/* ══════════════════════════════════════════════════════════════
   NEO — LIGHT THEME
   An override layer on top of neo-styles.css, scoped to
   body.theme-light, so both versions share one source of truth for
   layout and behaviour. Only surface, ink and border values change.

   Deliberate exception: the photo-led chapters (#horizons, #story,
   #discipline) stay dark. Those sections are full-bleed photography
   with type over it — forcing them light would wash the images out
   and cost legibility. The page reads as a light document with dark
   cinematic interludes, which is a rhythm, not an inconsistency.
   ══════════════════════════════════════════════════════════════ */

body.theme-light{
  --bg:#FBF9FD;
  --bg-2:#F3EEF8;
  --ink:#1B0D26;
  --ink-soft:#5C4A70;
  --line:#E5DBF0;
  --surface:#FFFFFF;
  --surface-2:#F7F3FB;
  --lead:#8A79A0;
  --nc-magenta-ink:#8D2341;
  background:
    radial-gradient(ellipse 90% 60% at 50% 0%, #F1E7FA 0%, transparent 58%),
    linear-gradient(180deg,#FBF9FD 0%,#F3EEF8 100%);
  background-attachment:fixed;
  color:var(--ink);
}

/* ── Nav ─────────────────────────────────────────────────────── */
body.theme-light nav.top .nav-links a{ color:#4B3A60; }
body.theme-light nav.top .nav-links a:hover,
body.theme-light nav.top .nav-links a.active{ color:var(--nc-magenta); }
body.theme-light .nav-mark{ background:rgba(255,255,255,0.86); border-color:var(--line); box-shadow:0 2px 10px rgba(27,13,38,0.08); }
body.theme-light .neo-logo img{ filter:none; }
body.theme-light #scroll-progress{ background:rgba(27,13,38,0.07); }

/* ── Type ────────────────────────────────────────────────────── */
body.theme-light h1.hero-h,
body.theme-light .payout-h,
body.theme-light .why-card h3,
body.theme-light .impact-card h3,
body.theme-light .news-card h3{ color:var(--ink); }
body.theme-light h2.section-h2,
body.theme-light .why-stage h3{ color:var(--lead); }
body.theme-light h2.section-h2 .accent,
body.theme-light h2.section-h2 .accent .w,
body.theme-light .section-head h2 .accent{ color:var(--ink); }
body.theme-light .section-lead,
body.theme-light .hero-sub,
body.theme-light .why-card p,
body.theme-light .impact-card p,
body.theme-light .news-card p,
body.theme-light .payout-copy p{ color:var(--ink-soft); }
body.theme-light .wc-stats .n,
body.theme-light .stat .n,
body.theme-light .hero-meta .item .n{ color:var(--ink); }
body.theme-light .wc-stats .l,
body.theme-light .news-meta,
body.theme-light .ic-kicker{ color:var(--ink-soft); }

/* ── Buttons ─────────────────────────────────────────────────── */
body.theme-light .btn-ghost{
  color:var(--ink); border-color:var(--line); background:#fff;
  box-shadow:0 1px 2px rgba(27,13,38,0.05);
}
body.theme-light .btn-ghost:hover{ background:var(--surface-2); border-color:var(--nc-magenta); }
body.theme-light .btn-primary{ background:var(--nc-magenta-ink); color:#fff; box-shadow:0 2px 8px rgba(246,68,119,0.22); }
body.theme-light .btn-primary:hover{ background:#6A1830; box-shadow:0 6px 18px rgba(246,68,119,0.26); }

/* ── Cards & surfaces ────────────────────────────────────────── */
body.theme-light .why-card,
body.theme-light .impact-card,
body.theme-light .news-card,
body.theme-light .member,
body.theme-light .why-vis,
body.theme-light .step-card-v2{
  background:var(--surface);
  border-color:var(--line);
  box-shadow:0 1px 2px rgba(27,13,38,0.04), 0 8px 24px rgba(27,13,38,0.04);
}
body.theme-light .why-card:hover,
body.theme-light .impact-card:hover,
body.theme-light .news-card:hover{
  background:#fff; border-color:var(--nc-magenta);
  box-shadow:0 2px 4px rgba(27,13,38,0.05), 0 16px 40px rgba(27,13,38,0.09);
}
body.theme-light .wc-icon{
  background:var(--surface-2); border-color:var(--line); color:var(--nc-magenta);
}
body.theme-light .wc-stats,
body.theme-light .news-card .news-body{ border-color:var(--line); }

/* ── Corridor ticker ─────────────────────────────────────────── */
body.theme-light .corridor-strip{ border-color:var(--line); }
body.theme-light .cr-item{ color:var(--ink-soft); }
body.theme-light .cr-label{ color:var(--ink-soft); }
body.theme-light .cr-label b{ color:var(--ink); }
body.theme-light .cr-marquee{
  mask-image:linear-gradient(90deg, transparent, #000 24px, #000 calc(100% - 40px), transparent);
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 24px, #000 calc(100% - 40px), transparent);
}

/* ── Payout finder ───────────────────────────────────────────── */
body.theme-light #payout-finder{
  background:#F0E8F8 !important;
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
body.theme-light .pf-field input{
  background:#fff; border-color:var(--line); color:var(--ink);
}
body.theme-light .pf-field input::placeholder{ color:#9C8CAF; }
body.theme-light .pf-field input:focus{ background:#fff; border-color:var(--nc-magenta); }

/* ── Testimonials ────────────────────────────────────────────── */
body.theme-light .review-slide,
body.theme-light .review-stage{ color:var(--ink); }
body.theme-light .r-quote{ color:var(--ink); }
body.theme-light .review-quotemark{ color:rgba(27,13,38,0.07); }
body.theme-light .r-who small{ color:var(--ink-soft); }
body.theme-light .review-dots .d{ background:rgba(27,13,38,0.16); }
body.theme-light .review-dots .d.active{ background:var(--nc-magenta); }

/* Mini review marquee — the subtree the first pass missed. Listed
   against the full class set in neo-styles.css (.rm-card, .rm-stars,
   .rm-card p/span, .r-nm, .r-where, .r-stars) so nothing is left on
   the dark-theme white. */
body.theme-light #testimonials{ color:var(--ink); }
body.theme-light .r-nm{ color:var(--ink); }
body.theme-light .r-where{ color:var(--ink-soft); }
body.theme-light .r-stars,
body.theme-light .rm-card .rm-stars{ color:var(--nc-magenta); }
body.theme-light .rm-card{
  background:var(--surface); border-color:var(--line);
  box-shadow:0 1px 2px rgba(27,13,38,0.04), 0 8px 24px rgba(27,13,38,0.04);
}
body.theme-light .rm-card p{ color:var(--ink); }
body.theme-light .rm-card span{ color:var(--ink-soft); }
body.theme-light .r-avatar{ background:var(--nc-purple); color:#fff; }

/* ── Labels ──────────────────────────────────────────────────── */
body.theme-light .section-label,
body.theme-light .eyebrow,
body.theme-light .lbl,
body.theme-light .news-cat-inline,
body.theme-light .ic-num,
body.theme-light .pf-field span{ color:#8B4FA8; }

/* ── Globe ───────────────────────────────────────────────────── */
body.theme-light .g-pill{
  background:rgba(255,255,255,0.92); border-color:var(--line);
  color:var(--ink); box-shadow:0 2px 8px rgba(27,13,38,0.1);
}
body.theme-light .g-pill .g-code{ color:var(--ink-soft); }
body.theme-light .g-pill .g-ccy{ color:var(--nc-magenta); }
body.theme-light .g-pill-primary{ background:var(--nc-magenta); border-color:var(--nc-magenta); }
body.theme-light .g-pill-primary .g-code,
body.theme-light .g-pill-primary .g-ccy{ color:#fff; }
body.theme-light .scroll-cue{ color:var(--ink-soft); }

/* ── Dark photo chapters keep their own ink ──────────────────── */
body.theme-light #horizons,
body.theme-light #story{ background:#180A22; color:rgba(255,255,255,0.95); }
body.theme-light #horizons h3{ color:#fff; }
body.theme-light #horizons p{ color:rgba(255,255,255,0.66); }
body.theme-light #horizons .lbl{ color:var(--nc-lilac); }

/* Seam between light page and dark chapter */
body.theme-light #horizons{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); }

/* ── Footer stays dark as an anchor ──────────────────────────── */
body.theme-light footer{ background:#1B0D26; color:rgba(255,255,255,0.62); }
body.theme-light footer h5{ color:#fff; }
body.theme-light footer a{ color:rgba(255,255,255,0.6); }
body.theme-light footer a:hover{ color:var(--nc-lilac); }

/* ── Theme switch ────────────────────────────────────────────── */
.theme-switch{
  display:inline-flex; align-items:center; gap:7px;
  padding:9px 15px; border-radius:999px;
  border:1px solid var(--line); background:rgba(255,255,255,0.05);
  font-size:11.5px; font-weight:600; letter-spacing:0.04em;
  color:var(--ink); white-space:nowrap;
  transition:border-color .25s, background .25s;
}
.theme-switch:hover{ border-color:var(--nc-magenta); }
.theme-switch svg{ width:14px; height:14px; }
body.theme-light .theme-switch{ background:#fff; box-shadow:0 1px 2px rgba(27,13,38,0.05); }
nav.top .nav-right{ display:flex; align-items:center; gap:12px; }@media(max-width:760px){ .theme-switch span{ display:none; } .theme-switch{ padding:9px; }}
/* Give the pale sphere an edge against the pale page */
body.theme-light #globe-canvas{ filter:drop-shadow(0 18px 40px rgba(76,36,110,0.16)); }

/* News cards on light: the lilac link fails contrast on white, and the
   category pill relied on a 55%-dark fill that only worked over the dark
   page — make it solid so it reads over any photo. */
body.theme-light .news-read{ color:var(--nc-magenta-ink); }
body.theme-light .news-cat{
  background:rgba(27,13,38,0.82); border-color:rgba(255,255,255,0.22); color:#fff;
}
body.theme-light .news-meta .dot{ color:var(--ink-soft); }

/* ══════════════════════════════════════════════════════════════
   LIGHT THEME — SECTION RHYTHM
   The hero stays dark: it carries the globe and it gives the light
   page a strong opening. Everything after it alternates between
   white and a lavender tint, with hairline seams, so no two
   adjacent sections share a surface.

     hero          dark
     services      dark   (full-bleed photography)
     story         dark   (cinematic interlude)
     how to send   white
     payout        tint
     why neo       white
     impact        tint
     testimonials  white
     news          tint
     footer        dark
   ══════════════════════════════════════════════════════════════ */

/* ── Dark hero inside the light page ─────────────────────────── */
body.theme-light #hero{
  background:
    radial-gradient(ellipse 100% 80% at 50% 0%, #3A1B52 0%, transparent 55%),
    radial-gradient(ellipse 60% 50% at 0% 100%, rgba(246,68,119,0.14) 0%, transparent 60%),
    linear-gradient(180deg,#180A22 0%,#28123A 100%);
  color:rgba(255,255,255,0.95);
}
body.theme-light #hero h1.hero-h{ color:#fff; }
body.theme-light #hero h1.hero-h .accent,
body.theme-light #hero h1.hero-h .accent .w{ color:var(--nc-magenta); }
body.theme-light #hero .hero-sub{ color:rgba(255,255,255,0.68); }
body.theme-light #hero .eyebrow{ color:var(--nc-lilac); }
body.theme-light #hero .corridor-strip{ border-color:rgba(255,255,255,0.12); }
body.theme-light #hero .cr-item{ color:rgba(255,255,255,0.6); }
body.theme-light #hero .cr-label{ color:rgba(255,255,255,0.55); }
body.theme-light #hero .cr-label b{ color:#fff; }
body.theme-light #hero .btn-ghost{
  color:#fff; background:rgba(255,255,255,0.06);
  border-color:rgba(255,255,255,0.18); box-shadow:none;
}
body.theme-light #hero .btn-ghost:hover{ background:rgba(255,255,255,0.12); border-color:var(--nc-magenta); }
/* White is right for the hero cue, which sits over the dark globe artwork,
   but NOT for cues on a light surface — that is why the services cue was
   invisible. Scoped to the hero. */
body.theme-light .hero .scroll-cue{ color:rgba(255,255,255,0.5); }
body.theme-light #globe-canvas{ filter:none; }
/* Nav only ever sits over the dark hero — it retreats on scroll and hands
   off to the N mark — so its links stay light in this theme. */
body.theme-light nav.top .nav-links a{ color:rgba(255,255,255,0.74); }
body.theme-light nav.top .nav-links a:hover,
body.theme-light nav.top .nav-links a.active{ color:var(--nc-lilac); }
body.theme-light nav.top .theme-switch{
  color:#fff; background:rgba(255,255,255,0.07);
  border-color:rgba(255,255,255,0.18); box-shadow:none;
}
body.theme-light nav.top .theme-switch:hover{ border-color:var(--nc-magenta); }

/* ── Alternating surfaces ────────────────────────────────────── */
body.theme-light #discipline,
body.theme-light #why-neo,
body.theme-light #testimonials{ background:#FFFFFF; }
body.theme-light #impact,
body.theme-light #news{ background:#F4EEFA; }
body.theme-light #payout-finder{ background:#EFE6F8 !important; }

body.theme-light #discipline,
body.theme-light #payout-finder,
body.theme-light #why-neo,
body.theme-light #impact,
body.theme-light #testimonials,
body.theme-light #news{ border-top:1px solid var(--line); }
body.theme-light #news{ border-bottom:1px solid var(--line); }

/* How-to-send loses its photo backdrop on white and reads as a clean flow */
body.theme-light #discipline .section-bg,
body.theme-light #discipline .section-overlay{ display:none; }
body.theme-light #discipline h2.section-h2{ color:var(--lead); }
body.theme-light #discipline h2.section-h2 .accent{ color:var(--ink); }
body.theme-light #discipline .section-lead{ color:var(--ink-soft); }
body.theme-light #discipline .step-card-v2 h4{ color:var(--ink); }
body.theme-light #discipline .step-card-v2 p{ color:var(--ink-soft); }
body.theme-light #discipline .step-card-v2{
  background:#fff; border-color:var(--line);
  box-shadow:0 1px 2px rgba(27,13,38,0.04), 0 8px 24px rgba(27,13,38,0.05);
}

/* Cards on the tinted sections lift a little harder so they stay distinct */
body.theme-light #impact .impact-card,
body.theme-light #news .news-card{
  background:#fff;
  box-shadow:0 1px 2px rgba(27,13,38,0.05), 0 10px 30px rgba(27,13,38,0.06);
}
/* The step card's chrome inherits --orange (a pale lilac) which is legible on
   dark but not on white — pull it to the brand magenta / ink here. */
body.theme-light #discipline .step-num-pill{ color:var(--nc-magenta); border-color:var(--line); background:var(--surface-2); }
body.theme-light #discipline .step-icn{
  background:var(--surface-2); border-color:var(--line); color:var(--nc-magenta);
}
body.theme-light #discipline .step-meta{ color:var(--ink-soft); border-color:var(--line); }
body.theme-light #discipline .step-meta .dot{ background:var(--nc-magenta); }
body.theme-light #discipline .step-card-v2:hover{ border-color:var(--nc-magenta); }
body.theme-light #discipline .section-label{ color:#8B4FA8; white-space:nowrap; }
body.theme-light .section-label{ white-space:nowrap; }
/* Same hairline value as every other divider on the light page. */
body.theme-light #discipline .send-line-bg{ stroke: var(--line); }

/* The switch holds two labelled states; without an explicit inline-flex the
   inner spans default to block and stack the icon above the text, which
   inflates the whole nav row. */
.theme-switch .ts-light,
.theme-switch .ts-dark{ display:inline-flex; align-items:center; gap:7px; }
.theme-switch .ts-dark{ display:none; }
body.theme-light .theme-switch .ts-dark{ display:inline-flex; }
body.theme-light .theme-switch .ts-light{ display:none; }@media(max-width:1100px){ nav.top .nav-links{ display:none; }}

/* ── Services editorial variant ──────────────────────────────── */
body.theme-light .fs-kicker{ color:#8B4FA8; }
body.theme-light .fs-h{ color:var(--ink); }
body.theme-light .fs-h .accent{ color:var(--nc-magenta); }
body.theme-light .fs-lead,
body.theme-light .fs-card p{ color:var(--ink-soft); }
body.theme-light .fs-media{ background:var(--surface-2); }
body.theme-light .fs-inner{ background:#FFFFFF; border-color:var(--line); box-shadow:0 30px 70px -32px rgba(60,20,90,0.28); }
body.theme-light .fs-card:nth-child(2) .fs-inner{ background:#FCF9FE; }
body.theme-light .fs-card:nth-child(3) .fs-inner{ background:#FAF5FD; }
body.theme-light .fs-card:nth-child(4) .fs-inner{ background:#F8F1FC; }
body.theme-light .fs-card:nth-child(5) .fs-inner{ background:#F5EDFA; }
body.theme-light .fs-card:nth-child(6) .fs-inner{ background:#F3E9F9; }
body.theme-light .fs-card:nth-child(7) .fs-inner{ background:#F0E5F7; }
body.theme-light .fs-idx-t{ color:#A695B8; }
body.theme-light .fs-foot{ border-top-color:var(--line); }
body.theme-light .fs-meta{ color:#8B4FA8; }
body.theme-light .fs-body p{ color:var(--ink-soft); }
body.theme-light .fs-body h3{ color:var(--ink); }

body.theme-light .fs-media--illus{ background:#FFFFFF; }

/* Homepage stack, light theme: match the Services rows exactly — one white
   surface for every card rather than the graded purple tints, since depth now
   comes from the scroll-scrubbed scale/opacity instead of the background. */
body.theme-light .fs-card:nth-child(2) .fs-inner,
body.theme-light .fs-card:nth-child(3) .fs-inner,
body.theme-light .fs-card:nth-child(4) .fs-inner,
body.theme-light .fs-card:nth-child(5) .fs-inner,
body.theme-light .fs-card:nth-child(6) .fs-inner,
body.theme-light .fs-card:nth-child(7) .fs-inner{ background:#FFFFFF; }
body.theme-light .fs-num{ color:#8B4FA8; }
body.theme-light .fs-stat .n{ color:var(--ink); }
body.theme-light .fs-stat .l{ color:var(--ink-soft); }