/* ============================================================
   AERE — V10 CLEAR SKY sitewide light-theme override.
   Rewritten 2026-06-06 after V10 lock.

   Most marketing pages still reference the legacy
   .strat-bg / .text-on-strat classes from the old dark stratosphere
   era. Rather than refactor every page by hand, this file remaps the
   legacy classes onto the V10 sky palette, so any page that still
   uses them inherits the new look automatically.

   New pages should use inline styles or the V10 helper components
   (PageHero, HeroSection) — but legacy pages keep working.

   Loaded AFTER the app bundle's CSS so it wins.
   ============================================================ */

/* 1. Legacy hero backgrounds become V10 sky.
   Three flavors map to the three sky variants from PageHero.tsx. */
.strat-bg {
  position: relative;
  background: linear-gradient(180deg,
    #e8f1fb 0%,
    #f4f9ff 30%,
    #ffffff 60%,
    #fefcf8 85%,
    #fef5e8 100%) !important;
}
.strat-bg-mid {
  position: relative;
  background: linear-gradient(180deg,
    #d1dfee 0%,
    #ecf3fa 30%,
    #f8fbff 60%,
    #ffffff 90%,
    #fefcf8 100%) !important;
}
.strat-bg-flat {
  position: relative;
  background: linear-gradient(180deg,
    #d1dfee 0%,
    #b9cce0 30%,
    #9eb8d4 60%,
    #7ea1c5 85%,
    #5d83af 100%) !important;
}

/* Soft sun glow at top of every legacy hero — additive. */
.strat-bg::before,
.strat-bg-mid::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 160px;
  z-index: 1;
  pointer-events: none;
  background: radial-gradient(ellipse 60% 100% at 50% 0%,
              rgba(255,235,200,0.35) 0%,
              rgba(255,225,185,0.16) 40%,
              transparent 80%);
  mix-blend-mode: multiply;
}

/* 2. Legacy "on-strat" text is now meant for V10 LIGHT surfaces — DARK ink. */
.text-on-strat       { color: #0a1628 !important; }
.text-on-strat-soft  { color: rgba(10,22,40,0.72) !important; }
.text-on-strat-line  { color: rgba(10,22,40,0.12) !important; }
.border-on-strat-line { border-color: rgba(10,22,40,0.12) !important; }

/* Inside any legacy "strat-bg-*" section, the same ink colors apply —
   no inversion. The sky is light. */
.strat-bg .text-on-strat,
.strat-bg-mid .text-on-strat,
.strat-bg-flat .text-on-strat,
[class*="strat-bg"] .text-on-strat,
[class*="bg-strat"] .text-on-strat,
.strat-bg h1, .strat-bg h2, .strat-bg h3,
footer .text-on-strat {
  color: #0a1628 !important;
  text-shadow: none !important;
}
.strat-bg .text-on-strat-soft,
.strat-bg-mid .text-on-strat-soft,
.strat-bg-flat .text-on-strat-soft,
[class*="strat-bg"] .text-on-strat-soft,
[class*="bg-strat"] .text-on-strat-soft,
footer .text-on-strat-soft {
  color: rgba(10,22,40,0.72) !important;
  text-shadow: none !important;
}

/* 3. .text-sky-pale (the highlight color used in legacy heroes) becomes
   the V10 accent. Pick the cerulean end of the gradient — most legible
   on light sky. */
.text-sky-pale { color: #1f5a8f !important; }

/* 4. Legacy hero text was using big drop-shadows for legibility on dark
   surfaces. Kill them — V10 is light, shadows look like printing errors. */
.strat-bg h1, .strat-bg h2, .strat-bg p,
.strat-bg .text-on-strat, .strat-bg .text-on-strat-soft,
.strat-bg-mid h1, .strat-bg-mid h2, .strat-bg-mid p,
.strat-bg-mid .text-on-strat, .strat-bg-mid .text-on-strat-soft {
  text-shadow: none !important;
}

/* 5. Legacy live-dot was white-on-dark. Make it cerulean-on-light. */
.live-dot, .live-dot-light {
  background: #3d7fb8 !important;
  box-shadow: 0 0 0 0 rgba(61,127,184,0.6) !important;
  animation: skyPulse 2s infinite !important;
}

/* ------------------------------------------------------------
   V10 TAILWIND DARK-UTILITY SWEEP

   Page sections that use bg-strat-deep / bg-strat-mid / bg-strat-soft /
   bg-ink-deep as FULL-WIDTH backgrounds become light V10 sky. Buttons
   keep dark since they're small + use ink/rounded variants already.

   Detection: sections, large padded containers, or any element with both
   the dark bg class and a hero-scale padding utility (py-16+).
   ------------------------------------------------------------ */
section.bg-strat-deep,
section.bg-strat-mid,
section.bg-strat-soft,
section.bg-ink-deep,
main > div.bg-strat-deep,
main > div.bg-strat-mid,
[class*="bg-strat-"][class*="py-16"],
[class*="bg-strat-"][class*="py-20"],
[class*="bg-strat-"][class*="py-24"],
[class*="bg-strat-"][class*="py-28"],
[class*="bg-strat-"][class*="py-32"],
[class*="bg-ink-deep"][class*="py-16"],
[class*="bg-ink-deep"][class*="py-20"],
[class*="bg-ink-deep"][class*="py-24"],
[class*="bg-ink-deep"][class*="py-28"] {
  background: linear-gradient(180deg,
    #e8f1fb 0%, #f4f9ff 30%, #ffffff 60%, #fefcf8 85%, #fef5e8 100%) !important;
  color: #0a1628 !important;
}

/* Inside those flipped sections, white text becomes ink. */
section.bg-strat-deep .text-white,
section.bg-strat-mid .text-white,
section.bg-strat-soft .text-white,
section.bg-ink-deep .text-white,
main > div.bg-strat-deep .text-white,
main > div.bg-strat-mid .text-white,
[class*="bg-strat-"][class*="py-2"] .text-white,
[class*="bg-strat-"][class*="py-3"] .text-white,
[class*="bg-ink-deep"][class*="py-2"] .text-white,
[class*="bg-ink-deep"][class*="py-3"] .text-white {
  color: #0a1628 !important;
}

/* Buttons that legitimately want dark fill: leave alone — they should
   already use the explicit V10 ink palette (#0a1628). The selectors
   above scope only to padded page sections, so .bg-strat-mid on a
   .px-4.py-2 pill button is untouched. */

/* ------------------------------------------------------------
   V10 prose / typography normalisation on inherited pages.

   Many sub-pages render long-form copy in <article class="prose">.
   The legacy prose tokens pointed at --strat-mid (#1a3358) for headings
   and links, which still reads as dark-ink on light sky — keep those.
   But the prose blockquote/highlight chrome assumed a darker page bg.
   ------------------------------------------------------------ */
.prose blockquote {
  background: rgba(232,241,251,0.5) !important;
  border-left-color: #3d7fb8 !important;
  border-radius: 0 12px 12px 0;
}
.prose code:not(pre code) {
  background: rgba(168,200,232,0.18) !important;
  color: #1f5a8f !important;
  border: 1px solid rgba(168,200,232,0.4);
  padding: 1px 6px !important;
  border-radius: 5px;
  font-family: "Geist Mono", ui-monospace, monospace !important;
  font-size: 0.86em;
}
.prose pre {
  background: rgba(10,22,40,0.92) !important;
  color: #f5f8fb !important;
  border-radius: 14px;
  border: 1px solid rgba(10,22,40,0.95);
}

/* ------------------------------------------------------------
   V10 default typography for inherited PageHero text scale
   ------------------------------------------------------------ */
.strat-bg h1,
.strat-bg-mid h1 {
  font-family: "Fraunces", serif !important;
  font-weight: 200 !important;
  letter-spacing: -0.035em !important;
  line-height: 0.98 !important;
}
.strat-bg h2,
.strat-bg-mid h2 {
  font-family: "Fraunces", serif !important;
  font-weight: 300 !important;
  letter-spacing: -0.025em !important;
}

/* ------------------------------------------------------------
   V10 Whitepaper + long-form chapter card normalisation.
   Targets pages that render a series of <article id="chapter-N">
   panels — Whitepaper, Tokenomics deep-dive, future RFC pages.
   ------------------------------------------------------------ */
article[id^="chapter-"] {
  background: rgba(255,255,255,0.72) !important;
  backdrop-filter: blur(24px) saturate(1.3);
  -webkit-backdrop-filter: blur(24px) saturate(1.3);
  border: 1px solid rgba(255,255,255,0.9) !important;
  box-shadow: 0 18px 50px rgba(31,90,143,0.1), inset 0 1px 0 rgba(255,255,255,0.95) !important;
}
article[id^="chapter-"] > header {
  background: linear-gradient(135deg,
    rgba(255,255,255,0.4) 0%,
    rgba(232,241,251,0.55) 100%) !important;
  border-bottom: 1px solid rgba(10,22,40,0.08) !important;
}
article[id^="chapter-"] h2 {
  font-family: "Fraunces", serif !important;
  font-weight: 300 !important;
  letter-spacing: -0.025em !important;
  color: #0a1628 !important;
}
article[id^="chapter-"] h3 {
  font-family: "Fraunces", serif !important;
  font-weight: 400 !important;
  letter-spacing: -0.015em !important;
}
article[id^="chapter-"] .num,
article[id^="chapter-"] .kicker {
  color: #1f5a8f !important;
}

/* Whitepaper sidebar "at a glance" card → glass V10 */
aside .rounded-2xl.border.border-ink-line.bg-white,
aside .rounded-xl.border.border-ink-line.bg-white {
  background: rgba(255,255,255,0.65) !important;
  backdrop-filter: blur(20px) saturate(1.3);
  -webkit-backdrop-filter: blur(20px) saturate(1.3);
  border-color: rgba(255,255,255,0.85) !important;
  box-shadow: 0 12px 40px rgba(31,90,143,0.1), inset 0 1px 0 rgba(255,255,255,0.95) !important;
}