/* ============================================================
   NEVAMIS MOTION DESIGN SYSTEM
   One stylesheet for the whole redesigned site. Dark navy, the
   mint signal, Bricolage headlines, Atkinson body, mono labels.

   Contract note: class names like .reveal, .sim-*, .stage-pill,
   .tagchip, .rail-track, .spine and .stack are the DOM contract
   of site.js + motion.js — keep them stable.
   ============================================================ */

:root{
  --navy:#0B1620; --navy-0:#02080D; --navy-2:#0D1C27; --navy-3:#10222E;
  --emerald:#2FBF8F; --emerald-deep:#0E5C4B; --emerald-mid:#1E8E6D; --mint:#9FF0CE;
  --ink:#EAF3EE; --muted:#8AA5A0; --line:rgba(159,240,206,.14);
  --warm:#F0B462; --warm-deep:#8A6210; --bad:#E5837B;
  --e-out:cubic-bezier(.16,1,.3,1); --e-in:cubic-bezier(.7,0,.84,0);
  /* compat aliases: markup ported from the previous site references these */
  --card:var(--navy-2); --frost:rgba(159,240,206,.05);
  --signal:var(--mint); --signal-deep:var(--emerald); --muted-dark:var(--muted);
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--navy);color:var(--ink)}
/* clip, not hidden: body-only clipping still reports horizontal overflow up on
   the html element, but overflow-x:hidden here would make html a scroll
   container and silently kill the sticky ROI panel. */
html{overflow-x:clip}
body{overflow-x:hidden;font-family:"Atkinson Hyperlegible","Segoe UI",system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;line-height:1.55;font-size:16.5px}
img{max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
::selection{background:rgba(47,191,143,.35);color:var(--ink)}
.wrap{max-width:1180px;margin:0 auto;padding:0 clamp(20px,4vw,44px)}
.mono{font-family:"Spline Sans Mono",ui-monospace,monospace}
h1,h2,h3,h4,.wordmark{font-family:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif}
h2{font-size:clamp(30px,4vw,44px);font-weight:700;letter-spacing:-.02em;line-height:1.08}
h3{font-size:19px;font-weight:700;letter-spacing:-.01em}
strong{color:var(--ink)}

/* keyboard focus is never removed, only styled */
:focus-visible{outline:2px solid var(--mint);outline-offset:3px;border-radius:6px}
.btn:focus-visible,.main-nav a:focus-visible,.navitem a:focus-visible{
  outline:none;box-shadow:inset 0 0 0 3px var(--ink)}

.skip{position:absolute;left:-9999px;top:0;z-index:300;background:var(--mint);color:#04120C;
  padding:10px 16px;border-radius:0 0 8px 0;font-weight:700}
.skip:focus{left:0}
.visually-hidden{position:absolute;left:-9999px}

/* readable floor: uppercase mono labels are a house pattern, but nothing a
   visitor has to read may drop below 11px. Audited 2026-07-28. */


/* ---------- header ---------- */
.site-header{position:fixed;z-index:50;top:0;left:0;right:0;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  background:linear-gradient(to bottom,rgba(11,22,32,.82),rgba(11,22,32,0));
  transition:background .3s var(--e-out),box-shadow .3s var(--e-out)}
.site-header.scrolled{background:rgba(9,18,26,.92);box-shadow:0 1px 0 var(--line)}
.site-header .wrap{display:flex;align-items:center;gap:18px;height:68px}
.wordmark{display:flex;align-items:center;gap:10px;font-weight:700;font-size:18px;letter-spacing:-.01em}
.wordmark span{color:var(--muted);font-weight:500}
.wordmark svg{filter:drop-shadow(0 0 10px rgba(47,191,143,.35))}
.wordmark circle.pulse-dot{animation:markPulse 2.8s var(--e-out) 1;transform-origin:32px 48px}
@keyframes markPulse{0%,100%{opacity:1}40%{opacity:.45}60%{opacity:1}}

.main-nav{display:flex;align-items:center;gap:20px;margin-left:auto}
.main-nav a:not(.btn){color:var(--muted);font-size:14.5px;position:relative;padding:4px 0;white-space:nowrap;
  transition:color .2s var(--e-out)}
.main-nav a:not(.btn)::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;
  background:var(--mint);transform:scaleX(0);transform-origin:left;
  transition:transform .28s var(--e-out);box-shadow:0 0 6px var(--mint)}
.main-nav a:not(.btn):hover{color:var(--ink)}
.main-nav a:not(.btn):hover::after,.main-nav a.active-section::after{transform:scaleX(1)}
.main-nav a.active-section{color:var(--ink)}
.nav-toggle{display:none;margin-left:auto;background:none;border:1px solid var(--line);
  color:var(--ink);border-radius:9px;width:42px;height:42px;font-size:17px;cursor:pointer}

@media(max-width:1080px){
  .main-nav a.nav-min{display:none}
}
@media(max-width:880px){
  .nav-toggle{display:grid;place-items:center}
  .main-nav{position:absolute;top:68px;left:0;right:0;flex-direction:column;align-items:stretch;
    gap:0;padding:8px 20px 18px;background:rgba(7,15,22,.98);border-bottom:1px solid var(--line);
    display:none}
  .main-nav.open{display:flex}
  .main-nav a:not(.btn){padding:12px 4px;font-size:16px;border-bottom:1px solid rgba(159,240,206,.07)}
  .main-nav a.nav-min{display:block}
  .main-nav .btn{margin-top:12px;justify-content:center}
}

/* ---------- buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;gap:9px;border-radius:999px;
  padding:12px 20px;font-weight:600;font-size:14.5px;border:1px solid transparent;cursor:pointer;
  white-space:nowrap;will-change:transform;font-family:inherit}
.btn .arw{transition:transform .18s var(--e-out)}
.btn:hover .arw{transform:translateX(3px)}
.btn-lg{padding:15px 26px;font-size:16px}
.btn-primary{background:linear-gradient(110deg,var(--emerald-mid),var(--emerald));color:#04120C;
  box-shadow:0 10px 30px -12px rgba(47,191,143,.6);background-size:160% 100%;background-position:0 0;
  transition:background-position .45s var(--e-out),box-shadow .3s var(--e-out)}
.btn-primary:hover{background-position:100% 0;box-shadow:0 16px 44px -14px rgba(47,191,143,.8)}
.btn-ghost,.btn-light-ghost{border-color:var(--line);color:var(--ink);background:transparent;
  transition:border-color .25s var(--e-out),background .25s var(--e-out)}
.btn-ghost:hover,.btn-light-ghost:hover{border-color:rgba(159,240,206,.42);background:rgba(159,240,206,.05)}
.ring-once{animation:ringOnce 1s var(--e-out) 1}
@keyframes ringOnce{0%{box-shadow:0 0 0 0 rgba(159,240,206,.55)}100%{box-shadow:0 0 0 22px rgba(159,240,206,0)}}

/* ---------- shared section scaffolding ---------- */
main section,main .dark{position:relative}
/* Sections clip their own decorative glows so nothing ever hangs past the
   page edge. #roi opts out: its results panel is position:sticky, which an
   overflow-hidden ancestor would silently disable. */
section{padding:96px 0;overflow:hidden}
#roi{overflow:visible}
section.tight{padding-top:0}
.section-head{max-width:660px;margin-bottom:44px}
.section-head h2{margin:10px 0 12px}
.section-head p{color:var(--muted);font-size:17px}
.eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--mint);font-size:12.5px;
  letter-spacing:.16em;text-transform:uppercase;border:1px solid var(--line);border-radius:999px;
  padding:6px 14px;background:rgba(159,240,206,.04)}
.eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 12px var(--mint)}
.grid-lines{position:absolute;inset:0;z-index:0;opacity:.4;pointer-events:none;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),
                   linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(120% 100% at 78% 42%,#000 18%,transparent 82%);
  -webkit-mask-image:radial-gradient(120% 100% at 78% 42%,#000 18%,transparent 82%)}
.glow{position:absolute;border-radius:50%;background:radial-gradient(closest-side,rgba(47,191,143,.28),transparent);
  filter:blur(40px);pointer-events:none;z-index:0}
section>.wrap{position:relative;z-index:2}
.midcta{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.midcta .mono{color:var(--muted);font-size:13px}

/* elevated panel look shared by cards */
.panel,.call-card,.owner-card,.sim,.ind-card,.roi-out,.roi-grid form,.proc>div,.week>div,
.stack .layer,.assure,.founder,.faq details,.compare-wrap,.mode-panel{
  background:linear-gradient(180deg,var(--navy-2),#0C1A25);
  border:1px solid var(--line);border-radius:16px}

/* card hover lift (fine pointers only; JS adds tilt ≤2°) */
@media(hover:hover){
  .ind-card,.proc>div,.week>div,.stack .layer{transition:transform .3s var(--e-out),border-color .3s var(--e-out),box-shadow .3s var(--e-out)}
  .ind-card:hover,.proc>div:hover,.week>div:hover,.stack .layer:hover{
    transform:translateY(-3px);border-color:rgba(159,240,206,.32);
    box-shadow:0 18px 40px -24px rgba(47,191,143,.4)}
}

/* ---------- reveals (site.js drives .in; no-js shows everything) ---------- */
.reveal{opacity:0;transform:translateY(20px);
  transition:opacity .7s var(--e-out),transform .7s var(--e-out)}
.reveal.in{opacity:1;transform:none}
html.no-js .reveal,html.motion-off .reveal{opacity:1;transform:none;transition:none}

/* ---------- living signal spine (motion.js prepends into [data-spine]) ---------- */
[data-spine]{overflow:visible}
.spine{position:absolute;left:clamp(4px,1.4vw,18px);top:90px;bottom:70px;width:2px;z-index:1;
  background:rgba(159,240,206,.07);border-radius:2px;pointer-events:none}
.spine i{position:absolute;left:0;top:0;width:100%;height:100%;border-radius:2px;
  background:linear-gradient(180deg,var(--emerald),var(--mint));
  transform:scaleY(0);transform-origin:top;transition:transform 1.4s var(--e-out);
  box-shadow:0 0 12px rgba(47,191,143,.5)}
.spine.in i{transform:scaleY(1)}
@media(max-width:900px){.spine{display:none}}

/* ---------- capability rail (trust strip) ---------- */
.trust-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:rgba(13,28,39,.5);padding:18px 0;overflow:hidden}
.trust-strip ul{display:flex;gap:26px;flex-wrap:wrap;list-style:none;justify-content:center}
.trust-strip li{display:inline-flex;align-items:center;gap:9px;color:var(--muted);font-size:14px;
  white-space:nowrap}
.trust-strip li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--emerald);
  box-shadow:0 0 8px rgba(47,191,143,.8)}
.rail-track{display:flex;gap:26px;width:max-content;animation:railScroll 36s linear infinite}
.rail-track:hover{animation-play-state:paused}
@keyframes railScroll{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 13px))}}
html.motion-off .rail-track{animation:none}

/* ---------- call proof (audio player + owner summary) ---------- */
/* translucent so the aurora sky shows through between the cards */
.call-proof{background:linear-gradient(180deg,rgba(11,22,32,.55),rgba(10,21,32,.7))}
.call-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:26px;align-items:start}
@media(max-width:960px){.call-grid{grid-template-columns:1fr}}
.call-card{padding:24px}
.call-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.call-head .label{color:var(--muted);font-size:11.5px;letter-spacing:.12em}
.call-head .state{color:var(--mint);font-size:11.5px;letter-spacing:.14em}
#callWave{width:100%;display:block;margin:4px 0 12px}
.player-row{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.play{display:inline-flex;align-items:center;gap:10px;background:linear-gradient(110deg,var(--emerald-mid),var(--emerald));
  color:#04120C;border:0;border-radius:999px;padding:11px 20px;font-weight:700;font-size:14.5px;
  cursor:pointer;font-family:inherit;box-shadow:0 10px 26px -12px rgba(47,191,143,.55);
  transition:box-shadow .3s var(--e-out),transform .16s var(--e-out)}
.play:hover{box-shadow:0 14px 34px -12px rgba(47,191,143,.75);transform:translateY(-1px)}
.timer{color:var(--muted);font-size:12.5px}
.line{display:grid;grid-template-columns:86px 1fr;gap:12px;padding:9px 10px;border-radius:10px;
  border-left:2px solid transparent;transition:background .25s var(--e-out),border-color .25s var(--e-out)}
.line p{font-size:15px;color:var(--muted);transition:color .25s var(--e-out)}
.line .who{font-size:11px;letter-spacing:.1em;color:var(--muted);padding-top:3px}
.line.agent .who{color:var(--mint)}
.line.speaking{background:rgba(159,240,206,.06);border-left-color:var(--mint)}
.line.speaking p{color:var(--ink)}
.call-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.tagchip{font-family:"Spline Sans Mono",monospace;font-size:11px;letter-spacing:.08em;
  border:1px solid var(--line);border-radius:999px;padding:5px 11px;color:var(--muted);
  opacity:.55;transition:opacity .4s var(--e-out),border-color .4s var(--e-out),color .4s var(--e-out),box-shadow .4s var(--e-out)}
.tagchip.lit{opacity:1;color:var(--mint);border-color:rgba(159,240,206,.4);
  box-shadow:0 0 14px -4px rgba(47,191,143,.5)}
/* Honesty badge riding beside a heading. These labels are what keep the
   section truthful about built-vs-planned, so they hold the 11px floor and
   step back via weight and opacity, never by shrinking below legibility. */
.tagchip.inl{vertical-align:middle;margin-left:7px;position:relative;top:-1px}
.tagchip.warm.lit{color:var(--warm);border-color:rgba(240,180,98,.45);box-shadow:0 0 14px -4px rgba(240,180,98,.4)}
.foot-note{margin-top:12px;color:var(--muted);font-size:12.5px}
.owner-card{padding:24px}
.owner-card h3{margin-bottom:14px}
.owner-card .note{color:var(--muted);font-size:13px;margin-top:10px}
.owner-card .midcta{margin-top:18px}
.sms{background:#0A1822;border:1px solid rgba(159,240,206,.2);border-radius:14px 14px 14px 4px;
  padding:14px 16px;font-size:14.5px;color:var(--ink);line-height:1.5;display:block}
.sms .mono{display:block;color:var(--mint);font-size:11px;letter-spacing:.14em;margin-bottom:8px}
.summary-arrive{opacity:0;transform:translateY(18px) scale(.985);
  transition:opacity .8s var(--e-out),transform .8s var(--e-out)}
.summary-arrive.in{opacity:1;transform:none}
html.no-js .summary-arrive,html.motion-off .summary-arrive{opacity:1;transform:none}

/* ---------- simulator ---------- */
.sim{padding:22px;overflow:hidden}
.sim-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.sim-head>.mono{font-size:11px;letter-spacing:.13em;color:var(--muted)}
.sim-head [data-sim-state]{color:var(--mint);border:1px solid var(--line);border-radius:999px;padding:4px 12px}
.sim-scenarios{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
.sim-scenarios button{font-family:inherit;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer;
  background:rgba(159,240,206,.04);border:1px solid var(--line);border-radius:999px;padding:8px 15px;
  transition:all .25s var(--e-out)}
.sim-scenarios button:hover{color:var(--ink);border-color:rgba(159,240,206,.35)}
.sim-scenarios button[aria-pressed="true"]{background:var(--mint);color:#04120C;border-color:var(--mint)}
.stage-rail{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:18px}
.stage-pill{font-family:"Spline Sans Mono",monospace;font-size:11px;letter-spacing:.06em;
  color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:5px 11px;
  transition:all .3s var(--e-out)}
.stage-pill.done{color:var(--emerald);border-color:rgba(47,191,143,.4)}
.stage-pill.active{color:#04120C;background:var(--mint);border-color:var(--mint);
  box-shadow:0 0 16px -4px rgba(159,240,206,.7)}
.sim-idle{text-align:center;padding:34px 20px}
.sim-idle p{color:var(--muted);max-width:56ch;margin:14px auto 22px}
.ghost-rail{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.ghost-rail span{font-family:"Spline Sans Mono",monospace;font-size:11px;color:var(--muted);opacity:.5;
  border:1px dashed var(--line);border-radius:999px;padding:5px 12px}
.cta-row{display:flex;gap:14px;flex-wrap:wrap}
.sim-body{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:18px;margin-bottom:16px}
@media(max-width:940px){.sim-body{grid-template-columns:1fr}}
.sim-col h3{font-size:12px;font-family:"Spline Sans Mono",monospace;font-weight:500;letter-spacing:.13em;
  text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.sim-line{display:block;padding:8px 11px;border-radius:10px;margin-bottom:7px;font-size:14px;
  color:var(--muted);background:rgba(159,240,206,.03);border-left:2px solid transparent;
  opacity:0;transform:translateY(6px);transition:opacity .4s var(--e-out),transform .4s var(--e-out)}
.sim-line.on{opacity:1;transform:none;color:var(--ink);border-left-color:rgba(159,240,206,.35)}
.sim-line .who{display:block;font-family:"Spline Sans Mono",monospace;font-size:11px;
  letter-spacing:.12em;color:var(--mint);margin-bottom:2px}
.sim-chips{display:flex;gap:7px;flex-wrap:wrap}
.sim-chip{font-size:12.5px;border:1px solid rgba(159,240,206,.3);color:var(--mint);
  border-radius:999px;padding:5px 12px;opacity:0;transform:scale(.9);
  transition:opacity .35s var(--e-out),transform .35s var(--e-out)}
.sim-chip.on{opacity:1;transform:none}
.sim-chip.amber{border-color:rgba(240,180,98,.45);color:var(--warm)}
.sim-rule{font-size:13px;padding:7px 11px;border-radius:9px;margin-bottom:6px;color:var(--muted);
  background:rgba(159,240,206,.03);border:1px solid var(--line);display:flex;align-items:center;gap:8px}
.sim-rule::before{font-weight:700}
.sim-rule.pass{color:var(--ink)} .sim-rule.pass::before{content:"✓";color:var(--emerald)}
.sim-rule.urgent{color:var(--warm);border-color:rgba(240,180,98,.4)} .sim-rule.urgent::before{content:"!";color:var(--warm)}
.sim-rule.block{color:var(--muted)} .sim-rule.block::before{content:"✕";color:var(--bad)}
.sim-rule.amber{color:var(--warm)} .sim-rule.amber::before{content:"?";color:var(--warm)}
.sim-out-card{border:1px solid var(--line);border-radius:11px;padding:10px 13px;margin-bottom:8px;
  font-size:13.5px;color:var(--muted);opacity:.55;transition:all .4s var(--e-out)}
.sim-out-card .mono{display:block;font-size:11px;letter-spacing:.13em;color:var(--muted);margin-bottom:3px}
.sim-out-card.on{opacity:1;color:var(--ink);border-color:rgba(159,240,206,.35);
  background:rgba(159,240,206,.04)}
.sim-out-card.on .mono{color:var(--mint)}
.sim-out-card.on.warm{border-color:rgba(240,180,98,.45)} .sim-out-card.on.warm .mono{color:var(--warm)}
.sim-controls{display:flex;align-items:center;gap:9px;flex-wrap:wrap;position:relative;
  border-top:1px solid var(--line);padding-top:15px}
.sim-controls button{font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;color:var(--ink);
  background:rgba(159,240,206,.05);border:1px solid var(--line);border-radius:9px;padding:8px 14px;
  transition:all .2s var(--e-out)}
.sim-controls button:hover{border-color:rgba(159,240,206,.4)}
.sim-controls button.primary{background:var(--mint);color:#04120C;border-color:var(--mint)}
.sim-progress{flex:1;min-width:90px;height:3px;border-radius:3px;background:rgba(159,240,206,.12);overflow:hidden}
.sim-progress i{display:block;height:100%;background:linear-gradient(90deg,var(--emerald),var(--mint));
  transform:scaleX(0);transform-origin:left;transition:transform .5s var(--e-out)}
.sim-elapsed{font-family:"Spline Sans Mono",monospace;font-size:11px;color:var(--muted)}
.sim-static{margin-top:18px;padding:16px 20px}
.sim-static summary{cursor:pointer;font-weight:600;color:var(--muted)}
.sim-static summary:hover{color:var(--ink)}

/* ---------- signal path (#how) ---------- */
.path-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;counter-reset:step}
@media(max-width:940px){.path-steps{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.path-steps{grid-template-columns:1fr}}
.pstep{counter-increment:step;background:linear-gradient(180deg,var(--navy-2),#0C1A25);
  border:1px solid var(--line);border-radius:16px;padding:22px;position:relative;
  opacity:.45;transform:translateY(10px);
  transition:opacity .6s var(--e-out),transform .6s var(--e-out),border-color .6s var(--e-out)}
.pstep::before{content:counter(step,decimal-leading-zero);font-family:"Spline Sans Mono",monospace;
  font-size:11px;letter-spacing:.12em;color:var(--mint);display:block;margin-bottom:10px}
.pstep h3{margin-bottom:7px}
.pstep p{color:var(--muted);font-size:14.5px}
.pstep.active{opacity:1;transform:none;border-color:rgba(159,240,206,.28)}
html.no-js .pstep,html.motion-off .pstep{opacity:1;transform:none}

/* ---------- coverage modes ---------- */
.modes [role=tablist]{display:inline-flex;gap:6px;background:rgba(159,240,206,.05);
  border:1px solid var(--line);border-radius:999px;padding:5px;margin-bottom:22px;flex-wrap:wrap}
.modes [role=tab]{font-family:inherit;font-size:14px;font-weight:600;color:var(--muted);cursor:pointer;
  background:transparent;border:0;border-radius:999px;padding:9px 18px;transition:all .25s var(--e-out)}
.modes [role=tab]:hover{color:var(--ink)}
.modes [role=tab][aria-selected="true"]{background:var(--mint);color:#04120C}
.mode-panel{padding:24px}
.mode-panel dl{display:grid;grid-template-columns:repeat(2,1fr);gap:18px 26px}
@media(max-width:700px){.mode-panel dl{grid-template-columns:1fr}}
.mode-panel dt{font-family:"Spline Sans Mono",monospace;font-size:11px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--mint);margin-bottom:5px}
.mode-panel dd{color:var(--muted);font-size:15px}

/* ---------- industries ---------- */
.ind-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:1020px){.ind-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.ind-grid{grid-template-columns:1fr}}
.ind-card{padding:20px;overflow:hidden}
.ind-card .art{position:relative;height:86px;border-radius:10px;margin-bottom:14px;
  border:1px solid rgba(159,240,206,.1);background-color:#02080D;
  background-size:cover;background-position:center;background-repeat:no-repeat}
.ind-card .art::after{content:"";position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(180deg,rgba(2,8,13,.18) 0%,rgba(6,20,29,.62) 100%)}
.ind-card>.mono{font-size:11px;letter-spacing:.14em;color:var(--mint)}
.ind-card h3{margin:7px 0 8px}
.ind-card p{color:var(--muted);font-size:14px}

/* ---------- ROI ---------- */
.roi-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
@media(max-width:900px){.roi-grid{grid-template-columns:1fr}}
.roi-grid form{padding:24px;display:grid;gap:16px}
.roi-grid label{font-weight:700;font-size:14.5px;display:block;margin-bottom:7px}
.roi-grid input{width:100%;padding:12px 13px;font-size:15.5px;font-family:inherit;color:var(--ink);
  background:rgba(159,240,206,.04);border:1px solid var(--line);border-radius:10px;min-height:46px;
  transition:border-color .2s var(--e-out),box-shadow .2s var(--e-out)}
.roi-grid input:focus{outline:none;border-color:rgba(159,240,206,.5);
  box-shadow:0 0 0 3px rgba(47,191,143,.18)}
.roi-grid .hint{color:var(--muted);font-size:12.5px;margin-top:6px}
.roi-out{padding:24px;position:sticky;top:86px}
.roi-out h3{margin-bottom:16px}
.roi-out .row{padding:13px 0;border-top:1px solid var(--line)}
.roi-out .lbl{font-size:11px;letter-spacing:.13em;color:var(--muted);margin-bottom:5px}
.roi-out .big{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;letter-spacing:-.02em;
  font-size:clamp(26px,3vw,34px);color:var(--mint)}
.roi-out .big.tick{animation:tickPop .22s var(--e-out)}
@keyframes tickPop{0%{transform:scale(1)}45%{transform:scale(1.045)}100%{transform:scale(1)}}
.roi-out .disclaimer{color:var(--muted);font-size:12px;margin-top:14px;line-height:1.5}

/* ---------- proc cards (process / pricing preview / beyond) ---------- */
.proc{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:900px){.proc{grid-template-columns:1fr}}
.proc>div{padding:22px}
.proc h3{margin-bottom:8px}
.proc p{color:var(--muted);font-size:14.5px}
.proc p+p{margin-top:6px}

/* ---------- build stack ---------- */
.stack{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:940px){.stack{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.stack{grid-template-columns:1fr}}
.stack .layer{padding:18px;display:block;opacity:0;transform:translateY(16px);
  transition:opacity .6s var(--e-out),transform .6s var(--e-out)}
.stack.in .layer{opacity:1;transform:none}
html.no-js .stack .layer,html.motion-off .stack .layer{opacity:1;transform:none}
.stack strong{display:block;font-family:"Bricolage Grotesque",sans-serif;font-size:16px;margin-bottom:5px}
.stack span{color:var(--muted);font-size:13.5px}

/* ---------- first week ---------- */
.week{display:grid;grid-template-columns:repeat(5,1fr);gap:13px;position:relative}
@media(max-width:960px){.week{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.week{grid-template-columns:1fr}}
.week>div{padding:18px}
.week .mono{font-size:11px;letter-spacing:.14em;color:var(--mint)}
.week h3{margin:7px 0 6px;font-size:16.5px}
.week p{color:var(--muted);font-size:13.5px}

/* ---------- comparison ---------- */
.compare-wrap{overflow-x:auto;padding:6px}
table.compare{width:100%;border-collapse:collapse;min-width:640px;font-size:14.5px}
.compare th,.compare td{padding:12px 14px;text-align:left;border-bottom:1px solid rgba(159,240,206,.08)}
.compare thead th{font-family:"Spline Sans Mono",monospace;font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted)}
.compare thead th:last-child{color:var(--mint)}
.compare tbody th{color:var(--ink);font-weight:600;font-size:14px}
.compare td.yes{color:var(--mint)} .compare td.yes::before{content:"✓ ";color:var(--emerald)}
.compare td.no{color:var(--muted);opacity:.7} .compare td.no::before{content:"✕ ";color:var(--bad)}
.compare td.part{color:var(--warm)}
.compare tbody tr{transition:background .2s var(--e-out)}
.compare tbody tr:hover{background:rgba(159,240,206,.03)}

/* ---------- pricing preview cards ---------- */
.price-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:900px){.price-cards{grid-template-columns:1fr}}
.price-card{background:linear-gradient(180deg,var(--navy-2),#0C1A25);border:1px solid var(--line);
  border-radius:16px;padding:24px;position:relative;
  transition:transform .3s var(--e-out),border-color .3s var(--e-out),box-shadow .3s var(--e-out)}
@media(hover:hover){.price-card:hover{transform:translateY(-3px);border-color:rgba(159,240,206,.32);
  box-shadow:0 18px 40px -24px rgba(47,191,143,.4)}}
.price-card.rec{border-color:rgba(47,191,143,.45);box-shadow:0 18px 48px -28px rgba(14,143,106,.5)}
.price-card .rec-tag{position:absolute;top:-11px;left:20px;font-family:"Spline Sans Mono",monospace;
  font-size:11px;letter-spacing:.13em;background:var(--mint);color:#04120C;border-radius:999px;
  padding:4px 11px;font-weight:700}
.price-card h3{font-size:21px}
.price-card .amount{font-family:"Bricolage Grotesque",sans-serif;font-size:36px;font-weight:800;
  letter-spacing:-.02em;margin:8px 0 2px;color:var(--ink)}
.price-card .amount span{font-size:15px;font-weight:400;color:var(--muted);font-family:"Atkinson Hyperlegible",sans-serif}
.price-card .meta{color:var(--muted);font-size:13.5px}
.price-card .annual-line{color:var(--mint);font-size:12.5px;margin-top:8px}

/* ---------- assure / founder ---------- */
.assure{padding:26px;display:grid;gap:14px}
.assure p{color:var(--muted);font-size:15.5px;display:flex;gap:10px;align-items:baseline}
.assure .ok{color:var(--emerald);font-weight:700;flex:0 0 auto}
.founder{display:flex;gap:18px;align-items:center;padding:18px;margin-top:6px}
.founder img{border-radius:50%;border:2px solid rgba(159,240,206,.3);flex:0 0 auto}
.founder p{color:var(--muted);font-size:14.5px;display:block}

/* ---------- FAQ ---------- */
.faq details{margin-bottom:10px;overflow:hidden}
.faq summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:14px;
  padding:17px 20px;font-weight:700;font-size:16px;font-family:"Bricolage Grotesque",sans-serif;
  transition:color .2s var(--e-out)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"+";font-family:"Spline Sans Mono",monospace;font-weight:400;font-size:19px;
  color:var(--mint);width:26px;height:26px;flex:0 0 auto;display:grid;place-items:center;
  border:1px solid var(--line);border-radius:50%;transition:transform .3s var(--e-out),background .3s var(--e-out)}
.faq details[open] summary::before{transform:rotate(45deg);background:rgba(159,240,206,.1)}
.faq summary:hover{color:var(--mint)}
.faq details p{padding:0 20px 18px 60px;color:var(--muted);font-size:15px;
  animation:faqOpen .35s var(--e-out)}
.faq details a{color:var(--mint);text-decoration:underline;text-underline-offset:3px}
@keyframes faqOpen{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
html.motion-off .faq details p{animation:none}

/* ---------- final CTA ---------- */
.final-cta{text-align:center;padding:110px 0;overflow:hidden;
  /* a dark cushion behind the closing words so the aurora can never crowd them */
  background:radial-gradient(60% 72% at 50% 42%,rgba(11,22,32,.6),transparent 78%)}
.final-cta h2{margin:12px auto 12px;max-width:18ch}
.final-cta>.wrap>p{color:var(--muted);max-width:52ch;margin:0 auto 28px}
.final-cta .eyebrow{margin:0 auto}

/* ---------- footer ---------- */
.site-footer{border-top:1px solid var(--line);background:var(--navy-0);padding:56px 0 32px}
.site-footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px;margin-bottom:34px}
@media(max-width:760px){.site-footer .cols{grid-template-columns:1fr}}
.site-footer .foot-h{font-size:15px;margin-bottom:12px;font-weight:700;letter-spacing:-.01em}
.site-footer p{color:var(--muted);font-size:14px}
.site-footer .cols a{display:block;color:var(--muted);font-size:14px;padding:4px 0;width:fit-content;
  position:relative;transition:color .2s var(--e-out)}
.site-footer .cols a::after{content:"";position:absolute;left:0;bottom:2px;height:1px;width:100%;
  background:var(--mint);transform:scaleX(0);transform-origin:left;transition:transform .25s var(--e-out)}
.site-footer .cols a:hover{color:var(--ink)}
.site-footer .cols a:hover::after{transform:scaleX(1)}
.site-footer .base{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;
  border-top:1px solid rgba(159,240,206,.08);padding-top:20px;color:var(--muted);font-size:13px}

/* ---------- mobile call bar ---------- */
.callbar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:none;text-align:center;
  background:linear-gradient(110deg,var(--emerald-mid),var(--emerald));color:#04120C;font-weight:700;
  padding:14px 16px calc(14px + env(safe-area-inset-bottom));box-shadow:0 -8px 30px -12px rgba(0,0,0,.5)}
@media(max-width:820px){
  .callbar{display:block}
  .site-footer{padding-bottom:96px}
}

/* ---------- inline scheduler on the final CTA ---------- */
.inline-book{max-width:760px;margin:44px auto 0;text-align:center}
.inline-book>.mono{color:var(--muted);font-size:12.5px;letter-spacing:.14em;
  text-transform:uppercase;margin-bottom:14px}
.inline-book-frame{border:1px solid var(--line);border-radius:16px;overflow:hidden;
  background:rgba(13,28,39,.6);min-height:120px}
.inline-book-frame:empty::after{content:"Loading the scheduler…";display:block;
  padding:44px 0;color:var(--muted);font-size:14px}

/* ---------- post-call prompt ----------
   Appears once, only after the visitor actually left to place a call.
   Sits above the mobile callbar and never covers the primary CTA. */
.callback-bar{position:fixed;left:50%;bottom:18px;z-index:70;transform:translate(-50%,140%);
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center;
  width:min(760px,calc(100vw - 28px));padding:14px 16px;
  background:rgba(9,20,28,.97);border:1px solid rgba(159,240,206,.3);border-radius:16px;
  box-shadow:0 24px 60px -24px rgba(0,0,0,.75);
  opacity:0;transition:transform .45s var(--e-out),opacity .45s var(--e-out)}
.callback-bar.in{transform:translate(-50%,0);opacity:1}
.callback-bar span{color:var(--ink);font-size:14.5px;flex:1 1 260px;min-width:0}
.callback-close{flex:0 0 auto;width:30px;height:30px;border-radius:50%;cursor:pointer;
  background:transparent;border:1px solid var(--line);color:var(--muted);font-size:18px;
  line-height:1;font-family:inherit;transition:color .2s,border-color .2s}
.callback-close:hover{color:var(--ink);border-color:rgba(159,240,206,.4)}
@media(max-width:820px){.callback-bar{bottom:76px}}
@media(prefers-reduced-motion:reduce){
  .callback-bar{transition:none;transform:translate(-50%,0);opacity:0}
  .callback-bar.in{opacity:1}
}

/* ---------- motion toggle ---------- */
.motion-toggle-btn{font-family:"Spline Sans Mono",monospace;font-size:11px;letter-spacing:.08em;
  color:var(--muted);background:rgba(11,22,32,.7);border:1px solid var(--line);border-radius:999px;
  padding:6px 13px;cursor:pointer;transition:color .2s var(--e-out),border-color .2s var(--e-out)}
.motion-toggle-btn:hover{color:var(--ink);border-color:rgba(159,240,206,.4)}

/* ---------- reduced motion ---------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
  .rail-track{animation:none}
  .reveal,.summary-arrive,.stack .layer,.pstep{opacity:1!important;transform:none!important}
}