.natal-page{
  background:
    radial-gradient(circle at top right, rgba(214,184,120,0.2), transparent 28%),
    linear-gradient(180deg, #fbf7ef 0%, #f5f0e3 100%);
  padding: 2rem 0 4rem;
}

.natal-page__hero{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(280px,0.8fr);
  gap:1.5rem;
  align-items:start;
  margin-bottom:1.5rem;
}

.natal-page__eyebrow{
  margin:0 0 0.6rem;
  text-transform:uppercase;
  letter-spacing:0.14em;
  font-size:0.76rem;
  font-weight:700;
  color:#97692f;
}

.natal-page h1{
  margin:0 0 1rem;
  font-size:clamp(2rem,5vw,3.3rem);
  line-height:1;
  color:#13233b;
}

.natal-page__lead{
  max-width:58rem;
  margin:0;
  font-size:1.02rem;
  line-height:1.7;
  color:#3e4b5f;
}

.natal-layout{
  display:grid;
  gap:1.25rem;
}

.natal-page__card,
.natal-page__panel{
  background:#fffdf8;
  border:1px solid rgba(22,37,58,0.08);
  border-radius:24px;
  box-shadow:0 18px 50px rgba(22,37,58,0.08);
}

.natal-page__card{
  padding:1.35rem;
}

.natal-page__card h2,
.natal-page__panel h3{
  margin:0 0 1rem;
  color:#13233b;
}

.natal-page__card--compact{
  background:linear-gradient(180deg, #11213a 0%, #1a2f4c 100%);
  color:#eef3fb;
}

.natal-page__card--compact h2{
  color:#fff;
}

.natal-page__list{
  margin:0;
  padding-left:1.1rem;
  display:grid;
  gap:0.65rem;
}

.natal-form{
  display:grid;
  gap:1rem;
}

.natal-form__grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
}

.natal-field{
  display:grid;
  gap:0.45rem;
  font-weight:600;
  color:#23344f;
}

.natal-field--wide{
  grid-column:1 / -1;
}

.natal-field input{
  width:100%;
  border:1px solid rgba(22,37,58,0.16);
  border-radius:14px;
  background:#fff;
  padding:0.85rem 0.95rem;
  font:inherit;
}

.natal-field__error,
.natal-form__errors{
  color:#b64c37;
}

.natal-toggle{
  display:flex;
  align-items:center;
  gap:0.6rem;
  color:#42546b;
}

.natal-submit{
  border:0;
  border-radius:999px;
  padding:0.95rem 1.4rem;
  font:inherit;
  font-weight:700;
  color:#fff;
  background:linear-gradient(135deg, #1d395e 0%, #9f6a2d 100%);
  cursor:pointer;
}

.natal-result-card__head{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:flex-start;
  margin-bottom:1rem;
}

.natal-result-card__head p{
  margin:0.35rem 0 0;
  color:#617186;
}

.natal-meta{
  display:grid;
  gap:0.3rem;
  text-align:right;
  color:#506077;
  font-size:0.92rem;
}

.natal-note{
  margin:0 0 1rem;
  padding:0.95rem 1rem;
  border-radius:16px;
  background:#fff3d5;
  color:#715117;
}

.natal-result-grid{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(320px,0.95fr);
  gap:1rem;
}

.natal-chart-box{
  display:grid;
  place-items:center;
  min-height:20rem;
  padding:0.45rem;
  border-radius:20px;
  background:radial-gradient(circle at center, #fff 0%, #f4efe3 100%);
  border:1px solid rgba(151,105,47,0.14);
}

.natal-chart-box--transit{
  min-height:24rem;
  padding:0.35rem;
}

.natal-svg{
  display:block;
  width:100%;
  max-width:36rem;
  height:auto;
}

.natal-svg--transit{
  max-width:42rem;
}

.natal-aside{
  display:grid;
  gap:1rem;
}

.natal-page__panel{
  padding:1rem 1.05rem;
}

.natal-aspects{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:0.75rem;
}

.natal-aspects li{
  display:grid;
  gap:0.2rem;
  padding-bottom:0.75rem;
  border-bottom:1px solid rgba(22,37,58,0.08);
}

.natal-description{
  display:grid;
  gap:0.8rem;
  color:#3c4c61;
  line-height:1.65;
}

.natal-table-wrap{
  overflow:auto;
}

.natal-table{
  width:100%;
  border-collapse:collapse;
}

.natal-table th,
.natal-table td{
  padding:0.8rem 0.7rem;
  border-bottom:1px solid rgba(22,37,58,0.08);
  text-align:left;
}

.natal-table thead th{
  color:#5a6980;
  font-size:0.9rem;
  text-transform:uppercase;
  letter-spacing:0.05em;
}

.natal-forecast-head p,
.natal-forecast-result__period{
  margin:0.35rem 0 0;
  color:#617186;
}

.natal-forecast-form{
  margin-top:1rem;
  padding-top:1rem;
  border-top:1px solid rgba(22,37,58,0.08);
}

.natal-forecast-form__controls{
  display:grid;
  grid-template-columns:minmax(220px,280px) 1fr;
  gap:1rem;
  align-items:end;
}

.natal-field--date{
  max-width:18rem;
}

.natal-forecast-buttons{
  display:flex;
  flex-wrap:wrap;
  gap:0.65rem;
}

.natal-forecast-button{
  border:1px solid rgba(22,37,58,0.12);
  background:#fff;
  color:#23344f;
  border-radius:999px;
  padding:0.8rem 1rem;
  font:inherit;
  font-weight:700;
  cursor:pointer;
  transition:0.2s ease;
}

.natal-forecast-button:hover{
  transform:translateY(-1px);
  border-color:rgba(31,62,101,0.28);
}

.natal-forecast-button.is-active{
  border-color:transparent;
  color:#fff;
  background:linear-gradient(135deg, #1d395e 0%, #9f6a2d 100%);
  box-shadow:0 12px 24px rgba(22,37,58,0.12);
}

.natal-forecast-result{
  display:grid;
  gap:1rem;
  margin-top:1rem;
}

.natal-transit-panel{
  display:grid;
  gap:1rem;
}

.natal-transit-panel__head{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:flex-start;
}

.natal-transit-actions{
  display:flex;
  flex-wrap:wrap;
  gap:0.65rem;
}

.natal-ai-panel{
  display:grid;
  gap:1rem;
}

.natal-ai-panel__head{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:flex-start;
}

.natal-ai-form{
  margin:0;
}

.natal-ai-text p{
  margin:0;
}

.natal-action-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:2.8rem;
  padding:0.8rem 1rem;
  border:0;
  border-radius:999px;
  background:linear-gradient(135deg, #1d395e 0%, #9f6a2d 100%);
  color:#fff;
  font:inherit;
  font-weight:700;
  text-decoration:none;
  cursor:pointer;
  box-shadow:0 10px 24px rgba(22,37,58,0.12);
}

.natal-action-link--ghost{
  background:#fff;
  color:#23344f;
  border:1px solid rgba(22,37,58,0.12);
  box-shadow:none;
}

.natal-action-link:disabled{
  opacity:0.72;
  cursor:progress;
}

.natal-forecast-result__grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
}

.natal-highlights{
  margin:0;
  padding-left:1.1rem;
  display:grid;
  gap:0.65rem;
  color:#3c4c61;
  line-height:1.55;
}

@media (max-width: 980px){
  .natal-page__hero,
  .natal-result-grid{
    grid-template-columns:1fr;
  }

  .natal-meta{
    text-align:left;
  }

  .natal-forecast-form__controls,
  .natal-forecast-result__grid{
    grid-template-columns:1fr;
  }

  .natal-transit-panel__head{
    flex-direction:column;
  }

  .natal-ai-panel__head{
    flex-direction:column;
  }
}

@media (max-width: 720px){
  .natal-form__grid{
    grid-template-columns:1fr;
  }

  .natal-field--wide{
    grid-column:auto;
  }

  .natal-page{
    padding-top:1.2rem;
  }

  .natal-page__card{
    padding:0.85rem;
  }

  .natal-chart-box{
    padding:0.1rem;
    margin-inline:-0.2rem;
  }

  .natal-chart-box--transit{
    padding:0;
  }

  .natal-svg,
  .natal-svg--transit{
    max-width:none;
  }
}