/* ═══════════════════════════════════════════════════════════
   SOMNA · astrologinis portretas
   ═══════════════════════════════════════════════════════════ */

/* ─────────── Onboardingas ─────────── */
.astro-step {
  max-width: 560px;
  margin: 0 auto;
  padding: calc(var(--nav-h) + var(--s9)) var(--s5) var(--s9);
  text-align: center;
}
.astro-step h2 { font-size: clamp(1.8rem, 4vw, 2.6rem); margin-bottom: var(--s4); }
.astro-sub {
  font-size: 15px; line-height: 1.75; color: var(--text-2);
  max-width: 46ch; margin: 0 auto var(--s6);
}
.astro-sub b { color: var(--text); font-weight: 500; }

.astro-dots { display: flex; gap: 6px; justify-content: center; margin-bottom: var(--s6); }
.astro-dots span {
  width: 26px; height: 2px; background: var(--line-2); border-radius: 2px;
  transition: background .3s var(--ease);
}
.astro-dots span.on { background: var(--brass); }
.astro-dots span.done { background: var(--brass-dk); }

.astro-note {
  margin-top: var(--s5);
  padding: var(--s4);
  border: 1px dashed var(--line-2);
  border-radius: var(--r2);
  font-size: 13px; line-height: 1.7; color: var(--text-3);
  text-align: left;
}
.astro-note b { color: var(--text-2); }

/* Miesto paieška */
.astro-city { position: relative; }
.astro-sug {
  position: absolute; left: 0; right: 0; top: calc(100% + 4px);
  background: var(--raised); border: 1px solid var(--line-2);
  border-radius: var(--r2); box-shadow: var(--sh3);
  z-index: 40; overflow: hidden; text-align: left;
}
.astro-sug-it {
  display: flex; justify-content: space-between; align-items: baseline; gap: var(--s3);
  width: 100%; padding: var(--s3) var(--s4);
  font-size: 14px; color: var(--text);
  transition: background .15s var(--ease);
}
.astro-sug-it:hover { background: var(--surf-a); }
.astro-sug-it span { font-size: 12px; color: var(--text-3); }

.astro-tone { display: flex; gap: var(--s3); justify-content: center; flex-wrap: wrap; }
.astro-tone-b {
  padding: var(--s4) var(--s6);
  border: 1px solid var(--line-2); border-radius: var(--r2);
  font-size: 15px; color: var(--text-2);
  transition: border-color .2s var(--ease), color .2s var(--ease), background .2s var(--ease);
}
.astro-tone-b:hover { border-color: var(--brass); color: var(--brass); background: var(--tint); }

/* ─────────── Pakrovimas ─────────── */
.astro-loading { text-align: center; padding: calc(var(--nav-h) + var(--s9)) var(--s5) var(--s9); }
.astro-orb { width: 130px; margin: 0 auto var(--s6); animation: astro-pulse 2.6s ease-in-out infinite; }
@keyframes astro-pulse {
  0%,100% { opacity: .5; transform: scale(.95) rotate(0deg); }
  50%     { opacity: 1; transform: scale(1.05) rotate(6deg); }
}
.astro-stage {
  font-family: var(--serif); font-size: 1.35rem; color: var(--text);
  min-height: 1.6em; transition: opacity .3s var(--ease);
}

/* ─────────── Portretas ─────────── */
.astro-head { text-align: center; padding: calc(var(--nav-h) + var(--s7)) 0 var(--s6); }
.astro-head h1 { font-size: clamp(2rem, 4.5vw, 3rem); margin-bottom: var(--s4); }
.astro-head .lede { margin-inline: auto; }

.astro-three {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s4);
}
@media (max-width: 860px) { .astro-three { grid-template-columns: 1fr; } }

.astro-big { padding: var(--s6); text-align: center; }
.astro-big-l {
  font-family: var(--mono); font-size: 11px; letter-spacing: .18em;
  text-transform: uppercase; color: var(--brass); margin-bottom: var(--s4);
}
.astro-big-g { font-size: 2.6rem; color: var(--brass); line-height: 1; }
.astro-big-s { font-family: var(--serif); font-size: 1.7rem; color: var(--title); margin-top: var(--s2); }
.astro-big-d { font-family: var(--mono); font-size: 12px; color: var(--text-3); margin-bottom: var(--s4); }
.astro-big p { font-size: 13.5px; line-height: 1.75; color: var(--text-2); text-align: left; }

.astro-sig {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s4);
}
@media (max-width: 720px) { .astro-sig { grid-template-columns: repeat(2, 1fr); } }
.astro-sig div { display: flex; flex-direction: column; }
.astro-sig b { font-family: var(--serif); font-size: 1.4rem; color: var(--brass); text-transform: capitalize; }
.astro-sig span { font-size: 11.5px; color: var(--text-3); margin-top: 2px; }

/* Planetų sąrašas */
.astro-pls { display: grid; gap: 2px; }
.astro-pl {
  display: grid; grid-template-columns: 34px 1fr auto auto; gap: var(--s3);
  align-items: center;
  padding: var(--s3) var(--s4);
  border: 1px solid var(--line); border-radius: var(--r2);
  background: var(--surf-c);
}
@media (max-width: 600px) {
  .astro-pl { grid-template-columns: 28px 1fr auto; }
  .astro-pl-h { grid-column: 2 / -1; }
}
.astro-pl-g { font-size: 1.2rem; color: var(--brass); text-align: center; }
.astro-pl-n b { display: block; font-size: 14px; color: var(--text); font-weight: 500; }
.astro-pl-n span { font-size: 12px; color: var(--text-3); }
.astro-pl-s { font-size: 13.5px; color: var(--text-2); white-space: nowrap; }
.astro-pl-h { font-family: var(--mono); font-size: 11.5px; color: var(--text-3); white-space: nowrap; }

/* Aspektai */
.astro-asp { display: grid; gap: var(--s2); }
.astro-asp-it {
  padding: var(--s3) var(--s4);
  border: 1px solid var(--line); border-left-width: 2px;
  border-radius: var(--r2); background: var(--surf-c);
}
.astro-asp-it b { display: block; font-size: 14px; color: var(--text); font-weight: 500; }
.astro-asp-it span { font-size: 12px; color: var(--text-3); }
.astro-h { border-left-color: var(--verd); }
.astro-t { border-left-color: var(--clay); }
.astro-n { border-left-color: var(--brass-dk); }

/* Pranešimas, kai ieškomo miesto sąraše nėra */
.astro-sug-none {
  padding: var(--s4);
  font-size: 13px;
  line-height: 1.65;
  color: var(--text-2);
  text-align: left;
}
