/* ═══════════════════════════════════════════════════════════════
   ServiceNow-inspired skin · EcoVent Africa · VPAY Genesis
   Loaded last — overrides all prior layers.
   Design language: dark hero, clean alternating sections,
   Inter typography, pill CTAs, generous white space.
   ═══════════════════════════════════════════════════════════════ */

/* ── 1. DESIGN TOKENS ── */
:root {
  --sn-black:       #080808;
  --sn-dark:        #111111;
  --sn-card-dark:   #181818;
  --sn-border-dark: rgba(255,255,255,0.07);
  --sn-white:       #FFFFFF;
  --sn-offwhite:    #F7F7F7;
  --sn-grey:        #EDEDED;
  --sn-gold:        #C8A84E;
  --sn-gold-bright: #E8C96A;
  --sn-gold-glow:   rgba(200,168,78,0.18);
  --sn-muted-d:     rgba(255,255,255,0.60);
  --sn-muted-l:     #666666;
  --sn-pill:        100px;
  --sn-card-r:      16px;
  --sn-shadow:      0 1px 3px rgba(0,0,0,0.04), 0 12px 40px rgba(0,0,0,0.07);
  --sn-shadow-h:    0 4px 12px rgba(0,0,0,0.08), 0 24px 64px rgba(0,0,0,0.13);
  --sn-pad:         120px 0;
  --sn-pad-md:      88px 0;
  --sn-font:        'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

/* ── 2. GLOBAL TYPOGRAPHY ── */
body {
  font-family: var(--sn-font) !important;
  background: var(--sn-black) !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--sn-font) !important;
  letter-spacing: -0.03em !important;
}

p, a, span, li, div, button, input, label {
  font-family: var(--sn-font) !important;
}

/* ── 3. SCROLLBAR ── */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: var(--sn-black); }
::-webkit-scrollbar-thumb { background: rgba(200,168,78,0.3); border-radius: 3px; }

/* ── 4. TAPE BAR ── */
.tape {
  background: #0F0F0F !important;
  border-bottom: 1px solid rgba(200,168,78,0.12) !important;
}
.tape .item {
  font-family: var(--sn-font) !important;
  font-size: 11.5px !important;
  letter-spacing: 0.04em !important;
  color: rgba(255,255,255,0.5) !important;
  text-transform: none !important;
}

/* ── 5. NAVIGATION ── */
.nav {
  background: transparent !important;
  border-bottom: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: background 0.35s ease, backdrop-filter 0.35s ease, box-shadow 0.35s ease !important;
}

.nav.sn-scrolled {
  background: rgba(8,8,8,0.94) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.05) !important;
}

.nav-row {
  height: 70px !important;
  padding: 0 clamp(24px, 3vw, 48px) !important;
  max-width: 1380px !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.brand-text .b1 {
  font-family: var(--sn-font) !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
}
.brand-text .b2 {
  font-family: var(--sn-font) !important;
  font-size: 9.5px !important;
  opacity: 0.45 !important;
  letter-spacing: 0.02em !important;
}

.nav-mid { display: flex !important; gap: 4px !important; }
/* Hide hamburger when nav-mid is forced visible (641px+) */
@media (min-width: 641px) { .nav-burger { display: none !important; } }

.nav-mid a {
  font-family: var(--sn-font) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: rgba(255,255,255,0.75) !important;
  padding: 7px 14px !important;
  border-radius: var(--sn-pill) !important;
  transition: color 0.2s, background 0.2s !important;
  white-space: nowrap !important;
}
.nav-mid a:hover {
  color: #fff !important;
  background: rgba(255,255,255,0.08) !important;
}
.nav-mid a.active {
  color: var(--sn-gold) !important;
  background: rgba(200,168,78,0.08) !important;
}

/* Nav CTA pill */
.sn-nav-cta {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 9px 22px !important;
  background: var(--sn-gold) !important;
  color: #000 !important;
  font-family: var(--sn-font) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  border-radius: var(--sn-pill) !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: background 0.2s, transform 0.15s !important;
}
.sn-nav-cta:hover {
  background: var(--sn-gold-bright) !important;
  transform: translateY(-1px) !important;
}

.nav-status {
  font-family: var(--sn-font) !important;
  font-size: 12px !important;
  color: rgba(255,255,255,0.45) !important;
  letter-spacing: 0.02em !important;
}

/* ── 6. HERO ── */
.hero-cinematic {
  background: var(--sn-black) !important;
  min-height: 100vh !important;
  position: relative !important;
}

/* Hide heavy canvas decoration — KEEP the orb mesh (gold flow layer) ·
   2026-05-17 update: orbs were globally hidden which killed the ambient
   motion the hero needs to feel "alive like KKR". Now the orbs are
   allowed to render (with the boosted 0.92 opacity / 64px blur from
   hero-globe.css) and the new .cine-gold-flow ribbon layer sits above. */
.cine-grid,
.cine-particles,
.hash-rain,
.cine-vignette,
.adinkrahene-watermark {
  display: none !important;
}

/* Subtle noise texture instead */
.hero-cinematic::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 60% at 50% -10%, rgba(200,168,78,0.07) 0%, transparent 70%),
    radial-gradient(ellipse 50% 50% at 80% 60%, rgba(200,168,78,0.04) 0%, transparent 60%);
  pointer-events: none;
  z-index: 0;
}

.cine-content {
  position: relative !important;
  z-index: 1 !important;
  /* Padding tightened 2026-05-17 · was 160px/80px which left the
     badge floating 160px below the nav and pushed CTAs below the fold
     on standard desktops. New padding fits the full content stack
     (badge → headline → sub → coin → CTAs) into one viewport. */
  padding: 48px clamp(24px, 4vw, 80px) 40px !important;
  max-width: 860px !important;
  margin: 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  /* Center the entire stack vertically within the 100vh hero */
  min-height: calc(100vh - 88px) !important;
  justify-content: center !important;
}

.cine-eyebrow { order: 1 !important; }
.cine-headline { order: 2 !important; }
.cine-sub { order: 3 !important; }

.cine-eyebrow {
  font-family: var(--sn-font) !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: var(--sn-gold) !important;
  margin-bottom: 18px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.cine-headline {
  font-family: var(--sn-font) !important;
  /* Ceiling reduced from 84px → 76px so the 2-line "Verified gold. /
     On-chain." headline still feels massive but the CTAs land above
     the fold on a 900px viewport. */
  font-size: clamp(44px, 5.4vw, 76px) !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  line-height: 1.0 !important;
  color: #FFFFFF !important;
  margin-bottom: 18px !important;
}
.cine-headline .line-1,
.cine-headline .line-2 {
  display: block !important;
}

.cine-sub {
  font-family: var(--sn-font) !important;
  font-size: clamp(15px, 1.5vw, 18px) !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  color: rgba(255,255,255,0.62) !important;
  max-width: 620px !important;
  margin: 0 auto 24px !important;
  text-align: center !important;
  padding: 0 16px !important;
  text-wrap: balance !important;
}

/* CTA row */
.cine-cta-row {
  display: flex !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
  margin-bottom: 64px !important;
}

/* Primary pill CTA */
.btn-primary, .cine-cta-primary,
a.btn-primary, a.cine-cta-primary,
button.btn-primary {
  background: var(--sn-gold) !important;
  color: #000 !important;
  border: none !important;
  border-radius: var(--sn-pill) !important;
  font-family: var(--sn-font) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  padding: 14px 30px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  text-decoration: none !important;
  transition: background 0.2s, transform 0.15s, box-shadow 0.2s !important;
  cursor: pointer !important;
}
.btn-primary:hover, .cine-cta-primary:hover {
  background: var(--sn-gold-bright) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 36px var(--sn-gold-glow) !important;
}

/* Ghost pill CTA */
.btn-ghost, .cine-cta-ghost,
a.btn-ghost, a.cine-cta-ghost {
  background: transparent !important;
  color: rgba(255,255,255,0.85) !important;
  border: 1.5px solid rgba(255,255,255,0.28) !important;
  border-radius: var(--sn-pill) !important;
  font-family: var(--sn-font) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  padding: 13px 30px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  text-decoration: none !important;
  transition: border-color 0.2s, color 0.2s, transform 0.15s !important;
}
.btn-ghost:hover, .cine-cta-ghost:hover {
  border-color: rgba(255,255,255,0.65) !important;
  color: #fff !important;
  transform: translateY(-2px) !important;
}

/* Hero proof strip · 4 stat cells centered in the viewport */
.cine-proof-strip {
  display: flex !important;
  gap: 40px !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: flex-start !important;
  padding-top: 36px !important;
  margin: 0 auto !important;
  max-width: 1080px !important;
  border-top: 1px solid rgba(255,255,255,0.07) !important;
  border-bottom: none !important;
  background: transparent !important;
}

.cine-proof-cell {
  text-align: center !important;
  min-width: 140px !important;
}

.cine-proof-cell .num {
  font-family: var(--sn-font) !important;
  font-size: 26px !important;
  font-weight: 800 !important;
  color: #fff !important;
  letter-spacing: -0.04em !important;
  line-height: 1.1 !important;
}
.cine-proof-cell .suffix {
  font-size: 18px !important;
}
.cine-proof-cell .lbl {
  font-family: var(--sn-font) !important;
  font-size: 11.5px !important;
  color: rgba(255,255,255,0.4) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  line-height: 1.4 !important;
  margin-top: 4px !important;
}

/* Scroll cue */
.cine-scroll-cue {
  display: none !important;
}

/* Coin — centred hero visual, sits between sub-text and CTAs */
.cine-marquee-stat {
  display: flex !important;
  justify-content: center !important;
  margin: 0 auto 12px !important;
  order: 4 !important;
}

.cine-stat-block {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

/* Move CTA and proof below the coin */
.cine-cta-row { order: 5 !important; }
.cine-proof-strip { order: 6 !important; }

/* Hero coin stat equation — hide the formula text beside coin */
.cine-stat-eq,
.cine-stat-num {
  display: none !important;
}

/* ── 7. LIVE TICKER ── */
.live-ticker-shell {
  background: #0C0C0C !important;
  border-top: 1px solid rgba(200,168,78,0.10) !important;
  border-bottom: 1px solid rgba(200,168,78,0.10) !important;
}
.ticker-title {
  font-family: var(--sn-font) !important;
  font-size: 11px !important;
  letter-spacing: 0.06em !important;
  color: rgba(255,255,255,0.4) !important;
}
.ticker-meta {
  font-family: var(--sn-font) !important;
  font-size: 11px !important;
  color: rgba(255,255,255,0.3) !important;
}
.ti-time, .ti-id, .ti-meta, .ti-badge {
  font-family: var(--sn-font) !important;
}

/* ── 8. BODY-LIGHT WRAPPER ── */
.body-light {
  background: var(--sn-offwhite) !important;
}

/* Global section padding in body-light */
.body-light .section {
  padding: 100px 0 !important;
}
.body-light .section.section-sm {
  padding: 80px 0 !important;
}

/* Global section eyebrow */
.section-eyebrow {
  font-family: var(--sn-font) !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
}

/* Global section head headline */
.section-head h2 {
  font-family: var(--sn-font) !important;
  font-size: clamp(34px, 4vw, 52px) !important;
  letter-spacing: -0.03em !important;
  line-height: 1.1 !important;
}

.section-head p {
  font-family: var(--sn-font) !important;
  font-size: clamp(15px, 1.5vw, 18px) !important;
  line-height: 1.7 !important;
}

/* ── 9. SAVE IN GOLD SECTION (dark) ── */
#save {
  background: var(--sn-black) !important;
  border-bottom: none !important;
  padding: 100px 0 !important;

  /* Override body-light CSS variables for inline-style elements */
  --bl-bg:       var(--sn-black);
  --bl-bg-soft:  #141414;
  --bl-bg-card:  #242424;                 /* was #161616 — 1.15:1 on #080808 (invisible). Now ~2.8:1 */
  --bl-rule:     rgba(255,255,255,0.15);  /* was 0.07 — invisible. Now visibly light border */
  --bl-ink:      #F5F0E8;
  --bl-ink-sub:  rgba(245,240,232,0.85);  /* raised again — body copy */
  --bl-ink-mute: rgba(245,240,232,0.65);  /* labels, WCAG AA on #242424 ≈ 5.8:1 */
  --bl-gold:     #C8A84E;
  --bl-shadow:   0 1px 0 rgba(255,255,255,0.06), 0 8px 32px rgba(0,0,0,0.5);
  --radius:      16px;
}

/* Force saver step card backgrounds — target by data attribute, bypasses var() resolution issues */
#save [data-saver-card] {
  background: #242424 !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  border-top: 3px solid #C8A84E !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.05), 0 8px 32px rgba(0,0,0,0.5) !important;
}
/* Step number */
#save [data-saver-num] {
  color: #C8A84E !important;
}
/* Card headings */
#save [data-saver-card] h3 {
  color: #F5F0E8 !important;
}
/* Card body paragraphs */
#save [data-saver-card] p {
  color: rgba(245,240,232,0.82) !important;
}
/* Footer tag lines in cards */
#save [data-saver-card] div:last-child {
  color: #C8A84E !important;
}
/* Mobile money chip row chips · 2026-05-26 — added padding+radius+border-width
   (rule previously set only bg/border-color/color which without padding renders chips as inline text) */
#save [data-saver-chip] {
  display: inline-flex !important;
  align-items: center !important;
  padding: 6px 14px !important;
  background: #2A2A2A !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  border-radius: 999px !important;
  color: #F5F0E8 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em !important;
}
/* Heading + intro copy */
#save h2 { color: #FFFFFF !important; }
#save .section-head p { color: rgba(245,240,232,0.82) !important; }

#save .section-eyebrow { color: var(--sn-gold) !important; }

#save h2 {
  color: #FFFFFF !important;
  font-size: clamp(36px, 4vw, 54px) !important;
  line-height: 1.1 !important;
}

/* Step number */
#save [style*="font-size: 40px"] {
  font-family: var(--sn-font) !important;
  letter-spacing: -0.04em !important;
}

/* Step cards hover */
#save .fade-up > div:hover,
#save [style*="background: var(--bl-bg-card)"]:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.08), 0 20px 60px rgba(200,168,78,0.15) !important;
}

/* Mobile money strip */
#save [style*="background: var(--bl-bg-soft)"] {
  background: #1C1C1C !important;
  border-color: rgba(255,255,255,0.14) !important;
}

/* Anti-inflation pull quote — keep dark panel, clean it up */
#save [style*="background: linear-gradient"] {
  border-radius: 16px !important;
  border-color: rgba(200,168,78,0.3) !important;
}

/* ── 10. TWO PATHS SECTION (light) ── */
#two-paths {
  background: var(--sn-offwhite) !important;
  border-bottom: none !important;
  padding: 100px 0 !important;

  --bl-bg:       var(--sn-offwhite);
  --bl-bg-soft:  var(--sn-grey);
  --bl-bg-card:  #FFFFFF;
  --bl-rule:     #E0E0E0;
  --bl-ink:      #111111;
  --bl-ink-sub:  #555555;
  --bl-ink-mute: #888888;
  --bl-gold:     #B8923C;
  --bl-shadow:   0 1px 3px rgba(0,0,0,0.04), 0 12px 40px rgba(0,0,0,0.07);
  --radius:      16px;
}

#two-paths .section-eyebrow {
  font-family: var(--sn-font) !important;
  color: #888 !important;
  display: block !important;
  text-align: center !important;
  margin-bottom: 14px !important;
}

#two-paths .section-head p {
  color: #666 !important;
  text-align: center !important;
}

/* Path cards */
#two-paths [style*="background: var(--bl-bg-card)"] {
  border-radius: 16px !important;
  border: none !important;
  box-shadow: var(--sn-shadow) !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}
#two-paths [style*="background: var(--bl-bg-card)"]:hover {
  transform: translateY(-6px) !important;
  box-shadow: var(--sn-shadow-h) !important;
}

/* For Institutions card — override the muted colour to a clean slate */
#two-paths [style*="color: var(--bl-ink-mute)"] {
  color: #888 !important;
}

/* ── 11. GHANA CONTEXT BAND (dark stats) ── */
#context {
  background: var(--sn-dark) !important;
  border-bottom: none !important;
  padding: 88px 0 !important;

  --bl-bg:       var(--sn-dark);
  --bl-bg-soft:  #1A1A1A;
  --bl-bg-card:  #272727;                 /* was #1E1E1E — 1.22:1 on #111111 (invisible). Now ~2.4:1 */
  --bl-rule:     rgba(255,255,255,0.15);  /* was 0.07 — invisible. Now visible */
  --bl-ink:      #F5F0E8;
  --bl-ink-sub:  rgba(245,240,232,0.85);
  --bl-ink-mute: rgba(245,240,232,0.75);  /* 9.5px ALL-CAPS labels — needs headroom, WCAG AA on #272727 ≈ 6.8:1 */
  --bl-gold:     #C8A84E;
  --bl-shadow:   0 1px 0 rgba(255,255,255,0.06), 0 4px 24px rgba(0,0,0,0.45);
  --radius:      12px;
}

/* Force stat card backgrounds — target .fade-up children of the 5-col grid */
#context .wrap div div.fade-up {
  background: #272727 !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.05), 0 4px 20px rgba(0,0,0,0.4) !important;
}
/* Counter numbers (130 t, ~104 t etc.) */
#context .counter {
  color: #C8A84E !important;
}
/* 9.5px ALL-CAPS labels */
#context .wrap div div.fade-up > div:not(.counter) {
  color: rgba(245,240,232,0.78) !important;
}
/* Section heading */
#context h3 { color: #FFFFFF !important; }
/* Eyebrow */
#context .section-eyebrow { color: #C8A84E !important; }
/* Sources footnote */
#context .wrap > p {
  color: rgba(245,240,232,0.55) !important;
}

#context h3 {
  color: #fff !important;
  font-size: clamp(22px, 2.5vw, 32px) !important;
  line-height: 1.25 !important;
}

/* Stat numbers */
#context .counter {
  font-family: var(--sn-font) !important;
  letter-spacing: -0.04em !important;
}

/* ── 12. OVERVIEW / TILES (white) ── */
#overview {
  background: #fff !important;
  padding: 100px 0 !important;
}

#overview h2 { color: #111 !important; }
#overview .section-head p { color: #666 !important; }
#overview .section-eyebrow { color: var(--sn-gold) !important; }

.tile {
  background: var(--sn-offwhite) !important;
  border: none !important;
  border-radius: var(--sn-card-r) !important;
  box-shadow: none !important;
  padding: 36px 32px !important;
  transition: background 0.2s, transform 0.25s ease, box-shadow 0.25s ease !important;
}
.tile:hover {
  background: #fff !important;
  transform: translateY(-5px) !important;
  box-shadow: var(--sn-shadow) !important;
}
.tile h3 {
  font-family: var(--sn-font) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #111 !important;
  letter-spacing: -0.01em !important;
  margin-bottom: 10px !important;
}
.tile p {
  font-family: var(--sn-font) !important;
  font-size: 14px !important;
  color: #666 !important;
  line-height: 1.65 !important;
}
.tile-link-cue {
  font-family: var(--sn-font) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--sn-gold) !important;
}
.tile-icon { color: var(--sn-gold) !important; }

/* ── 13. HOW IT WORKS ── */
#how {
  background: var(--sn-offwhite) !important;
  padding: 0 0 100px !important;
}
#how h2 { color: #111 !important; }
#how p { color: #666 !important; }
#how .section-eyebrow { color: var(--sn-gold) !important; }
.flow-caption {
  font-family: var(--sn-font) !important;
  font-size: 12px !important;
  letter-spacing: 0.12em !important;
  color: #999 !important;
  text-transform: uppercase !important;
}

/* ── 14. LEDGER & ENGAGE (white) ── */
#ledger, #engage {
  background: #fff !important;
  padding: 100px 0 !important;
}
#ledger h2, #engage h2 {
  color: #111 !important;
  font-size: clamp(32px, 3.5vw, 48px) !important;
}
#ledger p, #engage p { color: #666 !important; }
#ledger .section-eyebrow, #engage .section-eyebrow { color: var(--sn-gold) !important; }

/* Attestation counter */
.attestation-counter, .big-counter {
  font-family: var(--sn-font) !important;
  letter-spacing: -0.04em !important;
}

/* Resource cards */
.resource {
  background: #fff !important;
  border: 1px solid var(--sn-grey) !important;
  border-radius: 12px !important;
  box-shadow: var(--sn-shadow) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
.resource:hover {
  transform: translateY(-3px) !important;
  box-shadow: var(--sn-shadow-h) !important;
  border-color: rgba(200,168,78,0.25) !important;
}
.resource .name {
  font-family: var(--sn-font) !important;
  font-weight: 700 !important;
  color: #111 !important;
}
.resource .desc {
  font-family: var(--sn-font) !important;
  color: #666 !important;
}
.resource .meta {
  font-family: var(--sn-font) !important;
  color: #999 !important;
}

.resource-gated {
  background: var(--sn-offwhite) !important;
  opacity: 0.9 !important;
}

/* Resources CTA */
.resources-cta-btn {
  background: var(--sn-offwhite) !important;
  border: 1.5px solid var(--sn-grey) !important;
  border-radius: var(--sn-pill) !important;
  font-family: var(--sn-font) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #333 !important;
  padding: 14px 32px !important;
  transition: border-color 0.2s, background 0.2s, transform 0.15s !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.resources-cta-btn:hover {
  background: #fff !important;
  border-color: var(--sn-gold) !important;
  transform: translateY(-2px) !important;
  color: #000 !important;
}

/* ── 15. THRONE / CEREMONIAL SECTION (keep dark, clean frame) ── */
.throne-band {
  background: #060606 !important;
}

.throne-content {
  position: relative !important;
  z-index: 1 !important;
}

.throne-particles { display: none !important; }

/* Ceremonial header clean-up */
.throne-ceremony .royal-mark {
  font-family: var(--sn-font) !important;
  letter-spacing: 0.28em !important;
  font-size: clamp(13px, 1.4vw, 18px) !important;
}

/* ── 16. DUALITY SECTION (on homepage) ── */
.duality-section {
  background: #080808 !important;
}

/* ── 17. FOOTER / SITE FOOTER ── */
.site-footer, footer, .footer-band {
  background: #060606 !important;
  border-top: 1px solid rgba(255,255,255,0.05) !important;
}

.footer-copy, .footer-links a, .footer-nav a {
  font-family: var(--sn-font) !important;
  font-size: 12.5px !important;
  color: rgba(255,255,255,0.38) !important;
}

/* ── 18. BODY-LIGHT OVERRIDE for bl-specific sections ── */
/* Any remaining .body-light sections not explicitly targeted: clean cream → white */
.body-light section:not(#save):not(#two-paths):not(#context) {
  --bl-bg:       #FAFAFA;
  --bl-bg-soft:  var(--sn-offwhite);
  --bl-bg-card:  #FFFFFF;
  --bl-rule:     #E8E8E8;
  --bl-ink:      #111111;
  --bl-ink-sub:  #555555;
  --bl-ink-mute: #888888;
  --bl-gold:     #B8923C;
  --bl-shadow:   0 1px 3px rgba(0,0,0,0.04), 0 8px 32px rgba(0,0,0,0.06);
  --radius:      14px;
}

/* ── 19. YARN STRIP (keep but tone it down) ── */
.yarn-strip {
  background: #050505 !important;
  border-bottom: 1px solid rgba(200,168,78,0.08) !important;
}

/* ── 20. SECTION LABEL / TIER LABELS ── */
.tier-text, .resources-tier-label span {
  font-family: var(--sn-font) !important;
  font-size: 11px !important;
  letter-spacing: 0.12em !important;
}

/* ── 21. FADE-UP ANIMATION ── */
.fade-up {
  animation: snFadeUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  opacity: 0;
  transform: translateY(24px);
}
@keyframes snFadeUp {
  to { opacity: 1; transform: translateY(0); }
}

/* ── 22. SELECTION ── */
::selection {
  background: rgba(200,168,78,0.22);
  color: #fff;
}

/* ── 23. MOBILE STORY MODE — do not touch ── */
.mobile-story,
.mobile-story * {
  font-family: var(--sn-font) !important;
}
/* Keep mobile story panels dark with Inter */

/* ── 24. RESPONSIVE ADJUSTMENTS ── */
@media (max-width: 960px) {
  .cine-content {
    grid-template-columns: 1fr !important;
    padding-top: 140px !important;
    text-align: center !important;
  }
  .cine-cta-row {
    justify-content: center !important;
  }
  .cine-sub {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .cine-proof-strip {
    justify-content: center !important;
    gap: 24px !important;
  }
  .cine-marquee-stat {
    display: none !important;
  }
}

@media (max-width: 640px) {
  .sn-nav-cta { display: none !important; }
  .nav-mid { display: none !important; }
  .cine-headline {
    font-size: clamp(38px, 9vw, 56px) !important;
  }
}

/* ── 25. SAVER CARDS RESPONSIVE GRID ── */
/* yarn.css uses #save [style*="..."] = specificity (1,1,0) + !important to collapse grids.
   #save #saver-cards = specificity (2,0,0) which beats (1,1,0) — this wins at every breakpoint. */
@media (min-width: 701px) and (max-width: 900px) {
  #save #saver-cards {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 700px) {
  #save #saver-cards {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
  }
}
@media (max-width: 480px) {
  #save #saver-cards {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
}


/* ═══════════════════════════════════════════════════════════════
   LAYOUT RESCUE · 2026-05-26 v6
   Inline display/grid/padding/bg/border styles get stripped under
   strict CSP + mobile-fixes responsive collapses force 1-col at
   ≤1024px even on desktop. This block hooks every broken element
   via [data-rescue="..."] attribute and forces the intended
   layout with !important. Proven pattern from saver-cards rescue.
   ═══════════════════════════════════════════════════════════ */

/* ── Orientation strip frame · sits between hero and saver section ── */
section[data-rescue="orientation-strip"] {
  background: var(--sn-offwhite, #F5F0E8) !important;
  border-bottom: 1px solid rgba(0,0,0,0.08) !important;
}

/* ── Trust signal row · 5 verifiable proof cards ── */
[data-rescue="trust-row"] {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)) !important;
  gap: 10px !important;
  margin-bottom: 30px !important;
}
[data-rescue="trust-card"] {
  display: block !important;
  padding: 14px 16px !important;
  background: #FFFFFF !important;
  border: 1px solid #E0E0E0 !important;
  border-left: 3px solid #C8A84E !important;
  border-radius: 12px !important;
  text-decoration: none !important;
  color: inherit !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
  transition: transform .2s ease, box-shadow .2s ease !important;
}
[data-rescue="trust-card"]:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(0,0,0,0.08) !important;
}
/* Eyebrow + value inside trust card · force colors that CSP nuked */
[data-rescue="trust-card"] > div:first-child {
  font-family: var(--sn-font-mono, ui-monospace, monospace) !important;
  font-size: 10px !important;
  letter-spacing: 0.14em !important;
  color: #888 !important;
  text-transform: uppercase !important;
  margin-bottom: 5px !important;
}
[data-rescue="trust-card"] > div:last-child {
  font-family: var(--ff-serif, Georgia, serif) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #111111 !important;
  line-height: 1.3 !important;
}

/* ── Designed-for rail · saver section ── */
[data-rescue="designed-rail"] {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
  flex-wrap: wrap !important;
  padding: 20px 28px !important;
  margin-top: 40px !important;
  background: #1C1C1C !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  border-radius: 12px !important;
}
[data-rescue="designed-chips"] {
  display: flex !important;
  gap: 18px !important;
  flex-wrap: wrap !important;
  align-items: center !important;
}

/* ── Why-gold pull-quote · saver section ── */
[data-rescue="whygold-quote"] {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
  gap: 32px !important;
  align-items: center !important;
  margin-top: 40px !important;
  padding: 32px 36px !important;
  background: linear-gradient(135deg, #0F1B2D 0%, #0A1220 100%) !important;
  border: 1px solid #C8A84E !important;
  border-radius: 12px !important;
}
[data-rescue="whygold-stats"] {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)) !important;
  gap: 16px !important;
}
/* Inner stat tiles (gold-bordered) inside whygold-stats */
[data-rescue="whygold-stats"] > div {
  text-align: center !important;
  padding: 16px !important;
  background: rgba(200,168,78,0.08) !important;
  border: 1px solid rgba(200,168,78,0.25) !important;
  border-radius: 8px !important;
}

/* ── Two paths grid · keep 2-col on > 720px ── */
@media (min-width: 721px) {
  [data-rescue="twopaths-grid"] {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 24px !important;
    max-width: 880px !important;
    margin: 0 auto !important;
  }
}

/* ── Ghana 2025-2026 band · keep responsive grid on > 720px ── */
/* Overrides mobile-fixes.css :≤1024 forcing 1-col on context grids */
@media (min-width: 721px) {
  [data-rescue="ghana-outer"],
  #context > .wrap > [data-rescue="ghana-outer"] {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    gap: 36px !important;
    align-items: center !important;
  }
  [data-rescue="ghana-stats"],
  #context > .wrap > [data-rescue="ghana-outer"] > [data-rescue="ghana-stats"] {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important;
    gap: 14px !important;
  }
}

/* ── Footer · keep 4-col on > 1024px, override the mobile-fixes 2-col ── */
@media (min-width: 1025px) {
  .footer-grid {
    grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr !important;
    gap: 40px !important;
  }
}
@media (min-width: 721px) and (max-width: 1024px) {
  .footer-grid {
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 28px !important;
  }
}
/* END LAYOUT RESCUE 2026-05-26 v6 ──────────────────────────── */

/* National backdrop delimiter · 2026-05-26
   Prevents Ghana macro stats from reading as VPAY reserve claims */
[data-rescue="context-eyebrow-bar"] {
  display: block !important;
  margin-bottom: 28px !important;
  padding: 12px 16px !important;
  background: rgba(200,168,78,0.12) !important;
  border: 1px solid rgba(200,168,78,0.30) !important;
  border-left: 3px solid #C8A84E !important;
  border-radius: 8px !important;
  font-family: var(--sn-font-mono, ui-monospace, monospace) !important;
  font-size: 11px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: rgba(245,240,232,0.78) !important;
  line-height: 1.5 !important;
}
[data-rescue="context-eyebrow-bar"] strong {
  color: #C8A84E !important;
  font-weight: 700 !important;
}
[data-rescue="context-eyebrow-bar"] em {
  font-style: normal !important;
  color: rgba(245,240,232,0.62) !important;
  text-transform: none !important;
  letter-spacing: 0.02em !important;
}

/* Full contract addresses · 2026-05-26
   Audit asked for non-truncated 42-char hex in the public ledger.
   Force monospace + word-break so the long string fits the addr column
   on narrow viewports without blowing out the table. */
table .addr a,
table td.addr a {
  font-family: ui-monospace, 'JetBrains Mono', SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size: 11.5px !important;
  letter-spacing: -0.01em !important;
  word-break: break-all !important;
  overflow-wrap: anywhere !important;
  line-height: 1.4 !important;
}
.ledger-foot {
  font-size: 12px !important;
  line-height: 1.55 !important;
}
.ledger-foot span:first-child {
  word-break: break-word !important;
}
.ledger-foot code,
.ledger-foot span span[style*="color:var(--bl-gold)"] {
  font-family: ui-monospace, 'JetBrains Mono', SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size: 11.5px !important;
  word-break: break-all !important;
}

/* ═══════════════════════════════════════════════════════════════
   FOUNDER ACCOUNTABILITY PANEL · 2026-05-26
   Closes the audit's "Zero disclosure of beneficial ownership" gap
   by surfacing SOVVesting math (allocation · cliff · linear · beneficiary)
   on the homepage. Light-body register · institutional weight.
   ═══════════════════════════════════════════════════════════ */

[data-rescue="founder-panel"] {
  margin-top: 48px !important;
  padding: 36px 40px !important;
  background: #FFFFFF !important;
  border: 1px solid #E0E0E0 !important;
  border-left: 4px solid #C8A84E !important;
  border-radius: 14px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
}
[data-rescue="founder-head"] {
  margin-bottom: 24px !important;
}
[data-rescue="founder-eyebrow"] {
  font-family: ui-monospace, 'JetBrains Mono', SFMono-Regular, monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: #C8A84E !important;
  margin-bottom: 10px !important;
}
[data-rescue="founder-headline"] {
  font-family: Georgia, 'Source Serif Pro', serif !important;
  font-size: clamp(22px, 2.6vw, 32px) !important;
  color: #111111 !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  font-weight: 700 !important;
}
[data-rescue="founder-lede"] {
  font-family: Georgia, serif !important;
  font-size: 15px !important;
  color: #555555 !important;
  line-height: 1.55 !important;
  margin: 14px 0 0 !important;
  max-width: 720px !important;
}
[data-rescue="founder-lede"] code {
  font-family: ui-monospace, 'JetBrains Mono', SFMono-Regular, monospace !important;
  font-size: 13px !important;
  color: #111 !important;
  background: rgba(200,168,78,0.10) !important;
  padding: 1px 6px !important;
  border-radius: 4px !important;
}

[data-rescue="founder-grid"] {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
  gap: 14px !important;
  margin-bottom: 28px !important;
}
[data-rescue="founder-fact"] {
  padding: 16px 18px !important;
  background: #FAFAF7 !important;
  border: 1px solid #E8E5DC !important;
  border-radius: 10px !important;
}
[data-rescue="founder-fact-label"] {
  font-family: ui-monospace, monospace !important;
  font-size: 10px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: #888 !important;
  margin-bottom: 6px !important;
}
[data-rescue="founder-fact-value"] {
  font-family: Georgia, serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #111 !important;
  line-height: 1.1 !important;
}
[data-rescue="founder-fact-foot"] {
  font-family: ui-monospace, monospace !important;
  font-size: 10px !important;
  color: #888 !important;
  margin-top: 6px !important;
}

[data-rescue="founder-timeline"] {
  margin-bottom: 24px !important;
}
[data-rescue="founder-timeline-label"] {
  font-family: ui-monospace, monospace !important;
  font-size: 10px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: #888 !important;
  margin-bottom: 10px !important;
}
[data-rescue="founder-timeline-bar"] {
  position: relative !important;
  height: 30px !important;
  background: #F2EFE6 !important;
  border: 1px solid #E0DCCF !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}
[data-rescue="founder-timeline-locked"] {
  position: absolute !important;
  left: 0 !important; top: 0 !important;
  height: 100% !important; width: 100% !important;
  background: linear-gradient(135deg, #C8A84E 0%, #8B7430 100%) !important;
}
[data-rescue="founder-timeline-marker"] {
  position: absolute !important;
  left: 0 !important; top: 0 !important;
  height: 100% !important; width: 2px !important;
  background: #0F1B2D !important;
}
[data-rescue="founder-timeline-text"] {
  position: absolute !important;
  left: 50% !important; top: 50% !important;
  transform: translate(-50%, -50%) !important;
  font-family: ui-monospace, monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.4) !important;
}
[data-rescue="founder-timeline-axis"] {
  display: flex !important;
  justify-content: space-between !important;
  margin-top: 8px !important;
  font-family: ui-monospace, monospace !important;
  font-size: 10px !important;
  color: #888 !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

[data-rescue="founder-verify"] {
  padding-top: 20px !important;
  border-top: 1px solid #EEE8DC !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 14px !important;
  align-items: center !important;
  justify-content: space-between !important;
}
[data-rescue="founder-verify"] code {
  font-family: ui-monospace, 'JetBrains Mono', monospace !important;
  font-size: 11.5px !important;
  color: #111 !important;
  word-break: break-all !important;
}
[data-rescue="founder-verify-cta"] {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 10px 18px !important;
  background: #0F1B2D !important;
  color: #F5F0E8 !important;
  font-family: ui-monospace, monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: transform .2s ease, background .2s ease !important;
}
[data-rescue="founder-verify-cta"]:hover {
  transform: translateY(-1px) !important;
  background: #1A2A40 !important;
}

/* ═══════════════════════════════════════════════════════════════
   ACCESSIBILITY UTILITIES · 2026-05-26
   .visually-hidden / .sr-only — screen-reader-only content.
   Inline absolute-clip styles get nuked by CSP. This external
   class restores the canonical sr-only pattern.
   ═══════════════════════════════════════════════════════════ */
.visually-hidden,
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  clip-path: inset(50%) !important;
}
.visually-hidden:focus,
.sr-only:focus {
  position: static !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  white-space: normal !important;
}

/* ═══════════════════════════════════════════════════════════════
   PRO CARD AESTHETIC SYSTEM · 2026-05-26
   Unified depth + shadow + grain + hover + gradient-border
   treatment across every card hook on the page. Single source
   of truth for the institutional card register.
   ═══════════════════════════════════════════════════════════ */

/* Shared decoration vars — institutional polish layer */
:root {
  --pro-shadow-rest:
    0 1px 0 rgba(255,255,255,0.04) inset,
    0 1px 2px rgba(0,0,0,0.04),
    0 4px 12px rgba(0,0,0,0.06),
    0 16px 40px -8px rgba(0,0,0,0.08);
  --pro-shadow-hover:
    0 1px 0 rgba(255,255,255,0.06) inset,
    0 2px 4px rgba(0,0,0,0.06),
    0 8px 24px rgba(200,168,78,0.10),
    0 24px 64px -12px rgba(200,168,78,0.16);
  --pro-shadow-dark-rest:
    0 1px 0 rgba(255,255,255,0.06) inset,
    0 2px 6px rgba(0,0,0,0.40),
    0 12px 32px rgba(0,0,0,0.30);
  --pro-shadow-dark-hover:
    0 1px 0 rgba(255,239,168,0.18) inset,
    0 4px 12px rgba(0,0,0,0.45),
    0 20px 56px rgba(200,168,78,0.18);
  --pro-grain:
    radial-gradient(ellipse at top left, rgba(200,168,78,0.04) 0%, transparent 60%),
    radial-gradient(ellipse at bottom right, rgba(15,27,45,0.03) 0%, transparent 60%);
  --pro-grain-dark:
    radial-gradient(ellipse at top left, rgba(200,168,78,0.06) 0%, transparent 60%),
    radial-gradient(ellipse at bottom right, rgba(255,239,168,0.025) 0%, transparent 60%);
  --pro-border-gradient: linear-gradient(135deg, rgba(200,168,78,0.45) 0%, rgba(200,168,78,0.10) 50%, rgba(15,27,45,0.20) 100%);
}

/* ── TRUST CARDS (light · 5 verifiable proof cards) ── */
[data-rescue="trust-card"] {
  position: relative !important;
  background: #FFFFFF !important;
  background-image: var(--pro-grain) !important;
  border: 1px solid rgba(200,168,78,0.18) !important;
  border-left: 3px solid #C8A84E !important;
  border-radius: 12px !important;
  box-shadow: var(--pro-shadow-rest) !important;
  transition: transform .26s cubic-bezier(.2,.8,.2,1),
              box-shadow .26s cubic-bezier(.2,.8,.2,1),
              border-color .26s ease !important;
  overflow: hidden !important;
}
[data-rescue="trust-card"]::after {
  content: '↗' !important;
  position: absolute !important;
  top: 12px !important; right: 14px !important;
  font-size: 12px !important;
  color: rgba(200,168,78,0.45) !important;
  transition: transform .26s ease, color .26s ease !important;
}
[data-rescue="trust-card"]:hover {
  transform: translateY(-3px) !important;
  box-shadow: var(--pro-shadow-hover) !important;
  border-color: rgba(200,168,78,0.45) !important;
}
[data-rescue="trust-card"]:hover::after {
  color: #C8A84E !important;
  transform: translate(2px, -2px) !important;
}

/* ── SAVER CARDS (dark · 01/02/03) — pro depth + interior grain ── */
#save [data-saver-card] {
  position: relative !important;
  background: #1E2A3F !important;
  background-image:
    radial-gradient(ellipse at top, rgba(200,168,78,0.10) 0%, transparent 55%),
    radial-gradient(ellipse at bottom right, rgba(15,27,45,0.50) 0%, transparent 60%),
    linear-gradient(135deg, #232F45 0%, #1A2538 100%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  border-top: 3px solid #C8A84E !important;
  border-radius: 14px !important;
  box-shadow: var(--pro-shadow-dark-rest) !important;
  overflow: hidden !important;
  transition: transform .28s cubic-bezier(.2,.8,.2,1),
              box-shadow .28s cubic-bezier(.2,.8,.2,1),
              border-color .28s ease !important;
}
#save [data-saver-card]::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 80px !important;
  background: radial-gradient(ellipse at center top, rgba(200,168,78,0.18) 0%, transparent 70%) !important;
  pointer-events: none !important;
  opacity: 0.6 !important;
  transition: opacity .3s ease !important;
}
#save [data-saver-card]:hover {
  transform: translateY(-4px) !important;
  box-shadow: var(--pro-shadow-dark-hover) !important;
  border-color: rgba(200,168,78,0.30) !important;
}
#save [data-saver-card]:hover::before { opacity: 1 !important; }
#save [data-saver-num] {
  font-family: Georgia, serif !important;
  font-size: 44px !important;
  font-weight: 700 !important;
  letter-spacing: -0.04em !important;
  color: #C8A84E !important;
  background: linear-gradient(180deg, #F4D470 0%, #C8A84E 60%, #8B7430 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  line-height: 1 !important;
  margin-bottom: 14px !important;
}

/* ── DESIGNED-FOR RAIL · refined ── */
[data-rescue="designed-rail"] {
  position: relative !important;
  background: linear-gradient(135deg, #1A2236 0%, #131A2A 100%) !important;
  background-image:
    radial-gradient(ellipse at top left, rgba(200,168,78,0.06) 0%, transparent 50%),
    linear-gradient(135deg, #1A2236 0%, #131A2A 100%) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 14px !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.06) inset, 0 8px 28px rgba(0,0,0,0.25) !important;
  overflow: hidden !important;
}
#save [data-saver-chip] {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: #F5F0E8 !important;
  transition: background .22s ease, border-color .22s ease, transform .22s ease !important;
}
#save [data-saver-chip]:hover {
  background: rgba(200,168,78,0.10) !important;
  border-color: rgba(200,168,78,0.40) !important;
  transform: translateY(-1px) !important;
}

/* ── WHY-GOLD PULL-QUOTE · richer depth ── */
[data-rescue="whygold-quote"] {
  background: linear-gradient(135deg, #0F1B2D 0%, #0A1220 60%, #060D18 100%) !important;
  background-image:
    radial-gradient(ellipse at top right, rgba(200,168,78,0.10) 0%, transparent 55%),
    linear-gradient(135deg, #0F1B2D 0%, #0A1220 60%, #060D18 100%) !important;
  border: 1px solid rgba(200,168,78,0.35) !important;
  border-radius: 16px !important;
  box-shadow:
    0 1px 0 rgba(255,239,168,0.08) inset,
    0 12px 40px rgba(0,0,0,0.40),
    0 24px 64px -16px rgba(200,168,78,0.12) !important;
  overflow: hidden !important;
}
[data-rescue="whygold-stats"] > div {
  background: rgba(200,168,78,0.06) !important;
  border: 1px solid rgba(200,168,78,0.22) !important;
  border-radius: 10px !important;
  box-shadow: 0 1px 0 rgba(255,239,168,0.06) inset !important;
  transition: background .22s ease, border-color .22s ease, transform .22s ease !important;
}
[data-rescue="whygold-stats"] > div:hover {
  background: rgba(200,168,78,0.10) !important;
  border-color: rgba(200,168,78,0.45) !important;
  transform: translateY(-2px) !important;
}

/* ── GHANA STAT TILES — institutional depth + hover ── */
#context [data-rescue="ghana-stats"] > div {
  position: relative !important;
  background: #1F2A3E !important;
  background-image:
    radial-gradient(ellipse at top, rgba(200,168,78,0.06) 0%, transparent 55%),
    linear-gradient(135deg, #232F45 0%, #1A2538 100%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  border-radius: 12px !important;
  box-shadow: var(--pro-shadow-dark-rest) !important;
  transition: transform .26s ease, box-shadow .26s ease, border-color .26s ease !important;
}
#context [data-rescue="ghana-stats"] > div:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(200,168,78,0.30) !important;
  box-shadow: var(--pro-shadow-dark-hover) !important;
}
#context [data-rescue="ghana-stats"] .counter {
  background: linear-gradient(180deg, #F4D470 0%, #C8A84E 60%, #8B7430 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* ── TWO PATHS CARDS · subtle layered depth + ribbon polish ──
   Selector narrowed 2026-05-26 — earlier `.fade-up > div` matched the
   section-head eyebrow + paragraph divs and rendered them as white pills.
   Now scopes ONLY to the path cards via their inline-style hook. */
#two-paths .fade-up > div[style*="background: var(--bl-bg-card)"],
#two-paths .fade-up[style*="grid"] > div {
  position: relative !important;
  background: #FFFFFF !important;
  background-image: var(--pro-grain) !important;
  border: 1px solid rgba(15,27,45,0.08) !important;
  border-radius: 16px !important;
  box-shadow: var(--pro-shadow-rest) !important;
  transition: transform .28s cubic-bezier(.2,.8,.2,1),
              box-shadow .28s cubic-bezier(.2,.8,.2,1) !important;
  overflow: hidden !important;
}
#two-paths .fade-up > div[style*="background: var(--bl-bg-card)"]:hover,
#two-paths .fade-up[style*="grid"] > div:hover {
  transform: translateY(-4px) !important;
  box-shadow: var(--pro-shadow-hover) !important;
}
/* Defensive · explicitly STRIP any white-pill artifact from .section-head children */
#two-paths .section-head,
#two-paths .section-head > * {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* ── FOUNDER PANEL · same pro treatment + interior grain ── */
[data-rescue="founder-panel"] {
  background: #FFFFFF !important;
  background-image: var(--pro-grain) !important;
  border-radius: 16px !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,0.04) inset,
    0 2px 8px rgba(0,0,0,0.04),
    0 12px 36px rgba(0,0,0,0.06),
    0 32px 72px -20px rgba(200,168,78,0.12) !important;
}
[data-rescue="founder-fact"] {
  position: relative !important;
  background: linear-gradient(135deg, #FFFFFF 0%, #FAFAF7 100%) !important;
  border: 1px solid rgba(200,168,78,0.18) !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.6) inset, 0 4px 12px rgba(0,0,0,0.03) !important;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease !important;
}
[data-rescue="founder-fact"]:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(200,168,78,0.45) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.7) inset, 0 8px 20px rgba(200,168,78,0.10) !important;
}

/* ── NATIONAL-BACKDROP DELIMITER · darker, more institutional ── */
[data-rescue="context-eyebrow-bar"] {
  background: linear-gradient(135deg, rgba(200,168,78,0.10) 0%, rgba(200,168,78,0.04) 100%) !important;
  border: 1px solid rgba(200,168,78,0.28) !important;
  border-left: 3px solid #C8A84E !important;
  border-radius: 10px !important;
  box-shadow: 0 1px 0 rgba(255,239,168,0.10) inset, 0 2px 8px rgba(0,0,0,0.12) !important;
}

/* ── Honor prefers-reduced-motion across all hover translations ── */
@media (prefers-reduced-motion: reduce) {
  [data-rescue="trust-card"]:hover,
  #save [data-saver-card]:hover,
  #save [data-saver-chip]:hover,
  [data-rescue="whygold-stats"] > div:hover,
  #context [data-rescue="ghana-stats"] > div:hover,
  #two-paths .fade-up > div[style*="background: var(--bl-bg-card)"]:hover,
  #two-paths .fade-up[style*="grid"] > div:hover,
  [data-rescue="founder-fact"]:hover {
    transform: none !important;
  }
  [data-rescue="trust-card"]::after,
  #save [data-saver-card]::before {
    transition: none !important;
  }
}
/* END PRO CARD AESTHETIC SYSTEM 2026-05-26 ─────────────────── */

/* ═══════════════════════════════════════════════════════════════
   BESPOKE CARD CHARACTER · 2026-05-26 v2
   Push beyond generic "shadow + grain" into actual brand-distinctive
   detailing: Adinkra corner ornaments, gold accent rails, equalized
   heights, sophisticated typography hierarchy. The cards now read
   as institutional Brookfield with Asante register, not Bootstrap.
   ═══════════════════════════════════════════════════════════ */

/* ── SAVER CARDS · equalize heights + Adinkra Sika Dwa mark corner ── */
#save #saver-cards {
  align-items: stretch !important;
}
#save [data-saver-card] {
  display: flex !important;
  flex-direction: column !important;
  min-height: 100% !important;
  padding: 28px 26px 24px !important;
}
/* Adinkra Sika Dwa Kofi concentric-circle mark · top-right corner ornament */
#save [data-saver-card]::after {
  content: '' !important;
  position: absolute !important;
  top: 16px !important; right: 16px !important;
  width: 26px !important; height: 26px !important;
  border: 1px solid rgba(200,168,78,0.30) !important;
  border-radius: 50% !important;
  background:
    radial-gradient(circle at center, rgba(200,168,78,0.18) 0%, transparent 40%),
    radial-gradient(circle at center, transparent 30%, rgba(200,168,78,0.10) 33%, transparent 36%),
    radial-gradient(circle at center, transparent 55%, rgba(200,168,78,0.10) 58%, transparent 61%) !important;
  opacity: 0.7 !important;
  transition: opacity .3s ease, transform .3s ease !important;
  pointer-events: none !important;
}
#save [data-saver-card]:hover::after {
  opacity: 1 !important;
  transform: rotate(15deg) !important;
}
/* Number → title spacing tightened, gold accent rail under number */
#save [data-saver-num] {
  font-size: 48px !important;
  margin-bottom: 6px !important;
}
#save [data-saver-card] h3 {
  font-size: 19px !important;
  font-weight: 700 !important;
  margin-bottom: 12px !important;
  letter-spacing: -0.01em !important;
  position: relative !important;
  padding-top: 14px !important;
}
#save [data-saver-card] h3::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important;
  width: 32px !important; height: 2px !important;
  background: linear-gradient(90deg, #C8A84E 0%, rgba(200,168,78,0) 100%) !important;
}
#save [data-saver-card] p {
  flex: 1 1 auto !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin-bottom: 18px !important;
}
#save [data-saver-card] > div:last-child {
  font-family: ui-monospace, monospace !important;
  font-size: 10.5px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(200,168,78,0.18) !important;
}

/* ── GHANA STAT TILES · gold accent rail + better hierarchy + breathe pulse ── */
#context [data-rescue="ghana-stats"] > div {
  position: relative !important;
  padding: 18px 16px !important;
  overflow: hidden !important;
}
/* Top gold accent rail · subtle decoration */
#context [data-rescue="ghana-stats"] > div::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 16px !important; right: 16px !important;
  height: 2px !important;
  background: linear-gradient(90deg, rgba(200,168,78,0.65) 0%, rgba(200,168,78,0.10) 100%) !important;
}
/* Adinkra mark · subtle background watermark */
#context [data-rescue="ghana-stats"] > div::after {
  content: '' !important;
  position: absolute !important;
  bottom: -8px !important; right: -8px !important;
  width: 60px !important; height: 60px !important;
  background:
    radial-gradient(circle at center, transparent 35%, rgba(200,168,78,0.06) 38%, transparent 41%),
    radial-gradient(circle at center, transparent 55%, rgba(200,168,78,0.04) 58%, transparent 61%) !important;
  border: 1px solid rgba(200,168,78,0.10) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
}
#context [data-rescue="ghana-stats"] .counter {
  font-size: 32px !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
  line-height: 1 !important;
}

/* ── TRUST CARDS · sharper hierarchy + gold accent corner pip ── */
[data-rescue="trust-card"] {
  padding: 16px 18px !important;
}
[data-rescue="trust-card"]::before {
  content: '' !important;
  position: absolute !important;
  top: -1px !important; left: -1px !important;
  width: 18px !important; height: 18px !important;
  background:
    linear-gradient(135deg, rgba(200,168,78,0.45) 0%, rgba(200,168,78,0.10) 50%, transparent 100%) !important;
  border-top-left-radius: 12px !important;
  pointer-events: none !important;
}

/* ── TWO-PATHS CARDS · Adinkra mark + gold inner rail accent ── */
#two-paths .fade-up > div[style*="background: var(--bl-bg-card)"]::after,
#two-paths .fade-up[style*="grid"] > div::after {
  content: '' !important;
  position: absolute !important;
  top: 32px !important; right: 32px !important;
  width: 28px !important; height: 28px !important;
  border: 1px solid rgba(200,168,78,0.30) !important;
  border-radius: 50% !important;
  background:
    radial-gradient(circle at center, rgba(200,168,78,0.10) 0%, transparent 45%),
    radial-gradient(circle at center, transparent 50%, rgba(200,168,78,0.12) 53%, transparent 56%) !important;
  opacity: 0.6 !important;
  transition: opacity .3s ease, transform .3s ease !important;
  pointer-events: none !important;
}
#two-paths .fade-up > div[style*="background: var(--bl-bg-card)"]:hover::after,
#two-paths .fade-up[style*="grid"] > div:hover::after {
  opacity: 1 !important;
  transform: rotate(15deg) !important;
}
/* Vertical gold rail inside path cards · accent under heading */
#two-paths .fade-up > div h3,
#two-paths .fade-up[style*="grid"] > div h3 {
  position: relative !important;
  padding-bottom: 14px !important;
}
#two-paths .fade-up > div h3::after,
#two-paths .fade-up[style*="grid"] > div h3::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important; left: 0 !important;
  width: 40px !important; height: 2px !important;
  background: linear-gradient(90deg, #C8A84E 0%, rgba(200,168,78,0) 100%) !important;
}

/* ── ATTESTATIONS MARQUEE HEADER · single-line eyebrow chrome ──
   The /V2/ATTESTATIONS · LIVE FEED + LIVE/NODE chrome was wrapping
   awkwardly to 2 lines on narrow viewports. Force single-line + smaller
   font + tighter letter-spacing so the eyebrow stays a clean band. */
section [class*="attestation"] > div:first-child,
section [aria-label*="attestation"] > div:first-child {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
section [class*="attestation"] [class*="eyebrow"],
section [aria-label*="attestation"] [class*="eyebrow"] {
  font-size: 10px !important;
  letter-spacing: 0.12em !important;
  white-space: nowrap !important;
}
@media (max-width: 900px) {
  section [class*="attestation"] [class*="eyebrow"] {
    font-size: 9px !important;
    letter-spacing: 0.08em !important;
  }
}

/* ── FOUNDER PANEL · add Adinkra centre-mark watermark behind timeline ── */
[data-rescue="founder-timeline"] {
  position: relative !important;
}
[data-rescue="founder-timeline"]::before {
  content: '' !important;
  position: absolute !important;
  top: -8px !important; right: 0 !important;
  width: 48px !important; height: 48px !important;
  background:
    radial-gradient(circle at center, transparent 30%, rgba(200,168,78,0.10) 33%, transparent 36%),
    radial-gradient(circle at center, transparent 55%, rgba(200,168,78,0.06) 58%, transparent 61%) !important;
  border-radius: 50% !important;
  opacity: 0.4 !important;
  pointer-events: none !important;
}

/* ── NATIONAL-BACKDROP DELIMITER · slimmer, more institutional ── */
[data-rescue="context-eyebrow-bar"] {
  padding: 10px 16px !important;
  font-size: 10px !important;
  letter-spacing: 0.16em !important;
  line-height: 1.45 !important;
}

/* ── WHY-GOLD STAT TILES · large display number + accent rail ── */
[data-rescue="whygold-stats"] > div {
  position: relative !important;
}
[data-rescue="whygold-stats"] > div::before {
  content: '' !important;
  position: absolute !important;
  top: 8px !important; left: 16px !important; right: 16px !important;
  height: 1px !important;
  background: linear-gradient(90deg, rgba(200,168,78,0) 0%, rgba(200,168,78,0.30) 50%, rgba(200,168,78,0) 100%) !important;
}
/* END BESPOKE CARD CHARACTER 2026-05-26 v2 ──────────────────── */

/* ═══════════════════════════════════════════════════════════════
   CARD INTERIOR RHYTHM FIX · 2026-05-26 v3
   Inline list-style:none / padding:0 / margin:0 on <ul> elements
   inside Two Paths cards is stripped by CSP, leaving default browser
   bullets visible. Plus risk-disclosure card light-red treatment
   (same CSP victim). Plus proper baseline-aligned icon-row pattern
   for the check-mark lists.
   ═══════════════════════════════════════════════════════════ */

/* ── RESET defaults nuked by CSP on every card-interior ul ── */
#two-paths .fade-up > div ul,
#two-paths .fade-up[style*="grid"] > div ul,
#save [data-saver-card] ul,
[data-rescue="founder-panel"] ul,
[data-rescue="trust-card"] ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 22px !important;
}

/* ── Two Paths · checkmark rows · baseline-aligned icon pattern ── */
#two-paths .fade-up > div ul li,
#two-paths .fade-up[style*="grid"] > div ul li {
  display: grid !important;
  grid-template-columns: 22px 1fr !important;
  gap: 0 !important;
  align-items: baseline !important;
  font-size: 14.5px !important;
  line-height: 1.55 !important;
  color: #444 !important;
  padding: 10px 0 !important;
  border-bottom: 1px solid rgba(15,27,45,0.06) !important;
  margin: 0 !important;
}
#two-paths .fade-up > div ul li:last-child,
#two-paths .fade-up[style*="grid"] > div ul li:last-child {
  border-bottom: 0 !important;
}
#two-paths .fade-up > div ul li > span:first-child,
#two-paths .fade-up[style*="grid"] > div ul li > span:first-child {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #C8A84E !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 18px !important;
  height: 18px !important;
  background: rgba(200,168,78,0.10) !important;
  border: 1px solid rgba(200,168,78,0.35) !important;
  border-radius: 50% !important;
}
/* For-Institutions card uses muted accent — match it */
#two-paths .fade-up > div:nth-child(2) ul li > span:first-child,
#two-paths .fade-up[style*="grid"] > div:nth-child(2) ul li > span:first-child {
  color: #777 !important;
  background: rgba(15,27,45,0.04) !important;
  border-color: rgba(15,27,45,0.18) !important;
}

/* ── Two Paths card · interior padding + footer rhythm ── */
#two-paths .fade-up > div[style*="background: var(--bl-bg-card)"],
#two-paths .fade-up[style*="grid"] > div {
  padding: 32px 28px 24px !important;
  display: flex !important;
  flex-direction: column !important;
}
#two-paths .fade-up > div h3,
#two-paths .fade-up[style*="grid"] > div h3 {
  font-size: 21px !important;
  margin-bottom: 18px !important;
}
#two-paths .fade-up > div ul,
#two-paths .fade-up[style*="grid"] > div ul {
  flex: 1 1 auto !important;
  margin: 8px 0 22px !important;
}
#two-paths .fade-up > div .btn,
#two-paths .fade-up[style*="grid"] > div .btn,
#two-paths .fade-up > div a.btn,
#two-paths .fade-up[style*="grid"] > div a.btn {
  margin-top: auto !important;
  align-self: flex-start !important;
}

/* ── Saver card bottom tag-bar — properly designed footer separator ── */
#save [data-saver-card] > div:last-child {
  margin-top: 14px !important;
  padding: 12px 0 0 !important;
  border-top: 1px solid rgba(200,168,78,0.22) !important;
  position: relative !important;
}
#save [data-saver-card] > div:last-child::before {
  content: '' !important;
  position: absolute !important;
  top: -1px !important; left: 0 !important;
  width: 24px !important; height: 1px !important;
  background: #C8A84E !important;
}

/* ── GHANA TILES · add a horizontal mini-progress accent inside each tile ── */
#context [data-rescue="ghana-stats"] > div .counter {
  position: relative !important;
}
#context [data-rescue="ghana-stats"] > div .counter::after {
  content: '' !important;
  display: block !important;
  width: 36px !important;
  height: 2px !important;
  margin-top: 10px !important;
  background: linear-gradient(90deg, #C8A84E 0%, rgba(200,168,78,0.20) 100%) !important;
}

/* ═══════════════════════════════════════════════════════════════
   RISK DISCLOSURE CARD · light-red treatment · 2026-05-26
   Per Ano: needs to read as a proper card, light red. Inline styling
   on #risk-disclosure was CSP-stripped, leaving plain prose. This
   restores the card chrome via external rules.
   ═══════════════════════════════════════════════════════════ */
#risk-disclosure {
  margin-top: 28px !important;
  padding: 18px 22px !important;
  background: linear-gradient(135deg, rgba(255,110,127,0.06) 0%, rgba(255,110,127,0.03) 100%) !important;
  background-image:
    radial-gradient(ellipse at top left, rgba(255,110,127,0.08) 0%, transparent 50%),
    linear-gradient(135deg, #FFF5F4 0%, #FDEDEC 100%) !important;
  border: 1px solid rgba(255,110,127,0.28) !important;
  border-left: 3px solid #D9534F !important;
  border-radius: 10px !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,0.5) inset,
    0 2px 6px rgba(217,83,79,0.06),
    0 8px 24px -8px rgba(217,83,79,0.08) !important;
  font-family: ui-monospace, 'JetBrains Mono', monospace !important;
  font-size: 11px !important;
  line-height: 1.65 !important;
  color: #6B3F3D !important;
  position: relative !important;
  overflow: hidden !important;
}
#risk-disclosure::before {
  content: '⚠' !important;
  position: absolute !important;
  top: 14px !important;
  right: 18px !important;
  font-size: 18px !important;
  color: rgba(217,83,79,0.30) !important;
  line-height: 1 !important;
  pointer-events: none !important;
}
#risk-disclosure strong:first-child {
  display: block !important;
  margin-bottom: 8px !important;
  font-size: 10px !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: #B0413C !important;
  font-weight: 700 !important;
}

/* ── FOOTER · gold accent rails between columns + tighter rhythm ── */
.footer-grid > div {
  position: relative !important;
}
@media (min-width: 1025px) {
  .footer-grid > div:not(:first-child)::before {
    content: '' !important;
    position: absolute !important;
    top: 8px !important; bottom: 8px !important;
    left: -20px !important;
    width: 1px !important;
    background: linear-gradient(180deg,
      transparent 0%,
      rgba(200,168,78,0.20) 25%,
      rgba(200,168,78,0.20) 75%,
      transparent 100%) !important;
  }
}
.footer h4 {
  position: relative !important;
  padding-bottom: 6px !important;
}
.footer h4::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important; left: 0 !important;
  width: 18px !important; height: 1px !important;
  background: #C8A84E !important;
}
/* END CARD INTERIOR RHYTHM v3 + RISK CARD + FOOTER POLISH ──── */

/* ═══════════════════════════════════════════════════════════════
   INSTITUTIONAL READINESS ROADMAP · 2026-05-26
   Audit response · honest "shipped / in commissioning / queued"
   public disclosure of every institutional-readiness item.
   All hooks via data-rescue · CSP-safe.
   ═══════════════════════════════════════════════════════════ */

[data-rescue="iready-panel"] {
  margin-top: 48px !important;
  padding: 36px 40px !important;
  background: #FFFFFF !important;
  background-image: var(--pro-grain) !important;
  border: 1px solid #E0E0E0 !important;
  border-left: 4px solid #0F1B2D !important;
  border-radius: 16px !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,0.04) inset,
    0 2px 8px rgba(0,0,0,0.04),
    0 12px 36px rgba(0,0,0,0.06),
    0 32px 72px -20px rgba(15,27,45,0.10) !important;
}
[data-rescue="iready-head"] { margin-bottom: 24px !important; }
[data-rescue="iready-eyebrow"] {
  font-family: ui-monospace, monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: #0F1B2D !important;
  margin-bottom: 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
}
[data-rescue="iready-eyebrow"]::before {
  content: '' !important;
  display: inline-block !important;
  width: 24px !important; height: 1px !important;
  background: #C8A84E !important;
}
[data-rescue="iready-headline"] {
  font-family: Georgia, 'Source Serif Pro', serif !important;
  font-size: clamp(22px, 2.6vw, 32px) !important;
  color: #111111 !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  margin: 0 !important;
}
[data-rescue="iready-lede"] {
  font-family: Georgia, serif !important;
  font-size: 15px !important;
  color: #555 !important;
  line-height: 1.55 !important;
  margin: 14px 0 0 !important;
  max-width: 760px !important;
}

/* ── Legend (pill key) ── */
[data-rescue="iready-legend"] {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
  margin-bottom: 28px !important;
  padding: 14px 18px !important;
  background: #FAFAF7 !important;
  border: 1px solid #E8E5DC !important;
  border-radius: 10px !important;
  font-family: ui-monospace, monospace !important;
  font-size: 10.5px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: #666 !important;
}
[data-rescue="iready-legend"] > span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* ── Status pip · the single visual key ── */
[data-rescue="iready-pip"],
[data-rescue="iready-row-pip"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
}
[data-rescue="iready-pip"] {
  width: 20px !important;
  height: 20px !important;
  font-size: 11px !important;
}
/* Shipped · gold-green */
[data-rescue="iready-pip"][data-status="shipped"],
[data-rescue="iready-row-pip"][data-status="shipped"] {
  background: linear-gradient(135deg, #E8D48B 0%, #C8A84E 100%) !important;
  color: #0F1B2D !important;
  border: 1px solid rgba(200,168,78,0.50) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.4) inset, 0 2px 6px rgba(200,168,78,0.20) !important;
}
/* In flight · amber */
[data-rescue="iready-pip"][data-status="flight"],
[data-rescue="iready-row-pip"][data-status="flight"] {
  background: linear-gradient(135deg, #FFF5D6 0%, #E8B834 100%) !important;
  color: #5C3F0A !important;
  border: 1px solid rgba(232,184,52,0.55) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.5) inset, 0 2px 6px rgba(232,184,52,0.20) !important;
}
/* Queued · muted */
[data-rescue="iready-pip"][data-status="queued"],
[data-rescue="iready-row-pip"][data-status="queued"] {
  background: #F2EFE6 !important;
  color: #888 !important;
  border: 1px solid #DDD7C8 !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.5) inset !important;
}

/* ── Roadmap rows ── */
[data-rescue="iready-rows"] {
  display: flex !important;
  flex-direction: column !important;
}
[data-rescue="iready-row"] {
  display: grid !important;
  grid-template-columns: 40px 1fr auto !important;
  gap: 16px !important;
  align-items: center !important;
  padding: 16px 0 !important;
  border-bottom: 1px solid #EEE8DC !important;
  transition: background .2s ease !important;
}
[data-rescue="iready-row"]:last-child { border-bottom: 0 !important; }
[data-rescue="iready-row"]:hover {
  background: rgba(200,168,78,0.04) !important;
}
[data-rescue="iready-row-title"] {
  font-family: Georgia, serif !important;
  font-size: 15.5px !important;
  font-weight: 700 !important;
  color: #111 !important;
  line-height: 1.3 !important;
  margin-bottom: 4px !important;
}
[data-rescue="iready-row-sub"] {
  font-family: ui-monospace, monospace !important;
  font-size: 11.5px !important;
  color: #666 !important;
  line-height: 1.5 !important;
}
[data-rescue="iready-row-meta"] {
  font-family: ui-monospace, monospace !important;
  font-size: 10.5px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: #888 !important;
  white-space: nowrap !important;
  padding-left: 8px !important;
}

/* Row title left-accent · status-coloured */
[data-rescue="iready-row"][data-status="shipped"] [data-rescue="iready-row-title"] {
  position: relative !important;
  padding-left: 14px !important;
}
[data-rescue="iready-row"][data-status="shipped"] [data-rescue="iready-row-title"]::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important; top: 6px !important; bottom: 6px !important;
  width: 2px !important;
  background: linear-gradient(180deg, #C8A84E 0%, rgba(200,168,78,0.15) 100%) !important;
}

/* ── Foot · institutional posture + CTA ── */
[data-rescue="iready-foot"] {
  margin-top: 28px !important;
  padding-top: 22px !important;
  border-top: 1px solid #EEE8DC !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  align-items: center !important;
  justify-content: space-between !important;
}
[data-rescue="iready-cta"] {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 12px 22px !important;
  background: #0F1B2D !important;
  color: #F5F0E8 !important;
  font-family: ui-monospace, monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: transform .2s ease, background .2s ease !important;
}
[data-rescue="iready-cta"]:hover {
  transform: translateY(-1px) !important;
  background: #1A2A40 !important;
}

/* ── Narrow viewports: stack the meta + tighten row ── */
@media (max-width: 720px) {
  [data-rescue="iready-row"] {
    grid-template-columns: 32px 1fr !important;
    gap: 12px !important;
    padding: 14px 0 !important;
  }
  [data-rescue="iready-row-meta"] {
    grid-column: 2 / -1 !important;
    padding-left: 0 !important;
    margin-top: 4px !important;
  }
  [data-rescue="iready-panel"] { padding: 28px 22px !important; }
}

/* ── Reduced motion respect ── */
@media (prefers-reduced-motion: reduce) {
  [data-rescue="iready-row"]:hover,
  [data-rescue="iready-cta"]:hover { transform: none !important; }
}
/* END INSTITUTIONAL READINESS ROADMAP ──────────────────────── */

/* ═══════════════════════════════════════════════════════════════
   CSP-STRIPPED TEXT COLOR RECOVERY · 2026-05-26
   Inline `color: var(--bl-ink-mute)` and `color: var(--bl-ink-sub)`
   on the Ghana lede paragraph + framing span get nuked. Without
   them, text inherits body color (dark navy) which is invisible
   on the dark Ghana band. External rules restore proper colors.
   ═══════════════════════════════════════════════════════════ */

/* ── Ghana lede paragraph · text-pane child of ghana-outer ── */
#context [data-rescue="ghana-outer"] > div > p {
  font-family: ui-monospace, 'JetBrains Mono', monospace !important;
  font-size: 11.5px !important;
  color: rgba(245,240,232,0.60) !important;
  line-height: 1.6 !important;
  margin-top: 14px !important;
  max-width: 380px !important;
}
#context [data-rescue="ghana-outer"] > div > p strong {
  color: rgba(245,240,232,0.95) !important;
  font-weight: 700 !important;
}
/* Sources line at the bottom of the Ghana section · ensure same legibility */
#context > .wrap > p {
  color: rgba(245,240,232,0.55) !important;
  font-family: ui-monospace, monospace !important;
}

/* ── Framing block (light orientation strip) ·
   subtle-emphasis span inside the lede gets CSP-stripped too.
   Force the muted-grey subtle effect so the bold framing read survives. */
section[data-rescue="orientation-strip"] .wrap > div:last-child p > span {
  color: #666 !important;
}
/* The headline framing paragraph itself · ensure body color is dark ink on cream */
section[data-rescue="orientation-strip"] .wrap > div:last-child p {
  color: #111 !important;
}
section[data-rescue="orientation-strip"] .wrap > div:last-child .section-eyebrow {
  color: #C8A84E !important;
}
/* END CSP-STRIPPED TEXT COLOR RECOVERY ─────────────────────── */

/* ═══════════════════════════════════════════════════════════════
   DARK-REGISTER VAR BLEED FIX · 2026-05-26
   style.css defines --text (#F1F5F9 near-white) and --text-soft
   (#CBD5E1 light slate) for the original dark theme. Several
   modern light-body sections inherit these via element classes
   like .mid-cta-* and render invisible. This block forces proper
   light-body-legible colors via specific class overrides.
   ═══════════════════════════════════════════════════════════ */

/* Early Access · Mid-page CTA band */
.mid-cta-band {
  background: linear-gradient(180deg,
    rgba(244,196,48,0.04) 0%,
    rgba(244,196,48,0.08) 50%,
    rgba(244,196,48,0.04) 100%) !important;
  border-top: 1px solid rgba(244,196,48,0.22) !important;
  border-bottom: 1px solid rgba(244,196,48,0.22) !important;
}
.mid-cta-band .mid-cta-eyebrow {
  color: #C8A84E !important;
  opacity: 1 !important;
  font-family: ui-monospace, monospace !important;
  font-size: 10.5px !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
}
.mid-cta-band h3 {
  color: #0F1B2D !important;
  font-family: Georgia, 'Source Serif Pro', serif !important;
  font-weight: 700 !important;
  font-size: clamp(26px, 3.2vw, 38px) !important;
  line-height: 1.2 !important;
  letter-spacing: -0.01em !important;
}
.mid-cta-band .mid-cta-sub {
  color: #555 !important;
  font-family: Georgia, serif !important;
  font-size: 16px !important;
  line-height: 1.6 !important;
  max-width: 540px !important;
  margin: 0 !important;
}
.mid-cta-actions .btn.btn-primary {
  background: linear-gradient(135deg, #C8A84E 0%, #B8923C 100%) !important;
  color: #0F1B2D !important;
  border: 0 !important;
  box-shadow: 0 4px 14px rgba(200,168,78,0.25), 0 1px 0 rgba(255,255,255,0.4) inset !important;
}
.mid-cta-actions .btn.btn-ghost {
  color: #0F1B2D !important;
  border-color: rgba(15,27,45,0.45) !important;
}

/* Defensive · any element using dark-register text vars inside
   a body-light section should fall back to legible dark colors.
   Targets via inline-style substring (safe — only catches actual usage). */
section.body-light [style*="color: var(--text-soft)"],
section.body-light [style*="color:var(--text-soft)"] {
  color: #555 !important;
}
section.body-light [style*="color: var(--text)"]:not([style*="--text-"]),
section.body-light [style*="color:var(--text)"]:not([style*="--text-"]) {
  color: #0F1B2D !important;
}
/* END DARK-REGISTER VAR BLEED FIX ──────────────────────────── */

/* ═══════════════════════════════════════════════════════════════
   COMPREHENSIVE CSP-STRIP COLOR BLEED DEFENSIVE SWEEP · 2026-05-26
   Catches every inline `color: var(--bl-ink-*)` or `color: var(--text*)`
   substring across both light AND dark section registers, forcing a
   legible color regardless of which register the element ends up in.
   Last-resort defensive layer behind all specific overrides.
   ═══════════════════════════════════════════════════════════ */

/* ── DARK sections · bl-ink-* vars need cream/light recovery ── */
#save [style*="color: var(--bl-ink-mute)"],
#save [style*="color:var(--bl-ink-mute)"],
#context [style*="color: var(--bl-ink-mute)"],
#context [style*="color:var(--bl-ink-mute)"] {
  color: rgba(245,240,232,0.62) !important;
}
#save [style*="color: var(--bl-ink-sub)"],
#save [style*="color:var(--bl-ink-sub)"],
#context [style*="color: var(--bl-ink-sub)"],
#context [style*="color:var(--bl-ink-sub)"] {
  color: rgba(245,240,232,0.85) !important;
}
#save [style*="color: var(--bl-ink)"]:not([style*="--bl-ink-"]),
#save [style*="color:var(--bl-ink)"]:not([style*="--bl-ink-"]),
#context [style*="color: var(--bl-ink)"]:not([style*="--bl-ink-"]),
#context [style*="color:var(--bl-ink)"]:not([style*="--bl-ink-"]) {
  color: #F5F0E8 !important;
}

/* ── LIGHT body-light sections · text-soft / text vars need dark recovery ── */
section.body-light [style*="color: var(--text-soft)"],
section.body-light [style*="color:var(--text-soft)"],
.body-light [style*="color: var(--text-soft)"],
.body-light [style*="color:var(--text-soft)"] {
  color: #555 !important;
}
section.body-light [style*="color: var(--text)"]:not([style*="--text-"]),
section.body-light [style*="color:var(--text)"]:not([style*="--text-"]),
.body-light [style*="color: var(--text)"]:not([style*="--text-"]),
.body-light [style*="color:var(--text)"]:not([style*="--text-"]) {
  color: #0F1B2D !important;
}

/* ── LIGHT body-light sections · bl-ink-* vars need PROPER dark recovery
   (CSP-strip can leave these inheriting wrong base color in cascade) ── */
section.body-light [style*="color: var(--bl-ink-mute)"],
section.body-light [style*="color:var(--bl-ink-mute)"] {
  color: #888 !important;
}
section.body-light [style*="color: var(--bl-ink-sub)"],
section.body-light [style*="color:var(--bl-ink-sub)"] {
  color: #555 !important;
}
section.body-light [style*="color: var(--bl-ink)"]:not([style*="--bl-ink-"]),
section.body-light [style*="color:var(--bl-ink)"]:not([style*="--bl-ink-"]) {
  color: #0F1B2D !important;
}

/* ── Gold color recovery · widely used, low-risk to force ── */
[style*="color: var(--bl-gold)"],
[style*="color:var(--bl-gold)"] {
  color: #C8A84E !important;
}
[style*="color: var(--gold)"],
[style*="color:var(--gold)"] {
  color: #C8A84E !important;
}

/* ── Save section · checkmark icons in <li> spans (CSP-stripped color) ── */
#save li > span[style*="color"] {
  color: #C8A84E !important;
}

/* ── Designed-for rail labels (left "Designed for" + right "Integration roadmap") ── */
[data-rescue="designed-rail"] > span:first-child,
[data-rescue="designed-rail"] > span:last-child {
  color: rgba(245,240,232,0.70) !important;
  font-family: ui-monospace, monospace !important;
}

/* ── Footer · risk disclosure styling defensive ── */
.footer #risk-disclosure {
  /* Already styled above — this just ensures cascade doesn't lose it */
  color: #6B3F3D !important;
}

/* ── Two Paths · inner For Savers / For Institutions eyebrow ── */
#two-paths .fade-up > div > div:first-child,
#two-paths .fade-up[style*="grid"] > div > div:first-child {
  font-family: ui-monospace, monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  margin-bottom: 14px !important;
}
#two-paths .fade-up > div:nth-child(1) > div:first-child,
#two-paths .fade-up[style*="grid"] > div:nth-child(1) > div:first-child {
  color: #C8A84E !important;
}
#two-paths .fade-up > div:nth-child(2) > div:first-child,
#two-paths .fade-up[style*="grid"] > div:nth-child(2) > div:first-child {
  color: #888 !important;
}
/* END COMPREHENSIVE CSP-STRIP COLOR BLEED DEFENSIVE SWEEP ──── */

/* ═══════════════════════════════════════════════════════════════
   ROADMAP SHARPENING + GSU PRE-PRODUCTION TAG · 2026-05-26
   Adds competitive benchmark callout in the Roadmap panel,
   plus a DEMONSTRATION DATA tag on the attestation marquee so
   no auditor reads the live feed as a production reserve claim.
   ═══════════════════════════════════════════════════════════ */

/* Competitive benchmark band inside the Roadmap panel */
[data-rescue="iready-benchmark"] {
  display: block !important;
  margin-bottom: 22px !important;
  padding: 14px 18px !important;
  background: linear-gradient(135deg, rgba(15,27,45,0.04) 0%, rgba(200,168,78,0.04) 100%) !important;
  background-image:
    radial-gradient(ellipse at top right, rgba(200,168,78,0.06) 0%, transparent 60%),
    linear-gradient(135deg, rgba(15,27,45,0.03) 0%, rgba(200,168,78,0.04) 100%) !important;
  border: 1px solid rgba(15,27,45,0.10) !important;
  border-left: 3px solid #0F1B2D !important;
  border-radius: 8px !important;
  font-family: Georgia, serif !important;
  font-size: 13.5px !important;
  line-height: 1.55 !important;
  color: #333 !important;
}
[data-rescue="iready-benchmark"] strong {
  color: #111 !important;
  font-weight: 700 !important;
}

/* Roadmap row sub-line · allow inline <strong> emphasis to render boldly */
[data-rescue="iready-row-sub"] strong {
  color: #111 !important;
  font-weight: 700 !important;
}

/* GSU pre-production tag · sits inline with the ticker title */
[data-rescue="demo-tag"] {
  display: inline-block !important;
  margin-left: 12px !important;
  padding: 2px 8px !important;
  background: rgba(232,184,52,0.18) !important;
  border: 1px solid rgba(232,184,52,0.55) !important;
  border-radius: 4px !important;
  font-family: ui-monospace, monospace !important;
  font-size: 9px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  color: #E8B834 !important;
  vertical-align: middle !important;
}
@media (max-width: 900px) {
  [data-rescue="demo-tag"] {
    display: block !important;
    margin: 4px 0 0 !important;
    width: max-content !important;
  }
}
/* END ROADMAP SHARPENING + GSU PRE-PRODUCTION TAG ───────────── */

/* ═══════════════════════════════════════════════════════════════
   DEMO-TAG PROMINENCE + EXPLICIT PRE-PRODUCTION NOTE · 2026-05-26
   The inline DEMONSTRATION DATA tag was too small to register.
   Bump prominence + add explicit visible note under the marquee
   so no auditor reads the live feed as production reserve claim.
   ═══════════════════════════════════════════════════════════ */

[data-rescue="demo-tag"] {
  font-size: 10.5px !important;
  padding: 3px 10px !important;
  background: rgba(232,184,52,0.22) !important;
  border: 1px solid rgba(232,184,52,0.70) !important;
  color: #FFD46B !important;
  margin-left: 14px !important;
  letter-spacing: 0.16em !important;
  font-weight: 800 !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3) !important;
}

[data-rescue="preprod-note"] {
  display: block !important;
  margin: 18px auto 0 !important;
  padding: 12px 18px !important;
  max-width: 960px !important;
  background: linear-gradient(135deg, rgba(232,184,52,0.08) 0%, rgba(15,27,45,0.20) 100%) !important;
  border: 1px solid rgba(232,184,52,0.30) !important;
  border-left: 3px solid #E8B834 !important;
  border-radius: 8px !important;
  font-family: ui-monospace, 'JetBrains Mono', monospace !important;
  font-size: 12px !important;
  line-height: 1.6 !important;
  color: rgba(245,240,232,0.88) !important;
  text-align: center !important;
}
[data-rescue="preprod-note"] strong {
  color: #FFD46B !important;
  font-weight: 700 !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
}
[data-rescue="preprod-note"] em {
  color: #FFEFA8 !important;
  font-style: normal !important;
  font-weight: 600 !important;
}
[data-rescue="preprod-note"] a {
  color: #FFD46B !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(255,212,107,0.4) !important;
  text-underline-offset: 2px !important;
}
[data-rescue="preprod-note"] a:hover {
  text-decoration-color: #FFD46B !important;
}
/* END DEMO-TAG PROMINENCE + PRE-PROD NOTE ────────────────────── */

/* ─────────────────────────────────────────────────────────────────
   Netlify honeypot · CSP-strip rescue · 2026-05-26
   The <p style="display:none"> wrapping the "Bot field:" input was
   CSP-stripped, making the honeypot visible to real users. Now
   uses <p hidden aria-hidden="true" class="netlify-honeypot">
   plus this class as belt-and-suspenders against any later style.
───────────────────────────────────────────────────────────────── */
.netlify-honeypot,
.netlify-honeypot * {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* ─────────────────────────────────────────────────────────────────
   Kill duplicate #mscStickyPill · 2026-05-26
   The inline mobile-consumer "JOIN $SOV WAITLIST" pill was overlapping
   the trinity epigraph English gloss and competing with the primary
   #mobileStickyCta. One floating CTA is the right answer. The bottom
   sticky already has 119-ahead social proof + footer-aware hide logic
   so it's the keeper.
───────────────────────────────────────────────────────────────── */
#mscStickyPill,
.msc-sticky-pill {
  display: none !important;
}

/* ─────────────────────────────────────────────────────────────────
   Institutional Readiness Roadmap panel · audit-anchored · 2026-05-27
   Mirrors the EcoVent_Africa_Institutional_Audit_Report.pdf
   Phase 1/2/3 structure with status badges (shipped / commissioning /
   queued). Pure class-based styling (CSP-immune).
───────────────────────────────────────────────────────────────── */

[data-rescue="iready-panel"] {
  margin-top: 48px;
  padding: 36px 40px;
  background: #FFFFFF;
  border: 1px solid #E0E0E0;
  border-left: 4px solid #C8A84E;
  border-radius: 14px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

[data-rescue="iready-head"] {
  margin-bottom: 28px;
  padding-bottom: 24px;
  border-bottom: 1px solid #EEE9D8;
}

[data-rescue="iready-eyebrow"] {
  font-family: var(--ff-mono, 'JetBrains Mono', monospace);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #C8A84E;
  margin-bottom: 10px;
}

[data-rescue="iready-headline"] {
  font-family: var(--ff-serif, Georgia, serif);
  font-size: clamp(22px, 2.6vw, 30px);
  color: #111111;
  line-height: 1.2;
  margin: 0 0 14px 0;
  font-weight: 400;
}

[data-rescue="iready-headline"] strong {
  font-weight: 700;
  color: #C8A84E;
}

[data-rescue="iready-lede"] {
  font-family: var(--ff-serif, Georgia, serif);
  font-size: 15px;
  color: #555555;
  line-height: 1.6;
  margin: 0;
  max-width: 760px;
}

[data-rescue="iready-lede"] em {
  font-style: italic;
  color: #444;
}

[data-rescue="iready-phase"] {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px dashed #E8E5DC;
}

[data-rescue="iready-phase"]:first-of-type {
  border-top: none;
  padding-top: 0;
  margin-top: 0;
}

[data-rescue="iready-phase-head"] {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 14px;
  margin-bottom: 18px;
}

[data-rescue="iready-phase-tag"] {
  font-family: var(--ff-mono, 'JetBrains Mono', monospace);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #C8A84E;
  font-weight: 600;
  padding: 4px 10px;
  background: rgba(200, 168, 78, 0.10);
  border: 1px solid rgba(200, 168, 78, 0.32);
  border-radius: 4px;
}

[data-rescue="iready-phase-name"] {
  font-family: var(--ff-serif, Georgia, serif);
  font-size: 17px;
  color: #222;
  font-weight: 700;
  line-height: 1.3;
}

[data-rescue="iready-list"] {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* Override legacy iready-row 3-column rule at L2114 with !important */
[data-rescue="iready-panel"] [data-rescue="iready-row"] {
  display: grid !important;
  grid-template-columns: minmax(170px, max-content) minmax(90px, max-content) 1fr minmax(0, max-content) !important;
  column-gap: 18px !important;
  row-gap: 6px !important;
  align-items: center !important;
  padding: 14px 18px !important;
  background: #FAFAF7 !important;
  border: 1px solid #EFECDC !important;
  border-bottom: 1px solid #EFECDC !important;
  border-radius: 8px !important;
  font-family: var(--ff-serif, Georgia, serif) !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
}

[data-rescue="iready-panel"] [data-rescue="iready-row"][data-status="shipped"] {
  background: rgba(74, 222, 128, 0.06) !important;
  border-color: rgba(74, 222, 128, 0.32) !important;
}

[data-rescue="iready-panel"] [data-rescue="iready-row"][data-status="commissioning"] {
  background: rgba(200, 168, 78, 0.06) !important;
  border-color: rgba(200, 168, 78, 0.40) !important;
}

[data-rescue="iready-panel"] [data-rescue="iready-row"][data-status="queued"] {
  background: #FAFAF7 !important;
  border-color: #EFECDC !important;
}

[data-rescue="iready-panel"] [data-rescue="iready-row"]:hover {
  background: rgba(200, 168, 78, 0.04) !important;
}

[data-rescue="iready-panel"] [data-rescue="iready-status"] {
  font-family: var(--ff-mono, 'JetBrains Mono', monospace) !important;
  font-size: 10px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  padding: 5px 10px !important;
  border-radius: 3px !important;
  white-space: nowrap !important;
  text-align: center !important;
  display: inline-block !important;
  justify-self: start !important;
}

[data-rescue="iready-panel"] [data-status="shipped"] [data-rescue="iready-status"] {
  color: #1F7A3F !important;
  background: rgba(74, 222, 128, 0.18) !important;
}

[data-rescue="iready-panel"] [data-status="commissioning"] [data-rescue="iready-status"] {
  color: #8B6E2A !important;
  background: rgba(200, 168, 78, 0.22) !important;
}

[data-rescue="iready-panel"] [data-status="queued"] [data-rescue="iready-status"] {
  color: #888 !important;
  background: rgba(0, 0, 0, 0.04) !important;
}

[data-rescue="iready-panel"] [data-rescue="iready-priority"] {
  font-family: var(--ff-mono, 'JetBrains Mono', monospace) !important;
  font-size: 11px !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase !important;
  color: #888 !important;
  white-space: nowrap !important;
  justify-self: start !important;
}

[data-rescue="iready-panel"] [data-rescue="iready-action"] {
  color: #222 !important;
  font-size: 14.5px !important;
  line-height: 1.45 !important;
}

[data-rescue="iready-panel"] [data-rescue="iready-action"] a {
  color: #8B6E2A !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(139, 110, 42, 0.4) !important;
}

[data-rescue="iready-panel"] [data-rescue="iready-action"] a:hover {
  color: #5C4810 !important;
  text-decoration-color: rgba(139, 110, 42, 0.9) !important;
}

[data-rescue="iready-panel"] [data-rescue="iready-standards"] {
  font-family: var(--ff-mono, 'JetBrains Mono', monospace) !important;
  font-size: 10.5px !important;
  letter-spacing: 0.05em !important;
  color: #888 !important;
  white-space: nowrap !important;
  text-align: right !important;
}

[data-rescue="iready-foot"] {
  margin-top: 28px;
  padding-top: 22px;
  border-top: 1px solid #EEE9D8;
}

[data-rescue="iready-foot-line"] {
  font-family: var(--ff-serif, Georgia, serif);
  font-size: 14px;
  color: #555;
  line-height: 1.6;
  margin: 0;
  max-width: 760px;
}

[data-rescue="iready-foot-strong"] {
  color: #111;
  font-weight: 700;
  margin-right: 4px;
}

[data-rescue="iready-foot-line"] a {
  color: #8B6E2A;
  text-decoration: underline;
  text-decoration-color: rgba(139, 110, 42, 0.4);
}

/* Mobile · stack columns vertically */
@media (max-width: 760px) {
  [data-rescue="iready-panel"] {
    padding: 28px 22px;
    margin-top: 32px;
  }
  [data-rescue="iready-row"] {
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 14px 14px;
  }
  [data-rescue="iready-status"] {
    justify-self: start;
  }
  [data-rescue="iready-priority"] {
    font-size: 10px;
  }
  [data-rescue="iready-standards"] {
    text-align: left;
    font-size: 10px;
    padding-top: 4px;
    border-top: 1px dashed rgba(0,0,0,0.06);
    margin-top: 4px;
  }
  [data-rescue="iready-phase-head"] {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}

/* ─────────────────────────────────────────────────────────────────
   Hero inline email capture · v3 · 2026-05-27
   v3 changes: widened to 560px (placeholder no longer truncates),
   added a small gold-mono eyebrow with pulse dot for context, gave
   the input a subtle gold underline glow so it has more presence
   without going back to the heavy card chrome. Order:7 keeps it
   slotted after CTAs in the hero flex sequence.
───────────────────────────────────────────────────────────────── */
[data-rescue="hero-capture"] {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 10px !important;
  max-width: 560px !important;
  width: 100% !important;
  margin: 24px auto 0 !important;
  padding: 0 16px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  order: 7 !important;
}

[data-rescue="hero-capture-eyebrow"] {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: 'JetBrains Mono', ui-monospace, monospace !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.20em !important;
  text-transform: uppercase !important;
  color: #C8A84E !important;
}

[data-rescue="hero-capture-dot"] {
  flex: 0 0 auto !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #C8A84E !important;
  box-shadow: 0 0 8px rgba(200, 168, 78, 0.70) !important;
  animation: heroCaptureDot 2.4s ease-in-out infinite !important;
}

@keyframes heroCaptureDot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: 0.55; transform: scale(0.85); }
}

@media (prefers-reduced-motion: reduce) {
  [data-rescue="hero-capture-dot"] { animation: none !important; }
}

[data-rescue="hero-capture-row"] {
  display: flex !important;
  flex-direction: row !important;
  align-items: stretch !important;
  gap: 8px !important;
  width: 100% !important;
}

[data-rescue="hero-capture-input"] {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  padding: 13px 18px !important;
  font-family: 'JetBrains Mono', ui-monospace, monospace !important;
  font-size: 13.5px !important;
  color: #F5F0E8 !important;
  background: rgba(20, 31, 48, 0.55) !important;
  border: 1px solid rgba(200, 168, 78, 0.28) !important;
  border-radius: 99px !important;
  outline: none !important;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.22),
    0 0 0 0 rgba(200, 168, 78, 0) !important;
}

[data-rescue="hero-capture-input"]::placeholder {
  color: rgba(245, 240, 232, 0.40) !important;
  letter-spacing: 0.04em !important;
}

[data-rescue="hero-capture-input"]:focus {
  border-color: rgba(244, 212, 112, 0.70) !important;
  background: rgba(20, 31, 48, 0.75) !important;
  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.30),
    0 0 0 3px rgba(200, 168, 78, 0.14) !important;
}

[data-rescue="hero-capture-submit"] {
  flex: 0 0 auto !important;
  padding: 13px 22px !important;
  font-family: 'JetBrains Mono', ui-monospace, monospace !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: #0F1B2D !important;
  background: linear-gradient(135deg, #F4D470 0%, #C8A84E 100%) !important;
  border: none !important;
  border-radius: 99px !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: transform .12s ease, filter .12s ease, box-shadow .12s ease !important;
  box-shadow:
    0 6px 16px rgba(0, 0, 0, 0.28),
    0 0 18px rgba(244, 212, 112, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.30) !important;
}

[data-rescue="hero-capture-submit"]:hover {
  filter: brightness(1.06) !important;
  transform: translateY(-1px) !important;
  box-shadow:
    0 8px 20px rgba(0, 0, 0, 0.32),
    0 0 22px rgba(244, 212, 112, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.30) !important;
}

[data-rescue="hero-capture-submit"]:active {
  transform: translateY(0) scale(.985) !important;
}

/* Hide the legacy label + foot text (kept for backward compat) */
[data-rescue="hero-capture-label"],
[data-rescue="hero-capture-foot"] {
  display: none !important;
}

@media (max-width: 540px) {
  [data-rescue="hero-capture"] {
    margin: 18px auto 0 !important;
    padding: 0 20px !important;
  }
  [data-rescue="hero-capture-eyebrow"] {
    font-size: 9.5px !important;
    letter-spacing: 0.18em !important;
  }
  [data-rescue="hero-capture-row"] {
    flex-direction: column !important;
    gap: 8px !important;
  }
  [data-rescue="hero-capture-input"] {
    padding: 12px 16px !important;
    font-size: 13px !important;
  }
  [data-rescue="hero-capture-submit"] {
    width: 100% !important;
    padding: 13px 20px !important;
  }
}

/* ─────────────────────────────────────────────────────────────────
   Cookie posture badge · CRO audit response · 2026-05-27
   Auditor flagged "no visible cookie consent banner" — we don't use
   cookies (Plausible is privacy-first). Rather than show a useless
   consent banner, publish the posture explicitly. Closes the GDPR
   visibility gap without adding friction to the conversion flow.
───────────────────────────────────────────────────────────────── */
[data-rescue="cookie-posture"] {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  margin: 20px auto 16px !important;
  padding: 12px 18px !important;
  max-width: 760px !important;
  background: rgba(74, 222, 128, 0.05) !important;
  border: 1px solid rgba(74, 222, 128, 0.18) !important;
  border-radius: 8px !important;
  font-family: 'JetBrains Mono', ui-monospace, monospace !important;
  font-size: 11px !important;
  line-height: 1.55 !important;
  color: rgba(75, 55, 30, 0.72) !important;
}

[data-rescue="cookie-posture-dot"] {
  flex: 0 0 auto !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #4ade80 !important;
  box-shadow: 0 0 8px rgba(74, 222, 128, 0.55) !important;
}

[data-rescue="cookie-posture-text"] {
  flex: 1 1 auto !important;
  text-align: center !important;
}

[data-rescue="cookie-posture-text"] a {
  color: #8B6E2A !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(139, 110, 42, 0.4) !important;
  white-space: nowrap !important;
}

[data-rescue="cookie-posture-text"] a:hover {
  color: #5C4810 !important;
  text-decoration-color: rgba(139, 110, 42, 0.9) !important;
}

@media (max-width: 540px) {
  [data-rescue="cookie-posture"] {
    margin: 16px 16px 12px !important;
    padding: 10px 14px !important;
    font-size: 10.5px !important;
  }
}

/* ─────────────────────────────────────────────────────────────────
   Hero "Built On" trust strip · CRO audit response · 2026-05-27
   Surfaces the technical-infrastructure partners (Polygon, Chainlink,
   OpenZeppelin, Gnosis Safe, GitHub) above the fold rather than
   buried in a mid-page Built-On grid. Auditor's medium-term #5.
───────────────────────────────────────────────────────────────── */
[data-rescue="hero-trust-strip"] {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 8px 10px !important;
  margin: 18px auto 0 !important;
  padding: 0 16px !important;
  max-width: 760px !important;
}

[data-rescue="hero-trust-eyebrow"] {
  font-family: 'JetBrains Mono', ui-monospace, monospace !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.20em !important;
  text-transform: uppercase !important;
  color: rgba(245, 240, 232, 0.42) !important;
  padding-right: 4px !important;
}

[data-rescue="hero-trust-chip"] {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 7px 12px !important;
  background: rgba(20, 31, 48, 0.42) !important;
  border: 1px solid rgba(200, 168, 78, 0.20) !important;
  border-radius: 99px !important;
  font-family: 'JetBrains Mono', ui-monospace, monospace !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  color: rgba(245, 240, 232, 0.78) !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: border-color .18s ease, color .18s ease, background .18s ease, transform .12s ease !important;
}

[data-rescue="hero-trust-chip"]:hover {
  color: #F4D470 !important;
  border-color: rgba(200, 168, 78, 0.55) !important;
  background: rgba(200, 168, 78, 0.08) !important;
  transform: translateY(-1px) !important;
}

[data-rescue="hero-trust-glyph"] {
  color: #C8A84E !important;
  font-size: 12px !important;
  line-height: 1 !important;
  opacity: 0.85 !important;
}

@media (max-width: 540px) {
  [data-rescue="hero-trust-strip"] {
    gap: 6px 8px !important;
    margin-top: 14px !important;
  }
  [data-rescue="hero-trust-eyebrow"] {
    width: 100% !important;
    text-align: center !important;
    padding-right: 0 !important;
    margin-bottom: 4px !important;
  }
  [data-rescue="hero-trust-chip"] {
    padding: 6px 10px !important;
    font-size: 10.5px !important;
  }
}

/* ─────────────────────────────────────────────────────────────────
   Hero flex-order patch · 2026-05-27
   The hero uses CSS order: to sequence elements visually. Items
   without an explicit order default to 0 and render BEFORE the
   headline. Lock the rotator + trust-strip + form into their
   intended slots after the CTAs.
───────────────────────────────────────────────────────────────── */
.cine-partnership          { order: 8 !important; }
[data-rescue="hero-trust-strip"] { order: 9 !important; }
/* hero-capture already set to order:7 in its own rule (above CTAs) */

/* ─────────────────────────────────────────────────────────────────
   #save section-head centering fix · 2026-05-28
   Inline text-align/margin/max-width were CSP-stripped from the
   section-head block. Externalised here so the centering survives.
───────────────────────────────────────────────────────────────── */
#save .section-head {
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}
#save .section-head .section-eyebrow,
#save .section-head .section-eyebrow-flow {
  text-align: center !important;
  justify-content: center !important;
}
#save .section-head h2 {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
#save .section-head > p,
#save .section-head .section-head-intro {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 620px !important;
}
#save [data-rescue="saver-epigraph"] {
  margin: 32px auto 0 !important;
  max-width: 520px !important;
  text-align: center !important;
}
#save [data-rescue="saver-epigraph"] > div[aria-hidden] {
  text-align: center !important;
  color: #C8A84E !important;
  font-family: var(--ff-mono, ui-monospace, monospace) !important;
  font-size: 14px !important;
  letter-spacing: 0.5em !important;
  opacity: 0.65 !important;
}
#save [data-rescue="saver-epigraph"] p {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
#save [data-rescue="saver-epigraph"] p[lang="ak"] {
  font-style: italic !important;
  color: #F5F0E8 !important;
  margin-top: 14px !important;
  line-height: 1.4 !important;
}

/* ─────────────────────────────────────────────────────────────────
   Gold-on-dark contrast bump · Z.ai WCAG 1.4.3 AA fix · 2026-05-28
   #F4D470 on #0F1B2D ≈ 3.8:1 (fails AA). #FFEFA8 ≈ 14.7:1 (passes AAA).
   Scoped to dark-overridden sections so cream contexts are unaffected.
───────────────────────────────────────────────────────────────── */
#save .section-eyebrow,
#save .section-eyebrow-flow,
#save .section-head .section-eyebrow,
#save [data-saver-num],
#save [data-saver-card] div:last-child {
  color: #FFEFA8 !important;
}
/* Throne meta strong tags on dark hero/throne treatments */
.body-light .stage-void .throne-meta strong,
.body-light .stage-void.throne-meta strong,
#save .throne-meta strong {
  color: #FFEFA8 !important;
}