/* ============================================================
   ATS Школа — Расчёт натальной карты — Step 2B Godly Reset
   Direction: editorial luxury × WebGL-feel via layered light + SVG scene
   References (tone/level only, no copy):
     · Lusion — digital scene, depth, motion
     · Life In Vogue — editorial scale, italic display power
     · F. Miller — warm feminine layered light, soft material
   Дата: 2026-04-28 · Author: Claude Code
   Зависимости: Fraunces variable + Inter в /css/fonts.css; GSAP уже на странице.
   ============================================================ */

:root {
  /* Paper layered system */
  --paper-cream: #F8EFDF;
  --paper-warm: #EFE2C9;
  --paper-deeper: #E4D6BA;
  --paper-rose: #ECCFC1;
  --paper-rose-deep: #DAB2A1;
  --paper-rose-soft: #F5DDD0;
  --paper-blush: #F2D8C8;
  --paper-mist: #F4E8D7;
  --ink-coffee: #2F2620;
  --ink-deep: #20180F;
  --ink-soft: #5C4E42;
  --ink-quiet: #847566;
  --brass: #A97F4B;
  --brass-bright: #C99560;
  --brass-deep: #8B6438;
  --brass-glow: rgba(201,149,96,0.55);
  --brass-soft: rgba(169,127,75,0.40);
  --brass-line: rgba(169,127,75,0.22);
  --brass-fill: rgba(169,127,75,0.06);
  --plum-cta: #5B2238;
  --plum-cta-hover: #6B2C40;
  --plum-cta-bright: #7B3F54;
  --plum-cta-soft: rgba(91,34,56,0.10);

  --ff-display: 'Fraunces', Georgia, serif;
  --ff-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --ease-editorial: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-cinematic: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-rhythm: cubic-bezier(0.4, 0, 0.2, 1);

  --container-max: 1840px;
  --col-gap: 28px;

  /* Cursor parallax (set by JS) */
  --mx: 0px;
  --my: 0px;
  --mxr: 0deg;
  --myr: 0deg;
}

/* ============================================================
   HEADER OVERRIDE — paper hero вместо тёмного
   ============================================================ */
body:has(.astro) {
  background: var(--paper-cream);
  overflow-x: hidden;
}
body:has(.astro) .header:not(.scrolled) {
  background: linear-gradient(to bottom, rgba(248,239,223,0.55) 0%, rgba(248,239,223,0) 100%);
  border-bottom: 0.5px solid transparent;
}
body:has(.astro) .header:not(.scrolled) .logo { color: var(--ink-coffee); }
body:has(.astro) .header:not(.scrolled) .nav a { color: var(--ink-soft); }
body:has(.astro) .header:not(.scrolled) .hamburger span { background: var(--ink-coffee); }
body:has(.astro) .header.scrolled {
  background: rgba(248,239,223,0.92);
  border-bottom: 0.5px solid var(--brass-line);
}

/* ============================================================
   MAIN — rich layered base
   ============================================================ */
.astro {
  background: var(--paper-cream);
  color: var(--ink-coffee);
  font-family: var(--ff-body);
  font-size: 17px;
  line-height: 1.62;
  position: relative;
}

.astro::before {
  content: '';
  position: fixed; inset: 0; z-index: 0;
  pointer-events: none; opacity: 0.025;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 220px;
  mix-blend-mode: multiply;
}

.astro > section { position: relative; z-index: 1; }

/* ============================================================
   EDITORIAL CONTAINER — full-width 12-col
   ============================================================ */
.astro-promise__inner,
.astro-value__inner,
.astro-how__inner,
.astro-depth__inner,
.astro-course-cta__inner,
.astro-faq__inner,
.astro-final__inner {
  width: 100%;
  max-width: var(--container-max);
  margin: 0 auto;
  padding-left: clamp(20px, 5vw, 96px);
  padding-right: clamp(20px, 5vw, 96px);
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: var(--col-gap);
  position: relative;
}

@media (min-width: 2200px) {
  .astro-promise__inner, .astro-value__inner, .astro-how__inner,
  .astro-depth__inner, .astro-course-cta__inner, .astro-faq__inner, .astro-final__inner {
    padding-left: clamp(96px, 8vw, 200px);
    padding-right: clamp(96px, 8vw, 200px);
  }
}

/* ============================================================
   HERO — full-bleed living scene
   ============================================================ */
.astro-hero {
  position: relative;
  /* Owner-FB pass (2026-04-30): уменьшено с clamp(720,84vh,920) — пустота
     ниже формы на больших экранах создавала визуальный обрыв ("белую полосу")
     перед следующей секцией. Теперь hero обнимает реальный content (форма +
     scene + lead) с минимально-комфортным запасом. */
  min-height: clamp(560px, 70vh, 780px);
  background: var(--paper-cream);
  overflow: hidden;
  isolation: isolate;
  padding: 0;
}

/* === Atmosphere (layer A — back) — multi-radial warm light system === */
.astro-hero__atmosphere {
  position: absolute; inset: 0;
  z-index: 1;
  pointer-events: none;
  /* Step 2D: deeper depth — добавлены два radial-spotlight'а под scene
     и усилен gradient-floor для ощущения "weight" в нижней половине */
  background:
    radial-gradient(ellipse 60% 50% at 64% 50%, rgba(232,205,168,0.35) 0%, transparent 58%),
    radial-gradient(ellipse 80% 90% at 16% 12%, var(--paper-rose-soft) 0%, transparent 55%),
    radial-gradient(ellipse 60% 70% at 88% 78%, var(--paper-rose) 0%, transparent 50%),
    radial-gradient(ellipse 90% 60% at 50% 100%, var(--paper-blush) 0%, transparent 60%),
    radial-gradient(circle at 64% 50%, rgba(255,228,168,0.18) 0%, transparent 35%),
    linear-gradient(180deg, var(--paper-cream) 0%, var(--paper-mist) 70%, var(--paper-warm) 100%);
  transform: translate3d(calc(var(--mx) * 0.25), calc(var(--my) * 0.25), 0);
  transition: transform 1.2s var(--ease-editorial);
  will-change: transform;
}
@media (max-width: 1024px) {
  .astro-hero__atmosphere {
    background:
      radial-gradient(ellipse 80% 60% at 50% 50%, rgba(232,205,168,0.32) 0%, transparent 58%),
      radial-gradient(ellipse 80% 90% at 16% 12%, var(--paper-rose-soft) 0%, transparent 55%),
      radial-gradient(ellipse 90% 60% at 50% 100%, var(--paper-blush) 0%, transparent 60%),
      radial-gradient(circle at 50% 50%, rgba(255,228,168,0.16) 0%, transparent 40%),
      linear-gradient(180deg, var(--paper-cream) 0%, var(--paper-mist) 70%, var(--paper-warm) 100%);
  }
}

/* Light streak — diagonal sun ray feel (HF: усилено по аудиту) */
.astro-hero__atmosphere::before {
  content: '';
  position: absolute; inset: -10%;
  background:
    linear-gradient(125deg,
      transparent 0%,
      transparent 28%,
      rgba(255,243,224,0.30) 42%,
      rgba(255,228,196,0.55) 50%,
      rgba(255,243,224,0.30) 58%,
      transparent 72%,
      transparent 100%),
    linear-gradient(35deg,
      transparent 0%,
      transparent 60%,
      rgba(255,236,213,0.20) 76%,
      transparent 92%);
  mix-blend-mode: screen;
  filter: blur(10px);
  pointer-events: none;
  animation: streak-drift 28s ease-in-out infinite;
}
@keyframes streak-drift {
  0%,100% { transform: translateX(0) translateY(0); opacity: 0.95; }
  50%     { transform: translateX(2%) translateY(-1%); opacity: 1; }
}

/* Glow pool — bottom right warm pulse */
.astro-hero__atmosphere::after {
  content: '';
  position: absolute;
  width: 60vw; height: 60vw; max-width: 880px; max-height: 880px;
  right: -8vw; bottom: -16vw;
  background: radial-gradient(circle, rgba(218,178,161,0.40) 0%, rgba(218,178,161,0.18) 35%, transparent 70%);
  filter: blur(20px);
  pointer-events: none;
  animation: hero-pulse 12s ease-in-out infinite;
}

@keyframes hero-pulse {
  0%,100% { transform: scale(1) translate(0,0); opacity: 0.85; }
  50%     { transform: scale(1.08) translate(-2%,1%); opacity: 1; }
}

/* === Inner container — 12-col grid — full-bleed === */
.astro-hero__inner {
  position: relative;
  z-index: 3;
  width: 100%;
  max-width: var(--container-max);
  /* Owner-FB pass (2026-04-30): synced with new .astro-hero min-height. */
  min-height: clamp(560px, 70vh, 780px);
  margin: 0 auto;
  padding: clamp(96px, 12vh, 144px) clamp(20px, 5vw, 96px) clamp(32px, 5vh, 64px);
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: var(--col-gap);
  align-items: start;
}

@media (min-width: 2200px) {
  .astro-hero__inner {
    padding-left: clamp(96px, 8vw, 200px);
    padding-right: clamp(96px, 8vw, 200px);
  }
}

/* === Edition meta (Vogue masthead-feel) === */
.astro-hero__edition {
  grid-column: 1 / -1;
  display: flex; justify-content: space-between; align-items: baseline;
  font-family: var(--ff-body);
  font-size: 11px; font-weight: 500;
  letter-spacing: 0.26em; text-transform: uppercase;
  color: var(--brass);
  padding-bottom: 18px;
  border-bottom: 0.5px solid var(--brass-line);
  margin-bottom: clamp(48px, 8vh, 96px);
  flex-wrap: wrap; gap: 14px;
  position: relative; z-index: 5;
  /* Step 2C: readability over canvas */
  text-shadow: 0 0 16px rgba(248,239,223,0.8);
}
.astro-hero__edition-mark { display: inline-flex; align-items: center; gap: 14px; }
.astro-hero__edition-mark::before {
  content: 'XII'; font-family: var(--ff-display); font-style: italic;
  font-size: 18px; color: var(--brass-deep); text-transform: none;
  letter-spacing: 0; font-weight: 300;
}
.astro-hero__edition-meta { color: var(--ink-quiet); font-style: normal; }

/* === Title block — editorial Vogue scale === */
.astro-hero__title-wrap {
  /* Reopen-fix (2026-04-30): span 7 → span 9 on default. Owner reported
     hero looks like a narrow column on desktop because title was confined
     to ~58% of the grid width while right half stayed empty. Span 9 gives
     the editorial title proper presence on 1440-1920. */
  grid-column: 1 / span 9;
  position: relative;
  z-index: 4;
  /* Step 2C: extra readability for typography over canvas */
  text-shadow: 0 0 32px rgba(248,239,223,0.85), 0 0 16px rgba(248,239,223,0.7);
}
#astroH1 {
  font-family: var(--ff-display);
  font-weight: 300;
  font-style: italic;
  line-height: 0.92;
  letter-spacing: -0.03em;
  color: var(--ink-coffee);
  margin: 0;
  font-size: 1rem; /* reset; spans control size */
}
.astro-hero__title-line {
  display: block;
  font-size: clamp(3.4rem, 9.5vw, 9rem);
  font-style: italic;
  font-weight: 300;
}
.astro-hero__title-line--em {
  color: var(--brass-deep);
  font-size: clamp(3.4rem, 9.5vw, 9rem);
}
.astro-hero__title-line--em em {
  font-style: italic;
}
.astro-hero__title-sub {
  display: block;
  font-family: var(--ff-display);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(1.15rem, 1.6vw, 1.65rem);
  color: var(--ink-soft);
  margin-top: clamp(20px, 3vh, 36px);
  letter-spacing: -0.005em;
  line-height: 1.3;
  max-width: 28ch;
}

.astro-hero__lead {
  /* Reopen-fix: span 6 → span 8, max-width caps line length для читаемости */
  grid-column: 1 / span 8;
  font-family: var(--ff-body);
  font-size: clamp(1.05rem, 1.1vw, 1.18rem);
  line-height: 1.62;
  color: var(--ink-soft);
  max-width: 60ch;
  margin: clamp(28px, 4vh, 44px) 0 0;
  position: relative; z-index: 4;
  /* Step 2C: readability halo */
  text-shadow: 0 0 24px rgba(248,239,223,0.9);
}

.astro-hero__corner {
  grid-column: 11 / -1;
  grid-row: 2;
  align-self: end;
  font-family: var(--ff-display);
  font-style: italic;
  font-size: 14px;
  color: var(--ink-quiet);
  text-align: right;
  line-height: 1.5;
  position: relative; z-index: 4;
  margin-top: clamp(28px, 4vh, 44px);
}
.astro-hero__corner-mark {
  display: block;
  font-family: var(--ff-body); font-size: 10px;
  letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--brass);
  margin-bottom: 8px;
}

/* === LIVING DIGITAL SCENE (Step 2C) === */
/* Canvas occupies the entire hero as the back/mid plane.
   Content layer (typography, form) sits on top with z-index. */
.astro-hero__scene {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  display: block;
  /* Scene parallax — very subtle on whole scene */
  transform: translate3d(calc(var(--mx) * 0.4), calc(var(--my) * 0.4), 0);
  transition: transform 1.2s var(--ease-editorial);
  will-change: transform;
}
.astro-hero__scene-inner { position: absolute; inset: 0; }

/* Step 2D: composition cleanup — canvas slightly right-of-center
   so editorial typography lives in breathing left zone; scene = single composition. */
.astro-hero__canvas {
  position: absolute;
  top: 50%;
  left: 64%;
  width: clamp(640px, 78vw, 1380px);
  aspect-ratio: 1;
  height: auto;
  transform: translate(-50%, -50%);
  display: block;
  opacity: 0;
  animation: scene-canvas-arrive 2.6s var(--ease-cinematic) 0.4s forwards;
  pointer-events: none;
}
@keyframes scene-canvas-arrive {
  0%   { opacity: 0; }
  60%  { opacity: 0.55; }
  100% { opacity: 1; }
}

/* Closeout 2026-04-30 — Hero editorial natal accent.
   Lightweight inline SVG that fills the right half of the hero on desktop
   so the composition does not read as "text on the left, empty on the right".
   No canvas, no JS, no WebGL. Soft fade-in from page-load via CSS animation.
   On tablet/mobile (≤1024px) scene wrapper repositions below text → accent
   downscales naturally with the wrapper, no layout overflow. */
.astro-hero__accent {
  position: absolute;
  top: 50%;
  left: 64%;
  width: clamp(540px, 72vw, 1080px);
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  pointer-events: none;
  /* Content-depth pass (2026-04-30): убран `animation forwards`, который
     перекрывал `body.astro-has-result .astro-hero__accent { opacity: 0.55 }`
     правило. Теперь fade-in реализован через `transition` + JS-добавление
     класса `.is-loaded` (см. ниже body.astro-has-result переопределяет). */
  opacity: 0;
  transition: opacity 1.6s var(--ease-cinematic) 0.4s;
  z-index: 2;
}
/* When DOM ready (body classes applied via inline script in head), accent
   fades in. We use the fact that body has at least one class once page is
   interactive — but to be safe for SSR / no-class case, default-show via
   `:not(.astro-loading)`. Plain page load: opacity becomes 1 due to no
   competing rule. */
.astro-hero__scene-inner > .astro-hero__accent { opacity: 1; }
@media (max-width: 1024px) {
  .astro-hero__accent { width: 86vw; }
  .astro-hero__scene-inner > .astro-hero__accent { opacity: 0.88; }
}
@media (prefers-reduced-motion: reduce) {
  .astro-hero__accent { transition: none; opacity: 1; }
}
/* When result is shown, dial accent down to keep focus on result/facts.
   This now actually works — no `animation forwards` overriding it. */
body.astro-has-result .astro-hero__scene-inner > .astro-hero__accent { opacity: 0.45; }

.astro-hero__numerals {
  position: absolute;
  top: 50%;
  left: 64%;
  width: clamp(640px, 78vw, 1380px);
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  pointer-events: none;
  opacity: 0;
  animation: numerals-fade 1.6s var(--ease-cinematic) 3.2s forwards;
  z-index: 3;
}
@keyframes numerals-fade { to { opacity: 0.62; } }

.astro-hero__numerals text {
  font-family: var(--ff-display); font-style: italic; font-weight: 300;
  font-size: 14px; fill: var(--brass-deep);
  letter-spacing: 0.05em;
}

@media (max-width: 1280px) {
  .astro-hero__canvas,
  .astro-hero__numerals {
    left: 60%;
    width: clamp(560px, 78vw, 1100px);
  }
}
@media (max-width: 1024px) {
  .astro-hero__canvas,
  .astro-hero__numerals {
    left: 50%;
    width: min(720px, 96vw);
  }
}
@media (max-width: 640px) {
  .astro-hero__canvas,
  .astro-hero__numerals {
    width: min(540px, 110vw);
  }
}

/* HTML callouts on scene (post-submit) */
.astro-hero__callouts,
.astro-scene__callouts {
  position: absolute; inset: 0;
  pointer-events: none;
  z-index: 5;
}
.astro-hero__callouts[hidden],
.astro-scene__callouts[hidden] { display: none !important; }
.astro-scene__callout,
.astro-hero__callout {
  position: absolute;
  font-family: var(--ff-display); font-style: italic;
  font-size: 13px; color: var(--brass-deep);
  background: var(--paper-cream);
  padding: 6px 14px;
  border: 0.5px solid var(--brass-line);
  white-space: nowrap;
  opacity: 0; transform: translate(-50%,-50%) scale(0.95);
  transition: opacity 0.6s var(--ease-editorial), transform 0.6s var(--ease-editorial);
  box-shadow: 0 4px 18px rgba(59,48,42,0.06);
}
#astroResultSun { left: 30%; top: 28%; }
#astroResultMoon { left: 72%; top: 38%; }
#astroResultAsc { left: 38%; top: 72%; }
.astro-scene__callout.is-visible,
.astro-hero__callout.is-visible {
  opacity: 1; transform: translate(-50%,-50%) scale(1);
}

/* ============================================================
   CONCIERGE DESK — entry form below hero
   ============================================================ */
.astro-desk {
  position: relative;
  z-index: 4;
  /* Step 2E.2: NO margin-top — desk прилипает к hero atmosphere вплотную, без белого gap */
  margin-top: 0;
  padding: clamp(72px, 9vh, 120px) 0 clamp(72px, 9vh, 140px);
  /* Step 2E.3: усиленный stardust pattern сверху + orbital-bridge motif (per owner option G).
     Точки крупнее и контрастнее, чтобы реально читались как тонкая «карта неба». */
  background:
    radial-gradient(circle at 8% 14%, rgba(184,137,74,0.85) 0px, transparent 1.6px),
    radial-gradient(circle at 22% 9%, rgba(184,137,74,0.65) 0px, transparent 1.5px),
    radial-gradient(circle at 38% 19%, rgba(184,137,74,0.78) 0px, transparent 1.6px),
    radial-gradient(circle at 56% 7%, rgba(184,137,74,0.60) 0px, transparent 1.5px),
    radial-gradient(circle at 72% 15%, rgba(184,137,74,0.72) 0px, transparent 1.6px),
    radial-gradient(circle at 88% 11%, rgba(184,137,74,0.82) 0px, transparent 1.6px),
    radial-gradient(circle at 14% 26%, rgba(184,137,74,0.50) 0px, transparent 2px),
    radial-gradient(circle at 44% 28%, rgba(184,137,74,0.42) 0px, transparent 2px),
    radial-gradient(circle at 64% 26%, rgba(184,137,74,0.55) 0px, transparent 2px),
    radial-gradient(circle at 92% 28%, rgba(184,137,74,0.45) 0px, transparent 2px),
    radial-gradient(ellipse 70% 80% at 18% 0%, var(--paper-rose-soft) 0%, transparent 55%),
    radial-gradient(ellipse 60% 60% at 86% 100%, var(--paper-rose) 0%, transparent 60%),
    linear-gradient(180deg, var(--paper-warm) 0%, rgba(239,226,201,0.92) 50%, var(--paper-warm) 100%);
  overflow: hidden;
}
/* Step 2E.3: тонкий orbital-bridge — горизонтальная brass линия очень слабая
   на верхней границе desk (визуальный шов hero→form), не доминанта. */
.astro-desk > * {
  position: relative;
  z-index: 2;
}
.astro-desk__bridge {
  position: absolute;
  top: 36px;
  left: 50%;
  transform: translateX(-50%);
  width: clamp(360px, 60vw, 920px);
  height: 0.5px;
  background: linear-gradient(90deg, transparent 0%, rgba(184,137,74,0.45) 30%, rgba(184,137,74,0.55) 50%, rgba(184,137,74,0.45) 70%, transparent 100%);
  pointer-events: none;
  z-index: 1;
}
/* Decorative orbital accents on form-section */
.astro-desk::before, .astro-desk::after {
  content: '';
  position: absolute;
  pointer-events: none;
  border: 0.5px solid var(--brass-line);
  border-radius: 50%;
}
.astro-desk::before {
  /* large brass arc top-right of form */
  width: 480px; height: 480px;
  right: -180px; top: -160px;
  border-color: rgba(169,127,75,0.18);
  opacity: 0;
  animation: desk-arc-fade 1.6s var(--ease-editorial) 0.5s forwards;
}
.astro-desk::after {
  /* small brass dot bottom-left */
  width: 280px; height: 280px;
  left: -140px; bottom: -120px;
  border-color: rgba(169,127,75,0.14);
  opacity: 0;
  animation: desk-arc-fade 1.6s var(--ease-editorial) 0.7s forwards;
}
@keyframes desk-arc-fade { to { opacity: 1; } }
.astro-desk__inner {
  width: 100%;
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 clamp(20px, 5vw, 96px);
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: var(--col-gap);
  row-gap: 32px;
}
.astro-desk__head {
  grid-column: 1 / span 12;
  display: flex; justify-content: space-between; align-items: baseline;
  border-bottom: 0.5px solid var(--brass-line);
  padding-bottom: 18px;
  flex-wrap: wrap; gap: 18px;
}
.astro-desk__title {
  font-family: var(--ff-display); font-style: italic; font-weight: 300;
  font-size: clamp(1.6rem, 2.4vw, 2.4rem);
  color: var(--ink-coffee);
  letter-spacing: -0.02em;
  margin: 0;
  line-height: 1.1;
}
.astro-desk__title em { color: var(--brass-deep); }
.astro-desk__sub {
  font-family: var(--ff-body); font-size: 11px;
  letter-spacing: 0.26em; text-transform: uppercase;
  color: var(--brass);
}

/* Form structure — concierge wide */
.astro-form { grid-column: 1 / -1; display: contents; }
.astro-form__grid {
  grid-column: 1 / span 8;
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 32px; row-gap: 28px;
}
.astro-field {
  display: flex; flex-direction: column;
  gap: 10px; position: relative;
}
.astro-field--full { grid-column: 1 / -1; }
.astro-field--quiet { font-size: 13px; }

.ui-label {
  font-family: var(--ff-body); font-size: 10px;
  font-weight: 500; letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.astro-form input[type="date"],
.astro-form input[type="time"],
.astro-form input[type="text"] {
  font-family: var(--ff-display);
  font-size: 21px; font-style: italic;
  font-weight: 400;
  background: transparent;
  border: none;
  border-bottom: 1.5px solid var(--brass-soft);
  padding: 14px 2px 12px;
  color: var(--ink-coffee);
  transition: border-color 0.3s var(--ease-rhythm), box-shadow 0.3s var(--ease-rhythm);
  outline: none;
  width: 100%;
}
.astro-form input:hover {
  border-bottom-color: var(--brass);
}
.astro-form input:focus {
  border-bottom-color: var(--plum-cta);
  border-bottom-width: 1.5px;
  box-shadow: 0 4px 16px -8px rgba(91,34,56,0.25);
}
.astro-form input::placeholder {
  color: var(--ink-quiet); font-style: italic; opacity: 0.7;
}
.astro-form input[aria-invalid="true"] {
  border-bottom-color: var(--plum-cta);
}
/* HF: premium-style native datetime placeholders */
.astro-form input[type="date"]::-webkit-datetime-edit-fields-wrapper,
.astro-form input[type="time"]::-webkit-datetime-edit-fields-wrapper {
  font-family: var(--ff-display); font-style: italic;
  color: var(--ink-coffee); padding: 0;
}
.astro-form input[type="date"]::-webkit-datetime-edit-text,
.astro-form input[type="time"]::-webkit-datetime-edit-text {
  color: var(--brass); padding: 0 4px;
}
.astro-form input[type="date"]::-webkit-datetime-edit-month-field,
.astro-form input[type="date"]::-webkit-datetime-edit-day-field,
.astro-form input[type="date"]::-webkit-datetime-edit-year-field,
.astro-form input[type="time"]::-webkit-datetime-edit-hour-field,
.astro-form input[type="time"]::-webkit-datetime-edit-minute-field {
  color: var(--ink-coffee); font-weight: 400;
}
.astro-form input[type="date"]::-webkit-datetime-edit-month-field:not(:focus):not([aria-valuenow]),
.astro-form input[type="time"]::-webkit-datetime-edit-hour-field:not(:focus):not([aria-valuenow]) {
  color: var(--ink-quiet);
}
.astro-form input[type="date"]::-webkit-calendar-picker-indicator,
.astro-form input[type="time"]::-webkit-calendar-picker-indicator {
  filter: invert(0.45) sepia(0.5) saturate(1.2) hue-rotate(2deg);
  cursor: pointer; opacity: 0.55;
  transition: opacity 0.2s ease;
}
.astro-form input[type="date"]:hover::-webkit-calendar-picker-indicator,
.astro-form input[type="time"]:hover::-webkit-calendar-picker-indicator {
  opacity: 1;
}

.astro-check {
  display: inline-flex; align-items: flex-start; gap: 12px;
  cursor: pointer; line-height: 1.5;
  font-family: var(--ff-body); font-size: 14px;
  color: var(--ink-soft);
}
.astro-check input[type="checkbox"] {
  appearance: none; -webkit-appearance: none;
  width: 17px; height: 17px;
  border: 0.5px solid var(--ink-soft);
  background: var(--paper-cream);
  margin-top: 3px; flex-shrink: 0;
  cursor: pointer; position: relative;
  transition: all 0.2s var(--ease-rhythm);
}
.astro-check input[type="checkbox"]:checked {
  background: var(--plum-cta);
  border-color: var(--plum-cta);
}
.astro-check input[type="checkbox"]:checked::after {
  content: ''; position: absolute;
  top: 2px; left: 4px;
  width: 5px; height: 9px;
  border-right: 1.5px solid var(--paper-cream);
  border-bottom: 1.5px solid var(--paper-cream);
  transform: rotate(45deg);
}
.astro-check a {
  color: var(--brass);
  border-bottom: 0.5px solid var(--brass-line);
  transition: border-color 0.2s ease;
}
.astro-check a:hover { border-bottom-color: var(--brass); }

.astro-form__consent {
  grid-column: 1 / span 8;
}
.astro-form__submit {
  grid-column: 9 / -1;
  align-self: end;
  display: flex; flex-direction: column;
  gap: 14px; align-items: stretch;
}
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 14px;
  font-family: var(--ff-body);
  font-size: 14px; font-weight: 500;
  letter-spacing: 0.08em;
  padding: 22px 36px;
  border: none; cursor: pointer;
  text-decoration: none;
  text-transform: uppercase;
  transition: all 0.4s var(--ease-rhythm);
}
.btn--brass {
  background: var(--plum-cta);
  color: var(--paper-cream);
  border-radius: 2px;
  position: relative; overflow: hidden;
}
.btn--brass::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(110deg, transparent 30%, rgba(255,236,213,0.20) 50%, transparent 70%);
  transform: translateX(-100%);
  transition: transform 0.6s var(--ease-cinematic);
}
.btn--brass:hover {
  background: var(--plum-cta-hover);
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(91,34,56,0.22);
}
.btn--brass:hover::before { transform: translateX(100%); }
.btn--brass svg { transition: transform 0.4s var(--ease-rhythm); }
.btn--brass:hover svg { transform: translateX(4px); }

.astro-form__trust {
  font-family: var(--ff-display); font-style: italic;
  font-size: 12px; color: var(--ink-quiet);
  text-align: right;
  line-height: 1.4;
}
.astro-form__trust a {
  color: var(--brass);
  border-bottom: 0.5px solid var(--brass-line);
}
.astro-form__trust a:hover { border-bottom-color: var(--brass); }

.astro-form__status {
  grid-column: 1 / -1;
  font-family: var(--ff-display); font-style: italic;
  font-size: 14px; color: var(--ink-soft);
  min-height: 22px;
}
.astro-form__status.is-error { color: var(--plum-cta); }
.astro-form__status.is-success { color: var(--brass-deep); }

.astro-hero__resolved {
  grid-column: 1 / -1;
  margin-top: clamp(16px, 2vh, 32px);
  padding: clamp(28px, 4vh, 48px) 0;
  background: var(--paper-cream);
  border-top: 0.5px solid var(--brass-line);
  border-bottom: 0.5px solid var(--brass-line);
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: var(--col-gap);
  row-gap: 24px;
}
.astro-hero__resolved[hidden],
.astro-hero__resolved-planets[hidden] { display: none !important; }
.astro-hero__resolved-summary {
  grid-column: 1 / span 8;
  font-family: var(--ff-display);
  font-size: clamp(1.3rem, 1.8vw, 1.7rem);
  font-style: italic;
  line-height: 1.4;
  color: var(--ink-coffee);
  margin: 0;
}
.astro-hero__resolved-planets {
  grid-column: 1 / -1;
  border-top: 0.5px solid var(--brass-line);
  padding-top: 24px;
}
.astro-hero__resolved-planets .astro-result__planets-title {
  font-family: var(--ff-body); font-size: 11px;
  letter-spacing: 0.26em; text-transform: uppercase;
  color: var(--brass);
  font-weight: 500; margin: 0 0 16px;
}
.astro-planets {
  list-style: none; padding: 0; margin: 0;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px 32px;
}
.astro-planets li {
  font-family: var(--ff-display); font-style: italic;
  font-size: 16px; color: var(--ink-coffee);
  padding: 6px 0;
  border-bottom: 0.5px solid var(--brass-line);
}
.astro-hero__resolved-cta {
  grid-column: 9 / -1;
  display: flex; align-items: end; justify-content: flex-end;
}
.astro-hero__a11y-fallback {
  position: absolute; left: -10000px; top: -10000px;
  width: 1px; height: 1px; overflow: hidden;
}

/* ============================================================
   STAGE 4 ITER — Place input confirm
   ============================================================ */
.astro-field--place {
  position: relative;
}
/* Stage 4.2: live autocomplete wrapper + dropdown */
.astro-place {
  position: relative;
  width: 100%;
}
.astro-place__loader {
  position: absolute;
  right: 14px; top: 14px;
  width: 14px; height: 14px;
  border: 1.5px solid rgba(169,127,75,0.30);
  border-top-color: var(--brass);
  border-radius: 50%;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
}
.astro-place[data-state="loading"] .astro-place__loader {
  opacity: 1;
  animation: place-spin 0.8s linear infinite;
}
@keyframes place-spin { to { transform: rotate(360deg); } }

.astro-place__dropdown {
  position: absolute;
  top: 100%;
  left: 0; right: 0;
  margin-top: 6px;
  list-style: none;
  padding: 6px 0;
  background:
    radial-gradient(ellipse 100% 100% at 50% 0%, rgba(232,205,168,0.10) 0%, transparent 70%),
    linear-gradient(180deg, rgba(255,250,240,0.98) 0%, rgba(248,239,223,0.96) 100%);
  border: 0.5px solid var(--brass);
  border-radius: 2px;
  box-shadow:
    0 24px 64px -24px rgba(91,34,56,0.20),
    0 8px 24px -12px rgba(169,127,75,0.18);
  z-index: 30;
  max-height: 320px;
  overflow-y: auto;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.astro-place__dropdown[hidden] { display: none !important; }
.astro-place__option {
  display: flex; flex-direction: column;
  gap: 2px;
  padding: 12px 18px;
  cursor: pointer;
  transition: background 0.15s ease;
  border-bottom: 0.5px solid var(--brass-line);
}
.astro-place__option:last-child { border-bottom: 0; }
.astro-place__option:hover,
.astro-place__option.is-active {
  background: linear-gradient(90deg, rgba(232,205,168,0.30) 0%, rgba(232,205,168,0.10) 100%);
}
.astro-place__opt-city {
  font-family: var(--ff-display); font-style: italic; font-weight: 400;
  font-size: 17px;
  color: var(--ink-coffee);
  line-height: 1.2;
}
.astro-place__opt-meta {
  font-family: var(--ff-body); font-size: 12px;
  color: var(--ink-soft);
  letter-spacing: 0.02em;
  line-height: 1.3;
}
.astro-place[data-state="matched"] input { border-bottom-color: var(--brass); }
.astro-place[data-state="not-found"] input,
.astro-place[data-state="approx"] input { border-bottom-color: var(--plum-cta); }

.astro-form__place-confirm {
  grid-column: 1 / -1;
  display: flex; align-items: flex-start; gap: 10px;
  margin-top: 10px; min-height: 22px;
  font-family: var(--ff-display); font-style: italic;
  font-size: 13px; line-height: 1.45;
  color: var(--ink-soft);
  opacity: 0;
  transform: translateY(-4px);
  transition: opacity 0.4s var(--ease-editorial), transform 0.4s var(--ease-editorial), color 0.4s ease;
  pointer-events: none;
}
.astro-form__place-confirm[data-state="matched"],
.astro-form__place-confirm[data-state="approx"],
.astro-form__place-confirm[data-state="loading"],
.astro-form__place-confirm[data-state="suggesting"],
.astro-form__place-confirm[data-state="not-found"],
.astro-form__place-confirm[data-state="typing"] {
  opacity: 1;
  transform: translateY(0);
}
.astro-form__place-confirm-mark {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 6px;
  background: var(--brass);
  box-shadow: 0 0 8px rgba(229,192,136,0.5);
  transition: background 0.3s ease, box-shadow 0.3s ease;
}
.astro-form__place-confirm[data-state="empty"] .astro-form__place-confirm-mark,
.astro-form__place-confirm[data-state="typing"] .astro-form__place-confirm-mark {
  background: transparent; box-shadow: none;
}
.astro-form__place-confirm[data-state="loading"] .astro-form__place-confirm-mark {
  background: var(--brass);
  box-shadow: 0 0 8px rgba(229,192,136,0.5);
  animation: place-mark-pulse 1.2s ease-in-out infinite;
}
.astro-form__place-confirm[data-state="suggesting"] .astro-form__place-confirm-mark {
  background: var(--brass-bright);
  box-shadow: 0 0 8px rgba(229,192,136,0.6);
}
.astro-form__place-confirm[data-state="approx"] .astro-form__place-confirm-mark,
.astro-form__place-confirm[data-state="not-found"] .astro-form__place-confirm-mark {
  background: var(--plum-cta);
  box-shadow: 0 0 8px rgba(91,34,56,0.45);
}
@keyframes place-mark-pulse {
  0%,100% { opacity: 0.55; }
  50%     { opacity: 1; }
}
.astro-form__place-confirm[data-state="matched"] .astro-form__place-confirm-text { color: var(--brass-deep); }
.astro-form__place-confirm[data-state="approx"] .astro-form__place-confirm-text,
.astro-form__place-confirm[data-state="not-found"] .astro-form__place-confirm-text { color: var(--plum-cta); }
.astro-form__place-confirm[data-state="loading"] .astro-form__place-confirm-text,
.astro-form__place-confirm[data-state="suggesting"] .astro-form__place-confirm-text { color: var(--brass-deep); }

/* ============================================================
   STAGE 4 ITER — Result preview block (premium personal mini-result)
   ============================================================ */
.astro-result {
  /* Override base resolved layout — premium card-shell */
  grid-template-columns: repeat(12, 1fr) !important;
  background:
    radial-gradient(ellipse 60% 60% at 50% 0%, rgba(232,205,168,0.22) 0%, transparent 60%),
    linear-gradient(180deg, rgba(255,250,240,0.94) 0%, rgba(248,239,223,0.55) 100%) !important;
  border: 0.5px solid var(--brass-line) !important;
  border-radius: 2px;
  padding: clamp(36px, 5vh, 64px) clamp(28px, 3vw, 48px) clamp(36px, 5vh, 56px) !important;
  position: relative;
  overflow: hidden;
}
.astro-result::before {
  /* brass arc top — связь с natal-circle */
  content: '';
  position: absolute;
  top: 0; left: 50%; transform: translateX(-50%);
  width: clamp(120px, 16vw, 220px); height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--brass) 50%, transparent 100%);
  opacity: 0.7;
}

.astro-result__head {
  grid-column: 1 / -1;
  text-align: center;
  margin-bottom: clamp(28px, 4vh, 44px);
  display: flex; flex-direction: column; gap: 12px; align-items: center;
}
.astro-result__head-title {
  font-family: var(--ff-display); font-style: italic; font-weight: 300;
  font-size: clamp(1.6rem, 2.4vw, 2.4rem);
  line-height: 1.18;
  letter-spacing: -0.022em;
  color: var(--ink-coffee);
  margin: 0;
  max-width: 24ch;
}
/* Stage 4.5: honest mini-result framing */
.astro-result__head-note {
  font-family: var(--ff-body);
  font-size: 13px; line-height: 1.55;
  color: var(--ink-soft);
  margin: 8px 0 0;
  max-width: 56ch;
  text-align: center;
  font-style: italic;
}

/* Triad of 3 cards Sun/Moon/ASC */
/* Owner-FB pass (2026-04-30): Sun/Moon/ASC composition — единая
   editorial-полоса вместо трёх отдельных карточек. Карточки разделяются
   тонкими hairline-вертикалями, а не отдельными border-боксами. Brass-dot
   убран (orbital-метка казалась случайной). На mobile разворачивается в
   один столбец с горизонтальными разделителями. */
.astro-result__triad {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 0;
  row-gap: 0;
  margin-bottom: clamp(24px, 3.5vh, 40px);
  background:
    linear-gradient(180deg, rgba(248,239,223,0.55) 0%, rgba(248,239,223,0.30) 100%);
  border: 0.5px solid var(--brass-line);
  border-radius: 2px;
}
.astro-result__card {
  position: relative;
  display: flex; flex-direction: column;
  gap: 8px;
  padding: clamp(24px, 3vh, 36px) clamp(20px, 2.4vw, 32px);
  background: transparent;
  border: 0;
  border-radius: 0;
  text-align: center;
  align-items: center;
  min-height: 180px;
  transition: background 0.4s ease;
}
.astro-result__card + .astro-result__card {
  /* hairline divider between cards */
  border-left: 0.5px solid var(--brass-line);
}
.astro-result__card[data-state="resolved"] {
  background: linear-gradient(180deg, rgba(255,250,240,0.40) 0%, transparent 100%);
}
.astro-result__card[data-state="no-time"] {
  background:
    repeating-linear-gradient(135deg,
      rgba(239,226,201,0.0) 0 12px,
      rgba(239,226,201,0.18) 12px 13px);
}
/* Brass orbital dot убран — был случайным акцентом. */

.astro-result__planet-title {
  font-family: var(--ff-display); font-style: italic; font-weight: 400;
  font-size: clamp(1.3rem, 1.6vw, 1.6rem);
  line-height: 1.15;
  letter-spacing: -0.018em;
  color: var(--ink-coffee);
  margin: 0;
}
.astro-result__sign {
  font-family: var(--ff-display); font-style: italic;
  font-size: clamp(1.15rem, 1.4vw, 1.35rem);
  color: var(--brass-deep);
  margin: 4px 0 8px;
  font-weight: 400;
}
.astro-result__card[data-state="no-time"] .astro-result__sign,
.astro-result__card[data-state="pending"] .astro-result__sign {
  color: var(--ink-quiet);
}
.astro-result__phrase {
  font-family: var(--ff-body);
  font-size: 14px; line-height: 1.55;
  color: var(--ink-soft);
  margin: 0;
  max-width: 28ch;
}
.astro-result__asc-fallback[hidden] { display: none; }
.astro-result__asc-fallback {
  font-family: var(--ff-body);
  font-size: 13px; line-height: 1.5;
  color: var(--plum-cta);
  margin: 6px 0 0;
  max-width: 30ch;
  font-style: italic;
}

/* Numerology block (life-path) */
.astro-result__numerology {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 90px 1fr;
  align-items: center;
  gap: clamp(20px, 3vw, 36px);
  padding: clamp(24px, 3.5vh, 36px) clamp(22px, 2.6vw, 36px);
  background:
    radial-gradient(circle at 50% 50%, rgba(232,205,168,0.16) 0%, transparent 60%),
    linear-gradient(180deg, rgba(248,239,223,0.45) 0%, rgba(239,226,201,0.30) 100%);
  border: 0.5px solid var(--brass-line);
  border-radius: 2px;
  margin-bottom: clamp(28px, 4vh, 44px);
  position: relative;
}
.astro-result__num-mark {
  grid-column: 1 / -1;
  font-family: var(--ff-body); font-size: 11px;
  letter-spacing: 0.26em; text-transform: uppercase;
  color: var(--brass);
  margin-bottom: 6px;
  align-self: start;
}
.astro-result__num-value {
  grid-column: 1;
  font-family: var(--ff-display); font-style: italic; font-weight: 300;
  font-size: clamp(3.6rem, 5vw, 5rem);
  line-height: 1;
  color: var(--brass-deep);
  margin: 0;
  text-align: center;
  align-self: center;
}
.astro-result__num-phrase {
  grid-column: 2;
  font-family: var(--ff-body);
  font-size: 15px; line-height: 1.62;
  color: var(--ink-soft);
  margin: 0;
  max-width: 60ch;
  align-self: center;
}

/* Interpretation block (200-400 слов) */
.astro-result__interpretation {
  grid-column: 1 / -1;
  margin-bottom: clamp(28px, 4vh, 40px);
  padding-top: clamp(20px, 3vh, 32px);
  border-top: 0.5px solid var(--brass-line);
}
.astro-result__interpretation-title {
  font-family: var(--ff-body); font-size: 11px;
  font-weight: 500; letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--brass);
  margin: 0 0 16px;
}
.astro-result__interpretation-body {
  font-family: var(--ff-display); font-style: italic;
  font-size: clamp(1rem, 1.15vw, 1.18rem);
  line-height: 1.6;
  color: var(--ink-coffee);
  margin: 0;
  max-width: 68ch;
}
/* Polish-pass (2026-04-30): paragraph split for mini-interpretation —
   backend отдаёт текст с \n\n-разделителями, frontend оборачивает каждый
   chunk в <p class="astro-result__interp-para">. Воздух между группами. */
.astro-result__interp-para {
  margin: 0 0 0.95em 0;
}
.astro-result__interp-para:last-child {
  margin-bottom: 0;
}
.astro-result__interpretation-body:empty::before {
  content: 'Расчёт собирается… через секунду здесь появится мягкая интерпретация ваших трёх опор.';
  color: var(--ink-quiet);
  font-style: italic;
}

/* Stage 4.4 — Export actions block (SVG / PNG / PDF) */
.astro-result__exports {
  grid-column: 1 / -1;
  padding: clamp(20px, 3vh, 32px) 0;
  border-top: 0.5px solid var(--brass-line);
  display: flex; flex-direction: column;
  gap: 14px;
  align-items: flex-start;
}
.astro-result__exports[hidden] { display: none !important; }
.astro-result__exports-label {
  font-family: var(--ff-body); font-size: 11px;
  font-weight: 500; letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--brass);
}
.astro-result__exports-buttons {
  display: flex; flex-wrap: wrap;
  gap: 12px;
}
.astro-result__export-btn {
  display: inline-flex; align-items: center;
  gap: 10px;
  padding: 12px 22px;
  font-family: var(--ff-body); font-size: 13px;
  letter-spacing: 0.04em;
  color: var(--ink-coffee);
  background: linear-gradient(180deg, rgba(248,239,223,0.65) 0%, rgba(239,226,201,0.45) 100%);
  border: 0.5px solid var(--brass-line);
  border-radius: 2px;
  cursor: pointer;
  transition: all 0.3s var(--ease-rhythm);
}
.astro-result__export-btn:hover,
.astro-result__export-btn:focus-visible {
  border-color: var(--brass);
  background: linear-gradient(180deg, rgba(255,250,240,1) 0%, rgba(248,239,223,0.7) 100%);
  transform: translateY(-1px);
  box-shadow: 0 6px 18px -8px rgba(91,34,56,0.18);
  outline: none;
}
.astro-result__export-btn:focus-visible { border-color: var(--plum-cta); }
.astro-result__export-btn[disabled] { opacity: 0.5; cursor: wait; }
.astro-result__export-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 22px;
  font-family: var(--ff-body); font-size: 9px; font-weight: 600;
  letter-spacing: 0.10em;
  color: var(--brass-deep);
  background: rgba(229,192,136,0.20);
  border: 0.5px solid var(--brass-soft);
  border-radius: 2px;
}
.astro-result__exports-note {
  font-family: var(--ff-display); font-style: italic;
  font-size: 12px; line-height: 1.5;
  color: var(--ink-quiet);
  margin: 0;
  max-width: 56ch;
}
.astro-result__exports-status {
  font-family: var(--ff-body);
  font-size: 12px; line-height: 1.4;
  color: var(--brass-deep);
  min-height: 16px;
}
.astro-result__exports-status.is-error { color: var(--plum-cta); }
.astro-result__exports-status.is-success { color: var(--brass-deep); }

/* CTA block — dual route (course + app) */
.astro-result__cta {
  grid-column: 1 / -1;
  padding-top: clamp(20px, 3vh, 32px);
  border-top: 0.5px solid var(--brass-line);
  display: flex; flex-direction: column;
  gap: 18px;
  align-items: flex-start;
}
.astro-result__cta-lead {
  font-family: var(--ff-body);
  font-size: 14px; line-height: 1.6;
  color: var(--ink-soft);
  margin: 0;
  max-width: 64ch;
}
.astro-result__cta-actions {
  display: flex; flex-wrap: wrap;
  gap: 16px;
  align-items: center;
}
/* Ghost (secondary) button — для App bridge */
.btn--ghost {
  background: transparent;
  color: var(--ink-coffee);
  border: 0.5px solid var(--brass);
  border-radius: 2px;
  padding: 22px 32px;
  font-family: var(--ff-body); font-size: 14px; font-weight: 500;
  letter-spacing: 0.06em; text-transform: uppercase;
  text-decoration: none;
  transition: all 0.3s var(--ease-rhythm);
  display: inline-flex; align-items: center; justify-content: center;
}
.btn--ghost:hover,
.btn--ghost:focus-visible {
  background: rgba(232,205,168,0.18);
  border-color: var(--brass-deep);
  transform: translateY(-1px);
  outline: none;
}
.astro-result__cta-explain {
  font-family: var(--ff-display); font-style: italic;
  font-size: 13px; line-height: 1.55;
  color: var(--ink-quiet);
  margin: 0;
  max-width: 64ch;
}
@media (max-width: 640px) {
  .astro-result__cta-actions { flex-direction: column; align-items: stretch; }
  .astro-result__cta-actions .btn { width: 100%; }
}

/* Hide planets list (still populated by astro.js for a11y/data) */
.astro-hero__resolved-planets {
  display: none !important;
}

/* Stage 4.4 — Print stylesheet for PDF export via window.print() */
@media print {
  body * { visibility: hidden; }
  .astro-hero__resolved,
  .astro-hero__resolved * { visibility: visible; }
  .astro-hero__resolved {
    position: absolute; left: 0; top: 0; right: 0;
    padding: 36px 48px;
    background: white;
    color: black;
    box-shadow: none;
    border: none;
  }
  .astro-result__exports,
  .astro-result__cta {
    display: none !important;
  }
  .astro-result__head-title,
  .astro-result__planet-title,
  .astro-result__sign,
  .astro-result__phrase,
  .astro-result__num-value,
  .astro-result__num-phrase,
  .astro-result__interpretation-body {
    color: #2D1E16 !important;
  }
  .astro-result__num-mark,
  .astro-result__interpretation-title {
    color: #8B6438 !important;
  }
  .astro-result__triad {
    page-break-inside: avoid;
    grid-template-columns: repeat(3, 1fr) !important;
  }
  .astro-result__card { border: 0.5px solid #A97F4B !important; }
  .astro-result::before { display: none !important; }
  /* Add print-only header */
  .astro-result__head::before {
    content: 'АТС Школа · Натальная карта · мини-разбор';
    display: block;
    font-size: 10px;
    letter-spacing: 0.2em;
    color: #8B6438;
    margin-bottom: 12px;
    text-transform: uppercase;
  }
  /* Add print-only footer */
  .astro-hero__resolved::after {
    content: 'Полный разбор — в курсе «Вселенная в тебе» · ats.school';
    display: block;
    margin-top: 28px;
    padding-top: 14px;
    border-top: 0.5px solid #A97F4B;
    font-family: Georgia, serif; font-style: italic;
    font-size: 11px;
    color: #6B5E52;
  }
}

@media (max-width: 1024px) {
  .astro-result__triad { grid-template-columns: 1fr; }
  /* Owner-FB pass: при stack — divider становится горизонтальным
     (вместо vertical hairline между cards). */
  .astro-result__card + .astro-result__card {
    border-left: 0;
    border-top: 0.5px solid var(--brass-line);
  }
  .astro-result__numerology { grid-template-columns: 1fr; gap: 12px; text-align: center; }
  .astro-result__num-value { text-align: center; }
  .astro-result__num-phrase { text-align: center; max-width: 100%; }
}

/* HERO RESPONSIVE */
@media (max-width: 1280px) {
  .astro-hero__title-wrap { grid-column: 1 / span 8; }
  .astro-hero__lead { grid-column: 1 / span 8; }
  .astro-hero__scene { width: clamp(380px, 50vw, 720px); right: -4vw; }
}
@media (max-width: 1024px) {
  .astro-hero__inner { padding-top: clamp(96px, 12vh, 140px); padding-bottom: clamp(48px, 6vh, 80px); }
  .astro-hero__title-wrap { grid-column: 1 / -1; }
  .astro-hero__lead { grid-column: 1 / -1; }
  .astro-hero__corner { grid-column: 1 / -1; grid-row: auto; text-align: left; margin-top: 16px; }
  .astro-hero__scene {
    position: relative;
    top: auto; right: auto; transform: none;
    width: min(560px, 90vw);
    margin: clamp(40px, 6vh, 72px) auto 0;
    grid-column: 1 / -1;
  }
  .astro-form__grid, .astro-form__consent { grid-column: 1 / -1; }
  .astro-form__submit { grid-column: 1 / -1; align-items: stretch; }
  .astro-form__trust { text-align: left; }
  .astro-hero__resolved-summary, .astro-hero__resolved-cta { grid-column: 1 / -1; }
  .astro-hero__resolved-cta { justify-content: stretch; }
  .astro-hero__resolved-cta .btn { width: 100%; }
}
@media (max-width: 640px) {
  .astro-hero__edition { font-size: 9px; }
  .astro-hero__title-line, .astro-hero__title-line--em { font-size: clamp(2.6rem, 14vw, 4.5rem); }
  .astro-hero__title-sub { font-size: clamp(1rem, 4vw, 1.3rem); }
  .astro-hero__scene { width: 86vw; }
  .astro-form__grid { grid-template-columns: 1fr; }
  .astro-form__grid .astro-field--full { grid-column: 1 / -1; }
}

/* ============================================================
   TRIAD — Sun / Moon / Asc — interactive section (NEW Step 2E.1)
   Three semantic nodes in asymmetric editorial composition;
   hover/click bridges to scene.highlight() to wake the corresponding planet.
   ============================================================ */
.astro-triad {
  /* P10.7 (2026-05-05): уменьшен padding-bottom для устранения большого пустого
     промежутка под triad cards перед next-секцией. Было: clamp(80px,11vh,144px)
     ~99px на 1440. Стало: clamp(24px,3.5vh,48px) ~32px на 1440. Промежуток
     до next-section теперь ~32+48=80px (с учётом промежуточных margin) — в spec range. */
  padding: clamp(72px, 10vh, 128px) 0 clamp(24px, 3.5vh, 48px);
}

/* Closeout 2026-04-30: pre-submit explainer triad is the duplicate of the
   post-submit result triad inside the form area. As soon as the result
   is rendered (astro.js sets body.astro-has-result), hide the explainer
   so the user sees only one relevant Sun/Moon/ASC block — the factual one. */
body.astro-has-result .astro-triad { display: none; }

.astro-triad {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(ellipse 70% 60% at 50% 0%, rgba(232,205,168,0.18) 0%, transparent 55%),
    radial-gradient(ellipse 80% 50% at 25% 100%, var(--paper-rose-soft) 0%, transparent 55%),
    radial-gradient(ellipse 70% 60% at 80% 100%, rgba(218,178,161,0.30) 0%, transparent 55%),
    linear-gradient(180deg, transparent 0%, var(--paper-cream) 35%, var(--paper-cream) 100%);
}
.astro-triad__bg-arc {
  position: absolute;
  width: clamp(900px, 90vw, 1600px);
  aspect-ratio: 1;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border: 0.5px solid rgba(169,127,75,0.10);
  border-radius: 50%;
  pointer-events: none;
  opacity: 0;
}
.astro-triad.is-in-view .astro-triad__bg-arc {
  animation: triad-arc-fade 2.2s var(--ease-editorial) forwards;
}
@keyframes triad-arc-fade { to { opacity: 1; } }

.astro-triad__inner {
  width: 100%; max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 clamp(20px, 5vw, 96px);
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: var(--col-gap);
  position: relative;
}

.astro-triad__head {
  grid-column: 2 / span 9;
  margin-bottom: clamp(72px, 9vh, 128px);
  display: flex; flex-direction: column; gap: 22px;
}
.astro-triad__kicker {
  font-family: var(--ff-body); font-size: 11px;
  font-weight: 500; letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--brass);
  padding-bottom: 14px;
  border-bottom: 0.5px solid var(--brass-line);
  width: fit-content;
}
.astro-triad__title {
  font-family: var(--ff-display);
  font-size: clamp(2.2rem, 4.4vw, 4rem);
  font-weight: 300;
  font-style: italic;
  line-height: 1.04;
  letter-spacing: -0.025em;
  color: var(--ink-coffee);
  margin: 0;
  max-width: 18ch;
}
.astro-triad__title em { color: var(--brass-deep); }
.astro-triad__lead {
  font-family: var(--ff-body);
  font-size: clamp(1rem, 1vw, 1.1rem);
  line-height: 1.62;
  color: var(--ink-soft);
  max-width: 56ch;
  margin: 0;
}

/* Step 2E.3: 12-col grid с точной треугольной композицией —
   Sun col 1-4 top, Moon col 5-8 mt:48px (центральная нижняя точка),
   ASC col 9-12 mt:12px. Точно по спецификации owner. */
.astro-triad__cards {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: var(--col-gap);
  row-gap: clamp(28px, 4vh, 60px);
  position: relative;
  align-items: start;
}
.triad-card {
  position: relative;
  display: flex; flex-direction: column;
  padding: clamp(36px, 4vh, 56px) clamp(28px, 3vw, 44px);
  background:
    radial-gradient(ellipse 80% 50% at 50% 0%, rgba(232,205,168,0.18) 0%, transparent 70%),
    linear-gradient(180deg, rgba(255,250,240,0.9) 0%, rgba(248,239,223,0.55) 100%);
  border: 0.5px solid var(--brass-line);
  border-radius: 2px;
  cursor: pointer;
  transition:
    transform 0.6s var(--ease-editorial),
    border-color 0.4s var(--ease-rhythm),
    background 0.4s var(--ease-rhythm),
    box-shadow 0.6s var(--ease-editorial);
  outline: none;
  min-height: clamp(440px, 54vh, 540px);
  text-align: center;
  align-items: center;
}
.triad-card::before {
  /* Subtle brass arc on top of each card — связь с natal-circle темой */
  content: '';
  position: absolute;
  top: -1px; left: 50%; transform: translateX(-50%);
  width: clamp(64px, 8vw, 96px); height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--brass) 50%, transparent 100%);
  opacity: 0.55;
}
.triad-card:hover, .triad-card:focus-visible, .triad-card.is-active {
  transform: translateY(-8px);
  border-color: var(--brass);
  background:
    radial-gradient(ellipse 80% 50% at 50% 0%, rgba(232,205,168,0.32) 0%, transparent 70%),
    linear-gradient(180deg, rgba(255,250,240,1) 0%, rgba(248,239,223,0.85) 100%);
  box-shadow:
    0 28px 64px -24px rgba(91,34,56,0.22),
    0 10px 28px -12px rgba(169,127,75,0.24);
}
.triad-card:focus-visible {
  border-color: var(--plum-cta);
}
/* Step 2E.3: точная треугольная композиция по спецификации owner */
.triad-card--sun  { grid-column: 1 / span 4; margin-top: 0; }
.triad-card--moon { grid-column: 5 / span 4; margin-top: 48px; }
.triad-card--asc  { grid-column: 9 / span 4; margin-top: 12px; }

/* Mini natal-arc visual per card */
.triad-card__chart {
  width: clamp(160px, 18vw, 220px);
  height: clamp(160px, 18vw, 220px);
  position: relative;
  margin: 0 auto clamp(24px, 3vh, 36px);
  flex-shrink: 0;
}
.triad-card__chart svg {
  width: 100%; height: 100%;
  display: block;
  overflow: visible;
}
.triad-card__chart .ring {
  fill: none;
  stroke: var(--brass);
  stroke-width: 0.6;
  opacity: 0.40;
}
.triad-card__chart .arc {
  fill: none;
  stroke: var(--brass-deep);
  stroke-width: 1;
  opacity: 0.45;
  transition: opacity 0.6s var(--ease-editorial);
}
.triad-card__chart .point {
  fill: var(--brass);
  transition: r 0.6s var(--ease-editorial), filter 0.6s var(--ease-editorial);
  filter: drop-shadow(0 0 0 transparent);
}
.triad-card__chart .point-glow {
  fill: var(--brass-glow);
  opacity: 0;
  filter: blur(2px);
  transition: opacity 0.6s var(--ease-editorial);
}
.triad-card:hover .triad-card__chart .arc,
.triad-card.is-active .triad-card__chart .arc {
  opacity: 0.85;
}
.triad-card:hover .triad-card__chart .point-glow,
.triad-card.is-active .triad-card__chart .point-glow {
  opacity: 0.85;
}
.triad-card:hover .triad-card__chart .point,
.triad-card.is-active .triad-card__chart .point {
  filter: drop-shadow(0 0 6px rgba(229,192,136,0.85));
}

/* Step 2E.3: sun rays — same hover behavior as arcs */
.triad-card__chart .sun-ray {
  stroke: #B8894A;
  stroke-width: 0.85;
  stroke-linecap: round;
  opacity: 0.55;
  transition: opacity 0.6s var(--ease-editorial);
}
.triad-card:hover .triad-card__chart .sun-ray,
.triad-card.is-active .triad-card__chart .sun-ray {
  opacity: 1;
}
.triad-card__chart .sun-core {
  fill: #B8894A;
  transition: filter 0.6s var(--ease-editorial);
}
.triad-card:hover .triad-card__chart .sun-core,
.triad-card.is-active .triad-card__chart .sun-core {
  filter: drop-shadow(0 0 8px rgba(215,176,118,0.85));
}
.triad-card__chart .sun-halo {
  fill: rgba(215,176,118,0.10);
  transition: fill 0.6s var(--ease-editorial);
}
.triad-card:hover .triad-card__chart .sun-halo,
.triad-card.is-active .triad-card__chart .sun-halo {
  fill: rgba(215,176,118,0.28);
}
.triad-card__chart .moon-outline {
  fill: none; stroke: #CFAF9C; stroke-width: 0.7;
  opacity: 0.55;
  transition: opacity 0.6s var(--ease-editorial);
}
.triad-card:hover .triad-card__chart .moon-outline,
.triad-card.is-active .triad-card__chart .moon-outline {
  opacity: 0.95;
}
.triad-card__chart .moon-crescent {
  fill: #CFAF9C;
  transition: fill 0.6s var(--ease-editorial), filter 0.6s var(--ease-editorial);
}
.triad-card:hover .triad-card__chart .moon-crescent,
.triad-card.is-active .triad-card__chart .moon-crescent {
  fill: #DBC0AE;
  filter: drop-shadow(0 0 6px rgba(229,207,200,0.55));
}
.triad-card__chart .moon-halo {
  fill: rgba(229,207,200,0.12);
  transition: fill 0.6s var(--ease-editorial);
}
.triad-card:hover .triad-card__chart .moon-halo,
.triad-card.is-active .triad-card__chart .moon-halo {
  fill: rgba(229,207,200,0.30);
}
.triad-card__chart .asc-horizon,
.triad-card__chart .asc-vector {
  stroke: #6E5A47;
  stroke-width: 0.6;
  fill: none;
  opacity: 0.55;
  transition: opacity 0.6s var(--ease-editorial);
}
.triad-card:hover .triad-card__chart .asc-horizon,
.triad-card:hover .triad-card__chart .asc-vector,
.triad-card.is-active .triad-card__chart .asc-horizon,
.triad-card.is-active .triad-card__chart .asc-vector {
  opacity: 0.95;
}
.triad-card__chart .asc-arc {
  fill: none;
  stroke: #B8894A;
  stroke-width: 1;
  opacity: 0.65;
  transition: opacity 0.6s var(--ease-editorial), filter 0.6s var(--ease-editorial);
}
.triad-card:hover .triad-card__chart .asc-arc,
.triad-card.is-active .triad-card__chart .asc-arc {
  opacity: 1;
  filter: drop-shadow(0 0 6px rgba(215,176,118,0.75));
}
.triad-card__chart .asc-fill {
  fill: #B8894A;
  transition: fill 0.6s var(--ease-editorial);
}
.triad-card:hover .triad-card__chart .asc-fill,
.triad-card.is-active .triad-card__chart .asc-fill {
  fill: #C99560;
}
.triad-card__chart .asc-glow {
  fill: rgba(215,176,118,0.18);
  transition: fill 0.6s var(--ease-editorial);
}
.triad-card:hover .triad-card__chart .asc-glow,
.triad-card.is-active .triad-card__chart .asc-glow {
  fill: rgba(215,176,118,0.34);
}

.triad-card__title {
  font-family: var(--ff-display);
  font-style: italic; font-weight: 400;
  font-size: clamp(1.8rem, 2.4vw, 2.4rem);
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--ink-coffee);
  margin: 0 0 6px;
}
.triad-card__sub {
  font-family: var(--ff-display); font-style: italic;
  font-size: clamp(1rem, 1.1vw, 1.2rem);
  color: var(--brass-deep);
  margin: 0 0 clamp(20px, 3vh, 32px);
}
.triad-card__body {
  font-family: var(--ff-body);
  font-size: 15px; line-height: 1.62;
  color: var(--ink-soft);
  margin: 0 0 clamp(20px, 2.5vh, 28px);
  max-width: 32ch;
}
.triad-card__hint {
  margin-top: auto;
  font-family: var(--ff-body); font-size: 10px;
  letter-spacing: 0.26em; text-transform: uppercase;
  color: var(--brass);
  opacity: 0.65;
  transition: opacity 0.4s ease, transform 0.4s var(--ease-rhythm);
  display: inline-flex; align-items: center; gap: 8px;
}
.triad-card:hover .triad-card__hint,
.triad-card.is-active .triad-card__hint {
  opacity: 1;
  transform: translateX(4px);
}
.triad-card__hint::after {
  content: '→'; font-family: var(--ff-display); font-style: italic; font-size: 14px;
}

/* Reveal-on-scroll helper */
[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity 1.0s var(--ease-editorial),
    transform 1.0s var(--ease-editorial);
}
[data-reveal].is-revealed {
  opacity: 1;
  transform: translateY(0);
}
[data-reveal][data-reveal-delay="1"] { transition-delay: 0.10s; }
[data-reveal][data-reveal-delay="2"] { transition-delay: 0.22s; }
[data-reveal][data-reveal-delay="3"] { transition-delay: 0.36s; }

@media (max-width: 1024px) {
  .astro-triad__head { grid-column: 1 / -1; }
  .astro-triad__cards { grid-template-columns: 1fr; }
  .triad-card--sun,
  .triad-card--moon,
  .triad-card--asc {
    grid-column: 1; grid-row: auto;
    margin-top: 0; transform: none;
  }
  .triad-card--moon:hover, .triad-card--moon:focus-visible, .triad-card--moon.is-active {
    transform: translateY(-8px);
  }
}

/* ============================================================
   PROMISE — editorial pullquote with warm continuum
   ============================================================ */
.astro-promise {
  padding: clamp(48px, 7vh, 80px) 0;
  background:
    linear-gradient(180deg, var(--paper-warm) 0%, var(--paper-deeper) 100%);
  /* P10.7 (2026-05-05): убраны border-top + border-bottom — резкие brass-линии
     на переходах между секциями. Мягкий transition остаётся через background gradient. */
  position: relative;
  overflow: hidden;
}
.astro-promise::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 60%;
  background: radial-gradient(ellipse 50% 80% at 50% 0%, var(--paper-rose-soft) 0%, transparent 60%);
  pointer-events: none;
}
.astro-promise__inner { position: relative; }
.astro-promise__inner::before {
  content: 'XIII';
  grid-column: 1 / span 1;
  font-family: var(--ff-display); font-style: italic;
  font-size: clamp(2rem, 3vw, 3rem);
  color: var(--brass);
  align-self: start;
  line-height: 1;
}
#astroPromiseH {
  grid-column: 2 / span 9;
  font-family: var(--ff-display);
  font-size: clamp(2.4rem, 5vw, 4.8rem);
  font-weight: 300;
  font-style: italic;
  line-height: 1.02;
  letter-spacing: -0.025em;
  color: var(--ink-coffee);
  margin: 0 0 36px;
}
#astroPromiseH em { color: var(--brass-deep); font-style: italic; }
.astro-promise__inner p {
  grid-column: 2 / span 7;
  font-family: var(--ff-body);
  font-size: clamp(1.05rem, 1.18vw, 1.22rem);
  line-height: 1.62;
  color: var(--ink-soft);
  margin: 0;
  max-width: 60ch;
}
@media (max-width: 1024px) {
  #astroPromiseH, .astro-promise__inner p { grid-column: 1 / -1; }
  .astro-promise__inner::before { display: none; }
}

/* ============================================================
   VALUE — three editorial annotations
   ============================================================ */
.astro-value {
  padding: clamp(80px, 11vh, 140px) 0;
  background:
    linear-gradient(180deg, var(--paper-deeper) 0%, var(--paper-warm) 30%, var(--paper-cream) 100%);
}
.astro-value__head {
  grid-column: 1 / span 8;
  margin-bottom: clamp(72px, 8vh, 120px);
  display: flex; flex-direction: column; gap: 20px;
}
.astro-value__kicker {
  font-family: var(--ff-body); font-size: 11px;
  font-weight: 500; letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--brass);
  padding-bottom: 14px;
  border-bottom: 0.5px solid var(--brass-line);
  width: fit-content;
}
#astroValueH {
  font-family: var(--ff-display);
  font-size: clamp(2.2rem, 4.4vw, 4rem);
  font-weight: 300;
  font-style: italic;
  line-height: 1.04;
  letter-spacing: -0.025em;
  color: var(--ink-coffee);
  margin: 0;
  max-width: 18ch;
}
#astroValueH em { color: var(--brass-deep); }
.astro-value__head p {
  font-family: var(--ff-body);
  font-size: clamp(1rem, 1vw, 1.1rem);
  line-height: 1.6;
  color: var(--ink-soft);
  max-width: 56ch;
  margin: 8px 0 0;
}
.astro-annotations {
  grid-column: 1 / -1;
  list-style: none; padding: 0; margin: 0;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: var(--col-gap);
  border-top: 0.5px solid var(--brass-line);
}
.astro-annotation {
  grid-column: span 12;
  display: grid;
  grid-template-columns: 90px 90px 1fr 110px;
  align-items: start;
  column-gap: 36px;
  padding: clamp(40px, 6vh, 72px) 0;
  border-bottom: 0.5px solid var(--brass-line);
  position: relative;
}
.astro-annotation::after {
  content: '';
  position: absolute; left: 0; right: 0; top: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--brass-soft) 30%, var(--brass-soft) 70%, transparent 100%);
  opacity: 0;
  transition: opacity 0.6s ease;
}
.astro-annotation:hover::after { opacity: 1; }
.astro-annotation__ord {
  font-family: var(--ff-display);
  font-size: clamp(2.6rem, 3.4vw, 3.8rem);
  font-style: italic;
  font-weight: 300;
  color: var(--brass);
  line-height: 1;
}
.astro-annotation__symbol {
  width: 64px; height: 64px;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--brass-deep);
}
.astro-annotation__symbol svg { display: block; width: 56px; height: 56px; }
.astro-annotation__body { display: flex; flex-direction: column; gap: 14px; }
.astro-annotation__body h3 {
  font-family: var(--ff-display);
  font-size: clamp(1.5rem, 2vw, 2rem);
  font-style: italic;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -0.018em;
  color: var(--ink-coffee);
  margin: 0;
}
.astro-annotation__body p {
  font-family: var(--ff-body);
  font-size: 16px; line-height: 1.62;
  color: var(--ink-soft);
  margin: 0; max-width: 58ch;
}
.astro-annotation__tag {
  font-family: var(--ff-body); font-size: 10px;
  letter-spacing: 0.30em; text-transform: uppercase;
  color: var(--brass);
  text-align: right;
  align-self: start;
  padding-top: 16px;
}
@media (max-width: 1024px) {
  .astro-annotation { grid-template-columns: 60px 60px 1fr; gap: 20px; }
  .astro-annotation__tag { display: none; }
}
@media (max-width: 640px) {
  .astro-value__head { grid-column: 1 / -1; }
  .astro-annotation { grid-template-columns: 1fr; gap: 16px; }
  .astro-annotation__symbol { width: 44px; height: 44px; }
  .astro-annotation__symbol svg { width: 44px; height: 44px; }
}

/* ============================================================
   HOW — editorial 4-step
   ============================================================ */
.astro-how {
  padding: clamp(80px, 11vh, 140px) 0;
  background:
    linear-gradient(180deg, var(--paper-cream) 0%, var(--paper-warm) 50%, var(--paper-deeper) 100%);
  border-top: 0.5px solid var(--brass-line);
  border-bottom: 0.5px solid var(--brass-line);
}
.astro-how__head {
  grid-column: 1 / span 8;
  margin-bottom: clamp(72px, 8vh, 120px);
  display: flex; flex-direction: column; gap: 20px;
}
.astro-how__kicker {
  font-family: var(--ff-body); font-size: 11px;
  font-weight: 500; letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--brass);
  padding-bottom: 14px;
  border-bottom: 0.5px solid var(--brass-line);
  width: fit-content;
}
#astroHowH {
  font-family: var(--ff-display);
  font-size: clamp(2.2rem, 4.2vw, 3.8rem);
  font-weight: 300;
  font-style: italic;
  line-height: 1.04;
  letter-spacing: -0.025em;
  color: var(--ink-coffee);
  margin: 0;
}
#astroHowH em { color: var(--brass-deep); }

/* Step 2E.1: zig-zag asymmetric vertical timeline (breaks horizontal-strip feel) */
.astro-how__steps {
  grid-column: 1 / -1;
  list-style: none; padding: 0; margin: 0;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: var(--col-gap);
  row-gap: clamp(48px, 6vh, 80px);
  position: relative;
}
/* Vertical brass thread connecting steps */
.astro-how__steps::before {
  content: '';
  position: absolute;
  left: 50%; top: 0; bottom: 0;
  width: 0.5px;
  background: linear-gradient(180deg, transparent 0%, rgba(169,127,75,0.30) 12%, rgba(169,127,75,0.30) 88%, transparent 100%);
  transform: translateX(-50%);
  pointer-events: none;
}
.astro-how__step {
  position: relative;
  padding: clamp(28px, 3vh, 44px) clamp(28px, 3vw, 56px);
  display: flex; flex-direction: column; gap: 18px;
  background:
    linear-gradient(180deg, rgba(248,239,223,0.7) 0%, rgba(248,239,223,0.35) 100%);
  border: 0.5px solid var(--brass-line);
  border-radius: 2px;
}
.astro-how__step:nth-child(odd) {
  grid-column: 1 / span 6;
  margin-right: clamp(20px, 4vw, 60px);
}
.astro-how__step:nth-child(even) {
  grid-column: 7 / span 6;
  margin-left: clamp(20px, 4vw, 60px);
  margin-top: clamp(40px, 6vh, 80px);
}
.astro-how__step:nth-child(even) .astro-how__step-num {
  align-self: flex-end;
  text-align: right;
}
/* Brass dot on connecting thread */
.astro-how__step::before {
  content: '';
  position: absolute;
  width: 14px; height: 14px;
  border-radius: 50%;
  background: var(--paper-cream);
  border: 1px solid var(--brass);
  top: 50%; transform: translateY(-50%);
  box-shadow: 0 0 8px rgba(229,192,136,0.4);
}
.astro-how__step:nth-child(odd)::before {
  right: calc(-1 * clamp(20px, 4vw, 60px) - 7px);
}
.astro-how__step:nth-child(even)::before {
  left: calc(-1 * clamp(20px, 4vw, 60px) - 7px);
}
.astro-how__step-num {
  font-family: var(--ff-display); font-style: italic;
  font-weight: 300;
  font-size: clamp(2.6rem, 3.6vw, 3.8rem);
  color: var(--brass);
  line-height: 1;
  letter-spacing: -0.02em;
}
.astro-how__step-body h3 {
  font-family: var(--ff-display); font-style: italic;
  font-weight: 400;
  font-size: clamp(1.4rem, 1.8vw, 1.8rem);
  line-height: 1.2;
  color: var(--ink-coffee);
  margin: 0 0 14px;
}
.astro-how__step-body p {
  font-family: var(--ff-body);
  font-size: 15px; line-height: 1.6;
  color: var(--ink-soft); margin: 0;
}
.astro-how__step-rule { display: none; }
@media (max-width: 1024px) {
  .astro-how__steps::before { display: none; }
  .astro-how__step:nth-child(odd),
  .astro-how__step:nth-child(even) {
    grid-column: 1 / -1;
    margin: 0;
  }
  .astro-how__step::before { display: none; }
  .astro-how__step:nth-child(2) { border-right: 0.5px solid var(--brass-line); }
  .astro-how__step:nth-child(3) { border-right: none; }
}
@media (max-width: 640px) {
  .astro-how__head { grid-column: 1 / -1; }
  .astro-how__steps { grid-template-columns: 1fr; }
  .astro-how__step { border-right: none !important; padding-right: 0; }
}

/* ============================================================
   DEPTH — editorial spread
   ============================================================ */
.astro-depth {
  padding: clamp(80px, 11vh, 140px) 0;
  background:
    linear-gradient(180deg, var(--paper-deeper) 0%, var(--paper-warm) 50%, var(--paper-cream) 100%);
}
.astro-depth__head {
  grid-column: 1 / span 8;
  margin-bottom: clamp(72px, 8vh, 120px);
  display: flex; flex-direction: column; gap: 20px;
}
.astro-depth__kicker {
  font-family: var(--ff-body); font-size: 11px;
  font-weight: 500; letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--brass);
  padding-bottom: 14px;
  border-bottom: 0.5px solid var(--brass-line);
  width: fit-content;
}
#astroDepthH {
  font-family: var(--ff-display);
  font-size: clamp(2.2rem, 4.2vw, 3.8rem);
  font-weight: 300;
  font-style: italic;
  line-height: 1.04;
  letter-spacing: -0.025em;
  color: var(--ink-coffee);
  margin: 0;
}
#astroDepthH em { color: var(--brass-deep); }
.astro-depth__head p {
  font-family: var(--ff-body);
  font-size: clamp(1rem, 1vw, 1.1rem);
  line-height: 1.6;
  color: var(--ink-soft);
  max-width: 58ch;
  margin: 8px 0 0;
}
.astro-depth__spread {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: var(--col-gap);
  row-gap: clamp(40px, 6vh, 72px);
}
.astro-depth__lead {
  grid-column: 1 / span 6;
  display: flex; flex-direction: column; gap: 22px;
  padding-right: clamp(0px, 2vw, 36px);
  position: relative;
}
.astro-depth__lead-kicker {
  font-family: var(--ff-display); font-style: italic;
  font-size: 15px; color: var(--brass);
}
.astro-depth__lead h3 {
  font-family: var(--ff-display); font-style: italic;
  font-weight: 400;
  font-size: clamp(1.7rem, 2.6vw, 2.6rem);
  line-height: 1.15;
  letter-spacing: -0.018em;
  color: var(--ink-coffee);
  margin: 0; max-width: 18ch;
}
.astro-depth__lead p {
  font-family: var(--ff-body);
  font-size: 16px; line-height: 1.62;
  color: var(--ink-soft);
  margin: 0; max-width: 50ch;
}
.astro-depth__lead-rule {
  position: absolute; right: 0; top: 0; bottom: 0;
  width: 0.5px; background: var(--brass-line);
}
.astro-depth__notes {
  grid-column: 7 / span 6;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
}
.astro-depth__note {
  display: flex; flex-direction: column; gap: 14px;
  padding: 26px 0 0;
  border-top: 0.5px solid var(--brass-line);
  position: relative;
}
.astro-depth__note-ord {
  font-family: var(--ff-display); font-style: italic;
  font-size: 15px; color: var(--brass);
}
.astro-depth__note h4 {
  font-family: var(--ff-display); font-style: italic;
  font-weight: 400;
  font-size: clamp(1.25rem, 1.6vw, 1.5rem);
  line-height: 1.2;
  color: var(--ink-coffee);
  margin: 0;
}
.astro-depth__note p {
  font-family: var(--ff-body);
  font-size: 14px; line-height: 1.6;
  color: var(--ink-soft); margin: 0;
}
.astro-depth__note--ai .astro-depth__note-ord { color: var(--plum-cta); }
@media (max-width: 1024px) {
  .astro-depth__lead { grid-column: 1 / -1; padding-right: 0; }
  .astro-depth__lead-rule { display: none; }
  .astro-depth__notes { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .astro-depth__head { grid-column: 1 / -1; }
  .astro-depth__notes { grid-template-columns: 1fr; }
}

/* ============================================================
   COURSE-CTA — editorial pullquote bridge
   ============================================================ */
.astro-course-cta {
  padding: clamp(72px, 10vh, 130px) 0;
  background:
    linear-gradient(180deg, var(--paper-cream) 0%, var(--paper-warm) 30%, var(--paper-rose-soft) 70%, var(--paper-warm) 100%);
  border-top: 0.5px solid var(--brass-line);
  border-bottom: 0.5px solid var(--brass-line);
  position: relative;
  overflow: hidden;
}
.astro-course-cta::before {
  content: '';
  position: absolute; bottom: 0; left: 0; right: 0;
  height: 70%;
  background: radial-gradient(ellipse 50% 80% at 70% 100%, var(--paper-rose) 0%, transparent 60%);
  pointer-events: none;
}
.astro-course-cta__inner { position: relative; }
.astro-course-cta__inner::before {
  content: 'XVI';
  grid-column: 1 / span 1;
  font-family: var(--ff-display); font-style: italic;
  font-size: clamp(2rem, 3vw, 3rem);
  color: var(--brass);
  align-self: start;
  line-height: 1;
}
#astroCourseH {
  grid-column: 2 / span 8;
  font-family: var(--ff-display);
  font-size: clamp(2.2rem, 4.4vw, 4rem);
  font-weight: 300;
  font-style: italic;
  line-height: 1.02;
  letter-spacing: -0.025em;
  color: var(--ink-coffee);
  margin: 0 0 32px;
  max-width: 22ch;
}
#astroCourseH em { color: var(--brass-deep); }
.astro-course-cta__inner > p {
  grid-column: 2 / span 8;
  font-family: var(--ff-body);
  font-size: clamp(1.05rem, 1.15vw, 1.22rem);
  line-height: 1.62;
  color: var(--ink-soft);
  margin: 0 0 40px;
  max-width: 60ch;
}
.astro-course-cta__actions {
  grid-column: 2 / span 8;
  display: flex; align-items: center; gap: 32px; flex-wrap: wrap;
}
.astro-course-cta__link {
  font-family: var(--ff-display); font-style: italic;
  font-size: 16px;
  color: var(--ink-soft);
  text-decoration: none;
  display: inline-flex; align-items: center; gap: 4px;
}
.astro-course-cta__link span {
  border-bottom: 0.5px solid var(--brass-line);
  color: var(--brass);
  padding-bottom: 1px;
  transition: border-color 0.2s ease;
}
.astro-course-cta__link:hover span { border-bottom-color: var(--brass); }
@media (max-width: 1024px) {
  #astroCourseH, .astro-course-cta__inner > p, .astro-course-cta__actions { grid-column: 1 / -1; }
  .astro-course-cta__inner::before { display: none; }
}

/* ============================================================
   FAQ — quiet 2-col editorial
   ============================================================ */
.astro-faq {
  padding: clamp(72px, 10vh, 130px) 0;
  background:
    linear-gradient(180deg, var(--paper-warm) 0%, var(--paper-cream) 50%, var(--paper-deeper) 100%);
}
.astro-faq__head {
  grid-column: 1 / span 8;
  margin-bottom: clamp(56px, 7vh, 88px);
  display: flex; flex-direction: column; gap: 20px;
}
.astro-faq__kicker {
  font-family: var(--ff-body); font-size: 11px;
  font-weight: 500; letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--brass);
  padding-bottom: 14px;
  border-bottom: 0.5px solid var(--brass-line);
  width: fit-content;
}
#astroFaqH {
  font-family: var(--ff-display);
  font-size: clamp(2rem, 3.4vw, 3rem);
  font-weight: 300;
  font-style: italic;
  line-height: 1.04;
  letter-spacing: -0.022em;
  color: var(--ink-coffee);
  margin: 0;
}
#astroFaqH em { color: var(--brass-deep); }

.astro-faq__list {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: clamp(36px, 4vw, 72px);
  row-gap: 0;
}
.astro-faq__list details {
  border-top: 0.5px solid var(--brass-line);
  padding: 26px 0;
  transition: background 0.3s ease;
}
.astro-faq__list details[open] { background: rgba(169,127,75,0.03); }
.astro-faq__list details:last-child:nth-child(odd),
.astro-faq__list details:nth-last-child(2):nth-child(odd) {
  border-bottom: 0.5px solid var(--brass-line);
}
.astro-faq__list summary {
  font-family: var(--ff-display); font-style: italic;
  font-weight: 400;
  font-size: clamp(1.1rem, 1.25vw, 1.22rem);
  line-height: 1.4;
  color: var(--ink-coffee);
  cursor: pointer;
  list-style: none;
  display: flex; justify-content: space-between; align-items: flex-start; gap: 18px;
}
.astro-faq__list summary::-webkit-details-marker { display: none; }
.astro-faq__list summary::after {
  content: '+';
  font-family: var(--ff-display); font-style: italic;
  font-size: 26px;
  color: var(--brass);
  line-height: 1;
  transition: transform 0.4s var(--ease-cinematic);
  flex-shrink: 0;
}
.astro-faq__list details[open] summary::after { transform: rotate(45deg); }
.astro-faq__list details p {
  font-family: var(--ff-body);
  font-size: 15px; line-height: 1.62;
  color: var(--ink-soft);
  margin: 16px 0 0; max-width: 58ch;
}
@media (max-width: 768px) {
  .astro-faq__head { grid-column: 1 / -1; }
  .astro-faq__list { grid-template-columns: 1fr; }
}

/* ============================================================
   FINAL — warm fade transition; footer continuum
   ============================================================ */
/* Step 2E.3: smooth cream → cosmic plum (matched to footer #2B1E23) */
.astro-final {
  padding: clamp(80px, 11vh, 140px) 0 clamp(96px, 13vh, 160px);
  background:
    linear-gradient(180deg,
      var(--paper-deeper) 0%,
      var(--paper-warm) 18%,
      var(--paper-rose-soft) 38%,
      #C7A688 58%,
      #6B4536 78%,
      #3D262B 92%,
      #2B1E23 100%);
  /* P10.6 (2026-05-05): убран жёсткий border-top var(--brass-line) перед final-блоком —
     теперь переход FAQ→final мягкий через background gradient без видимой линии. */
  text-align: center;
  position: relative;
  overflow: hidden;
}
.astro-final::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 70% 80% at 50% 50%, var(--paper-rose-soft) 0%, transparent 60%);
  pointer-events: none;
}
/* Subtle stardust over the dark transition zone */
.astro-final::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 50%;
  background-image:
    radial-gradient(circle at 12% 80%, rgba(229,192,136,0.55) 0px, transparent 1.5px),
    radial-gradient(circle at 28% 65%, rgba(229,192,136,0.40) 0px, transparent 1.5px),
    radial-gradient(circle at 44% 88%, rgba(229,192,136,0.50) 0px, transparent 1px),
    radial-gradient(circle at 62% 72%, rgba(229,192,136,0.30) 0px, transparent 1.2px),
    radial-gradient(circle at 78% 92%, rgba(229,192,136,0.45) 0px, transparent 1.5px),
    radial-gradient(circle at 88% 78%, rgba(229,192,136,0.35) 0px, transparent 1px);
  pointer-events: none;
  opacity: 0.85;
  mix-blend-mode: screen;
}
.astro-final__inner {
  display: flex !important;
  grid-template-columns: none !important;
  flex-direction: column;
  align-items: center;
  text-align: center;
  position: relative; z-index: 2;
}
.astro-final__mark {
  width: 88px; height: 88px;
  margin-bottom: 32px;
  animation: final-mark-pulse 8s ease-in-out infinite;
}
@keyframes final-mark-pulse {
  0%,100% { opacity: 0.7; transform: scale(1); }
  50%     { opacity: 1; transform: scale(1.04); }
}
.astro-final h3 {
  font-family: var(--ff-display); font-style: italic;
  font-weight: 300;
  font-size: clamp(1.5rem, 2.4vw, 2.2rem);
  line-height: 1.25;
  letter-spacing: -0.02em;
  color: var(--ink-coffee);
  margin: 0 0 22px; max-width: 28ch;
}
.astro-final p {
  font-family: var(--ff-body);
  font-size: 15px; line-height: 1.62;
  color: var(--ink-soft);
  margin: 0 0 36px; max-width: 56ch;
}
.astro-final__pwa {
  margin-top: clamp(24px, 4vh, 48px);
  position: relative; z-index: 3;
}
.astro-final__pwa a {
  font-family: var(--ff-body); font-size: 11px;
  letter-spacing: 0.26em; text-transform: uppercase;
  /* Light text for readability over the darkening gradient zone */
  color: rgba(245,237,227,0.95);
  border-bottom: 0.5px solid rgba(229,192,136,0.55);
  padding-bottom: 4px;
  transition: border-color 0.2s ease, color 0.2s ease;
  text-shadow: 0 0 24px rgba(63,42,31,0.5);
}
.astro-final__pwa a:hover {
  color: var(--brass-bright);
  border-bottom-color: var(--brass-bright);
}

/* Step 2E.3: page-scoped footer contrast fix per owner spec —
   dark plum-cosmic background + warm light text + raised secondary opacity. */
body:has(.astro) .footer {
  background: linear-gradient(180deg, #2B1E23 0%, #251820 50%, #1F1318 100%);
  border-top: 0;
}
body:has(.astro) .footer-brand .logo,
body:has(.astro) .footer-brand .logo span {
  color: #F3E8DC;
}
body:has(.astro) .footer-brand-desc {
  color: rgba(243,232,220,0.78);
}
body:has(.astro) .footer-brand-socials a {
  color: rgba(243,232,220,0.65);
  border-color: rgba(243,232,220,0.18);
}
body:has(.astro) .footer-brand-socials a:hover {
  color: #D2B08F;
  border-color: #D2B08F;
  background: rgba(210,176,143,0.10);
}
body:has(.astro) .footer-meta-disclaimer {
  /* Owner-FB pass: 0.62 → 0.78 — Meta-disclaimer был трудно читаемым на dark plum. */
  color: rgba(243,232,220,0.78);
}
body:has(.astro) .footer-col h4 {
  color: #D2B08F;
}
body:has(.astro) .footer-col a {
  color: rgba(243,232,220,0.78);
}
body:has(.astro) .footer-col a:hover {
  color: #E5C088;
}
body:has(.astro) .footer-legal {
  border-top-color: rgba(243,232,220,0.10);
}
body:has(.astro) .footer-legal p {
  /* Owner-FB pass: 0.62 → 0.78 — copyright/ИП-data была pale. */
  color: rgba(243,232,220,0.78);
}
body:has(.astro) .footer-legal a {
  color: rgba(243,232,220,0.72);
}
body:has(.astro) .footer-legal a:hover {
  color: #E5C088;
}

/* ============================================================
   KILL SWITCH OVERLAY (preserved)
   ============================================================ */
/* Step 2D: kill-switch dialog — hidden by default, JS toggles via [hidden] attr */
.astro-kill[hidden] { display: none !important; }
.astro-kill {
  position: fixed; inset: 0; z-index: 200;
  background: rgba(47,38,32,0.85);
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
}
.astro-kill > * {
  background: var(--paper-cream);
  padding: 36px 44px;
  font-family: var(--ff-display); font-style: italic;
  color: var(--ink-coffee);
  border: 0.5px solid var(--brass-line);
  max-width: 520px; text-align: center;
}

/* ============================================================
   Submit state (JS sets data-form-state="submitting")
   ============================================================ */
.astro-form[data-form-state="submitting"] { opacity: 0.7; pointer-events: none; }
.astro-form[data-form-state="submitting"] input,
.astro-form[data-form-state="submitting"] button { cursor: wait; }

[data-scene-state="resolved"] { transition: all 0.6s var(--ease-editorial); }

/* ============================================================
   ENTRY MOTION — editorial reveal stagger
   ============================================================ */
@media (prefers-reduced-motion: no-preference) {
  .astro-hero__edition {
    opacity: 0; transform: translateY(-12px);
    animation: editorial-fade 1.0s var(--ease-editorial) 0.1s forwards;
  }
  .astro-hero__title-line {
    display: block;
    opacity: 0; transform: translateY(40px);
    animation: editorial-rise 1.4s var(--ease-cinematic) forwards;
  }
  .astro-hero__title-line:nth-child(1) { animation-delay: 0.30s; }
  .astro-hero__title-line:nth-child(2) { animation-delay: 0.50s; }
  .astro-hero__title-sub {
    opacity: 0; transform: translateY(16px);
    animation: editorial-rise 1.0s var(--ease-editorial) 0.85s forwards;
  }
  .astro-hero__lead {
    opacity: 0; transform: translateY(16px);
    animation: editorial-rise 1.0s var(--ease-editorial) 1.0s forwards;
  }
  .astro-hero__corner {
    opacity: 0;
    animation: editorial-fade 1.0s var(--ease-editorial) 1.2s forwards;
  }
  /* Step 2C: scene container has no animation; .astro-hero__canvas has its own scene-canvas-arrive */
  .astro-desk {
    opacity: 0; transform: translateY(20px);
    animation: editorial-rise 1.0s var(--ease-editorial) 1.4s forwards;
  }
}
@keyframes editorial-rise {
  to { opacity: 1; transform: translateY(0); }
}
@keyframes editorial-fade {
  to { opacity: 1; transform: translateY(0); }
}
/* Step 2C: scene-arrive removed; canvas has its own fade-in */

@media (prefers-reduced-motion: reduce) {
  .astro-hero__atmosphere::after,
  .astro-hero__atmosphere::before,
  .astro-hero__canvas,
  .astro-hero__numerals,
  .astro-final__mark { animation: none !important; }
  .astro-hero__canvas { opacity: 0.85 !important; }
  .astro-hero__numerals { opacity: 0.55 !important; }
  .astro-hero__edition,
  .astro-hero__title-line,
  .astro-hero__title-sub,
  .astro-hero__lead,
  .astro-hero__corner,
  .astro-hero__scene,
  .astro-desk { opacity: 1; transform: none !important; animation: none !important; }
  .astro-scene__callout,
  .astro-hero__callout { transition: none; }
}

/* ============================================================
   ULTRA-WIDE
   ============================================================ */
@media (min-width: 1920px) {
  .astro-hero__title-line, .astro-hero__title-line--em { font-size: clamp(5rem, 8vw, 9.6rem); }
}
@media (min-width: 2400px) {
  .astro-hero__inner { padding-top: clamp(160px, 14vh, 240px); }
}

/* ============================================================
   PRINT
   ============================================================ */
@media print {
  .astro::before, .astro-hero__atmosphere, .astro-hero__scene, .astro-final__mark { display: none; }
  body, .astro { background: white; color: black; }
}

/* ============================================================
   FULL-FIX 2026-04-29 — Factual data blocks (free tier)
   Стили для секции .astro-facts с таблицами планет / аспектов /
   планет-в-знаках / планет-в-домах / куспидов / конфигураций / баланса.
   Editorial palette, тонкие линии, без агрессивных RGB.
   ============================================================ */

.astro-facts {
  /* Reopen-fix (2026-04-30): без grid-column section auto-placement
     помещал .astro-facts в одну колонку 12-col grid внутри
     .astro-hero__resolved → ширина 520 px на 1440 viewport ("узкий
     столбик"). Принудительно растягиваем на всю ширину result-area. */
  grid-column: 1 / -1;
  margin-top: clamp(28px, 4vh, 56px);
  padding-top: clamp(24px, 3vh, 40px);
  border-top: 0.5px solid var(--brass-line, rgba(169, 127, 75, 0.3));
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(16px, 2.4vw, 28px);
}

.astro-facts__head {
  grid-column: 1 / -1;
  margin-bottom: clamp(12px, 2vh, 20px);
}
.astro-facts__kicker {
  display: block;
  font-family: var(--ff-body, 'Inter', sans-serif);
  font-size: 10px; letter-spacing: 0.26em; text-transform: uppercase;
  color: var(--brass, #A97F4B);
  margin-bottom: 8px;
}
.astro-facts__title {
  font-family: var(--ff-display, 'Fraunces', Georgia, serif);
  font-style: italic; font-weight: 400;
  font-size: clamp(1.5rem, 2.4vw, 2.1rem);
  color: var(--ink-coffee, #3B302A);
  margin: 0 0 8px 0;
  line-height: 1.15;
}
.astro-facts__lead {
  font-family: var(--ff-body, 'Inter', sans-serif);
  font-size: 13px; line-height: 1.5;
  color: var(--ink-soft, #6B5E52);
  margin: 0;
  max-width: 60ch;
}

.astro-facts__card {
  background: rgba(255, 250, 240, 0.4);
  border: 0.5px solid var(--brass-line, rgba(169, 127, 75, 0.3));
  padding: clamp(16px, 2vw, 22px);
  border-radius: 2px;
}
.astro-facts__card--planets,
.astro-facts__card--aspects { grid-column: 1 / -1; }

.astro-facts__card-head {
  display: flex; align-items: baseline; gap: 12px;
  margin-bottom: 14px;
  border-bottom: 0.5px solid var(--brass-line, rgba(169, 127, 75, 0.25));
  padding-bottom: 10px;
}
.astro-facts__card-title {
  font-family: var(--ff-display, 'Fraunces', Georgia, serif);
  font-style: italic; font-weight: 400;
  font-size: clamp(1.05rem, 1.4vw, 1.25rem);
  color: var(--ink-coffee, #3B302A);
  margin: 0;
  flex-grow: 1;
}
.astro-facts__card-counter {
  font-family: var(--ff-body, 'Inter', sans-serif);
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--brass, #A97F4B);
  background: rgba(169, 127, 75, 0.1);
  padding: 4px 10px; border-radius: 2px;
}
/* P10.4 (2026-05-05): hide aspects counter when empty (pre-fill removed).
   astro.js sets textContent to filtered.length post-submit; if 0 aspects,
   рудиментарный edge case — отображается «0», нерешаемый pure CSS. */
.astro-facts__card-counter:empty { display: none; }

/* Glyphs */
.astro-facts__glyph {
  font-family: Georgia, 'DejaVu Sans', serif;
  font-size: 16px;
  color: var(--ink-coffee, #3B302A);
  display: inline-block; min-width: 18px;
  text-align: center;
  vertical-align: -2px;
}
.astro-facts__glyph-angle {
  font-size: 11px; font-weight: 700; letter-spacing: 0.05em;
  color: var(--brass-deep, #8B6438);
}
.astro-facts__sign-glyph {
  font-family: Georgia, 'DejaVu Sans', serif;
  font-size: 18px;
  color: var(--brass-deep, #8B6438);
}
.astro-facts__retro {
  color: var(--plum-cta, #5B2238);
  font-weight: 700;
  margin-left: 4px;
}

/* Planet table */
.astro-facts__table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.astro-facts__table {
  width: 100%; border-collapse: collapse;
  font-family: var(--ff-body, 'Inter', sans-serif);
  font-size: 13px;
  color: var(--ink-coffee, #3B302A);
}
.astro-facts__table th {
  text-align: left;
  font-weight: 400;
  font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--brass, #A97F4B);
  padding: 8px 12px 8px 0;
  border-bottom: 0.5px solid var(--brass-line, rgba(169, 127, 75, 0.3));
}
.astro-facts__table td {
  padding: 9px 12px 9px 0;
  border-bottom: 0.25px solid rgba(169, 127, 75, 0.15);
  vertical-align: middle;
}
.astro-facts__table tr:last-child td { border-bottom: none; }
.astro-facts__td-num {
  font-variant-numeric: tabular-nums;
  color: var(--ink-soft, #6B5E52);
}
.astro-facts__th-house {
  text-align: right; padding-right: 0;
}
.astro-facts__row-angle td {
  background: rgba(169, 127, 75, 0.05);
  font-style: italic;
}

/* Aspects list */
.astro-facts__aspects-list {
  list-style: none; padding: 0; margin: 0;
  display: grid; gap: 6px;
}
.astro-facts__aspect {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; padding: 8px 12px;
  font-family: var(--ff-body, 'Inter', sans-serif);
  font-size: 13px;
  border-left: 2px solid transparent;
  background: rgba(255, 250, 240, 0.4);
}
.astro-facts__aspect--soft   { border-left-color: var(--earth-tone, #6A4B1A); }
.astro-facts__aspect--tense  { border-left-color: var(--plum-cta, #5B2238); }
.astro-facts__aspect--neutral { border-left-color: var(--brass-deep, #8B6438); }
.astro-facts__aspect--minor  { border-left-color: var(--ink-soft, #6B5E52); }
.astro-facts__aspect-pair {
  color: var(--ink-coffee, #3B302A);
}
.astro-facts__aspect-orb {
  color: var(--ink-soft, #6B5E52);
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  flex-shrink: 0;
}

.astro-facts__toggle {
  margin-top: 10px;
  background: transparent;
  border: 0.5px solid var(--brass, #A97F4B);
  color: var(--brass, #A97F4B);
  padding: 8px 16px;
  font-family: var(--ff-body, 'Inter', sans-serif);
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  cursor: pointer;
  border-radius: 2px;
  transition: background 0.2s, color 0.2s;
}
.astro-facts__toggle:hover { background: var(--brass, #A97F4B); color: white; }

/* Definition lists for signs / houses */
.astro-facts__defs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px 16px;
  margin: 0;
  padding: 0;
}
.astro-facts__defs dt {
  font-family: var(--ff-body, 'Inter', sans-serif);
  font-size: 12px;
  color: var(--ink-soft, #6B5E52);
  margin-bottom: 4px;
}
.astro-facts__defs dd {
  margin: 0 0 10px 0;
  font-family: var(--ff-body, 'Inter', sans-serif);
  font-size: 14px;
  color: var(--ink-coffee, #3B302A);
}
.astro-facts__house-num {
  display: inline-block;
  font-family: var(--ff-display, 'Fraunces', Georgia, serif);
  font-style: italic; font-size: 16px;
  color: var(--brass-deep, #8B6438);
  min-width: 22px;
  margin-right: 4px;
}

/* Cusps list */
.astro-facts__cusps-list {
  list-style: none; padding: 0; margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 8px 18px;
}
.astro-facts__cusps-list li {
  display: flex; align-items: baseline; flex-wrap: wrap;
  column-gap: 12px; row-gap: 2px;
  padding: 8px 0;
  border-bottom: 0.25px solid rgba(169, 127, 75, 0.15);
  font-family: var(--ff-body, 'Inter', sans-serif);
  font-size: 13px;
  line-height: 1.45;
}
.astro-facts__cusps-list .astro-facts__house-num {
  flex-shrink: 0;
  min-width: 18px;
  text-align: right;
}
.astro-facts__house-cusp {
  font-variant-numeric: tabular-nums;
  color: var(--ink-soft, #6B5E52);
  min-width: 64px;
  flex-shrink: 0;
  white-space: nowrap;
}
.astro-facts__house-sign {
  color: var(--ink-coffee, #3B302A);
  white-space: nowrap;
  flex-shrink: 0;
}
.astro-facts__house-sign .astro-facts__sign-glyph {
  margin-right: 4px;
}

/* Configurations */
.astro-facts__configs-list {
  list-style: none; padding: 0; margin: 0;
  display: grid; gap: 10px;
}
.astro-facts__config {
  padding: 10px 14px;
  background: rgba(169, 127, 75, 0.06);
  border-left: 2px solid var(--brass, #A97F4B);
  font-family: var(--ff-body, 'Inter', sans-serif);
}
.astro-facts__config-kind {
  display: block;
  font-family: var(--ff-display, 'Fraunces', Georgia, serif);
  font-style: italic; font-size: 14px;
  color: var(--ink-coffee, #3B302A);
  margin-bottom: 4px;
}
.astro-facts__config-planets {
  display: block;
  font-size: 13px;
  color: var(--ink-soft, #6B5E52);
}

/* Balance grid */
.astro-facts__balance-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 18px;
}
.astro-facts__bal-section {
  border-left: 2px solid var(--brass-line, rgba(169, 127, 75, 0.3));
  padding-left: 14px;
}
.astro-facts__bal-title {
  font-family: var(--ff-body, 'Inter', sans-serif);
  font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--brass, #A97F4B);
  margin: 0 0 10px 0;
  font-weight: 400;
}
.astro-facts__bal-row {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 4px 0;
  border-bottom: 0.25px solid rgba(169, 127, 75, 0.12);
  font-family: var(--ff-body, 'Inter', sans-serif);
  font-size: 13px;
}
.astro-facts__bal-row:last-child { border-bottom: none; }
.astro-facts__bal-label { color: var(--ink-soft, #6B5E52); }
.astro-facts__bal-value {
  color: var(--ink-coffee, #3B302A);
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}

/* Mobile stack */
@media (max-width: 900px) {
  .astro-facts {
    grid-template-columns: 1fr;
  }
  .astro-facts__card { padding: 14px 14px; }
  .astro-facts__table th,
  .astro-facts__table td { padding: 7px 8px 7px 0; font-size: 12px; }
  .astro-facts__defs {
    grid-template-columns: 1fr;
  }
  .astro-facts__cusps-list { grid-template-columns: 1fr; }
  .astro-facts__balance-grid { grid-template-columns: 1fr; }
}

/* Reduced motion — no transitions */
@media (prefers-reduced-motion: reduce) {
  .astro-facts__toggle { transition: none; }
}

/* ============================================================
   Content-depth pass (2026-04-30) — additive styles
   ============================================================ */

/* Editorial intro paragraph для каждой factual card —
   1-2 sentence, brass/serif italic, мягко вводит блок. */
.astro-facts__intro {
  font-family: var(--ff-display, 'Fraunces', Georgia, serif);
  font-style: italic;
  font-size: 14px;
  line-height: 1.55;
  color: var(--ink-soft, #6B5E52);
  margin: 0 0 18px 0;
  max-width: 70ch;
}

/* House-name label (e.g. "— личность", "— партнёрства") в planets-in-houses
   и houses-in-signs — мягкая subdued italic после номера дома. */
.astro-facts__house-name {
  font-family: var(--ff-display, 'Fraunces', Georgia, serif);
  font-style: italic;
  font-size: 13px;
  color: var(--ink-soft, #6B5E52);
  margin-left: 4px;
}
.astro-facts__cusps-list .astro-facts__house-name {
  margin-right: 6px;
  flex-shrink: 0;
}

/* Footer width consistency on >1280 viewports — match astro sections
   (max-width 1840px from inline body styles). Без этого правила footer
   сжимается до глобальных 1200px и выглядит уже main content. */
@media (min-width: 1281px) {
  body:has(.astro) .footer-inner,
  body:has(.astro) .footer-legal-inner {
    max-width: 1840px;
  }
}

/* ============================================================
   Polish-pass (2026-04-30) — result-arrival soft fade-in.
   CSS-only keyframe animation; reduced-motion safe.
   Trigger: body.astro-has-result is set by astro.js right before
   the factual cards are unhidden — animation fires once per card.
   ============================================================ */
@keyframes astroResultArrive {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: none; }
}
/* P10.2 (2026-05-05) — selectors aligned to actual DOM. Result-block sub-elements
   (head, triad cards, numerology, interpretation, exports, CTA) теперь тоже
   получают staged fade. Stagger 80ms между элементами, easing premium smooth. */
body.astro-has-result .astro-result__head,
body.astro-has-result .astro-result__card,
body.astro-has-result .astro-result__numerology,
body.astro-has-result .astro-result__interpretation,
body.astro-has-result .astro-result__exports,
body.astro-has-result .astro-result__cta,
body.astro-has-result .astro-facts__card {
  animation: astroResultArrive 480ms cubic-bezier(0.32, 0.72, 0, 1) both;
}
body.astro-has-result .astro-result__head                  { animation-delay:   0ms; }
body.astro-has-result .astro-result__card:nth-of-type(1)   { animation-delay:  80ms; }
body.astro-has-result .astro-result__card:nth-of-type(2)   { animation-delay: 160ms; }
body.astro-has-result .astro-result__card:nth-of-type(3)   { animation-delay: 240ms; }
body.astro-has-result .astro-result__numerology            { animation-delay: 280ms; }
body.astro-has-result .astro-result__interpretation        { animation-delay: 320ms; }
body.astro-has-result .astro-facts__card:nth-of-type(1)    { animation-delay: 400ms; }
body.astro-has-result .astro-facts__card:nth-of-type(2)    { animation-delay: 460ms; }
body.astro-has-result .astro-facts__card:nth-of-type(3)    { animation-delay: 520ms; }
body.astro-has-result .astro-facts__card:nth-of-type(4)    { animation-delay: 580ms; }
body.astro-has-result .astro-facts__card:nth-of-type(5)    { animation-delay: 640ms; }
body.astro-has-result .astro-facts__card:nth-of-type(n+6)  { animation-delay: 700ms; }
body.astro-has-result .astro-result__exports               { animation-delay: 760ms; }
body.astro-has-result .astro-result__cta                   { animation-delay: 820ms; }

@media (prefers-reduced-motion: reduce) {
  body.astro-has-result .astro-result__head,
  body.astro-has-result .astro-result__card,
  body.astro-has-result .astro-result__numerology,
  body.astro-has-result .astro-result__interpretation,
  body.astro-has-result .astro-result__exports,
  body.astro-has-result .astro-result__cta,
  body.astro-has-result .astro-facts__card {
    animation: none;
  }
}

/* ============================================================
   V3.1 hero canvas revive (2026-04-30) — owner feedback на V3:
   я заменил canvas-based «Living Scene» на CSS-fake motion поверх
   статичного closeout-pass'овского SVG accent. Это была ошибка.
   Owner прав: настоящая живая сцена — это natal-scene.js Step 2D
   (Multi-layer Canvas2D: 7 орбит + 12 планет + 8 аспект-линий +
   light-packets + cursor gravity). Canvas-контейнер был удалён
   polish-pass'ом, accent SVG заменил его — natal-scene.js boot()
   silent-no-op'ил в отсутствие `.astro-hero__canvas` элемента.
   В V3.1 canvas вернули, accent SVG закомментирован в HTML,
   V3 fake-motion блок удалён. Остаётся: edition+corner hide,
   hero::after fade-seam — обе правки про clutter/seam, не motion.
   Накрест: existing CSS правила .astro-hero__canvas L363-380
   (animation: scene-canvas-arrive 2.6s) уже жили в файле.
   ============================================================ */

/* 1. Скрытие owner-flagged мусора в hero — top-left/top-right
      edition strip и right-side corner CTA. Display:none, чтобы
      grid освободил место и композиция упростилась.
      animation:none дополнительно нейтрализует старые entry-fade
      правила L2551-2554/2570-2573 (dead-tween fix M1). */
.astro-hero__edition,
.astro-hero__corner {
  display: none !important;
  animation: none !important;
}

/* 2. Phase 1 — «диск выходит за обрезанный контур» (owner-feedback 2026-04-30):
      Раньше canvas-сцена обрезалась нижней границей hero (overflow:hidden),
      что создавало жёсткий шов на стыке hero → astro-desk. Owner попросил
      убрать этот шов, чтобы диск плавно «выходил» за hero и растворялся в
      следующей секции — без жёсткого контура. Решение из 4 шагов: */

/* 2.1 Hero overflow visible + поднимаем выше astro-desk по z-index, чтобы
       canvas overflow реально отрисовался поверх astro-desk фона.
       Селектор `.astro > section.astro-hero` нужен для повышения специфичности
       над `.astro > section { z-index: 1 }` на L94. Обычный `.astro-hero`
       (specificity 0,1,0) проигрывает `.astro > section` (0,1,1). */
.astro > section.astro-hero {
  overflow: visible;
  z-index: 5;
}

/* 2.2 Atmosphere остаётся в границах hero — не должна вылезать в navbar /
       по бокам / в astro-desk. clip-path обрезает по самой hero. */
.astro-hero__atmosphere {
  clip-path: inset(0 0 0 0);
}

/* 2.3 Scene wrapper и numerals разрешают canvas выехать на 280px вниз —
       примерно нижняя половина диска при viewport 1440. Boka и top
       обрезаются по hero. */
.astro-hero__scene,
.astro-hero__numerals {
  clip-path: inset(0 0 -280px 0);
}

/* 2.4 Mask на canvas — нижний край диска не «обрезается» прямой линией,
       а плавно растворяется. От верха до 55% canvas — полная видимость,
       от 55% до 100% — мягкое затухание opacity. Это даёт ощущение что
       диск «дышит» и переходит в следующий блок естественно, без шва. */
.astro-hero__canvas {
  -webkit-mask-image: linear-gradient(180deg,
    rgb(0 0 0)            0%,
    rgb(0 0 0)            55%,
    rgb(0 0 0 / 0.78)    70%,
    rgb(0 0 0 / 0.40)    85%,
    transparent          100%);
  mask-image: linear-gradient(180deg,
    rgb(0 0 0)            0%,
    rgb(0 0 0)            55%,
    rgb(0 0 0 / 0.78)    70%,
    rgb(0 0 0 / 0.40)    85%,
    transparent          100%);
}

/* 2.5 ::after fade больше не нужен — диск сам перекрывает зону шва.
       Полностью убираем. */
.astro-hero::after { display: none; }

/* 2.6 astro-desk__bridge — тонкая brass линия на 36px от top desk,
       визуально читается как «вот тут начинается следующая секция».
       Owner: «не должно быть такого явного разделения». Скрываем. */
.astro-desk__bridge { display: none; }


/* ============================================================
   Phase 2 motion-pass (2026-05-01) — секции ниже hero дышат:
   scroll-reveal entry, stagger, hover micro-interactions, accent
   line draw-in, ambient breath orbs в фоне всей страницы.
   Используем уже существующий [data-reveal] IO в natal-page-extras.js
   (L77-112) — class .is-revealed добавляется при intersection.
   ============================================================ */

/* Phase 2.1 — расширяем reveal-delay с "1..3" до "1..6" для длинных
   списков (4 шага в astro-how, 5 notes в astro-depth, 6 details в FAQ). */
[data-reveal][data-reveal-delay="4"] { transition-delay: 0.50s; }
[data-reveal][data-reveal-delay="5"] { transition-delay: 0.62s; }
[data-reveal][data-reveal-delay="6"] { transition-delay: 0.74s; }

/* Phase 2.2 — hover lift на cards/annotations/steps/notes — premium
   feel, без bounce/elastic. 240ms по §41.1 UI micro-interactions. */
.astro-annotation,
.astro-how__step,
.astro-depth__note,
.astro-depth__lead {
  transition:
    transform   240ms cubic-bezier(0.4, 0, 0.2, 1),
    box-shadow  240ms cubic-bezier(0.4, 0, 0.2, 1);
}
.astro-annotation:hover,
.astro-annotation:focus-within,
.astro-how__step:hover,
.astro-how__step:focus-within,
.astro-depth__note:hover,
.astro-depth__note:focus-within,
.astro-depth__lead:hover,
.astro-depth__lead:focus-within {
  transform: translateY(-3px);
  box-shadow: 0 12px 32px -12px rgba(70, 50, 30, 0.18);
}

/* FAQ summary — мягкий left-pad shift на hover/focus, не lift. */
.astro-faq__list summary {
  transition:
    color         200ms cubic-bezier(0.4, 0, 0.2, 1),
    padding-left  200ms cubic-bezier(0.4, 0, 0.2, 1);
  cursor: pointer;
}
.astro-faq__list summary:hover,
.astro-faq__list summary:focus-visible {
  color: var(--brass-deep);
  padding-left: 6px;
}

/* CTA buttons — subtle scale+lift на hover. 180ms по §41.1. */
.astro-course-cta__actions .btn,
.astro-final .btn,
.btn--brass {
  transition:
    transform        180ms cubic-bezier(0.4, 0, 0.2, 1),
    box-shadow       180ms cubic-bezier(0.4, 0, 0.2, 1),
    background-color 180ms cubic-bezier(0.4, 0, 0.2, 1);
}
.astro-course-cta__actions .btn:hover,
.astro-final .btn:hover,
.btn--brass:hover {
  transform: translateY(-2px) scale(1.015);
  box-shadow: 0 10px 28px -10px rgba(70, 35, 50, 0.36);
}

/* Phase 2.3 — Section title accent line draw-in. Тонкая золотая
   подчёркивающая линия под h2; рисуется 0 → 100% width при reveal
   родительского блока. Усиливает stage-gating каждой секции. */
.astro-promise__inner h2,
.astro-value__head h2,
.astro-how__head h2,
.astro-depth__head h2,
.astro-course-cta__inner h2,
.astro-faq__head h2 {
  position: relative;
}
.astro-promise__inner h2::after,
.astro-value__head h2::after,
.astro-how__head h2::after,
.astro-depth__head h2::after,
.astro-course-cta__inner h2::after,
.astro-faq__head h2::after {
  content: '';
  display: block;
  width: 0;
  height: 1px;
  background: linear-gradient(90deg,
    var(--brass) 0%,
    rgba(169, 127, 75, 0.2) 100%);
  margin-top: 20px;
  transition: width 1100ms cubic-bezier(0.16, 1, 0.3, 1) 280ms;
}
[data-reveal].is-revealed.astro-promise__inner h2::after,
[data-reveal].is-revealed.astro-value__head h2::after,
[data-reveal].is-revealed.astro-how__head h2::after,
[data-reveal].is-revealed.astro-depth__head h2::after,
[data-reveal].is-revealed.astro-course-cta__inner h2::after,
[data-reveal].is-revealed.astro-faq__head h2::after {
  width: clamp(48px, 8vw, 96px);
}

/* Phase 2.4 — Ambient breath orbs в фоне всей страницы. Два радиальных
   градиента, очень тонких (opacity 0.10-0.12), медленный drift 38-46s,
   связывают весь поток секций с hero atmosphere. z-index:0 (под content),
   pointer-events:none. Reduced-motion → не запускается. */
@media (prefers-reduced-motion: no-preference) {
  body::before {
    content: '';
    position: fixed;
    top: 25%; left: -8%;
    width: 38vw; height: 38vw;
    max-width: 720px; max-height: 720px;
    background: radial-gradient(circle,
      rgba(218, 178, 161, 0.14) 0%,
      transparent 65%);
    filter: blur(32px);
    pointer-events: none;
    z-index: 0;
    animation: ambientBreathA 38s cubic-bezier(0.4, 0, 0.2, 1) infinite;
  }
  body::after {
    content: '';
    position: fixed;
    bottom: 8%; right: -6%;
    width: 32vw; height: 32vw;
    max-width: 620px; max-height: 620px;
    background: radial-gradient(circle,
      rgba(229, 192, 136, 0.10) 0%,
      transparent 65%);
    filter: blur(32px);
    pointer-events: none;
    z-index: 0;
    animation: ambientBreathB 46s cubic-bezier(0.4, 0, 0.2, 1) -12s infinite;
  }
  @keyframes ambientBreathA {
    0%, 100% { transform: translate(0, 0) scale(1);    opacity: 0.85; }
    50%      { transform: translate(3vw, -2vw) scale(1.08); opacity: 1; }
  }
  @keyframes ambientBreathB {
    0%, 100% { transform: translate(0, 0) scale(1);    opacity: 0.78; }
    50%      { transform: translate(-2vw, 3vw) scale(1.06); opacity: 1; }
  }
}
@media print {
  body::before, body::after { display: none; }
}


/* ============================================================
   Phase 3 composition fix (2026-05-01) — §22.1 + §48.1:
   astro-how был zig-zag 2-col grid с одинаковыми card-style
   фонами; визуально читался как «4 одинаковые карточки» (anti-pattern).
   Перебираем в vertical editorial timeline: single column, без cards,
   крупные брасс-номера слева, текст справа, vertical brass thread связывает
   шаги. Полная ширина — astro-how__inner расходится до container-max.
   ============================================================ */

/* 3.1 Container на astro-how — расширяем grid с 12-col до full-bleed */
.astro-how__inner {
  /* унаследованное .astro-promise__inner и т.д. уже max-width: var(--container-max) */
  display: block; /* сбрасываем 12-col grid; внутри переход на flex/grid timeline */
}
.astro-how__head {
  margin-bottom: clamp(48px, 6vh, 96px);
  max-width: 60ch;
}

/* 3.2 Steps — vertical editorial timeline (override zig-zag из L2003-2099) */
.astro-how__steps {
  /* сбрасываем 12-col grid */
  display: flex !important;
  flex-direction: column;
  gap: clamp(40px, 5vh, 72px) !important;
  position: relative;
  padding-left: clamp(80px, 10vw, 140px); /* зона слева для brass thread + numbers */
  max-width: 1040px; /* читаемая ширина текста */
}

/* 3.3 Vertical brass thread слева, не по центру */
.astro-how__steps::before {
  left: clamp(40px, 5vw, 70px) !important; /* над left-padding'ом */
  top: 24px !important;
  bottom: 24px !important;
  background: linear-gradient(180deg,
    transparent 0%,
    rgba(169,127,75,0.45) 8%,
    rgba(169,127,75,0.35) 92%,
    transparent 100%) !important;
  width: 1px !important;
  transform: none !important;
}

/* 3.4 Step — без card-фона, без border, только лёгкое spacing */
.astro-how__step {
  padding: 0 !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  column-gap: clamp(28px, 3vw, 56px) !important;
  align-items: baseline !important;
  margin: 0 !important;
}

/* 3.5 Sbrasыvaem zig-zag */
.astro-how__step:nth-child(odd),
.astro-how__step:nth-child(even) {
  grid-column: auto !important;
  margin: 0 !important;
}
.astro-how__step:nth-child(even) .astro-how__step-num {
  align-self: baseline !important;
  text-align: left !important;
}

/* 3.6 Brass dot на thread — на каждом шаге слева, на уровне номера */
.astro-how__step::before {
  width: 12px !important;
  height: 12px !important;
  background: var(--paper-cream) !important;
  border: 1px solid var(--brass) !important;
  border-radius: 50% !important;
  position: absolute !important;
  left: calc(clamp(40px, 5vw, 70px) - 5.5px) !important;
  right: auto !important;
  top: clamp(18px, 2vh, 28px) !important;
  transform: none !important;
  box-shadow: 0 0 8px rgba(229,192,136,0.45) !important;
}

/* 3.7 Number — крупный editorial italic, разный размер на каждом шаге
       (рандомизация ритма по §22.3), не SaaS-шаблонные одинаковые числа */
.astro-how__step-num {
  font-family: var(--ff-display);
  font-style: italic;
  font-weight: 300;
  color: var(--brass);
  line-height: 0.9 !important;
  letter-spacing: -0.02em;
  font-size: clamp(3.2rem, 5vw, 5.4rem) !important;
  min-width: 90px;
}
/* Каждый второй шаг имеет slightly smaller number, чтобы ритм не был ровный */
.astro-how__step:nth-child(2) .astro-how__step-num,
.astro-how__step:nth-child(4) .astro-how__step-num {
  font-size: clamp(2.6rem, 4vw, 4.2rem) !important;
  color: var(--brass-deep);
}

/* 3.8 Body — текст справа от числа */
.astro-how__step-body h3 {
  font-size: clamp(1.5rem, 2vw, 2rem) !important;
  margin: 0 0 14px !important;
  color: var(--ink-coffee);
}
.astro-how__step-body p {
  font-size: clamp(15px, 1.05vw, 17px) !important;
  line-height: 1.65 !important;
  max-width: 56ch;
  color: var(--ink-soft);
}

/* 3.9 Mobile/tablet — уменьшаем left-padding, thread тоньше */
@media (max-width: 1024px) {
  .astro-how__steps {
    padding-left: clamp(60px, 8vw, 100px) !important;
  }
  .astro-how__steps::before {
    left: clamp(28px, 4vw, 50px) !important;
  }
  .astro-how__step::before {
    left: calc(clamp(28px, 4vw, 50px) - 5.5px) !important;
  }
}
@media (max-width: 640px) {
  .astro-how__steps {
    padding-left: 56px !important;
  }
  .astro-how__steps::before {
    left: 22px !important;
  }
  .astro-how__step {
    grid-template-columns: 1fr !important;
    row-gap: 12px !important;
  }
  .astro-how__step::before {
    left: 16px !important;
  }
  .astro-how__step-num {
    font-size: clamp(2.2rem, 8vw, 3rem) !important;
    min-width: auto !important;
  }
}

/* === V3.1 + Phase 1 + Phase 2 + Phase 3 — END === */


/* ============================================================
   Phase 4 a11y + polish (2026-05-01) — закрываем axe-violations
   и WCAG-fail из p4_audit:
   1. h-scroll на 4vp (body::after / canvas overflow вылезали за viewport
      потому что html не имел overflow-x);
   2. kicker contrast 3.16:1 < AA 4.5:1 для small text 11px brass-on-cream.
   ============================================================ */

/* 4.1 html overflow-x — закрывает h-scroll одной строкой. body уже
   имеет overflow-x:hidden (L59), но html без правила позволяет
   horizontal scroll appear на whole-page level. */
html { overflow-x: clip; }
@supports not (overflow-x: clip) {
  html { overflow-x: hidden; }
}

/* 4.2 Kickers (Section I/II/III/IV/V) — contrast 3.16 → AA pass:
   меняем color: var(--brass) #A97F4B на var(--brass-deep) #8B6438
   — даёт ~4.7:1 на paper-cream #F8EFDF (AA pass для 11px small). */
.astro-desk__kicker,
.astro-triad__kicker,
.astro-value__kicker,
.astro-how__kicker,
.astro-depth__kicker,
.astro-faq__kicker {
  color: var(--brass-deep);
}

/* P10.2 (2026-05-05) — astro-desk kicker (form section "II · Введите данные рождения").
   Re-introduced per owner P10.2 spec §2.2. Style mirrors astro-triad__kicker
   (font-family body, 11px, letter-spacing 0.26em, uppercase). */
.astro-desk__kicker {
  display: block;
  font-family: var(--ff-body);
  font-size: 11px;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  font-weight: 500;
  margin-bottom: 14px;
}

/* === Phase 4 — END === */


/* ============================================================
   Phase 5 cleanup (2026-05-01) — owner feedback по 7 скринам:
   убрать decorative chrome (XIII / XVI numerals, SOL/LUNA/ASC tags,
   II./III./IV./V. ords, brass dots на astro-how thread, kickers
   Section I-V, top-right form sub, sub-CTA под submit). Triad cards
   выровнять по верхнему уровню (убрать "пляшут"). astro-how numbers
   привести к baseline с заголовком справа.
   ============================================================ */

/* 5.1 Убираем XIII перед "Не про приговор" */
.astro-promise__inner::before {
  display: none !important;
  content: '' !important;
}

/* 5.2 Убираем XVI перед "Если важно... пройти этот путь" */
.astro-course-cta__inner::before {
  display: none !important;
  content: '' !important;
}

/* 5.3 Triad cards equal-height — owner: "Луна и Асцендент должны быть
   на одном уровне с Солнцем, не пляшут". Убираем margin-top смещения
   с moon (48px) и asc (12px). */
.triad-card--sun,
.triad-card--moon,
.triad-card--asc {
  margin-top: 0 !important;
}
.astro-triad__cards {
  align-items: stretch; /* все cards одинаковой высоты */
}

/* 5.4 astro-how brass dot — owner: "белая точка не нужна, накладывается
   на цифру". Скрываем ::before dot. */
.astro-how__step::before {
  display: none !important;
}

/* 5.5 astro-how step num + body — выравнивание по baseline.
   Owner: "цифры идут выше чем надписи, привести к одному уровню".
   align-items: center + одинаковый line-height. */
.astro-how__step {
  align-items: center !important;
}
.astro-how__step-num {
  /* единичные числа 1-4 теперь короче, уменьшаем размер чуть-чуть
     чтобы не доминировали; align-self center синхронизирует с h3 */
  align-self: center !important;
  font-size: clamp(2.6rem, 4vw, 4rem) !important;
  line-height: 1 !important;
}
.astro-how__step:nth-child(2) .astro-how__step-num,
.astro-how__step:nth-child(4) .astro-how__step-num {
  /* убираем variable-rhythm — owner просит унифицированный размер */
  font-size: clamp(2.6rem, 4vw, 4rem) !important;
  color: var(--brass) !important;
}

/* === Phase 5 cleanup — END === */


/* ============================================================
   Phase 5B center editorial (2026-05-01) — owner-feedback:
   "блоки смещены влево, можно разместить больше посередине, страница
   станет визуально красивее". Центрируем headers + lead-text всех
   editorial секций (promise / value / depth / course-cta / faq / final
   / desk-title). astro-how timeline НЕ трогаем — он работает по
   brass-thread слева (timeline-композиция, центр-выравнивание там
   нарушит ритм). Triad cards 3-grid уже центрированы grid'ом.
   ============================================================ */

/* 5B.1 Centered editorial header — заголовок + lead + body p */
.astro-desk__head,
.astro-promise__inner,
.astro-value__head,
.astro-depth__head,
.astro-course-cta__inner,
.astro-faq__head,
.astro-final__inner {
  text-align: center;
}

/* 5B.2 Headers max-width + auto margin для центровки текста на
   widescreen без растяжения по всей ширине. */
#astroDeskH,
#astroPromiseH,
#astroValueH,
#astroDepthH,
#astroCourseH,
#astroFaqH {
  max-width: clamp(20ch, 80%, 26ch);
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 5B.3 Lead-text под h2 — центрируется и ограничивается читаемой
   шириной (60-66ch по §41 typography readability). */
.astro-promise__inner p,
.astro-value__head p,
.astro-depth__head p,
.astro-course-cta__inner p {
  max-width: 64ch;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 5B.4 Section accent line под h2 — теперь центрируем (сейчас
   рисуется от left edge h2). margin: 20px auto 0 — center + top spacing. */
.astro-promise__inner h2::after,
.astro-value__head h2::after,
.astro-how__head h2::after,
.astro-depth__head h2::after,
.astro-course-cta__inner h2::after,
.astro-faq__head h2::after {
  margin-left: auto;
  margin-right: auto;
}

/* 5B.5 astro-how head — центрируем тоже h2 + body, но steps timeline
   остаётся слева на brass-thread. astro-how__head sits separately. */
.astro-how__head {
  text-align: center;
  max-width: none !important;
}
#astroHowH {
  max-width: 24ch;
  margin-left: auto !important;
  margin-right: auto !important;
}
.astro-how__head h2::after {
  margin-left: auto;
  margin-right: auto;
}

/* 5B.6 course-cta actions — кнопка + link, центрировать. */
.astro-course-cta__actions {
  justify-content: center !important;
}

/* 5B.7 faq list — если 2-col grid, оставить как есть, но header центрирован.
   FAQ details items themselves остаются textual block без alignment shift. */

/* 5B.8 desk-title и hero result-arrival — center + body lead
   (форма мини-расчёт). */
.astro-desk__title {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 5B.9 final section — h2 + p + ecosystem links центрируются */
.astro-final__inner h2,
.astro-final__inner p {
  margin-left: auto;
  margin-right: auto;
  max-width: 60ch;
}

/* === Phase 5B center — END === */


/* ============================================================
   Phase 5C compact center (2026-05-01) — owner-feedback вторая
   итерация: P5B сделал center, но max-width clamp(20ch,80%,26ch)
   на h2 был слишком узкий → длинные h2 переносились в 3 строки
   ("Солнце, Луна, Асцендент — ваши три опоры", "Что показывает
   натальная карта", "Если важно не просто посмотреть"). Triad
   header вообще не покрылся (text-align: start). Расширяем h2 и
   покрываем triad header.
   ============================================================ */

/* 5C.1 Triad header — добавляем center coverage (был пропущен) */
.astro-triad__head {
  text-align: center !important;
}
#astroTriadH {
  text-align: center !important;
  max-width: min(95%, 1200px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.astro-triad__lead {
  text-align: center !important;
  max-width: 64ch !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 5C.2 Расширяем h2 max-width — позволяем длинным заголовкам влезть
   в 1-2 строки. min(95%, 1200px) → не больше 1200px, не меньше 95%
   родителя. Узкий clamp 26ch заменён на широкий predictable cap. */
#astroDeskH,
#astroPromiseH,
#astroValueH,
#astroDepthH,
#astroCourseH,
#astroFaqH {
  max-width: min(95%, 1200px) !important;
}

/* 5C.3 На длинных h2 (value, course) уменьшим font-size слегка
   чтобы они вмещались в 2 строки на 1440 viewport, не растягиваясь
   на full-width. */
#astroValueH,
#astroCourseH {
  font-size: clamp(2.4rem, 4.2vw, 3.6rem) !important;
}

/* 5C.4 How h2 — текст "Как проходит расчёт натальной карты онлайн"
   достаточно влезает в 2 строки уже сейчас, оставляем. */

/* 5C.5 Lead body p расширяем тоже до 70ch для дыхания */
.astro-promise__inner p,
.astro-value__head p,
.astro-depth__head p,
.astro-course-cta__inner p,
.astro-triad__lead {
  max-width: 70ch !important;
}

/* === Phase 5C compact center — END === */


/* ============================================================
   Phase 6 final QA-pass (2026-05-01) — §23 V6.2 + owner-ultimatum:
   "выровнять ВСЕ блоки, ВСЕ надписи, ВСЕ строки".
   Из 64 текст-элементов 50 не центрированы — потому что:
   - .astro-value/depth/faq/triad inner containers offset слева на 72-182px
     (узкая центральная колонка)
   - annotations / depth__spread / faq__list — multi-column grids с
     text-align:start внутри
   - body p имеют max-width 64-70ch но без margin:auto после grid-cell

   План: cascade text-align:center на ВСЕ section roots + cell items,
   max-width на типовые items, single-column конвертация для grids
   (annotations vertical / faq single-col / depth lead-above-notes).
   astro-how timeline + hero asymmetry + form inputs НЕ трогаем.
   ============================================================ */

/* 6.1 Global cascade — text-align: center на всех editorial секциях
       и их прямых потомках */
.astro-promise, .astro-promise__inner, .astro-promise > *,
.astro-value, .astro-value__inner, .astro-value__head,
.astro-depth, .astro-depth__inner, .astro-depth__head, .astro-depth__spread,
.astro-course-cta, .astro-course-cta__inner,
.astro-faq, .astro-faq__inner, .astro-faq__head, .astro-faq__list,
.astro-triad, .astro-triad__inner, .astro-triad__head, .astro-triad__cards,
.astro-final, .astro-final__inner {
  text-align: center !important;
}

/* 6.2 Item-children внутри grid cells — раньше text-align:start */
.astro-annotation, .astro-annotation *,
.astro-depth__lead, .astro-depth__lead *,
.astro-depth__note, .astro-depth__note *,
.astro-faq__list details,
.astro-faq__list summary,
.astro-faq__list p,
.triad-card, .triad-card *,
.astro-final__inner *:not(a) {
  text-align: center !important;
}

/* 6.3 Все h2 — единый центрированный max-width, в 1-2 строки */
.astro-promise h2,
.astro-value h2,
.astro-depth h2,
.astro-course-cta h2,
.astro-faq h2,
.astro-triad h2,
.astro-final h2 {
  max-width: min(95%, 1100px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 6.4 H3/H4 внутри items — узкий center */
.astro-value h3,
.astro-depth h3, .astro-depth h4,
.astro-triad h3 {
  max-width: 60ch;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 6.5 Body p везде — center + 70ch для дыхания, max ~3 строки на 1440 */
.astro-promise p,
.astro-value p,
.astro-depth p,
.astro-course-cta p,
.astro-faq p,
.astro-triad p,
.astro-final p {
  max-width: 64ch !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 6.6 Annotations — vertical stack, не 3-grid */
.astro-annotations {
  display: flex !important;
  flex-direction: column !important;
  gap: clamp(40px, 5vh, 64px) !important;
  max-width: 760px;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
}
.astro-annotation {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  list-style: none;
  padding: clamp(16px, 2vh, 32px) !important;
}
.astro-annotation__ord,
.astro-annotation__symbol {
  margin-left: auto !important;
  margin-right: auto !important;
}
.astro-annotation__body {
  max-width: 60ch;
  margin: 0 auto;
}

/* 6.7 Depth — lead full-width above, notes 2-col centered grid */
.astro-depth__spread {
  display: flex !important;
  flex-direction: column !important;
  gap: clamp(40px, 5vh, 72px) !important;
  max-width: 1100px;
  margin-left: auto !important;
  margin-right: auto !important;
}
.astro-depth__lead {
  max-width: 700px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  padding: clamp(20px, 3vh, 36px) !important;
}
.astro-depth__notes {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
  gap: clamp(20px, 3vw, 36px) !important;
  max-width: 980px;
  margin-left: auto !important;
  margin-right: auto !important;
}
.astro-depth__note {
  text-align: center !important;
  padding: clamp(20px, 2.5vh, 30px) !important;
}

/* 6.8 FAQ — single-col vertical centered */
.astro-faq__list {
  display: flex !important;
  flex-direction: column !important;
  grid-template-columns: none !important;
  gap: clamp(12px, 1.5vh, 20px) !important;
  max-width: 880px;
  margin-left: auto !important;
  margin-right: auto !important;
}
.astro-faq__list details {
  text-align: center !important;
  max-width: 100%;
}
.astro-faq__list summary {
  text-align: center !important;
  display: list-item; /* preserve disclosure marker */
  list-style-position: inside;
}
.astro-faq__list details > p {
  max-width: 70ch;
  margin: 14px auto 0 !important;
}

/* 6.9 Triad — cards 3-grid сохраняем (3 опоры semantic) но header center,
   cards body тоже center */
.triad-card {
  text-align: center !important;
}
.triad-card__title,
.triad-card__sub,
.triad-card__body,
.triad-card__hint {
  text-align: center !important;
}

/* 6.10 Course-cta actions — center horizontal flex row + wrap mobile */
.astro-course-cta__actions {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: clamp(16px, 2vw, 32px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: clamp(20px, 3vh, 36px) !important;
}

/* 6.11 Final section — оставляем typography centered, но не трогаем links */
.astro-final__inner h2,
.astro-final__inner p {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 6.12 Section accent line под h2 — center */
.astro-promise__inner h2::after,
.astro-value__head h2::after,
.astro-how__head h2::after,
.astro-depth__head h2::after,
.astro-course-cta__inner h2::after,
.astro-faq__head h2::after,
.astro-triad__head h2::after {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* === Phase 6 final QA-pass — END === */


/* ============================================================
   Phase 6.1 — drop 12-col grid на section inners.
   Re-audit показал что h2/p offset -55..-221px остаётся даже после
   text-align:center, потому что parent containers имеют display:grid
   с 12-col template, и items сидят в first 6-8 columns
   (grid-column: 1 / span 7 или подобное). Drop grid → block flow,
   тогда text-align:center работает по полной ширине.
   ============================================================ */

.astro-promise__inner,
.astro-value__inner,
.astro-value__head,
.astro-depth__inner,
.astro-depth__head,
.astro-faq__inner,
.astro-faq__head,
.astro-triad__inner,
.astro-triad__head,
.astro-course-cta__inner {
  display: block !important;
  grid-template-columns: none !important;
}

/* После drop grid, item-children теряют `grid-column: 1 / span N` —
   но text-align: center + max-width + margin auto уже их центрируют
   в block flow. */

/* 6.1.2 Depth notes — расширяем минимальный column-width
   (260px → 320px), чтобы short body p не переносились в 4 строки */
.astro-depth__notes {
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
}

/* 6.1.3 FAQ summary — не показываем list-style маркер по центру
   (он сидит слева и нарушает center alignment) */
.astro-faq__list summary {
  list-style: none !important;
  padding-right: 28px;
  position: relative;
}
.astro-faq__list summary::before {
  /* custom centered toggle indicator */
  content: '+';
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--ff-display);
  font-style: italic;
  font-size: 1.2em;
  color: var(--brass);
  transition: transform 240ms cubic-bezier(0.4, 0, 0.2, 1);
}
.astro-faq__list details[open] summary::before {
  transform: translateY(-50%) rotate(45deg);
}
.astro-faq__list summary::-webkit-details-marker {
  display: none;
}

/* === Phase 6.1 — END === */


/* ============================================================
   Phase 6.2 — depth notes single-column (final centering)
   После Phase 6.1 headers+lead все центрированы. Остаются:
   - 8 triad cards (3-grid, semantic 3 опоры) — оставляем
   - 8 how step items (timeline на brass thread) — оставляем
   - 8 depth notes (2x2 grid offset ±254) — конвертируем в vertical
     single-column, чтобы каждая на 0px offset.
   ============================================================ */

.astro-depth__notes {
  display: flex !important;
  flex-direction: column !important;
  grid-template-columns: none !important;
  gap: clamp(28px, 3vh, 48px) !important;
  max-width: 720px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.astro-depth__note {
  width: 100% !important;
  max-width: 700px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* === Phase 6.2 — END === */


/* ============================================================
   Phase 7 final QA-fix (2026-05-01) — subagent audit findings:
   1. H2 sizes desync (6 значений 34.56/48/57.6/60.48/63.36/72px) →
      свести к единому clamp для editorial sections.
   2. Неравномерный vertical rhythm секций после Phase 6.1 drop-grid
      → единый --section-gap token applied as padding.
   3. Cookie banner перекрывает CTA — вне scope этой страницы
      (глобальный компонент сайта).
   ============================================================ */

/* 7.1 H2 unified scale — все editorial h2 один clamp размер.
   На 1440 даст ~62-72px, на 1024 ~48-56px, на mobile ~36-44px. */
#astroPromiseH,
#astroValueH,
#astroHowH,
#astroDepthH,
#astroCourseH,
#astroFaqH,
#astroTriadH {
  font-size: clamp(2.6rem, 4.6vw, 4.4rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.015em !important;
}
/* desk-title оставляем меньше — semantic sub-section внутри hero-flow */
.astro-desk__title {
  font-size: clamp(2rem, 3vw, 2.6rem) !important;
}
/* astro-final h2 — закрытие cycle, средний размер */
.astro-final h2 {
  font-size: clamp(2.2rem, 3.5vw, 3rem) !important;
}

/* 7.2 Unified vertical rhythm — section padding-top/bottom единый */
:root {
  --section-gap-lg: clamp(96px, 12vh, 160px);
  --section-gap-md: clamp(64px, 8vh, 112px);
}
.astro-promise,
.astro-value,
.astro-how,
.astro-depth,
.astro-course-cta,
.astro-faq {
  padding-top: var(--section-gap-lg) !important;
  padding-bottom: var(--section-gap-lg) !important;
}
.astro-final {
  padding-top: var(--section-gap-md) !important;
  padding-bottom: var(--section-gap-md) !important;
}
/* astro-desk остаётся в Phase 1 bleed flow — не переопределяем top
   padding (диск переходит сверху), только bottom выравниваем. */
.astro-desk {
  padding-bottom: var(--section-gap-lg) !important;
}

/* 7.3 Header-to-body spacing внутри секций — единый ритм */
.astro-promise__inner h2,
.astro-value__head h2,
.astro-how__head h2,
.astro-depth__head h2,
.astro-course-cta__inner h2,
.astro-faq__head h2,
.astro-triad__head h2 {
  margin-bottom: clamp(20px, 2.5vh, 36px) !important;
}
.astro-promise__inner p,
.astro-value__head p,
.astro-depth__head p,
.astro-course-cta__inner p,
.astro-triad__lead {
  margin-top: clamp(16px, 2vh, 28px) !important;
  margin-bottom: 0 !important;
}

/* 7.4 Section header → body items spacing
   (header-to-cards/items) единый ~64-96px */
.astro-triad__head,
.astro-value__head,
.astro-how__head,
.astro-depth__head,
.astro-faq__head {
  margin-bottom: clamp(48px, 6vh, 96px) !important;
}

/* === Phase 7 final QA-fix — END === */


/* ============================================================
   Phase 8 premium tier-1 fix (2026-05-01) — subagent §23 verdict FAIL
   из-за 5 HIGH-blockers: decorative numerals/symbols в annotations,
   astro-how timeline misalignment + offset 140px влево, accent-line
   под каждым h2 (тонкая невидимая декорация), visible card borders
   у triad/result, body low-bite (#5C4E42 на cream).
   ============================================================ */

/* === P8.1 astro-value annotations — naked editorial ===
   Убираем I./II./III. ord + SVG sun/moon/asc symbol. Оставляем только
   h3 italic + body. Hairline-divider между блоками. */
.astro-annotation__ord,
.astro-annotation__symbol {
  display: none !important;
}
.astro-annotation {
  padding: clamp(28px, 4vh, 56px) 0 !important;
  border-bottom: 1px solid var(--brass-line) !important;
  background: none !important;
  text-align: center !important;
}
.astro-annotation:last-child {
  border-bottom: none !important;
}
.astro-annotation__body h3 {
  font-family: var(--ff-display);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(1.6rem, 2.2vw, 2.2rem) !important;
  margin: 0 0 16px !important;
  color: var(--ink-coffee);
}
.astro-annotation__body p {
  font-family: var(--ff-body);
  font-size: 17px !important;
  line-height: 1.65 !important;
  color: var(--ink-deep, #2A241F) !important;
  max-width: 64ch !important;
  margin: 0 auto !important;
}

/* === P8.2 astro-how naked centered editorial ===
   Убираем padding-left 140px + brass-thread + dot. Steps centered
   editorial 64ch column. Inline-номер серым tabular small caps. */
.astro-how__steps {
  padding-left: 0 !important;
  max-width: 64ch !important;
  margin: 0 auto !important;
  gap: clamp(40px, 5vh, 64px) !important;
}
.astro-how__steps::before {
  display: none !important;
}
.astro-how__step {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  grid-template-columns: none !important;
  gap: 12px !important;
}
.astro-how__step::before {
  display: none !important;
}
.astro-how__step-num {
  font-family: var(--ff-display);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(1.6rem, 1.8vw, 2.2rem) !important;
  color: var(--brass-deep) !important;
  letter-spacing: 0.06em !important;
  align-self: center !important;
  text-align: center !important;
  min-width: 0 !important;
}
.astro-how__step-num::after {
  content: ' —';
  color: var(--brass-line);
}
.astro-how__step-body {
  text-align: center !important;
}
.astro-how__step-body h3 {
  font-size: clamp(1.4rem, 2vw, 1.9rem) !important;
  margin: 0 0 12px !important;
  text-align: center !important;
}
.astro-how__step-body p {
  text-align: center !important;
  margin: 0 auto !important;
  max-width: 56ch !important;
  font-size: 17px !important;
  line-height: 1.65 !important;
  color: var(--ink-deep, #2A241F) !important;
}

/* === P8.3 Удаление accent-line под h2 ===
   Subagent: «тоненькая хрень в каждом блоке». Tier-1 (Linear/Stripe)
   не используют декорацию под h2. Убираем все 7 ::after. */
.astro-promise__inner h2::after,
.astro-value__head h2::after,
.astro-how__head h2::after,
.astro-depth__head h2::after,
.astro-course-cta__inner h2::after,
.astro-faq__head h2::after,
.astro-triad__head h2::after {
  display: none !important;
  content: none !important;
}

/* === P8.4 Убрать card borders ===
   triad-card visible border 1px brass — Stripe/Linear не делают так.
   Заменяем на naked typography + bottom hairline divider Apple-style. */
.triad-card {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: clamp(24px, 3vh, 40px) clamp(20px, 2.5vw, 36px) !important;
}
.triad-card:hover {
  background: rgba(169,127,75,0.04) !important;
  transform: translateY(-2px) !important;
}
/* astro-result cards (post-submit) — same naked treatment */
.astro-result__card {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* depth-notes — hairline divider rhythm Apple specs-table */
.astro-depth__note {
  background: none !important;
  border: none !important;
  border-top: 1px solid var(--brass-line) !important;
  border-radius: 0 !important;
  padding: clamp(28px, 3.5vh, 48px) 0 !important;
}
.astro-depth__note:first-child {
  border-top: none !important;
}
.astro-depth__lead {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: clamp(24px, 3vh, 44px) 0 !important;
}

/* === P8.5 Body typography — увеличить bite ===
   #5C4E42 на cream = WCAG AA pass но визуально бледно.
   Tier-1: #2A241F 17px lh 1.65 — больше contrast, читается чётко. */
:root {
  --ink-deep: #2A241F;
}
.astro-promise p,
.astro-value p,
.astro-depth p,
.astro-course-cta p,
.astro-faq p,
.astro-triad p,
.astro-final p,
.astro-how__step-body p,
.astro-annotation__body p,
.astro-faq__list details > p {
  color: var(--ink-deep) !important;
  font-size: 17px !important;
  line-height: 1.65 !important;
}
/* Lead p (под h2) — чуть бОльше для editorial accent */
.astro-promise__inner > p,
.astro-value__head > p,
.astro-depth__head > p,
.astro-course-cta__inner > p,
.astro-triad__lead {
  font-size: clamp(17px, 1.3vw, 19px) !important;
  line-height: 1.6 !important;
}

/* === P8.6 H2 3-tier scale + italic mix ===
   t1 (key): 88px italic — triad, value
   t2 (mid): 64px roman — how, depth, promise
   t3 (small): 48px italic — faq, course-cta */
#astroTriadH,
#astroValueH {
  font-size: clamp(2.8rem, 5vw, 4.8rem) !important;
  font-style: italic !important;
}
#astroPromiseH,
#astroHowH,
#astroDepthH {
  font-size: clamp(2.4rem, 4vw, 3.6rem) !important;
  /* roman, не italic */
  font-style: normal !important;
}
#astroPromiseH em,
#astroHowH em,
#astroDepthH em {
  font-style: italic !important;
  color: var(--brass-deep);
}
#astroFaqH,
#astroCourseH {
  font-size: clamp(2rem, 3.2vw, 2.8rem) !important;
  font-style: italic !important;
}

/* === P8.7 course-cta polish — link под button + button radius ===
   Сейчас link справа от button нарушает читательский ритм. */
.astro-course-cta__actions {
  flex-direction: column !important;
  gap: clamp(16px, 2vh, 24px) !important;
}
.astro-course-cta__link {
  font-style: italic;
  font-size: 15px;
  color: var(--ink-soft);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color 200ms cubic-bezier(0.4,0,0.2,1);
}
.astro-course-cta__link:hover {
  border-bottom-color: var(--brass);
}
/* Linear-style pill button (999px) для primary CTA */
.btn--brass {
  border-radius: 999px !important;
  padding: 16px 36px !important;
}

/* === P8.8 desk + final выровнять под --section-gap-lg === */
.astro-desk {
  padding-top: var(--section-gap-lg) !important;
}
.astro-final {
  padding-top: var(--section-gap-lg) !important;
  padding-bottom: var(--section-gap-lg) !important;
}

/* === Phase 8 — END === */


/* ============================================================
   Phase 8.1 final tier-1 push (2026-05-01) — закрываем PARTIAL→PASS:
   1. .astro-how__inner padding-left:72px → симметричный padding,
      убирает off-center axis
   2. H2 tier-1 (triad/value) max до 88px (5.5rem) для real Apple bite
   Hero canvas overflow НЕ трогаем — Phase 1 owner-approved bleed.
   ============================================================ */

.astro-how__inner {
  padding-left: clamp(20px, 5vw, 96px) !important;
  padding-right: clamp(20px, 5vw, 96px) !important;
}

#astroTriadH,
#astroValueH {
  font-size: clamp(2.8rem, 5.5vw, 5.5rem) !important;
}

/* === Phase 8.1 — END === */


/* ============================================================
   Phase 9 final unification (2026-05-01) — owner: «разбег шрифтов,
   столбиком, иконки из прошлого века». Один общий fix:
   1. H2 unified — все editorial секции один размер
   2. astro-how → 2×2 editorial grid (не vertical столбик),
      naked typography без цифр/brass-thread/dots
   3. triad-card → убрать SVG charts (sun/moon/asc circles) +
      kicker «I · Sol / II · Luna / III · ASC»
   4. result-card (post-submit) — те же symbols убрать для
      consistency
   ============================================================ */

/* P9.1 H2 unified — отменяет 3-tier P8.6 в пользу одного размера */
#astroPromiseH,
#astroValueH,
#astroHowH,
#astroDepthH,
#astroCourseH,
#astroFaqH,
#astroTriadH {
  font-size: clamp(2.4rem, 4.2vw, 3.6rem) !important;
  font-style: italic !important;
  line-height: 1.1 !important;
  letter-spacing: -0.015em !important;
  font-weight: 300 !important;
}
.astro-final h2 {
  font-size: clamp(2rem, 3.2vw, 2.8rem) !important;
}

/* P9.2 astro-how — 2×2 editorial grid, не vertical column.
   Cards: только h3 italic + body, без цифр, без brass-line. */
.astro-how__steps {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: clamp(48px, 6vh, 88px) clamp(40px, 5vw, 96px) !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
  padding-left: 0 !important;
  flex-direction: unset !important;
}
.astro-how__step {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  padding: 0 !important;
  gap: 12px !important;
}
.astro-how__step-num {
  display: none !important;
}
.astro-how__step-body h3 {
  font-family: var(--ff-display) !important;
  font-style: italic !important;
  font-weight: 300 !important;
  font-size: clamp(1.5rem, 2vw, 2rem) !important;
  margin: 0 0 14px !important;
  text-align: center !important;
  color: var(--ink-coffee);
}
.astro-how__step-body p {
  text-align: center !important;
  margin: 0 auto !important;
  max-width: 36ch !important;
  font-size: 17px !important;
  line-height: 1.65 !important;
  color: var(--ink-deep) !important;
}
@media (max-width: 768px) {
  .astro-how__steps {
    grid-template-columns: 1fr !important;
    gap: clamp(40px, 5vh, 64px) !important;
  }
}

/* P9.3 triad-card — убрать SVG icon (chart). HTML elements __symbol,
   __head-mark, __card-icon, __planet-symbol удалены в P10.4 — orphan
   rules вычищены. */
.triad-card__chart {
  display: none !important;
}

/* === Phase 9 final unification — END === */


/* ============================================================
   P10.7-retry (2026-05-05) — triad→promise adjacency gap fix.
   On 1440 viewports >900h, P7 unified rhythm pushed total visual gap
   between .astro-triad (paddingBottom 31.5px @900h) and .astro-promise
   (paddingTop --section-gap-lg !important = 108-160px) above 140px spec.
   Override paddingTop ONLY when promise is direct sibling of triad.
   Math: --section-gap-md = clamp(64px,8vh,112px). On 1440x900: 8vh=72,
   total gap = 31.5+72 = 103.5px (within 80-140 spec).
   On 1440x1080: 8vh=86.4 → total 124.2px (within spec).
   Other promise occurrences would keep unified rhythm.
   ============================================================ */
.astro-triad + .astro-promise {
  padding-top: var(--section-gap-md) !important;
}