/* ============================================================
   ALFHARON CORPORATE SERVICES — house style for web
   Dark gold theme. Palette derived from the locked proposal system.
   All text/background pairs verified against WCAG AA.
   ============================================================ */
:root{
  /* surfaces — dark by default */
  --black:#06080E;       /* deepest: hero, CTA bands */
  --paper:#0B0E17;       /* page base */
  --paper-warm:#0E1220;  /* alternating section */
  --callout:#131829;     /* raised panel */
  --subfill:#1A2135;     /* table fill / hover */

  /* text */
  --ink:#F3F2EF;         /* primary text on dark (17.2:1) */
  --grey:#A9ACB8;        /* body text on dark (8.5:1) */

  /* gold — high-chroma metallic. Hue held at ~41deg; saturation lifted from 50% to 66-82%
     which is what makes it read sharp rather than olive. */
  --gold:#D4A02E;        /* brand gold — fills, rules (8.1:1 on page) */
  --gold-b:#EFC65C;      /* bright gold — TEXT ON DARK (11.8:1) */
  --gold-deep:#8A6A2E;   /* deep gold — text on light surfaces only */
  --gold-hi:#FFE7A6;     /* highlight for gradient sheen (15.8:1) */
  --glow:rgba(239,198,92,.34);
  --glow-soft:rgba(239,198,92,.16);

  --border:rgba(239,198,92,.22);
  --maxw:1120px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Montserrat',Arial,sans-serif;
  font-weight:500;
  font-size:16px;
  line-height:1.7;
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;height:auto}

/* --- gold system: sheen gradient + glow ------------------------------- */
.gold-text{
  background:linear-gradient(100deg,var(--gold) 0%,var(--gold-hi) 42%,var(--gold-b) 62%,var(--gold) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  background-size:220% 100%;animation:sheen 9s ease-in-out infinite;
}
@keyframes sheen{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@media(prefers-reduced-motion:reduce){.gold-text{animation:none}}

/* a hairline that glows rather than sits flat */
.gold-rule{width:64px;height:2px;border:0;margin:22px 0;
  background:linear-gradient(90deg,var(--gold),var(--gold-hi));
  box-shadow:0 0 14px var(--glow)}
.gold-rule.center{margin-left:auto;margin-right:auto}
a{color:var(--gold-b);text-decoration:none}
a:hover{color:var(--gold-hi)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

/* ---------- eyebrow / rules ---------- */
.eyebrow{
  font-size:.72rem;font-weight:600;letter-spacing:.22em;
  text-transform:uppercase;color:var(--gold-b);margin-bottom:14px;
}
.eyebrow.on-dark{color:var(--gold-b)}
.hairline{height:1px;background:var(--gold-b);opacity:.55;border:0}

/* ---------- nav ---------- */
.nav{
  position:sticky;top:0;z-index:100;background:rgba(4,6,11,.92);
  backdrop-filter:blur(14px);border-bottom:1px solid var(--border);
  box-shadow:0 1px 0 var(--glow-soft);
}
.nav-inner{
  max-width:var(--maxw);margin:0 auto;padding:0 24px;
  display:flex;align-items:center;justify-content:space-between;height:88px;
}
.nav-brand{
  font-weight:600;letter-spacing:.24em;font-size:.95rem;color:var(--ink);
  text-transform:uppercase;display:flex;align-items:center;
}
.nav-brand span{color:var(--gold)}
.nav-logo{height:48px;width:auto;display:block;
  filter:drop-shadow(0 0 18px rgba(239,198,92,.30)) drop-shadow(0 0 3px rgba(255,231,166,.22));
  transition:filter .3s}
.nav-brand:hover .nav-logo{filter:drop-shadow(0 0 26px rgba(239,198,92,.55)) drop-shadow(0 0 4px rgba(255,231,166,.4))}
@media(max-width:760px){.nav-logo{height:38px}}
.nav-links{display:flex;align-items:center;gap:32px;list-style:none}
.nav-links a{
  color:#D7D8DE;font-size:.82rem;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;padding:6px 0;border-bottom:2px solid transparent;
  transition:border-color .2s,color .2s;
}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--gold-hi);border-bottom-color:var(--gold-b)}
.nav-cta{
  background:linear-gradient(135deg,var(--gold-b),var(--gold) 60%,#96712F);
  color:#0B0E17 !important;padding:11px 22px;
  box-shadow:0 4px 18px rgba(172,132,57,.32);
  border:1px solid rgba(199,162,91,.5);
  font-size:.78rem;letter-spacing:.1em;
}
.nav-cta:hover{background:linear-gradient(135deg,var(--gold-hi),var(--gold-b));color:#06080E !important;
  box-shadow:0 8px 28px rgba(199,162,91,.46)}
.nav-toggle{display:none;background:none;border:1px solid var(--border);
  padding:8px 12px;font-size:1.1rem;color:var(--ink);cursor:pointer}

/* ---------- buttons ---------- */
.btn{
  display:inline-block;padding:15px 34px;font-family:inherit;
  font-size:.82rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  cursor:pointer;transition:all .25s;text-align:center;
}
.btn-gold{
  background:linear-gradient(135deg,var(--gold-b),var(--gold) 55%,#96712F);
  color:#0B0E17;border:1px solid var(--gold-b);
  box-shadow:0 6px 22px rgba(172,132,57,.30), inset 0 1px 0 rgba(255,255,255,.28);
}
.btn-gold:hover{
  background:linear-gradient(135deg,var(--gold-hi),var(--gold-b) 60%,var(--gold));
  box-shadow:0 10px 34px rgba(199,162,91,.44), inset 0 1px 0 rgba(255,255,255,.4);
  transform:translateY(-2px);
}
.btn-ghost-dark{background:transparent;color:var(--ink);border:1px solid rgba(199,162,91,.42)}
.btn-ghost-dark:hover{border-color:var(--gold-b);color:var(--gold-hi);box-shadow:0 0 24px var(--glow-soft)}
.btn-ghost-light{background:transparent;color:#fff;border:1px solid var(--gold-b)}
.btn-ghost-light:hover{background:var(--gold-b);color:var(--black);box-shadow:0 0 26px var(--glow)}
.btn-row{display:flex;gap:18px;flex-wrap:wrap}

/* ---------- hero (document cover come alive) ---------- */
.hero{
  background:var(--black);color:#fff;text-align:center;
  padding:110px 24px 96px;position:relative;
}
.hero::before,.hero::after{
  content:"";position:absolute;left:24px;right:24px;height:1px;
  background:var(--gold-b);opacity:.45;
}
.hero::before{top:26px}
.hero::after{bottom:26px}
.hero-logo{width:min(340px,70vw);margin:0 auto 46px}
.hero .eyebrow{color:var(--gold-b);margin-bottom:26px}
.hero h1{
  font-weight:300;font-size:clamp(2.1rem,4.6vw,3.6rem);line-height:1.22;
  letter-spacing:.01em;max-width:820px;margin:0 auto;
}
.hero h1 strong{font-weight:600;color:var(--gold-b)}
.hero-rule{width:0;height:2px;background:var(--gold-b);border:0;margin:34px auto;
  animation:drawRule 1.1s .3s ease forwards}
@keyframes drawRule{to{width:88px}}
.hero-sub{
  max-width:660px;margin:0 auto 42px;color:#C9CAD1;font-size:1.02rem;font-weight:400;
}
.hero .btn-row{justify-content:center}
.hero-tag{
  margin-top:56px;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold-b);opacity:.85;
}

/* page hero (interior pages) */
.page-hero{
  background:radial-gradient(900px 380px at 18% 0%, rgba(172,132,57,.14), transparent 62%), var(--black);
  color:#fff;padding:104px 24px 88px;position:relative;
}
.page-hero::after{content:"";position:absolute;left:24px;right:24px;bottom:20px;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold-b),transparent);opacity:.6;
  box-shadow:0 0 18px var(--glow-soft)}
.page-hero h1{font-weight:300;font-size:clamp(1.9rem,3.8vw,2.9rem);line-height:1.3;max-width:800px}
.page-hero p{max-width:680px;color:#C9CAD1;font-weight:400;margin-top:26px;line-height:1.85}

/* ---------- sections ---------- */
/* Sections must be opaque and must paint above a pinned section. A plain
   .section previously had no background at all — invisible until the NED
   section started pinning behind it, at which point its content showed
   straight through the gaps between cards. */
.section{padding:118px 0;background:var(--paper);position:relative;z-index:1}
.section.warm{background:var(--paper-warm);position:relative;z-index:1;
  border-top:1px solid rgba(239,198,92,.10);border-bottom:1px solid rgba(239,198,92,.10)}
.section.dark{background:radial-gradient(900px 420px at 50% 0%, rgba(212,160,46,.11), transparent 65%), var(--black);color:#fff;position:relative;z-index:1}
.section-head{max-width:760px;margin-bottom:68px}
.section-head h2{font-weight:600;font-size:clamp(1.5rem,2.8vw,2.1rem);line-height:1.3;color:var(--ink)}
.section.dark .section-head h2{color:#fff;font-weight:300}
.section-head p{color:var(--grey);margin-top:20px;line-height:1.85}
.section.dark .section-head p{color:#C9CAD1}
.center{text-align:center}
.section-head.center{margin-left:auto;margin-right:auto}

/* ---------- stat cards (One Strategy block) ---------- */
.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:linear-gradient(90deg,var(--gold),var(--gold-hi),var(--gold));
  border:1px solid rgba(199,162,91,.5);box-shadow:0 0 34px var(--glow-soft)}
.stat-card{background:linear-gradient(170deg,#121728,#080B13);padding:46px 30px;text-align:center;
  transition:box-shadow .3s}
.stat-card:hover{box-shadow:inset 0 0 40px rgba(199,162,91,.12)}
.stat-card .figure{
  font-weight:300;font-size:1.55rem;color:var(--gold-b);letter-spacing:.02em;line-height:1.2;
  display:block;margin-bottom:12px;
}
.stat-card .caption{font-size:.82rem;color:#E8E8EC;font-weight:400;line-height:1.55}

/* ---------- pillar cards ---------- */
.pillars{display:grid;grid-template-columns:repeat(2,1fr);gap:32px}
@media(max-width:820px){.pillars{grid-template-columns:1fr}}

/* platform band — pillar 05 promoted: it is the product, not a service line */
.platform-band{
  position:relative;margin-top:26px;color:#fff;border:1px solid var(--border);
  background:radial-gradient(720px 300px at 12% 0%, rgba(199,162,91,.15), transparent 62%),
             linear-gradient(160deg,#121728 0%,#07090F 100%);
  box-shadow:0 24px 60px rgba(0,0,0,.55), inset 0 1px 0 rgba(199,162,91,.22);
  display:grid;grid-template-columns:1.15fr .85fr;gap:64px;padding:60px 52px;align-items:center;
}
.platform-band .p-num{color:var(--gold-b)}
.platform-band h3{font-weight:600;font-size:1.35rem;margin:6px 0 16px;line-height:1.3}
.platform-band p{color:#C9CAD1;font-weight:400;font-size:.95rem;line-height:1.7}
.platform-band ul{list-style:none;display:grid;gap:14px}
.platform-band li{position:relative;padding-left:22px;font-size:.9rem;color:#E8E8EC;font-weight:400}
.platform-band li::before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;
  background:var(--gold-b);box-shadow:0 0 10px var(--glow)}
@media(max-width:820px){.platform-band{grid-template-columns:1fr;gap:28px;padding:38px 28px}}

.pillar{
  position:relative;background:linear-gradient(165deg,#121727 0%,#0C101B 100%);
  border:1px solid var(--border);padding:46px 40px;
  transition:transform .3s,box-shadow .3s,border-color .3s;
}
.pillar::before{
  content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,var(--gold),var(--gold-hi),var(--gold));
  box-shadow:0 0 16px var(--glow);
}
.pillar::after{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s;
  background:radial-gradient(420px 200px at 20% 0%, rgba(199,162,91,.13), transparent 70%);
}
.pillar:hover{transform:translateY(-5px);border-color:rgba(199,162,91,.45);
  box-shadow:0 20px 48px rgba(0,0,0,.55), 0 0 32px var(--glow-soft)}
.pillar:hover::after{opacity:1}
.pillar .p-num{
  font-weight:600;color:var(--gold-b);font-size:.78rem;letter-spacing:.18em;margin-bottom:16px;
}
.pillar h3{font-weight:600;font-size:1.06rem;line-height:1.45;margin-bottom:18px;color:#fff}
.pillar p{font-size:.9rem;color:var(--grey);font-weight:400;line-height:1.8}
.pillar ul{margin-top:16px;list-style:none}
.pillar li{
  font-size:.87rem;color:var(--ink);font-weight:400;padding-left:20px;position:relative;margin-bottom:9px;
}
.pillar li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;background:var(--gold)}

/* ---------- callout box ---------- */
.callout{
  background:linear-gradient(150deg,#141A2B,#0D1120);
  border-left:3px solid var(--gold-b);border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);box-shadow:-6px 0 26px rgba(199,162,91,.10);
  padding:42px 46px;margin:44px 0;
}
.callout h3{font-weight:600;font-size:1rem;letter-spacing:.04em;margin-bottom:12px;color:var(--gold-b)}
.callout p{font-size:.93rem;color:var(--grey);font-weight:400}
.callout p+p{margin-top:12px}
.callout .fine{font-size:.8rem;color:var(--grey);margin-top:16px}

/* ---------- split feature ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.split .side-label{
  font-size:.72rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-b);
  margin-bottom:14px;
}
.split h2{font-weight:600;font-size:clamp(1.4rem,2.5vw,1.9rem);line-height:1.32;margin-bottom:20px}
.split p{color:var(--grey);font-weight:400;font-size:.95rem;line-height:1.85}
.split p+p{margin-top:20px}

/* ledger table (self-funding) */
.ledger{width:100%;border-collapse:collapse;margin-top:8px}
.ledger th{
  background:linear-gradient(135deg,#1A2135,#0F1420);color:var(--gold-b);
  font-weight:600;font-size:.8rem;letter-spacing:.06em;
  text-transform:uppercase;padding:14px 18px;text-align:left;
  border-bottom:1px solid rgba(199,162,91,.35);
}
.ledger td{
  border:1px solid var(--border);padding:14px 18px;font-size:.88rem;font-weight:400;color:var(--ink);
}
.ledger tr.total td{background:var(--subfill);font-weight:600;color:var(--gold-b)}

/* ---------- credibility strip ---------- */
.cred{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(199,162,91,.35)}
.cred-item{background:linear-gradient(170deg,#121728,#080B13);padding:54px 40px;transition:box-shadow .3s}
.cred-item:hover{box-shadow:inset 0 0 46px rgba(199,162,91,.12)}
.cred-item h3{font-weight:600;font-size:.95rem;color:var(--gold-b);letter-spacing:.05em;margin-bottom:14px}
.cred-item p{font-size:.88rem;color:#C9CAD1;font-weight:400}

/* ---------- process steps ---------- */
.steps{counter-reset:step;display:grid;gap:0;border-top:1px solid var(--border)}
.step{
  display:grid;grid-template-columns:110px 1fr;gap:44px;padding:46px 0;
  border-bottom:1px solid var(--border);transition:background .3s;
}
.step:hover{background:linear-gradient(90deg,rgba(199,162,91,.06),transparent 60%)}
.step .s-num{
  font-weight:300;font-size:2.4rem;line-height:1;
  background:linear-gradient(120deg,var(--gold),var(--gold-hi));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.step h3{font-weight:600;font-size:1.05rem;margin-bottom:10px}
.step p{color:var(--grey);font-weight:400;font-size:.93rem;max-width:680px}

/* ---------- NED PROGRAMME showcase ------------------------------------
   Full-bleed feature band. Every figure here is platform-recorded and
   verifiable. Modelled financial values (ETI, net benefit, spend) are
   deliberately NOT shown — they are gated on Rone's review.
   -------------------------------------------------------------------- */
.ned{
  position:relative;overflow:hidden;padding:132px 0;
  background:radial-gradient(1000px 520px at 22% 8%, rgba(212,160,46,.18), transparent 62%),
             radial-gradient(760px 420px at 88% 92%, rgba(239,198,92,.10), transparent 60%),
             linear-gradient(165deg,#0C1120 0%,#05070C 100%);
  border-top:1px solid var(--border);border-bottom:1px solid var(--border);
}
.ned::before{
  content:"";position:absolute;left:-20%;right:-20%;top:0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,var(--gold-hi),transparent);
  box-shadow:0 0 40px 6px rgba(239,198,92,.30);opacity:.7;
}
.ned-top{display:grid;grid-template-columns:1.12fr .88fr;gap:76px;align-items:center;margin-bottom:76px}
.ned-head{max-width:none}
.ned-head h2{
  font-weight:300;font-size:clamp(1.8rem,3.6vw,2.9rem);line-height:1.24;color:#fff;margin-bottom:26px;
}
.ned-head h2 em{
  font-style:normal;font-weight:600;
  background:linear-gradient(100deg,var(--gold) 0%,var(--gold-hi) 42%,var(--gold-b) 62%,var(--gold) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  background-size:220% 100%;animation:sheen 9s ease-in-out infinite;
  filter:drop-shadow(0 0 24px rgba(239,198,92,.30));
}
.ned-head p{color:#C4C6CF;font-weight:400;font-size:1rem;line-height:1.9;max-width:720px}

/* official credential — a light artefact deliberately framed like a
   certificate pinned to a dark wall, rather than blended into the theme */
.ned-badge{margin:0}
.ned-badge img{
  display:block;width:100%;height:auto;max-width:340px;margin-left:auto;background:#fff;
  aspect-ratio:1/1;object-fit:contain;
  border:1px solid rgba(239,198,92,.55);
  box-shadow:0 0 56px rgba(212,160,46,.26), 0 22px 58px rgba(0,0,0,.62);
  transition:box-shadow .35s,transform .35s;
}
.ned-badge img:hover{transform:translateY(-4px);
  box-shadow:0 0 78px rgba(239,198,92,.42), 0 28px 68px rgba(0,0,0,.7)}
.ned-badge figcaption{
  max-width:340px;margin:20px 0 0 auto;text-align:right;
  font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-b);line-height:1.9;
}
.ned-badge figcaption span{display:block;letter-spacing:.06em;text-transform:none;
  font-weight:400;color:#8A8C96;font-size:.74rem;margin-top:6px}
@media(max-width:980px){
  .ned-top{grid-template-columns:1fr;gap:44px}
  .ned-badge img{margin:0 auto;max-width:320px}
  .ned-badge figcaption{margin:18px auto 0;text-align:center}
}

.ned-figs{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:linear-gradient(90deg,var(--gold),var(--gold-hi),var(--gold));
  border:1px solid rgba(239,198,92,.5);
  box-shadow:0 0 60px rgba(212,160,46,.22), 0 26px 70px rgba(0,0,0,.6);
}
.ned-fig{background:linear-gradient(170deg,#101627 0%,#06090F 100%);padding:52px 30px;text-align:center;
  transition:box-shadow .35s}
.ned-fig:hover{box-shadow:inset 0 0 60px rgba(239,198,92,.14)}
.ned-fig .n{
  display:block;font-weight:300;font-size:clamp(2rem,3.6vw,2.9rem);line-height:1;letter-spacing:-.01em;
  background:linear-gradient(120deg,var(--gold),var(--gold-hi) 55%,var(--gold-b));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 22px rgba(239,198,92,.34));margin-bottom:16px;
}
.ned-fig .l{display:block;font-size:.72rem;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-b);margin-bottom:10px}
.ned-fig .d{font-size:.82rem;color:#A9ACB8;font-weight:400;line-height:1.6}

.ned-foot{display:grid;grid-template-columns:1.25fr .75fr;gap:64px;align-items:center;margin-top:64px}
.ned-quote{
  border-left:3px solid var(--gold-b);padding:8px 0 8px 30px;
  font-weight:300;font-size:clamp(1.05rem,2vw,1.35rem);line-height:1.6;color:#EDEDF0;
}
.ned-quote strong{font-weight:600;color:var(--gold-b)}
.ned-quote cite{display:block;font-style:normal;font-size:.72rem;letter-spacing:.16em;
  text-transform:uppercase;color:#8A8C96;margin-top:20px;font-weight:600}
.ned-cta .btn{width:100%}
.ned-note{font-size:.74rem;color:#7F818C;font-weight:400;line-height:1.7;margin-top:20px}

@media(max-width:980px){
  .ned-figs{grid-template-columns:repeat(2,1fr)}
  .ned-foot{grid-template-columns:1fr;gap:38px}
}
@media(max-width:760px){
  .ned{padding:86px 0}
  .ned-head{margin-bottom:48px}
  .ned-fig{padding:38px 20px}
}

/* ---------- STACK TEST: sections that pin, with the next riding over ----
   Native position:sticky — scroll is never hijacked. The wheel, trackpad,
   keyboard, Cmd+F and screen readers all behave exactly as normal; the only
   difference is that a pinned section stays put while the following one
   slides up over it.

   A section taller than the viewport cannot pin at top:0 or its bottom would
   never be reachable. js/site.js therefore sets `top` to (viewportH - sectionH)
   so the section scrolls normally until its BOTTOM edge meets the bottom of
   the screen, and pins from there.

   To remove this test: delete this block, the .stack/.stack-over classes in
   index.html, and the layoutStack() function in js/site.js.
   -------------------------------------------------------------------- */
.stack{position:sticky;top:0;z-index:0}
.stack-over{
  position:relative;z-index:1;
  border-top:1px solid rgba(239,198,92,.38);
  box-shadow:0 -46px 92px rgba(0,0,0,.82), 0 -1px 0 rgba(255,231,166,.14);
}

/* Pinning is a large-screen enhancement. On a phone it wastes the viewport,
   and anyone who has asked for reduced motion should not get it at all. */
@media(max-width:980px){
  .stack{position:static;top:auto}
  .stack-over{box-shadow:none;border-top:1px solid var(--border)}
}
@media(prefers-reduced-motion:reduce){
  .stack{position:static;top:auto}
  .stack-over{box-shadow:none}
}

/* ---------- CLOSING CTA: the one moment with nothing else on screen -----
   Full viewport, centred, vignetted. When it is in view the nav slides away
   and the progress line fades, so the last thing the visitor sees is the ask
   and nothing else. Scroll is never blocked — they can leave whenever they
   want, and the nav returns the instant they scroll back up.
   -------------------------------------------------------------------- */
.cta-band{
  position:relative;z-index:2;color:#fff;text-align:center;
  min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;
  padding:110px 24px;
  background:
    radial-gradient(760px 420px at 50% 50%, rgba(212,160,46,.20), transparent 62%),
    var(--black);
  border-top:1px solid rgba(239,198,92,.38);
  box-shadow:0 -46px 92px rgba(0,0,0,.85);
}
/* vignette — darkens the edges so the eye has nowhere else to go */
.cta-band::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(120% 90% at 50% 50%, transparent 42%, rgba(0,0,0,.72) 100%);
}
.cta-band > *{position:relative;z-index:1}
.cta-band::before{content:"";position:absolute;left:24px;right:24px;top:20px;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold-b),transparent);opacity:.6;
  box-shadow:0 0 18px var(--glow-soft);z-index:1}
/* the mark floats — no box, no plate. Two stacked drop-shadows give it
   depth: a dark one below for lift off the page, and a gold one around it
   for the glow. It drifts slowly so it reads as suspended rather than stuck. */
.cta-mark{
  width:112px;margin:0 auto 48px;opacity:1;
  filter:drop-shadow(0 22px 34px rgba(0,0,0,.78))
         drop-shadow(0 0 40px rgba(239,198,92,.40))
         drop-shadow(0 0 8px rgba(255,231,166,.30));
  animation:markFloat 7.5s ease-in-out infinite;
  will-change:transform;
}
@keyframes markFloat{
  0%,100%{transform:translateY(0) rotate(0deg)}
  50%    {transform:translateY(-12px) rotate(-1.2deg)}
}
@media(prefers-reduced-motion:reduce){.cta-mark{animation:none}}
.cta-band h2{font-weight:300;font-size:clamp(1.9rem,4vw,3rem);max-width:860px;margin:0 auto 26px;line-height:1.28}
.cta-band h2 strong{font-weight:600;
  background:linear-gradient(100deg,var(--gold) 0%,var(--gold-hi) 42%,var(--gold-b) 62%,var(--gold) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  background-size:220% 100%;animation:sheen 9s ease-in-out infinite;
  filter:drop-shadow(0 0 24px rgba(239,198,92,.3))}
.cta-band p{color:#C4C6CF;max-width:620px;margin:0 auto 44px;font-weight:400;line-height:1.85}
.cta-band .btn-row{justify-content:center}
.cta-tel{margin-top:34px;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:#8A8C96}
.cta-tel a{color:var(--gold-b);letter-spacing:.06em}

/* nav gets out of the way for the close */
.nav{transition:height .3s, background .3s, box-shadow .3s, transform .45s ease, opacity .45s ease}
.nav.nav-away{transform:translateY(-100%);opacity:0;pointer-events:none}
body.at-close .scrollbar-gold{opacity:0;transition:opacity .45s ease}

@media(max-width:760px){
  .cta-band{min-height:auto;padding:88px 22px}
  .cta-mark{width:92px;margin-bottom:32px}
}
@media(prefers-reduced-motion:reduce){
  .nav.nav-away{transform:none;opacity:1;pointer-events:auto}
}

/* ---------- forms ---------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.form-grid .full{grid-column:1/-1}
label{display:block;font-size:.78rem;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink);margin-bottom:8px}
input,select,textarea{
  width:100%;padding:14px 16px;border:1px solid var(--border);background:#0E1220;
  font-family:inherit;font-size:.95rem;font-weight:400;color:var(--ink);
}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold-b);
  box-shadow:0 0 0 3px rgba(199,162,91,.16)}
input::placeholder,textarea::placeholder{color:#6C6F7B}
textarea{min-height:150px;resize:vertical}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:.82rem;color:var(--grey);font-weight:400}
.consent input{width:18px;height:18px;margin-top:2px;flex:none;accent-color:var(--gold)}
.form-note{font-size:.78rem;color:var(--grey);font-weight:400;margin-top:18px}

/* ---------- footer ---------- */
footer{background:var(--black);color:#C9CAD1;padding:70px 0 34px;
  border-top:1px solid var(--border);box-shadow:0 -1px 0 var(--glow-soft)}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.4fr;gap:44px;margin-bottom:50px}
.foot-brand{font-weight:600;letter-spacing:.22em;font-size:.9rem;color:#fff;text-transform:uppercase;margin-bottom:18px}
.foot-brand span{color:var(--gold-b)}
footer p,footer li{font-size:.84rem;font-weight:400}
footer h4{font-size:.74rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:var(--gold-b);margin-bottom:18px}
footer ul{list-style:none}
footer li{margin-bottom:10px}
footer a{color:#C9CAD1}
footer a:hover{color:var(--gold-hi)}
.foot-legal{border-top:1px solid rgba(199,162,91,.3);padding-top:26px;
  font-size:.74rem;color:#8A8C96;font-weight:400}
.foot-legal p+p{margin-top:8px}

/* ---------- scroll dynamics ---------- */

/* 1. gold reading-progress line across the top of the viewport */
.scrollbar-gold{
  position:fixed;top:0;left:0;height:2px;width:0;z-index:200;pointer-events:none;
  background:linear-gradient(90deg,var(--gold),var(--gold-hi));
  box-shadow:0 0 14px var(--glow);
  transition:width .08s linear;
}

/* 2. nav condenses once you leave the hero */
.nav{transition:height .3s, background .3s, box-shadow .3s}
.nav-inner{transition:height .3s}
.nav.condensed{box-shadow:0 6px 30px rgba(0,0,0,.55), 0 1px 0 var(--glow-soft)}
.nav.condensed .nav-inner{height:66px}
.nav.condensed .nav-logo{height:38px}
@media(max-width:760px){.nav.condensed .nav-logo{height:32px}}

/* 3. reveals travel further and settle, with a subtle scale */
.reveal{opacity:0;transform:translateY(34px) scale(.985);
  transition:opacity .8s cubic-bezier(.22,.68,.24,1), transform .8s cubic-bezier(.22,.68,.24,1)}
.reveal.in{opacity:1;transform:none}
/* siblings stagger so rows arrive in sequence rather than as a block */
.reveal[data-stagger="1"]{transition-delay:.10s}
.reveal[data-stagger="2"]{transition-delay:.20s}
.reveal[data-stagger="3"]{transition-delay:.30s}

/* 4. counters hold their box while ticking so nothing reflows */
.ned-fig .n{font-variant-numeric:tabular-nums}

@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .hero-rule{width:88px;animation:none}
  .scrollbar-gold{display:none}
  .nav,.nav-inner,.nav-logo{transition:none}
  html{scroll-behavior:auto}
}

/* ---------- responsive ---------- */
@media(max-width:980px){
  .section{padding:96px 0}
  .stat-row{grid-template-columns:repeat(2,1fr)}
  .cred{grid-template-columns:1fr}
  .split{grid-template-columns:1fr;gap:40px}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .nav-links{
    display:none;position:absolute;top:88px;left:0;right:0;background:#0A0D16;
    flex-direction:column;gap:0;border-bottom:1px solid var(--gold);
    padding:10px 24px 22px;box-shadow:0 18px 34px rgba(0,0,0,.6);
  }
  .nav-links.open{display:flex}
  .nav-links li{width:100%}
  .nav-links a{display:block;padding:14px 0;border-bottom:1px solid var(--border)}
  .nav-cta{margin-top:14px;text-align:center}
  .nav-toggle{display:block}
  .section{padding:78px 0}
  .page-hero{padding:72px 22px 60px}
  .hero{padding:78px 24px 70px}
  .cta-band{padding:80px 22px}
  .pillar{padding:36px 28px}
  .callout{padding:32px 28px}
  .cred-item{padding:42px 30px}
  .form-grid{grid-template-columns:1fr}
  .stat-row{grid-template-columns:1fr 1fr}
  .step{grid-template-columns:64px 1fr;gap:20px}
  .step .s-num{font-size:1.7rem}
  .foot-grid{grid-template-columns:1fr}
}