/* ==========================================================================
   ASCENDRAYS — shared stylesheet, used by every page in the site.
   Split out of the original single-file build so index.html, programs.html,
   process.html, compliance.html, calculator.html, faq.html and contact.html
   all share one source of truth for tokens, layout and components.
   Full colour-system documentation: PALETTE.md
   ========================================================================== */

/* ---------------------------------------------------------------- tokens */
:root{
  /* ==========================================================================
     COLOUR SYSTEM — derived from the Ascendrays logo, not estimated.
     Brand values were sampled from the logo artwork itself (k-means over the
     opaque pixels of the mark, plus the flat wordmark navy). Every ramp below
     was generated in OKLCH from its brand hue+chroma against a fixed lightness
     ladder, so steps are perceptually even and the numbers mean the same
     lightness in every family. The step nearest each brand colour is pinned to
     the exact brand value. Contrast ratios for each real pairing are noted.
     Full documentation: PALETTE.md
     ========================================================================== */

  /* -- brand, exact values sampled from the logo ---------------------------- */
  --brand-navy:#1C2952;      /* wordmark */
  --brand-indigo:#493F80;    /* lower rays */
  --brand-violet:#885069;    /* gradient transition */
  --brand-orange:#F37D19;    /* primary rays */
  --brand-gold:#FEA814;      /* ray tips */

  /* -- navy ramp (anchor 800 = brand navy) ---------------------------------- */
  --navy-50:#E9F6FF;  --navy-100:#DCE9FF; --navy-200:#C6D4F8;
  --navy-300:#A7B7DF; --navy-400:#8697C4; --navy-500:#6779A7;
  --navy-600:#4E5C83; --navy-700:#384464; --navy-800:#1C2952;
  --navy-900:#11182D;

  /* -- indigo ramp (anchor 700 = brand indigo) ------------------------------ */
  --indigo-100:#E7E4FF; --indigo-300:#B4AFEA; --indigo-500:#7770B4;
  --indigo-700:#493F80; --indigo-900:#191432;

  /* -- violet ramp (anchor 600 = brand violet) ------------------------------ */
  --violet-100:#FFDDED; --violet-300:#D9A7BB;
  --violet-600:#885069; --violet-800:#422230;

  /* -- orange ramp (anchor 400 = brand orange) ------------------------------ */
  --orange-100:#FFD6A7; --orange-200:#FFBE89; --orange-400:#F37D19;
  --orange-500:#C45500; --orange-600:#9B3D00; --orange-700:#772800;

  /* -- gold ramp (anchor 300 = brand gold) ---------------------------------- */
  --gold-100:#FFDF9D; --gold-300:#FEA814; --gold-500:#B46500;

  /* -- semantic roles: these are what the UI actually references ------------ */
  --paper:#EFF2FC;                 /* page background */
  --paper-2:#F8FAFF;               /* raised background */
  --surface:#FFFFFF;                  /* cards */
  --ink:var(--navy-900);              /* body text — 15.75:1 on paper */
  --ink-2:var(--navy-800);
  --ink-soft:var(--navy-600);         /* secondary text — 5.90:1 on paper */
  --line:rgba(17,24,45,.14);
  --line-2:rgba(17,24,45,.07);

  --accent:var(--brand-orange);       /* fills, graphics, CTA surfaces */
  --accent-ink:var(--navy-900);       /* text ON accent — 6.51:1 */
  --accent-text:var(--orange-600);    /* accent-coloured text on light — 6.13:1 */
  --signal:var(--brand-gold);         /* highlights on dark — 9.08:1 on navy-900 */

  --on-dark:var(--navy-100);          /* text on dark panels — 14.38:1 */
  --on-dark-soft:var(--navy-300);     /* 8.79:1 */
  --on-dark-muted:var(--navy-400);    /* 6.07:1 — smallest mono still passes */

  --ok:#3FB785;                     /* status green — 6.98:1 on navy-900 */
  --bad:#EA6972;                     /* status red — 5.67:1 on navy-900 */
  --note-bg:#FFEED5;
  --note-ink:var(--orange-700);       /* 8.83:1 on note-bg */

  /* -- legacy aliases, kept so older rules keep resolving ------------------- */
  --blue:var(--indigo-700);
  --blue-soft:var(--indigo-100);
  --violet:var(--brand-violet);
  --amber:var(--accent);
  --amber-2:var(--signal);
  --mint:var(--ok);
  --rose:var(--bad);

  --display:"Bricolage Grotesque","Instrument Sans",system-ui,sans-serif;
  --body:"Instrument Sans",system-ui,-apple-system,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

  --shell:min(1240px,92vw);
  --r:14px;
  --ease:cubic-bezier(.2,.7,.2,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--body);font-size:17px;line-height:1.55;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img,svg{display:block;max-width:100%}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}

/* paper grain + faint grid, very low contrast */
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(17,24,45,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(17,24,45,.035) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(circle at 50% 0%,#000 0%,transparent 78%);
}

:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:4px}

.shell{width:var(--shell);margin-inline:auto;position:relative;z-index:1}
.section{padding:clamp(64px,9vw,128px) 0}
.section--tight{padding:clamp(48px,6vw,84px) 0}

/* ------------------------------------------------------------ typography */
h1,h2,h3,h4{font-family:var(--display);margin:0;letter-spacing:-.02em;line-height:1.02;font-weight:700}
h1{font-size:clamp(38px,6.4vw,76px);font-variation-settings:"wdth" 92}
h2{font-size:clamp(30px,4.4vw,52px);font-variation-settings:"wdth" 92}
h3{font-size:clamp(20px,2.2vw,26px);line-height:1.15}
p{margin:0}
.lede{font-size:clamp(17px,1.55vw,20px);color:var(--ink-soft);max-width:58ch}

.eyebrow{
  font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-soft);display:flex;align-items:center;gap:10px;
}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--ink-soft);opacity:.6}
.eyebrow--plain::before{display:none}

.mono{font-family:var(--mono)}
.hl{background:linear-gradient(transparent 62%,rgba(254,168,20,.45) 62%)}

/* ---------------------------------------------------------------- buttons */
.btn{
  --bg:var(--ink);--fg:var(--surface);
  display:inline-flex;align-items:center;gap:10px;
  background:var(--bg);color:var(--fg);text-decoration:none;
  padding:14px 22px;border:1px solid transparent;border-radius:999px;
  font-weight:600;font-size:15.5px;cursor:pointer;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .25s;
  box-shadow:0 1px 0 rgba(17,24,45,.18);
}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px -12px rgba(17,24,45,.5)}
.btn:active{transform:translateY(0)}
.btn--accent{--bg:var(--accent);--fg:var(--accent-ink);box-shadow:0 1px 0 rgba(17,24,45,.2)}
.btn--ghost{--bg:transparent;--fg:var(--ink);border-color:var(--line);box-shadow:none}
.btn--ghost:hover{background:var(--surface)}
.btn .arw{transition:transform .35s var(--ease)}
.btn:hover .arw{transform:translateX(4px)}

/* ------------------------------------------------------------------- nav */
.nav{
  position:sticky;top:0;z-index:60;
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  background:rgba(239,242,252,.74);border-bottom:1px solid transparent;
  transition:border-color .3s,background .3s;
}
.nav.is-stuck{border-bottom-color:var(--line);background:rgba(239,242,252,.93)}
.nav__in{display:flex;align-items:center;gap:28px;height:70px}
/* --------------------------------------------------------- brand / logo */
.brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none}
.mark{height:32px;width:auto;flex:none;will-change:clip-path,transform}
.brand .wm{height:15px;width:auto}
.brand--foot .mark{height:38px}
.brand--foot .wm{height:17px}

/* the rays grow up out of their base, then settle */
.mark{animation:rays 1s var(--ease) both}
.brand .wm{animation:wm-in .7s .34s var(--ease) both}
@keyframes rays{
  0%{clip-path:inset(100% 0 0 0);transform:translateY(6px) scale(.94);opacity:0}
  55%{opacity:1}
  70%{clip-path:inset(0 0 0 0);transform:translateY(0) scale(1.04)}
  100%{clip-path:inset(0 0 0 0);transform:none;opacity:1}
}
@keyframes wm-in{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}

/* hover: the mark lifts and warms, like the rays catching light */
.brand .mark{transition:transform .5s var(--ease),filter .5s var(--ease)}
.brand:hover .mark{transform:translateY(-2px) scale(1.07);filter:drop-shadow(0 6px 14px rgba(243,125,25,.45))}

.tagline{
  font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-soft);margin:12px 0 14px;padding-top:12px;border-top:1px solid var(--line);
  max-width:340px;
}

/* ------------------------------------------------------------- splash */
.splash{
  position:fixed;inset:0;z-index:200;background:var(--paper);
  display:grid;place-items:center;transition:opacity .7s var(--ease),visibility .7s;
}
.splash.out{opacity:0;visibility:hidden}
.splash__in{text-align:center;display:grid;justify-items:center;gap:18px}
.splash .mark{height:clamp(104px,17vw,158px);animation-duration:1.25s}
.splash__wm{
  width:min(340px,62vw);height:auto;
  animation:wm-rise 1s .5s var(--ease) both;
}
@keyframes wm-rise{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
.splash__tag{
  margin-top:2px;font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);
  border-top:1px solid var(--line);padding-top:12px;animation:fadeUp .8s .8s var(--ease) backwards;
}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.nav__links{display:flex;gap:26px;margin-left:auto;font-size:15px}
.nav__links a{text-decoration:none;color:var(--ink-soft);position:relative;padding:4px 0}
.nav__links a::after{content:"";position:absolute;left:0;bottom:0;height:1.5px;width:0;background:var(--ink);transition:width .3s var(--ease)}
.nav__links a:hover{color:var(--ink)}
.nav__links a:hover::after{width:100%}
.nav .btn{padding:11px 18px;font-size:14.5px}
@media(max-width:900px){.nav__links{display:none}.nav__in{gap:14px}.nav .btn{margin-left:auto}}

/* ------------------------------------------------------------------ hero */
.hero{padding-top:clamp(40px,5vw,74px);padding-bottom:clamp(48px,6vw,90px)}
.hero__grid{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(28px,4vw,58px);align-items:center}
@media(max-width:1000px){.hero__grid{grid-template-columns:1fr;gap:40px}}
.hero h1{margin:18px 0 20px}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.hero__meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.chip{
  font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;
  border:1px solid var(--line);border-radius:999px;padding:6px 12px;color:var(--ink-soft);background:rgba(255,255,255,.55);
}

/* ------------------------------------------------- signature: send console */
.console{
  background:var(--ink);color:var(--on-dark);border-radius:18px;padding:18px;
  box-shadow:0 40px 80px -50px rgba(17,24,45,.8),0 2px 0 rgba(255,255,255,.4) inset;
  position:relative;overflow:hidden;
}
.console::after{
  content:"";position:absolute;inset:-40% -10% auto;height:80%;
  background:radial-gradient(60% 60% at 30% 0%,rgba(73,63,128,.5),transparent 70%);
  pointer-events:none;
}
.console__bar{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:11.5px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--on-dark-muted);position:relative;z-index:1}
.dot{width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 0 rgba(63,183,133,.6);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(63,183,133,0)}100%{box-shadow:0 0 0 0 rgba(63,183,133,0)}}
.tag-sample{margin-left:auto;border:1px solid rgba(243,125,25,.6);color:var(--amber);border-radius:999px;padding:3px 9px;font-size:10px}

.console__head{display:flex;align-items:flex-end;gap:16px;margin:18px 0 12px;position:relative;z-index:1}
.throughput{font-family:var(--display);font-size:clamp(34px,4.6vw,52px);font-variation-settings:"wdth" 88;line-height:1}
.throughput span{font-size:.42em;color:var(--on-dark-muted);font-family:var(--mono);margin-left:8px;letter-spacing:.08em}
.delta{font-family:var(--mono);font-size:12px;color:var(--mint);margin-bottom:6px}

.wave{display:flex;align-items:flex-end;gap:3px;height:104px;position:relative;z-index:1}
.wave i{
  flex:1;background:linear-gradient(180deg,#7770B4,#1C2952);border-radius:2px 2px 1px 1px;
  height:12%;transition:height .7s var(--ease),background .7s var(--ease);
}
.wave i.hot{background:linear-gradient(180deg,#FEA814,#F37D19)}
.wave-axis{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10px;color:var(--on-dark-muted);
  margin-top:8px;letter-spacing:.08em;position:relative;z-index:1}

.placement{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:20px;position:relative;z-index:1}
.pl{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);border-radius:10px;padding:11px 12px}
.pl b{font-family:var(--display);font-size:22px;display:block;font-variation-settings:"wdth" 88}
.pl small{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--on-dark-muted)}
.pl .track{height:3px;background:rgba(255,255,255,.12);border-radius:2px;margin-top:9px;overflow:hidden}
.pl .track i{display:block;height:100%;width:0;background:var(--mint);transition:width 1.4s var(--ease)}
.pl.warn .track i{background:var(--amber)}
.pl.bad .track i{background:var(--rose)}

.log{margin-top:18px;border-top:1px solid rgba(255,255,255,.1);padding-top:12px;font-family:var(--mono);
  font-size:11.5px;line-height:1.9;color:var(--on-dark-soft);height:118px;overflow:hidden;position:relative;z-index:1}
.log div{display:flex;gap:10px;animation:slideIn .45s var(--ease) both}
.log .t{color:var(--on-dark-muted);flex:none}
.log .ok{color:var(--mint)}
.log .wm{color:var(--amber)}
@keyframes slideIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ------------------------------------------------------------- marquee */

.marquee{border-block:1px solid var(--line);background:var(--paper-2);overflow:hidden;padding:16px 0}
.marquee__track{display:flex;gap:44px;width:max-content;animation: marquee 15s linear infinite;}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee span{font-family:var(--mono);font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);white-space:nowrap;display:flex;align-items:center;gap:44px}
.marquee span::after{content:"◆";font-size:8px;color:var(--amber)}
@keyframes scroll{to{transform:translateX(-50%)}}

/* --------------------------------------------------------------- headers */
.head{max-width:64ch;margin-bottom:clamp(30px,4vw,54px)}
.head h2{margin:14px 0 16px}

/* ----------------------------------------------------------------- tabs */
.tabs{display:flex;gap:6px;background:rgba(255,255,255,.6);border:1px solid var(--line);
  border-radius:999px;padding:5px;width:max-content;max-width:100%;flex-wrap:wrap}
.tab{border:0;background:transparent;border-radius:999px;padding:10px 20px;cursor:pointer;
  font-weight:600;font-size:15px;color:var(--ink-soft);transition:color .25s}
.tab[aria-selected="true"]{background:var(--ink);color:var(--surface)}
.panel[hidden]{display:none}
.panel{margin-top:30px}
.two{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(20px,3vw,44px)}
@media(max-width:900px){.two{grid-template-columns:1fr}}

.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:clamp(20px,2.6vw,30px)}
.card--ink{background:var(--ink);color:var(--on-dark);border-color:transparent}
.card--ink .eyebrow{color:var(--on-dark-muted)}
.card--ink .eyebrow::before{background:var(--on-dark-muted)}

.ticks{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:13px}
.ticks li{display:flex;gap:12px;align-items:flex-start;font-size:16px;color:var(--ink-soft)}
.card--ink .ticks li{color:var(--on-dark-soft)}
.ticks svg{flex:none;margin-top:4px}

.terms{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-top:22px}
.terms div{background:var(--surface);padding:16px 18px}
.terms dt{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.terms dd{margin:6px 0 0;font-family:var(--display);font-size:19px;font-variation-settings:"wdth" 90}

/* -------------------------------------------------------------- process */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
@media(max-width:900px){.steps{grid-template-columns:1fr}}
.step{background:var(--paper-2);padding:clamp(22px,2.6vw,30px);position:relative;transition:background .35s var(--ease)}
.step:hover{background:var(--surface)}
.step__n{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--blue)}
.step h3{margin:12px 0 8px;font-size:21px}
.step p{color:var(--ink-soft);font-size:15.5px}
.step::after{content:"";position:absolute;left:0;top:0;height:2px;width:0;background:var(--blue);transition:width .5s var(--ease)}
.step:hover::after{width:100%}

/* ------------------------------------------------------------ compliance */
.comp{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:900px){.comp{grid-template-columns:1fr}}
.comp .card{transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.comp .card:hover{transform:translateY(-4px);box-shadow:0 22px 40px -30px rgba(17,24,45,.5)}
.comp h3{font-size:19px;margin-bottom:8px}
.comp p{color:var(--ink-soft);font-size:15.5px}
.badge{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--blue);background:var(--blue-soft);border-radius:6px;padding:4px 8px;display:inline-block;margin-bottom:14px}

/* ----------------------------------------------------------------- stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border-block:1px solid var(--line)}
@media(max-width:820px){.stats{grid-template-columns:repeat(2,1fr)}}
.stat{background:var(--paper);padding:clamp(24px,3vw,38px) clamp(16px,2vw,26px)}
.stat b{display:block;font-family:var(--display);font-size:clamp(34px,4.6vw,56px);font-variation-settings:"wdth" 88;line-height:1;letter-spacing:-.03em}
.stat small{display:block;margin-top:10px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}

/* ------------------------------------------------------------ calculator */
.calc{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px);align-items:start}
@media(max-width:900px){.calc{grid-template-columns:1fr}}
.field{margin-bottom:20px}
.field label{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--mono);
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:9px}
.field label b{font-family:var(--display);font-size:17px;color:var(--ink);letter-spacing:-.01em}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:3px;background:var(--line);border-radius:2px;cursor:pointer}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;
  background:var(--ink);border:3px solid var(--paper-2);box-shadow:0 2px 8px rgba(17,24,45,.35);transition:transform .2s}
input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.15)}
input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--ink);border:3px solid var(--paper-2)}

.out{background:var(--ink);color:var(--on-dark);border-radius:var(--r);padding:clamp(22px,2.6vw,30px);position:sticky;top:96px}
.out__row{display:flex;justify-content:space-between;align-items:baseline;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.1)}
.out__row:last-of-type{border-bottom:0}
.out__row small{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--on-dark-muted)}
.out__row b{font-family:var(--display);font-size:clamp(24px,3vw,34px);font-variation-settings:"wdth" 88;letter-spacing:-.02em}
.out__note{font-family:var(--mono);font-size:11px;color:var(--on-dark-muted);line-height:1.7;margin-top:16px}

/* ------------------------------------------------------------------- faq */
.faq{border-top:1px solid var(--line)}
.q{border-bottom:1px solid var(--line)}
.q button{width:100%;background:none;border:0;display:flex;gap:20px;align-items:center;justify-content:space-between;
  padding:24px 0;text-align:left;cursor:pointer;font-family:var(--display);font-size:clamp(18px,2vw,23px);
  font-weight:700;letter-spacing:-.02em;transition:color .25s}
.q button:hover{color:var(--blue)}
.q .pm{flex:none;width:26px;height:26px;border:1px solid var(--line);border-radius:50%;position:relative;transition:transform .4s var(--ease),background .3s}
.q .pm::before,.q .pm::after{content:"";position:absolute;inset:50% 7px auto;height:1.5px;background:var(--ink);transition:opacity .3s}
.q .pm::after{transform:rotate(90deg)}
.q[open] .pm{transform:rotate(135deg);background:var(--blue-soft)}
.q .a{padding:0 0 26px;color:var(--ink-soft);max-width:74ch;font-size:16.5px}

/* ------------------------------------------------------------------- cta */
.cta{background:var(--ink);color:var(--on-dark);border-radius:22px;padding:clamp(28px,4.4vw,64px);position:relative;overflow:hidden}
.cta::before{content:"";position:absolute;inset:auto -20% -60% auto;width:70%;aspect-ratio:1;
  background:radial-gradient(circle,rgba(243,125,25,.32),transparent 65%)}
.cta::after{content:"";position:absolute;inset:-50% auto auto -15%;width:55%;aspect-ratio:1;
  background:radial-gradient(circle,rgba(73,63,128,.5),transparent 65%)}
.cta__grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px)}
@media(max-width:900px){.cta__grid{grid-template-columns:1fr}}
.cta h2{color:var(--surface)}
.cta .lede{color:var(--on-dark-soft)}
.form{display:grid;gap:12px}
.form input,.form select,.form textarea{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:10px;
  padding:13px 15px;color:var(--surface);width:100%;transition:border-color .25s,background .25s}
.form input::placeholder,.form textarea::placeholder{color:var(--on-dark-muted)}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--amber);background:rgba(255,255,255,.1);outline:none}
.form select option{color:#11182D}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.form .row{grid-template-columns:1fr}}
.form-msg{font-family:var(--mono);font-size:12.5px;color:var(--mint);min-height:20px}

/* ---------------------------------------------------------------- footer */
.foot{padding:44px 0 56px;border-top:1px solid var(--line);margin-top:clamp(48px,6vw,90px)}
.foot__in{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:flex-start}
.foot p,.foot a{font-size:14px;color:var(--ink-soft)}
.foot nav{display:flex;gap:20px;flex-wrap:wrap}
.foot a{text-decoration:none}
.foot a:hover{color:var(--ink)}

/* -------------------------------------------------------------- reveals */
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv[data-d="1"]{transition-delay:.08s}
.rv[data-d="2"]{transition-delay:.16s}
.rv[data-d="3"]{transition-delay:.24s}
.rv[data-d="4"]{transition-delay:.32s}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important}
  .rv{opacity:1;transform:none}
  .splash{display:none}
}

/* ---------------------------------------------------------- nav: current page */
.nav__links a[aria-current="page"]{color:var(--ink)}
.nav__links a[aria-current="page"]::after{width:100%}

/* ==========================================================================
   CHAT WIDGET — floating lead-capture chat, bottom-right on every page.
   Injected at runtime by chatbot.js. Uses the same tokens as the rest of
   the site (see the :root block above) so it never needs its own palette.
   ========================================================================== */

#ac-chat{position:fixed;right:20px;bottom:20px;z-index:9999;font-family:var(--body)}

#ac-chat-launch{
  width:60px;height:60px;border-radius:50%;border:none;cursor:pointer;
  background:linear-gradient(155deg,var(--brand-orange),var(--brand-gold));
  color:var(--navy-900);display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 30px rgba(28,41,82,.28),0 2px 8px rgba(28,41,82,.18);
  transition:transform .18s var(--ease),box-shadow .18s var(--ease);
  position:relative;
}
#ac-chat-launch:hover{transform:translateY(-2px) scale(1.03)}
#ac-chat-launch svg{width:26px;height:26px}
#ac-chat:not(.is-open):not(.is-touched) #ac-chat-launch{animation:ac-pulse 2.2s ease-out infinite}
@keyframes ac-pulse{
  0%{box-shadow:0 10px 30px rgba(28,41,82,.28),0 2px 8px rgba(28,41,82,.18),0 0 0 0 rgba(243,125,25,.45)}
  70%{box-shadow:0 10px 30px rgba(28,41,82,.28),0 2px 8px rgba(28,41,82,.18),0 0 0 14px rgba(243,125,25,0)}
  100%{box-shadow:0 10px 30px rgba(28,41,82,.28),0 2px 8px rgba(28,41,82,.18),0 0 0 0 rgba(243,125,25,0)}
}
#ac-chat-launch .ac-dot{
  position:absolute;top:-2px;right:-2px;width:14px;height:14px;border-radius:50%;
  background:var(--bad);border:2px solid var(--paper);
}
#ac-chat.is-open #ac-chat-launch .ac-icon-chat{display:none}
#ac-chat:not(.is-open) #ac-chat-launch .ac-icon-close{display:none}

#ac-chat-panel{
  position:absolute;right:0;bottom:76px;width:360px;max-width:calc(100vw - 32px);
  height:min(560px,calc(100vh - 120px));background:var(--surface);border:1px solid var(--line);
  border-radius:18px;box-shadow:0 24px 60px rgba(17,24,45,.24),0 4px 16px rgba(17,24,45,.12);
  display:flex;flex-direction:column;overflow:hidden;
  opacity:0;transform:translateY(14px) scale(.98);pointer-events:none;
  transition:opacity .2s var(--ease),transform .2s var(--ease);
}
#ac-chat.is-open #ac-chat-panel{opacity:1;transform:none;pointer-events:auto}

#ac-chat-head{
  background:var(--ink);color:var(--surface);padding:16px 18px;display:flex;align-items:center;gap:12px;flex-shrink:0;
}
#ac-chat-head img{width:28px;height:28px;object-fit:contain}
#ac-chat-head .ac-title{font-family:var(--display);font-weight:700;font-size:15px;line-height:1.2}
#ac-chat-head .ac-sub{font-size:12px;color:var(--on-dark-soft);margin-top:2px}
#ac-chat-head-close{
  margin-left:auto;background:none;border:none;color:var(--on-dark-soft);cursor:pointer;
  width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:8px;
}
#ac-chat-head-close:hover{background:rgba(255,255,255,.08);color:var(--surface)}

#ac-chat-body{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:10px;background:var(--paper-2)}
#ac-chat-body::-webkit-scrollbar{width:6px}
#ac-chat-body::-webkit-scrollbar-thumb{background:var(--line);border-radius:6px}

.ac-row{display:flex}
.ac-row.bot{justify-content:flex-start}
.ac-row.user{justify-content:flex-end}
.ac-bubble{
  max-width:82%;padding:10px 13px;border-radius:14px;font-size:13.5px;line-height:1.55;
  white-space:pre-wrap;word-break:break-word;
}
.ac-row.bot .ac-bubble{background:var(--surface);border:1px solid var(--line);color:var(--ink);border-bottom-left-radius:4px}
.ac-row.user .ac-bubble{background:var(--brand-orange);color:var(--navy-900);border-bottom-right-radius:4px}

.ac-typing{display:inline-flex;gap:4px;padding:4px 2px}
.ac-typing i{width:6px;height:6px;border-radius:50%;background:var(--ink-soft);opacity:.5;animation:ac-bounce 1s infinite ease-in-out}
.ac-typing i:nth-child(2){animation-delay:.15s}
.ac-typing i:nth-child(3){animation-delay:.3s}
@keyframes ac-bounce{0%,80%,100%{transform:translateY(0);opacity:.4}40%{transform:translateY(-4px);opacity:1}}

#ac-chat-quick{display:flex;flex-wrap:wrap;gap:8px;padding:0 18px 12px;background:var(--paper-2);flex-shrink:0}
.ac-chip-btn{
  border:1px solid var(--line);background:var(--surface);color:var(--ink);
  padding:8px 13px;border-radius:999px;font-size:13px;cursor:pointer;transition:all .15s var(--ease);
}
.ac-chip-btn:hover{border-color:var(--brand-orange);color:var(--accent-text)}

#ac-chat-input{
  display:flex;gap:8px;padding:12px;border-top:1px solid var(--line);background:var(--surface);flex-shrink:0;
}
#ac-chat-input input, #ac-chat-input textarea{
  flex:1;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:13.5px;
  font-family:var(--body);color:var(--ink);background:var(--paper-2);resize:none;
}
#ac-chat-input input:focus, #ac-chat-input textarea:focus{outline:none;border-color:var(--brand-orange)}
#ac-chat-send{
  border:none;background:var(--brand-orange);color:var(--navy-900);width:40px;height:40px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:filter .15s;
}
#ac-chat-send:hover{filter:brightness(1.06)}
#ac-chat-send:disabled{opacity:.45;cursor:not-allowed}

@media (max-width:480px){
  #ac-chat{right:14px;bottom:14px}
  #ac-chat-panel{right:-6px;width:calc(100vw - 20px);height:min(72vh,560px)}
}
