/* ================================================================
   VANTIDGE.AI — Design System v3  "Aurora on Obsidian"
   ----------------------------------------------------------------
   Signature: THE STACK. Vantidge sells ownership of every layer of
   an AI system and every phase of its life. So the hero is not a
   slogan over a gradient — it is the reference architecture itself,
   four layers deep, three phases wide, scanned by a travelling
   aurora. Everything else in the system stays quiet so that one
   object carries the argument.
   ================================================================ */


:root{
  /* ---------- colour ---------- */
  --obsidian:  #080B1A;   /* page base, dark bookends            */
  --abyss:     #0E1430;   /* elevated dark surface               */
  --vault:     #171F42;   /* cards on dark                       */
  --aurora:    #6E56F8;   /* primary brand energy — the accent   */
  --aurora-lo: #A695FF;   /* aurora, legible on dark             */
  --aurora-ink:#4A2ED6;   /* aurora, legible on light            */
  --pulse:     #19E0C4;   /* signal aqua — data + positive state  */
  --pulse-ink: #0B7A6A;
  --brass:     #FFC062;   /* warm accent — CTAs, reserved        */
  --brass-ink: #8A5A10;

  --porcelain: #FFFFFF;
  --frost:     #F4F6FC;   /* cool paper — alternating bands      */
  --frost-2:   #EAEEF9;
  --line:      #E1E6F3;
  --line-dark: rgba(255,255,255,.10);

  --ink:       #0A0F24;   /* text on light                       */
  --slate:     #545E7A;   /* secondary text on light             */
  --mist:      #A7B0CC;   /* secondary text on dark              */
  --mist-2:    #7A85A6;

  /* ---------- type ---------- */
  --font-display:'Archivo', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --font-body:   'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --font-data:   'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* ---------- space (4px base) ---------- */
  --s1:4px;  --s2:8px;  --s3:12px; --s4:16px; --s5:24px;
  --s6:32px; --s7:48px; --s8:64px; --s9:96px; --s10:128px;

  /* ---------- layout ---------- */
  --container: 1240px;
  --gutter: clamp(20px, 4.5vw, 56px);
  --band-y: clamp(80px, 9.5vw, 132px);
  --r-sm: 8px;
  --r:    14px;
  --r-lg: 22px;
  --r-pill: 999px;
  --stack-cell: 78px;   /* phase header + dot cell share this, so they stay aligned */

  /* ---------- elevation ---------- */
  --shadow-1: 0 1px 2px rgba(10,15,36,.05), 0 4px 14px -6px rgba(10,15,36,.09);
  --shadow-2: 0 2px 4px rgba(10,15,36,.05), 0 18px 42px -18px rgba(10,15,36,.18);
  --shadow-3: 0 30px 70px -28px rgba(10,15,36,.30);
  --glow-aurora: 0 0 0 1px rgba(110,86,248,.35), 0 18px 50px -18px rgba(110,86,248,.55);

  --ease: cubic-bezier(.22,.75,.24,1);
}

/* Fine grain, used at very low opacity over dark bands.
   Inline SVG turbulence — no image request, no visible pattern. */
:root{
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E");
}

/* ================================================================
   BASE
   ================================================================ */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--porcelain);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.65;
  font-feature-settings:"cv11","ss01";
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
img,svg,video{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
ul,ol{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p,figure,blockquote{ margin:0; }
button{ font:inherit; color:inherit; cursor:pointer; }
table{ border-collapse:collapse; }
::selection{ background:rgba(110,86,248,.22); }

:focus-visible{
  outline:2px solid var(--aurora-ink);
  outline-offset:3px;
  border-radius:3px;
}
.band--ink :focus-visible,.nav :focus-visible,.hero :focus-visible,
.footer :focus-visible,.closer :focus-visible{ outline-color:var(--brass); }

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

.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap; border:0; }

/* skip link */
.skip{
  position:absolute; left:var(--s4); top:-64px; z-index:200;
  background:var(--brass); color:var(--obsidian);
  padding:10px 18px; border-radius:var(--r-sm); font-weight:600; font-size:.9rem;
  transition:top .18s var(--ease);
}
.skip:focus{ top:var(--s4); }

/* ================================================================
   TYPE
   ================================================================ */
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:600; letter-spacing:-.02em; }

.d-xl{
  font-size:clamp(2.6rem, 5.4vw, 4.4rem);
  line-height:1.0;
  letter-spacing:-.035em;
  font-weight:700;
}
.d-lg{
  font-size:clamp(2rem, 3.5vw, 3rem);
  line-height:1.08;
  letter-spacing:-.03em;
  font-weight:700;
}
.d-md{
  font-size:clamp(1.4rem, 2.1vw, 1.85rem);
  line-height:1.2;
  letter-spacing:-.025em;
  font-weight:600;
}
h3,.d-sm{ font-size:1.18rem; line-height:1.32; letter-spacing:-.015em; font-weight:600; }

.lede{
  font-size:clamp(1.05rem, 1.35vw, 1.2rem);
  line-height:1.62;
  color:var(--slate);
  max-width:56ch;
}
.on-dark{ color:var(--porcelian); color:#fff; }
.lede.on-dark{ color:var(--mist); }
.muted{ color:var(--slate); }
.muted.on-dark{ color:var(--mist); }

/* Eyebrow — mono, because these label structure, not decorate it */
.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-data);
  font-size:.72rem; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase;
  color:var(--aurora-ink);
  margin-bottom:var(--s5);
}
.eyebrow::before{
  content:""; width:26px; height:1px; background:currentColor; opacity:.7; flex:none;
}
.eyebrow--pulse{ color:var(--pulse-ink); }
.eyebrow.on-dark{ color:var(--brass); }

/* Section head — asymmetric by default: statement left, gloss right.
   Alignment is fixed by the grid, never by per-element overrides. */
.head{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);
  gap:clamp(24px,4vw,64px);
  align-items:end;
  margin-bottom:clamp(40px,5vw,68px);
}
.head--solo{ grid-template-columns:minmax(0,780px); }
.head--center{ grid-template-columns:minmax(0,760px); justify-content:center; text-align:center; }
.head--center .eyebrow{ justify-content:center; }
.head--center .eyebrow::before{ display:none; }
.head--center .lede{ margin-inline:auto; }
.head p{ color:var(--slate); font-size:1.02rem; }
.head.on-dark p,.head p.on-dark{ color:var(--mist); }
@media (max-width:860px){
  .head{ grid-template-columns:1fr; align-items:start; gap:var(--s5); }
}

/* ================================================================
   BUTTONS
   ================================================================ */
.btn{
  --btn-y:15px; --btn-x:26px;
  position:relative;
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:var(--btn-y) var(--btn-x);
  font-family:var(--font-body); font-weight:600; font-size:.95rem; letter-spacing:-.005em;
  border:1px solid transparent; border-radius:var(--r-pill);
  white-space:nowrap;
  transition:transform .22s var(--ease), box-shadow .22s var(--ease),
             background-color .22s var(--ease), color .22s var(--ease), border-color .22s var(--ease);
}
.btn svg{ width:16px; height:16px; transition:transform .22s var(--ease); }
.btn:hover svg{ transform:translateX(3px); }

.btn--primary{ background:var(--brass); color:var(--obsidian); }
.btn--primary:hover{ background:#FFD290; transform:translateY(-2px);
  box-shadow:0 14px 34px -12px rgba(255,192,98,.6); }

.btn--aurora{ background:var(--aurora); color:#fff; }
.btn--aurora:hover{ background:#8069FF; transform:translateY(-2px); box-shadow:var(--glow-aurora); }

.btn--ghost{ border-color:rgba(255,255,255,.22); color:#fff; background:rgba(255,255,255,.03); }
.btn--ghost:hover{ border-color:var(--brass); color:var(--brass); transform:translateY(-2px); }

.btn--line{ border-color:var(--line); color:var(--ink); background:var(--porcelain); }
.btn--line:hover{ border-color:var(--aurora-ink); color:var(--aurora-ink); transform:translateY(-2px);
  box-shadow:var(--shadow-1); }

.btn--sm{ --btn-y:10px; --btn-x:19px; font-size:.86rem; }
.btn--block{ width:100%; }

/* Text link with a rule that draws itself */
.tlink{
  display:inline-flex; align-items:center; gap:8px;
  font-weight:600; font-size:.92rem; color:var(--aurora-ink);
  padding-bottom:3px;
  background-image:linear-gradient(currentColor,currentColor);
  background-size:0% 1.5px; background-position:0 100%; background-repeat:no-repeat;
  transition:background-size .3s var(--ease);
}
.tlink:hover{ background-size:100% 1.5px; }
.tlink.on-dark{ color:var(--brass); }

/* ================================================================
   NAV
   ================================================================ */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:100;
  background:rgba(8,11,26,0);
  transition:background-color .3s var(--ease), border-color .3s var(--ease), backdrop-filter .3s;
  border-bottom:1px solid transparent;
}
.nav.is-stuck{
  background:rgba(8,11,26,.82);
  backdrop-filter:blur(18px) saturate(160%);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
  border-bottom-color:var(--line-dark);
}
.nav__row{ display:flex; align-items:center; gap:var(--s6); height:78px; }
.nav__progress{
  position:absolute; left:0; bottom:-1px; height:2px; width:0;
  background:linear-gradient(90deg,var(--aurora),var(--pulse));
  transition:width .1s linear;
}

.logo{
  display:inline-flex; align-items:baseline; gap:1px;
  font-family:var(--font-display); font-weight:700; font-size:1.14rem;
  letter-spacing:-.02em; color:#fff; flex:none;
}
.logo b{ font-weight:700; }
.logo i{ font-style:normal; color:var(--aurora-lo); }
.logo span{ font-family:var(--font-data); font-size:.68em; font-weight:600; color:var(--pulse);
  letter-spacing:.02em; margin-left:1px; }

.nav__links{ display:flex; align-items:center; gap:var(--s2); margin-left:auto; }
.nav__links > li{ position:relative; }
.nav__links a,.nav__links button{
  display:inline-flex; align-items:center; gap:6px;
  padding:9px 14px; border:0; background:none;
  font-size:.93rem; font-weight:500; color:var(--mist);
  border-radius:var(--r-pill);
  transition:color .18s var(--ease), background-color .18s var(--ease);
}
.nav__links a:hover,.nav__links button:hover{ color:#fff; background:rgba(255,255,255,.06); }
.nav__links a[aria-current="page"]{ color:#fff; }
.nav__links a[aria-current="page"]::after{
  content:""; width:5px; height:5px; border-radius:50%; background:var(--brass);
}
.nav__cta{ display:flex; align-items:center; gap:var(--s3); margin-left:var(--s4); }

.nav__caret{ width:11px; height:11px; transition:transform .2s var(--ease); }
[aria-expanded="true"] .nav__caret{ transform:rotate(180deg); }

/* Services dropdown */
.dropdown{
  position:absolute; top:calc(100% + 12px); left:50%; translate:-50% 0;
  width:min(560px,calc(100vw - 40px));
  padding:var(--s5);
  background:rgba(14,20,48,.97);
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  border:1px solid var(--line-dark); border-radius:var(--r-lg);
  box-shadow:0 40px 90px -30px rgba(0,0,0,.8);
  display:grid; grid-template-columns:1fr 1fr; gap:var(--s2);
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity .2s var(--ease), transform .2s var(--ease), visibility .2s;
}
.dropdown.is-open{ opacity:1; visibility:visible; transform:none; }
.dropdown a{
  display:block; padding:12px 14px; border-radius:var(--r-sm);
  color:#fff; font-size:.9rem; font-weight:600;
}
.dropdown a small{ display:block; font-weight:400; font-size:.8rem; color:var(--mist-2); margin-top:2px; }
.dropdown a:hover{ background:rgba(110,86,248,.16); }
.dropdown a:hover small{ color:var(--mist); }

.nav__mobile-cta{ display:none; }
.nav__toggle{
  display:none; width:42px; height:42px; align-items:center; justify-content:center;
  border:1px solid var(--line-dark); border-radius:var(--r-pill);
  background:rgba(255,255,255,.05); color:#fff;
}
.nav__toggle svg{ width:19px; height:19px; }

@media (max-width:1000px){
  .nav__links{
    position:fixed; inset:78px 0 0 0;
    flex-direction:column; align-items:stretch; gap:0;
    padding:var(--s5) var(--gutter) var(--s8);
    background:var(--obsidian);
    overflow-y:auto;
    opacity:0; visibility:hidden; transform:translateY(-8px);
    transition:opacity .22s var(--ease), transform .22s var(--ease), visibility .22s;
  }
  .nav__links.is-open{ opacity:1; visibility:visible; transform:none; }
  .nav__links a,.nav__links button{
    width:100%; justify-content:flex-start; padding:17px 0; font-size:1.05rem;
    border-radius:0; border-bottom:1px solid var(--line-dark);
  }
  .nav__links a:hover,.nav__links button:hover{ background:none; }
  .nav__links a[aria-current="page"]::after{ margin-left:auto; }
  .dropdown{
    position:static; translate:none; width:100%; grid-template-columns:1fr;
    background:none; border:0; box-shadow:none; padding:var(--s2) 0 var(--s4);
    opacity:1; visibility:visible; transform:none;
    display:none;
  }
  .dropdown.is-open{ display:grid; }
  .dropdown a{ padding:11px 0; }
  .nav__mobile-cta{ display:block; margin-top:var(--s6); border-bottom:0; }
  .nav__mobile-cta .btn{ display:inline-flex; width:100%; }
  .nav__cta .btn{ display:none; }
  .nav__toggle{ display:inline-flex; margin-left:auto; }
  .nav__cta{ margin-left:0; }
}

/* ================================================================
   BANDS  (vertical rhythm lives here and nowhere else)
   ================================================================ */
.band{ padding-block:var(--band-y); position:relative; }
.band--frost{ background:var(--frost); }
.band--white{ background:var(--porcelain); }
.band--ink{ background:var(--obsidian); color:#fff; isolation:isolate; }
.band--ink::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background-image:var(--grain); opacity:.035; pointer-events:none;
  mix-blend-mode:overlay;
}
.band--ink h1,.band--ink h2,.band--ink h3,.band--ink h4{ color:#fff; }
.band--tight{ padding-block:clamp(56px,6vw,80px); }

/* hairline divider between two light bands of the same colour */
.rule{ height:1px; background:var(--line); border:0; margin:0; }

/* ================================================================
   HERO
   ================================================================ */
.hero{
  position:relative;
  background:var(--obsidian);
  color:#fff;
  padding:calc(78px + clamp(48px,6vw,86px)) 0 clamp(64px,7vw,104px);
  overflow:hidden;
  isolation:isolate;
}
/* aurora field */
.hero__aurora{
  position:absolute; inset:-30% -10% auto -10%; height:120%;
  z-index:-2; pointer-events:none;
}
.hero__aurora i{
  position:absolute; display:block; border-radius:50%;
  filter:blur(90px); opacity:.5;
  will-change:transform;
}
.hero__aurora i:nth-child(1){
  width:46vw; height:46vw; left:44%; top:2%;
  background:radial-gradient(circle,rgba(110,86,248,.85),transparent 66%);
  animation:drift1 26s ease-in-out infinite alternate;
}
.hero__aurora i:nth-child(2){
  width:34vw; height:34vw; left:2%; top:34%;
  background:radial-gradient(circle,rgba(25,224,196,.42),transparent 66%);
  animation:drift2 32s ease-in-out infinite alternate;
}
.hero__aurora i:nth-child(3){
  width:26vw; height:26vw; left:66%; top:52%;
  background:radial-gradient(circle,rgba(255,192,98,.28),transparent 66%);
  animation:drift1 38s ease-in-out infinite alternate-reverse;
}
@keyframes drift1{ to{ transform:translate3d(-7%,6%,0) scale(1.14); } }
@keyframes drift2{ to{ transform:translate3d(9%,-7%,0) scale(1.1); } }

/* engineering grid, faded from the centre out */
.hero__grid{
  position:absolute; inset:0; z-index:-1; pointer-events:none;
  background-image:
    linear-gradient(to right,rgba(255,255,255,.055) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(255,255,255,.055) 1px,transparent 1px);
  background-size:76px 76px;
  mask-image:radial-gradient(120% 90% at 60% 30%,#000 20%,transparent 78%);
  -webkit-mask-image:radial-gradient(120% 90% at 60% 30%,#000 20%,transparent 78%);
}
.hero::before{ /* grain */
  content:""; position:absolute; inset:0; z-index:-1;
  background-image:var(--grain); opacity:.04; mix-blend-mode:overlay; pointer-events:none;
}

.hero__inner{
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);
  gap:clamp(40px,5vw,80px);
  align-items:center;
}
.hero__copy{ max-width:620px; }
.hero h1{ margin-bottom:var(--s5); }
.hero h1 em{
  font-style:normal;
  background:linear-gradient(96deg,var(--brass) 8%,var(--aurora-lo) 62%,var(--pulse) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero .lede{ max-width:50ch; }
.hero__ctas{ display:flex; flex-wrap:wrap; gap:var(--s3); margin-top:var(--s7); }

/* three-verb proof strip under the CTAs */
.verbs{
  display:flex; flex-wrap:wrap; gap:var(--s2) var(--s5);
  margin-top:var(--s7); padding-top:var(--s5);
  border-top:1px solid var(--line-dark);
  font-family:var(--font-data); font-size:.74rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--mist-2);
}
.verbs b{ color:#fff; font-weight:600; }
.verbs span{ display:inline-flex; align-items:center; gap:8px; }
.verbs span::before{
  content:""; width:6px; height:6px; border-radius:50%; background:var(--pulse);
  box-shadow:0 0 12px var(--pulse);
}

@media (max-width:1000px){
  .hero__inner{ grid-template-columns:1fr; gap:var(--s8); }
  .hero__copy{ max-width:640px; }
}

/* ================================================================
   SIGNATURE — THE STACK
   ================================================================ */
.stack{
  position:relative;
  background:linear-gradient(168deg,rgba(23,31,66,.92),rgba(8,11,26,.86));
  border:1px solid var(--line-dark);
  border-radius:var(--r-lg);
  padding:var(--s5) var(--s5) var(--s4);
  box-shadow:0 50px 110px -40px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.07);
  backdrop-filter:blur(6px);
}
.stack__top{
  display:grid; grid-template-columns:1fr auto; align-items:center; gap:var(--s4);
  padding-bottom:var(--s4); margin-bottom:var(--s4);
  border-bottom:1px solid var(--line-dark);
}
.stack__title{
  font-family:var(--font-data); font-size:.7rem; font-weight:600;
  letter-spacing:.19em; text-transform:uppercase; color:var(--mist);
}
.stack__phases{ display:flex; gap:var(--s2); padding-right:calc(var(--s4) + 1px); }
.stack__phases span{
  width:var(--stack-cell); text-align:center;
  font-family:var(--font-data); font-size:.62rem; font-weight:600;
  letter-spacing:.13em; text-transform:uppercase; color:var(--mist-2);
}

.layer{
  position:relative;
  display:grid; grid-template-columns:1fr auto; align-items:center; gap:var(--s4);
  padding:var(--s4) var(--s4);
  border:1px solid rgba(255,255,255,.07);
  border-radius:var(--r);
  background:rgba(255,255,255,.02);
  transition:background-color .4s var(--ease), border-color .4s var(--ease), box-shadow .4s var(--ease);
}
.layer + .layer{ margin-top:var(--s2); }
.layer.is-lit{
  background:linear-gradient(100deg,rgba(110,86,248,.22),rgba(25,224,196,.08));
  border-color:rgba(166,149,255,.45);
  box-shadow:0 0 0 1px rgba(166,149,255,.16), 0 12px 34px -16px rgba(110,86,248,.75);
}
.layer__name{
  font-family:var(--font-data); font-size:.7rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:#fff;
  margin-bottom:8px;
}
.layer__items{ display:flex; flex-wrap:wrap; gap:6px; }
.layer__items span{
  font-size:.74rem; color:var(--mist);
  padding:4px 9px; border-radius:var(--r-pill);
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.06);
  white-space:nowrap;
}
.layer__dots{ display:flex; gap:var(--s2); flex:none; }
.layer__dots i{
  width:var(--stack-cell); height:26px; border-radius:var(--r-sm);
  display:grid; place-items:center;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  transition:background-color .4s var(--ease), border-color .4s var(--ease);
}
.layer__dots i::before{
  content:""; width:7px; height:7px; border-radius:50%;
  background:var(--mist-2); transition:background-color .4s var(--ease), box-shadow .4s var(--ease);
}
.layer.is-lit .layer__dots i{ background:rgba(25,224,196,.13); border-color:rgba(25,224,196,.34); }
.layer.is-lit .layer__dots i::before{ background:var(--pulse); box-shadow:0 0 12px var(--pulse); }

.stack__foot{
  display:flex; align-items:center; justify-content:space-between; gap:var(--s4);
  margin-top:var(--s4); padding-top:var(--s4);
  border-top:1px solid var(--line-dark);
  font-size:.82rem; color:var(--mist);
}
.stack__foot b{ color:#fff; font-weight:600; }
.stack__foot em{
  font-style:normal; font-family:var(--font-data); font-size:.66rem;
  letter-spacing:.14em; text-transform:uppercase; color:var(--pulse);
  display:inline-flex; align-items:center; gap:7px;
}
.stack__foot em::before{
  content:""; width:6px; height:6px; border-radius:50%; background:var(--pulse);
  animation:blip 2.4s ease-in-out infinite;
}
@keyframes blip{ 0%,100%{ opacity:1; } 50%{ opacity:.25; } }

@media (max-width:1180px) and (min-width:1001px){
  :root{ --stack-cell:66px; }
  .stack__phases span{ font-size:.55rem; letter-spacing:.08em; }
}
@media (max-width:620px){
  .stack{ padding:var(--s4); }
  .stack__top{ grid-template-columns:1fr; }
  .stack__phases{ display:none; }
  .layer{ grid-template-columns:1fr; gap:var(--s3); }
  .layer__dots i{ flex:1; width:auto; }
  .stack__foot{ flex-direction:column; align-items:flex-start; gap:var(--s2); }
}

/* ================================================================
   MARQUEE — platform fluency
   ================================================================ */
.marquee{
  padding-block:var(--s7);
  background:var(--obsidian);
  border-top:1px solid var(--line-dark);
  overflow:hidden;
}
.marquee__label{
  text-align:center;
  font-family:var(--font-data); font-size:.68rem; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase; color:var(--mist-2);
  margin-bottom:var(--s5);
}
.track{
  display:flex; width:max-content; gap:var(--s7);
  animation:slide 46s linear infinite;
}
.track--rev{ animation-direction:reverse; animation-duration:56s; margin-top:var(--s4); }
.marquee:hover .track{ animation-play-state:paused; }
.track span{
  font-family:var(--font-display); font-weight:500; font-size:1.02rem;
  color:var(--mist-2); white-space:nowrap; letter-spacing:-.01em;
  transition:color .2s var(--ease);
}
.track span:hover{ color:#fff; }
@keyframes slide{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
.marquee__fade{ position:relative; }
.marquee__fade::before,.marquee__fade::after{
  content:""; position:absolute; top:0; bottom:0; width:14%; z-index:2; pointer-events:none;
}
.marquee__fade::before{ left:0; background:linear-gradient(90deg,var(--obsidian),transparent); }
.marquee__fade::after{ right:0; background:linear-gradient(270deg,var(--obsidian),transparent); }

/* ================================================================
   GRID + PANELS
   ================================================================ */
.grid{ display:grid; gap:var(--s5); }
.g2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.g3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.g4{ grid-template-columns:repeat(4,minmax(0,1fr)); }
@media (max-width:980px){ .g3,.g4{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:660px){ .g2,.g3,.g4{ grid-template-columns:minmax(0,1fr); } }

/* light panel */
.panel{
  position:relative;
  display:flex; flex-direction:column;
  background:var(--porcelain);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  padding:clamp(24px,2.4vw,34px);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.panel:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2); border-color:#D2D9EE; }
.panel h3{ margin-bottom:var(--s3); }
.panel p{ color:var(--slate); font-size:.96rem; }
.panel--flat:hover{ transform:none; box-shadow:none; border-color:var(--line); }

/* dark panel with a gradient hairline — the only "lit edge" in the system */
.panel--ink{
  color:#fff;
  background:
    linear-gradient(168deg,rgba(23,31,66,.9),rgba(14,20,48,.9)) padding-box,
    linear-gradient(150deg,rgba(166,149,255,.55),rgba(25,224,196,.18) 42%,rgba(255,255,255,.05) 76%) border-box;
  border:1px solid transparent;
}
.panel--ink p{ color:var(--mist); }
.panel--ink:hover{ box-shadow:0 30px 70px -30px rgba(110,86,248,.5); border-color:transparent; }

/* icon plate */
.plate{
  width:46px; height:46px; flex:none;
  display:grid; place-items:center;
  border-radius:13px; margin-bottom:var(--s5);
  background:rgba(110,86,248,.1); color:var(--aurora-ink);
  border:1px solid rgba(110,86,248,.2);
}
.plate svg{ width:22px; height:22px; }
.plate--pulse{ background:rgba(25,224,196,.12); color:var(--pulse-ink); border-color:rgba(25,224,196,.24); }
.plate--brass{ background:rgba(255,192,98,.16); color:var(--brass-ink); border-color:rgba(255,192,98,.32); }
.plate--on-dark{ background:rgba(166,149,255,.14); color:var(--aurora-lo); border-color:rgba(166,149,255,.26); }
.plate--on-dark.plate--pulse{ background:rgba(25,224,196,.13); color:var(--pulse); border-color:rgba(25,224,196,.28); }
.plate--on-dark.plate--brass{ background:rgba(255,192,98,.14); color:var(--brass); border-color:rgba(255,192,98,.3); }

/* statement list */
.checks{ display:flex; flex-direction:column; gap:var(--s3); }
.checks li{ display:flex; gap:var(--s3); font-size:.96rem; color:var(--slate); }
.checks li::before{
  content:""; flex:none; width:18px; height:18px; margin-top:3px; border-radius:50%;
  background:rgba(110,86,248,.12) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234A2ED6' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/11px no-repeat;
}
.checks--pulse li::before{
  background-color:rgba(25,224,196,.14);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B7A6A' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}
.checks--dark li{ color:var(--mist); }
.checks--dark li::before{
  background-color:rgba(166,149,255,.16);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A695FF' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}

/* chips */
.chips{ display:flex; flex-wrap:wrap; gap:8px; }
.chips span{
  font-size:.84rem; color:var(--slate);
  padding:7px 13px; border-radius:var(--r-pill);
  background:var(--frost); border:1px solid var(--line);
}
.chips--dark span{ color:var(--mist); background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.09); }

/* ================================================================
   REVEAL
   ================================================================ */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; } }

/* ================================================================
   CLOSER + FOOTER
   ================================================================ */
.closer{
  position:relative; overflow:hidden; isolation:isolate;
  background:var(--obsidian); color:#fff;
  padding-block:clamp(80px,9vw,124px);
  text-align:center;
}
.closer__aurora{ position:absolute; inset:0; z-index:-1; pointer-events:none; }
.closer__aurora i{
  position:absolute; display:block; border-radius:50%; filter:blur(100px); opacity:.42;
}
.closer__aurora i:nth-child(1){ width:40vw; height:40vw; left:8%; top:-40%;
  background:radial-gradient(circle,rgba(110,86,248,.8),transparent 66%); }
.closer__aurora i:nth-child(2){ width:34vw; height:34vw; right:4%; bottom:-46%;
  background:radial-gradient(circle,rgba(25,224,196,.5),transparent 66%); }
.closer .eyebrow{ justify-content:center; }
.closer .eyebrow::before{ display:none; }
.closer h2{ max-width:24ch; margin-inline:auto; }
.closer .lede{ margin:var(--s5) auto 0; text-align:center; }
.closer__ctas{ display:flex; flex-wrap:wrap; gap:var(--s3); justify-content:center; margin-top:var(--s7); }

.footer{ background:var(--obsidian); color:var(--mist); border-top:1px solid var(--line-dark);
  padding-block:var(--s9) var(--s6); }
.footer__top{
  display:grid; grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));
  gap:clamp(28px,4vw,56px); padding-bottom:var(--s8);
}
.footer__brand p{ color:var(--mist-2); font-size:.92rem; max-width:34ch; margin-top:var(--s4); }
.footer__brand .logo{ margin-bottom:0; }
.footer__label{
  font-family:var(--font-data); font-size:.68rem; font-weight:600;
  letter-spacing:.19em; text-transform:uppercase; color:#fff; margin-bottom:var(--s4);
}
.footer ul{ display:flex; flex-direction:column; gap:11px; }
.footer ul a{ font-size:.92rem; color:var(--mist-2); transition:color .18s var(--ease); }
.footer ul a:hover{ color:#fff; }
.footer__bar{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--s4);
  padding-top:var(--s6); border-top:1px solid var(--line-dark);
  font-size:.82rem; color:var(--mist-2);
}
.footer__bar nav{ display:flex; gap:var(--s5); }
@media (max-width:1080px){
  .footer__top{ grid-template-columns:repeat(4,minmax(0,1fr)); }
  .footer__brand{ grid-column:1 / -1; }
}
@media (max-width:760px){ .footer__top{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .footer__top{ grid-template-columns:1fr; } }

/* ================================================================
   PAGE HERO (interior pages) — shorter, same atmosphere
   ================================================================ */
.phero{
  position:relative; overflow:hidden; isolation:isolate;
  background:var(--obsidian); color:#fff;
  padding:calc(78px + clamp(46px,5.5vw,74px)) 0 clamp(52px,6vw,80px);
}
.phero__aurora{ position:absolute; inset:0; z-index:-1; pointer-events:none; }
.phero__aurora i{ position:absolute; display:block; border-radius:50%; filter:blur(100px); opacity:.44; }
.phero__aurora i:nth-child(1){ width:42vw; height:42vw; left:52%; top:-52%;
  background:radial-gradient(circle,rgba(110,86,248,.85),transparent 66%); }
.phero__aurora i:nth-child(2){ width:30vw; height:30vw; left:-6%; bottom:-52%;
  background:radial-gradient(circle,rgba(25,224,196,.42),transparent 66%); }
.phero__grid{
  position:absolute; inset:0; z-index:-1; pointer-events:none;
  background-image:
    linear-gradient(to right,rgba(255,255,255,.05) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:76px 76px;
  mask-image:radial-gradient(110% 130% at 70% 0%,#000 10%,transparent 72%);
  -webkit-mask-image:radial-gradient(110% 130% at 70% 0%,#000 10%,transparent 72%);
}
.phero__inner{ display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);
  gap:clamp(28px,4vw,64px); align-items:end; }
.phero h1{ max-width:22ch; }
.phero .lede{ max-width:46ch; }
@media (max-width:900px){ .phero__inner{ grid-template-columns:1fr; gap:var(--s5); align-items:start; } }

/* breadcrumb */
.crumb{
  display:flex; align-items:center; gap:10px; margin-bottom:var(--s5);
  font-family:var(--font-data); font-size:.7rem; font-weight:600;
  letter-spacing:.15em; text-transform:uppercase; color:var(--mist-2);
}
.crumb a{ color:var(--mist-2); }
.crumb a:hover{ color:#fff; }
.crumb span{ color:var(--brass); }

/* ================================================================
   COUNT BAND — honest numbers: they describe the offer, not results
   ================================================================ */
.counts{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:var(--line-dark);
  border:1px solid var(--line-dark); border-radius:var(--r-lg); overflow:hidden; }
.count{ background:var(--abyss); padding:clamp(24px,2.6vw,36px); }
.count b{
  display:block; font-family:var(--font-display); font-weight:700;
  font-size:clamp(2.4rem,4vw,3.4rem); line-height:1; letter-spacing:-.04em;
  background:linear-gradient(120deg,#fff 20%,var(--aurora-lo) 90%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  margin-bottom:var(--s3);
}
.count strong{
  display:block; font-family:var(--font-data); font-size:.68rem; font-weight:600;
  letter-spacing:.17em; text-transform:uppercase; color:var(--pulse); margin-bottom:var(--s2);
}
.count p{ font-size:.9rem; color:var(--mist); }
@media (max-width:900px){ .counts{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:520px){ .counts{ grid-template-columns:1fr; } }

/* ================================================================
   MATURITY CURVE — a real sequence, so it is numbered and ordered
   ================================================================ */
.curve{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,340px);
  gap:clamp(32px,4vw,60px); align-items:center;
}
@media (max-width:940px){ .curve{ grid-template-columns:1fr; } }
.curve__figure{
  position:relative;
  background:var(--porcelain); border:1px solid var(--line);
  border-radius:var(--r-lg); padding:clamp(20px,2.4vw,30px);
  box-shadow:var(--shadow-1);
}
.curve__svg{ width:100%; height:auto; overflow:visible; }
.curve__path{
  fill:none; stroke:url(#curveStroke); stroke-width:3; stroke-linecap:round;
  stroke-dasharray:1000; stroke-dashoffset:1000;
  transition:stroke-dashoffset 2s var(--ease);
}
.curve.is-in .curve__path{ stroke-dashoffset:0; }
.curve__fill{ fill:url(#curveFill); opacity:0; transition:opacity 1.2s var(--ease) .6s; }
.curve.is-in .curve__fill{ opacity:1; }
.curve__node circle{ transition:transform .5s var(--ease), opacity .5s var(--ease); }
.curve__stagelabel{ font-family:var(--font-display); font-size:13px; font-weight:600; fill:var(--ink); }
.curve__stagesub{ font-family:var(--font-body); font-size:10.5px; fill:var(--slate); }
.curve__num{ font-family:var(--font-data); font-size:9.5px; font-weight:600; fill:var(--slate); letter-spacing:.1em; }
.curve__axis{ stroke:var(--line); stroke-width:1; }
.curve__axislabel{ font-family:var(--font-data); font-size:9px; font-weight:600;
  fill:var(--slate); letter-spacing:.14em; text-transform:uppercase; }
.curve__flag{ font-family:var(--font-data); font-size:9.5px; font-weight:600; letter-spacing:.1em; }
.curve__notes{ display:flex; flex-direction:column; gap:var(--s5); }
.curve__note{ padding-left:var(--s5); border-left:2px solid var(--line); }
.curve__note--stall{ border-left-color:var(--brass); }
.curve__note--us{ border-left-color:var(--pulse); }
.curve__note h3{
  font-family:var(--font-data); font-size:.68rem; font-weight:600; letter-spacing:.16em;
  text-transform:uppercase; margin-bottom:var(--s2);
}
.curve__note--stall h3{ color:var(--brass-ink); }
.curve__note--us h3{ color:var(--pulse-ink); }
.curve__note p{ font-size:.94rem; color:var(--slate); }

/* ================================================================
   SERVICE TRACKS — 12 capabilities in 4 value tracks
   ================================================================ */
.track-row{
  display:grid; grid-template-columns:minmax(0,232px) minmax(0,1fr);
  gap:clamp(20px,3vw,44px);
  padding-block:clamp(28px,3vw,40px);
  border-top:1px solid var(--line);
  align-items:start;
}
.track-row:last-child{ border-bottom:1px solid var(--line); }
.track-row__head h3{ font-size:1.05rem; display:flex; align-items:center; gap:var(--s3); }
.track-row__head p{ font-size:.9rem; color:var(--slate); margin-top:var(--s3); }
.track-tag{
  font-family:var(--font-data); font-size:.66rem; font-weight:600;
  letter-spacing:.17em; text-transform:uppercase;
  padding:6px 12px; border-radius:var(--r-pill);
}
.track-tag--build{ background:rgba(110,86,248,.11); color:var(--aurora-ink); }
.track-tag--run{ background:rgba(25,224,196,.14); color:var(--pulse-ink); }
.track-tag--extend{ background:rgba(255,192,98,.2); color:var(--brass-ink); }
.track-tag--scale{ background:rgba(10,15,36,.07); color:var(--ink); }
.cap-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s3); }
@media (max-width:1040px){ .cap-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px){
  .track-row{ grid-template-columns:1fr; }
  .cap-grid{ grid-template-columns:1fr; }
}
.cap{
  background:var(--porcelain); border:1px solid var(--line); border-radius:var(--r);
  padding:var(--s5); transition:border-color .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease);
}
.cap:hover{ transform:translateY(-3px); border-color:#CFD7EE; box-shadow:var(--shadow-1); }
.cap h3,.cap h4{ font-size:.98rem; font-weight:600; line-height:1.3;
  letter-spacing:-.01em; margin-bottom:6px; }
.cap p{ font-size:.86rem; color:var(--slate); line-height:1.55; }

/* ================================================================
   SPLIT — two ways in
   ================================================================ */
.split{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s5); }
@media (max-width:860px){ .split{ grid-template-columns:1fr; } }
.route{
  position:relative; overflow:hidden;
  display:flex; flex-direction:column;
  border-radius:var(--r-lg); padding:clamp(28px,3vw,44px);
  background:var(--porcelain); border:1px solid var(--line);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.route:hover{ transform:translateY(-4px); box-shadow:var(--shadow-3); }
.route::before{
  content:""; position:absolute; inset:-40% -20% auto auto; width:280px; height:280px;
  border-radius:50%; filter:blur(70px); opacity:.16; pointer-events:none;
}
.route--ent::before{ background:var(--aurora); }
.route--start::before{ background:var(--pulse); }
.route__tag{
  align-self:flex-start;
  font-family:var(--font-data); font-size:.66rem; font-weight:600;
  letter-spacing:.17em; text-transform:uppercase;
  padding:7px 13px; border-radius:var(--r-pill); margin-bottom:var(--s5);
}
.route--ent .route__tag{ background:rgba(110,86,248,.11); color:var(--aurora-ink); }
.route--start .route__tag{ background:rgba(25,224,196,.15); color:var(--pulse-ink); }
.route h3{ font-size:clamp(1.3rem,1.9vw,1.6rem); margin-bottom:var(--s5); max-width:22ch; }
.route .checks{ margin-bottom:var(--s6); }
.route .tlink{ margin-top:auto; align-self:flex-start; }

/* ================================================================
   COMPARISON TABLE
   ================================================================ */
.tablewrap{
  position:relative; overflow-x:auto;
  margin-inline:calc(var(--gutter) * -1); padding-inline:var(--gutter);
  scrollbar-width:thin;
  /* fades the right edge only while there is more table to reach */
  mask-image:linear-gradient(90deg,#000 calc(100% - 48px),transparent);
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 48px),transparent);
}
@media (min-width:900px){ .tablewrap{ mask-image:none; -webkit-mask-image:none; } }
.cmp{ width:100%; min-width:720px; }
.cmp th,.cmp td{ padding:18px var(--s4); text-align:left; font-size:.93rem; vertical-align:middle; }
.cmp thead th{
  font-family:var(--font-data); font-size:.66rem; font-weight:600;
  letter-spacing:.15em; text-transform:uppercase; color:var(--slate);
  padding-bottom:var(--s4); border-bottom:1px solid var(--line);
}
.cmp tbody td{ border-bottom:1px solid var(--line); }
.cmp tbody tr:last-child td{ border-bottom:0; }
.cmp .feat{ font-weight:600; color:var(--ink); width:26%; }
.cmp .us{ background:rgba(110,86,248,.045); }
.cmp thead th.us{
  color:#fff; background:var(--aurora); border-bottom-color:var(--aurora);
  border-radius:var(--r-sm) var(--r-sm) 0 0; letter-spacing:.13em;
}
.cmp tbody tr:last-child td.us{ border-radius:0 0 var(--r-sm) var(--r-sm); }
.mark{ display:inline-flex; align-items:center; gap:9px; color:var(--slate); }
.mark::before{
  content:""; flex:none; width:16px; height:16px; border-radius:50%;
  background-position:center; background-repeat:no-repeat; background-size:10px;
}
.mark--yes{ color:var(--ink); font-weight:600; }
.mark--yes::before{
  background-color:rgba(25,224,196,.18);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B7A6A' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}
.mark--part::before{
  background-color:rgba(255,192,98,.24);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A5A10' stroke-width='3.6' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E");
}
.mark--no{ color:var(--mist-2); }
.mark--no::before{
  background-color:rgba(84,94,122,.12);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23545E7A' stroke-width='3.2' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E");
}
.tablenote{ font-size:.8rem; color:var(--slate); margin-top:var(--s4); }

/* ================================================================
   Q&A — objections
   ================================================================ */
.qa{ border-top:1px solid var(--line-dark); }
.qa__item{ border-bottom:1px solid var(--line-dark); }
.qa__q{
  width:100%; display:flex; align-items:center; gap:var(--s4);
  padding:var(--s5) 0; background:none; border:0; text-align:left;
  font-family:var(--font-display); font-weight:600; font-size:clamp(1.02rem,1.5vw,1.18rem);
  color:#fff; letter-spacing:-.015em;
}
.qa__q:hover{ color:var(--brass); }
.qa__q i{
  margin-left:auto; flex:none; width:30px; height:30px; border-radius:50%;
  border:1px solid var(--line-dark); display:grid; place-items:center;
  transition:transform .3s var(--ease), border-color .3s var(--ease), background-color .3s var(--ease);
}
.qa__q i::before,.qa__q i::after{
  content:""; position:absolute; background:currentColor; border-radius:2px;
}
.qa__q i svg{ width:13px; height:13px; }
.qa__q[aria-expanded="true"] i{ transform:rotate(45deg); background:rgba(255,192,98,.16); border-color:rgba(255,192,98,.4); }
.qa__a{ overflow:hidden; max-height:0; transition:max-height .4s var(--ease); }
.qa__a > p{ padding:0 0 var(--s5); color:var(--mist); font-size:1rem; max-width:70ch; }
.qa__a > p b{ color:#fff; font-weight:600; }

/* ================================================================
   VALUE SHIFTS — problem → what changes
   ================================================================ */
.shift-group + .shift-group{ margin-top:var(--s8); }
.shift-group__tag{
  display:inline-block; margin-bottom:var(--s5);
  font-family:var(--font-data); font-size:.66rem; font-weight:600;
  letter-spacing:.17em; text-transform:uppercase;
  padding:7px 13px; border-radius:var(--r-pill);
}
.shift-group__tag--ent{ background:rgba(110,86,248,.11); color:var(--aurora-ink); }
.shift-group__tag--start{ background:rgba(25,224,196,.15); color:var(--pulse-ink); }
.shift{
  display:grid; grid-template-columns:minmax(0,1fr) 44px minmax(0,1.15fr);
  gap:var(--s4); align-items:center;
  padding:var(--s5) 0; border-top:1px solid var(--line);
}
.shift-group .shift:last-child{ border-bottom:1px solid var(--line); }
.shift__from{ color:var(--slate); font-size:.96rem; }
.shift__arrow{ display:grid; place-items:center; }
.shift__arrow svg{ width:20px; height:20px; }
.shift-group--ent .shift__arrow{ color:var(--aurora-ink); }
.shift-group--start .shift__arrow{ color:var(--pulse-ink); }
.shift__to{ font-weight:600; font-size:.98rem; color:var(--ink); }
@media (max-width:760px){
  .shift{ grid-template-columns:1fr; gap:var(--s2); }
  .shift__arrow{ justify-items:start; }
  .shift__arrow svg{ transform:rotate(90deg); }
}
.disclaimer{ font-size:.8rem; color:var(--slate); margin-top:var(--s5); }

/* ================================================================
   ARCHITECTURE LAYERS (services page) — the stack, at rest
   ================================================================ */
.arch{ display:flex; flex-direction:column; gap:var(--s3); }
.arch__row{
  display:grid; grid-template-columns:minmax(0,236px) minmax(0,1fr);
  gap:var(--s5); align-items:center;
  padding:var(--s5) clamp(20px,2.4vw,30px);
  border-radius:var(--r);
  background:
    linear-gradient(150deg,rgba(23,31,66,.86),rgba(14,20,48,.86)) padding-box,
    linear-gradient(120deg,rgba(166,149,255,.42),rgba(25,224,196,.14) 48%,rgba(255,255,255,.05)) border-box;
  border:1px solid transparent;
  transition:transform .3s var(--ease);
}
.arch__row:hover{ transform:translateX(6px); }
.arch__label{
  font-family:var(--font-data); font-size:.72rem; font-weight:600;
  letter-spacing:.15em; text-transform:uppercase; color:#fff;
}
.arch__label small{
  display:block; margin-top:6px; font-family:var(--font-body); font-size:.8rem;
  letter-spacing:0; text-transform:none; color:var(--mist-2); font-weight:400;
}
@media (max-width:760px){ .arch__row{ grid-template-columns:1fr; gap:var(--s4); } }

/* ================================================================
   PODS
   ================================================================ */
.pod{ display:flex; flex-direction:column; }
.pod__roles{ display:flex; flex-direction:column; gap:10px; margin:var(--s4) 0 var(--s6); }
.pod__roles li{
  display:flex; align-items:center; gap:11px; font-size:.9rem; color:var(--slate);
  padding-bottom:10px; border-bottom:1px solid var(--line);
}
.pod__roles li:last-child{ border-bottom:0; padding-bottom:0; }
.pod__roles li::before{
  content:""; flex:none; width:5px; height:5px; border-radius:50%; background:var(--aurora);
}
.pod__label{
  font-family:var(--font-data); font-size:.64rem; font-weight:600;
  letter-spacing:.17em; text-transform:uppercase; color:var(--slate);
}
.pod__out{
  margin-top:auto; padding-top:var(--s4); border-top:1px solid var(--line);
  font-size:.92rem; color:var(--ink); font-weight:500;
}
.pod__out span{
  display:block; margin-bottom:6px;
  font-family:var(--font-data); font-size:.64rem; font-weight:600;
  letter-spacing:.17em; text-transform:uppercase; color:var(--pulse-ink);
}

/* ================================================================
   TIMELINE — numbered because the phases really are sequential
   ================================================================ */
.timeline{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--s5); position:relative; }
.timeline::before{
  content:""; position:absolute; left:0; right:0; top:23px; height:2px;
  background:linear-gradient(90deg,rgba(110,86,248,.35),rgba(25,224,196,.5),rgba(255,192,98,.4));
}
.phase{ position:relative; padding-top:var(--s8); }
.phase__num{
  position:absolute; top:0; left:0;
  width:48px; height:48px; border-radius:50%;
  display:grid; place-items:center;
  font-family:var(--font-data); font-weight:600; font-size:.88rem;
  background:var(--porcelain); color:var(--aurora-ink);
  border:2px solid var(--aurora); box-shadow:0 0 0 6px var(--frost);
}
.phase__when{
  font-family:var(--font-data); font-size:.64rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--pulse-ink); margin-bottom:var(--s2);
}
.phase h3{ font-size:1.06rem; margin-bottom:var(--s3); }
.phase p{ font-size:.92rem; color:var(--slate); }
@media (max-width:940px){
  .timeline{ grid-template-columns:1fr; gap:0; }
  .timeline::before{ left:23px; right:auto; top:0; bottom:0; width:2px; height:auto;
    background:linear-gradient(180deg,rgba(110,86,248,.35),rgba(25,224,196,.5),rgba(255,192,98,.4)); }
  .phase{ padding:0 0 var(--s7) 76px; }
  .phase:last-child{ padding-bottom:0; }
  .phase__num{ box-shadow:0 0 0 6px var(--frost); }
}

/* ================================================================
   STACKED TECH GRID (delivery / services)
   ================================================================ */
.tech{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:clamp(24px,3vw,48px); row-gap:var(--s8); }
@media (max-width:940px){ .tech{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:620px){ .tech{ grid-template-columns:1fr; } }
.tech__col h3{
  font-family:var(--font-data); font-size:.68rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--pulse);
  padding-bottom:var(--s3); margin-bottom:var(--s4);
  border-bottom:1px solid var(--line-dark);
}
.tech__col ul{ display:flex; flex-direction:column; gap:9px; }
.tech__col li{ font-size:.92rem; color:var(--mist); }

/* ================================================================
   CONTACT
   ================================================================ */
.contact{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:clamp(32px,4vw,72px); align-items:start; }
@media (max-width:900px){ .contact{ grid-template-columns:1fr; } }
.form{ display:flex; flex-direction:column; gap:var(--s4); }
.field label{
  display:block; font-size:.8rem; font-weight:600; color:var(--ink);
  margin-bottom:8px; letter-spacing:-.005em;
}
.field label em{ font-style:normal; color:var(--slate); font-weight:400; }
.field input,.field textarea,.field select{
  width:100%; font-family:var(--font-body); font-size:.96rem; color:var(--ink);
  padding:14px 15px; background:var(--porcelain);
  border:1px solid var(--line); border-radius:var(--r-sm);
  transition:border-color .18s var(--ease), box-shadow .18s var(--ease);
}
.field input:focus,.field textarea:focus,.field select:focus{
  outline:none; border-color:var(--aurora); box-shadow:0 0 0 3px rgba(110,86,248,.15);
}
.field textarea{ min-height:132px; resize:vertical; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s4); }
@media (max-width:560px){ .field-row{ grid-template-columns:1fr; } }
.formnote{ font-size:.8rem; color:var(--slate); }
.aside{ display:flex; flex-direction:column; gap:var(--s5); }
.aside__block h3{
  font-family:var(--font-data); font-size:.68rem; font-weight:600;
  letter-spacing:.17em; text-transform:uppercase; color:var(--slate); margin-bottom:var(--s3);
}
.aside__block a{ font-weight:600; font-size:1.02rem; color:var(--ink); }
.aside__block a:hover{ color:var(--aurora-ink); }
.aside__block p{ font-size:.94rem; color:var(--slate); }

/* ================================================================
   404
   ================================================================ */
.err{ min-height:72vh; display:grid; place-items:center; text-align:center;
  padding:calc(78px + var(--s9)) 0 var(--s9); }
.err__code{
  font-family:var(--font-data); font-size:.72rem; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase; color:var(--brass); margin-bottom:var(--s5);
}
.err h1{ max-width:20ch; margin-inline:auto; }
.err .lede{ margin:var(--s5) auto 0; }
.err__ctas{ display:flex; gap:var(--s3); justify-content:center; flex-wrap:wrap; margin-top:var(--s7); }

/* ================================================================
   UTILITIES (last — deliberately, so they win)
   ================================================================ */
.mt-0{ margin-top:0 !important; }
.center{ text-align:center; }
.stack-sm > * + *{ margin-top:var(--s4); }

/* ================================================================
   MEGA DROPDOWN — needed once the nav carries industries + company
   ================================================================ */
.dropdown--wide{ width:min(720px,calc(100vw - 40px)); grid-template-columns:repeat(3,1fr); }
.dropdown__col{ display:flex; flex-direction:column; gap:2px; }
.dropdown__head{
  font-family:var(--font-data); font-size:.62rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase; color:var(--mist-2);
  padding:6px 14px 8px;
}
@media (max-width:1000px){
  .dropdown--wide{ width:100%; grid-template-columns:1fr; }
  .dropdown__head{ padding:10px 0 4px; }
}

/* ================================================================
   INDUSTRY CARDS
   ================================================================ */
.ind-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s5); }
@media (max-width:820px){ .ind-grid{ grid-template-columns:1fr; } }
.ind{
  position:relative; overflow:hidden;
  display:flex; flex-direction:column;
  padding:clamp(26px,3vw,40px);
  border-radius:var(--r-lg);
  background:var(--porcelain); border:1px solid var(--line);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.ind:hover{ transform:translateY(-4px); box-shadow:var(--shadow-3); border-color:#D2D9EE; }
.ind::before{
  content:""; position:absolute; inset:-45% -25% auto auto; width:260px; height:260px;
  border-radius:50%; filter:blur(70px); opacity:.14; pointer-events:none; background:var(--aurora);
}
.ind:nth-child(2n)::before{ background:var(--pulse); }
.ind__eyebrow{
  font-family:var(--font-data); font-size:.64rem; font-weight:600;
  letter-spacing:.17em; text-transform:uppercase; color:var(--aurora-ink); margin-bottom:var(--s3);
}
.ind:nth-child(2n) .ind__eyebrow{ color:var(--pulse-ink); }
.ind h3{ font-size:clamp(1.2rem,1.7vw,1.45rem); margin-bottom:var(--s4); }
.ind > p{ color:var(--slate); font-size:.96rem; margin-bottom:var(--s5); }
.ind__uses{ display:flex; flex-direction:column; gap:10px; margin-bottom:var(--s6); }
.ind__uses li{
  display:flex; gap:11px; font-size:.9rem; color:var(--slate);
  padding-bottom:10px; border-bottom:1px solid var(--line);
}
.ind__uses li:last-child{ border-bottom:0; padding-bottom:0; }
.ind__uses li b{ color:var(--ink); font-weight:600; }
.ind .tlink{ margin-top:auto; align-self:flex-start; }

/* ================================================================
   ARTICLE / LONG-FORM
   ================================================================ */
.article{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,250px);
  gap:clamp(32px,5vw,80px); align-items:start; }
@media (max-width:960px){ .article{ grid-template-columns:1fr; } }
.prose{ max-width:68ch; }
.prose > * + *{ margin-top:var(--s5); }
.prose h2{
  font-size:clamp(1.35rem,2vw,1.7rem); line-height:1.24; letter-spacing:-.025em;
  margin-top:var(--s8); padding-top:var(--s2);
}
.prose h3{ font-size:1.1rem; margin-top:var(--s7); }
.prose p{ font-size:1.04rem; line-height:1.72; color:#232B45; }
.prose ul{ display:flex; flex-direction:column; gap:var(--s3); padding-left:0; }
.prose ul li{ display:flex; gap:var(--s3); font-size:1.02rem; line-height:1.68; color:#232B45; }
.prose ul li::before{
  content:""; flex:none; width:6px; height:6px; margin-top:11px; border-radius:50%;
  background:var(--aurora); opacity:.75;
}
.prose blockquote{
  margin:var(--s7) 0; padding:var(--s5) 0 var(--s5) var(--s6);
  border-left:2px solid var(--aurora);
  font-family:var(--font-display); font-size:clamp(1.15rem,1.7vw,1.35rem);
  line-height:1.4; letter-spacing:-.02em; color:var(--ink);
}
.prose strong{ font-weight:600; color:var(--ink); }
.prose .callout{
  margin-top:var(--s6); padding:var(--s5) var(--s6);
  background:var(--frost); border:1px solid var(--line); border-radius:var(--r);
}
.prose .callout p{ font-size:.96rem; color:var(--slate); }
.prose .callout p + p{ margin-top:var(--s3); }

.artmeta{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--s2) var(--s4); margin-bottom:var(--s5);
  font-family:var(--font-data); font-size:.68rem; font-weight:600;
  letter-spacing:.15em; text-transform:uppercase; color:var(--mist-2); }
.artmeta span{ color:var(--brass); }
.toc{ position:sticky; top:110px; }
.toc h2{
  font-family:var(--font-data); font-size:.66rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase; color:var(--slate);
  margin-bottom:var(--s4); padding-bottom:var(--s3); border-bottom:1px solid var(--line);
}
.toc ul{ display:flex; flex-direction:column; gap:var(--s3); }
.toc a{ font-size:.92rem; color:var(--slate); line-height:1.4; }
.toc a:hover{ color:var(--aurora-ink); }
@media (max-width:960px){ .toc{ position:static; } }

/* insight cards */
.post{
  display:flex; flex-direction:column; padding:clamp(24px,2.6vw,34px);
  background:var(--porcelain); border:1px solid var(--line); border-radius:var(--r-lg);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.post:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2); border-color:#D2D9EE; }
.post__tag{
  align-self:flex-start; margin-bottom:var(--s4);
  font-family:var(--font-data); font-size:.62rem; font-weight:600;
  letter-spacing:.17em; text-transform:uppercase;
  padding:6px 12px; border-radius:var(--r-pill);
  background:rgba(110,86,248,.1); color:var(--aurora-ink);
}
.post__tag--ops{ background:rgba(25,224,196,.14); color:var(--pulse-ink); }
.post__tag--talent{ background:rgba(255,192,98,.2); color:var(--brass-ink); }
.post h3{ font-size:1.16rem; line-height:1.32; margin-bottom:var(--s3); }
.post p{ font-size:.94rem; color:var(--slate); margin-bottom:var(--s5); }
.post__foot{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:var(--s3); }
.post__read{ font-family:var(--font-data); font-size:.66rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--mist-2); }

/* ================================================================
   ABOUT — principles + founder
   ================================================================ */
.founder{ display:grid; grid-template-columns:minmax(0,180px) minmax(0,1fr);
  gap:clamp(24px,3vw,44px); align-items:start; }
@media (max-width:700px){ .founder{ grid-template-columns:1fr; } }
.founder__mark{
  aspect-ratio:1; border-radius:var(--r-lg); display:grid; place-items:center;
  background:linear-gradient(150deg,rgba(110,86,248,.18),rgba(25,224,196,.1));
  border:1px solid rgba(166,149,255,.3);
  font-family:var(--font-display); font-size:3rem; font-weight:700;
  letter-spacing:-.04em; color:#fff;
}
.founder__role{
  font-family:var(--font-data); font-size:.68rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--brass); margin-bottom:var(--s3);
}
.founder p + p{ margin-top:var(--s4); }

.principle{ display:grid; grid-template-columns:56px minmax(0,1fr); gap:var(--s5);
  padding-block:clamp(24px,2.6vw,32px); border-top:1px solid var(--line); align-items:start; }
.principle:last-child{ border-bottom:1px solid var(--line); }
.principle__num{
  font-family:var(--font-data); font-size:.82rem; font-weight:600;
  letter-spacing:.06em; color:var(--aurora-ink); padding-top:3px;
}
.principle h3{ font-size:1.12rem; margin-bottom:var(--s3); }
.principle p{ font-size:.98rem; color:var(--slate); max-width:70ch; }

/* ================================================================
   CAREERS
   ================================================================ */
.role{
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--s5); align-items:center;
  padding:var(--s5) clamp(20px,2.4vw,28px);
  background:var(--porcelain); border:1px solid var(--line); border-radius:var(--r);
  transition:border-color .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease);
}
.role + .role{ margin-top:var(--s3); }
.role:hover{ border-color:var(--aurora); transform:translateX(4px); box-shadow:var(--shadow-1); }
.role h3{ font-size:1.05rem; margin-bottom:6px; }
.role__meta{ display:flex; flex-wrap:wrap; gap:var(--s2) var(--s4);
  font-family:var(--font-data); font-size:.66rem; font-weight:600;
  letter-spacing:.13em; text-transform:uppercase; color:var(--mist-2); }
.role__meta b{ color:var(--pulse-ink); font-weight:600; }
@media (max-width:640px){
  .role{ grid-template-columns:1fr; align-items:start; }
  .role .btn{ width:100%; }
}
.hiring{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--s5); }
@media (max-width:900px){ .hiring{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){ .hiring{ grid-template-columns:1fr; } }

/* ================================================================
   MEDIA SYSTEM
   Photography is the single largest visual difference between this
   site and a large enterprise one. Every slot below ships with
   on-brand abstract art and accepts a photograph with no markup
   change — swap the file, keep the class.
   ================================================================ */

/* full-bleed photo band with legible overlay */
.photoband{
  position:relative; isolation:isolate; overflow:hidden;
  min-height:clamp(360px,44vw,520px);
  display:grid; align-items:center;
  background:var(--obsidian);
}
.photoband__media{
  position:absolute; inset:0; z-index:-2;
}
.photoband__media img,.photoband__media svg{
  width:100%; height:100%; object-fit:cover; display:block;
}
/* the scrim is what keeps text AA-legible over any photograph */
.photoband::before{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(100deg,rgba(8,11,26,.94) 0%,rgba(8,11,26,.82) 42%,rgba(8,11,26,.42) 100%);
}
.photoband__inner{ max-width:56ch; padding-block:clamp(48px,6vw,80px); }
.photoband h2{ color:#fff; }
.photoband .lede{ color:var(--mist); margin-top:var(--s5); }
.photoband__ctas{ display:flex; flex-wrap:wrap; gap:var(--s3); margin-top:var(--s6); }
@media (max-width:700px){
  .photoband::before{
    background:linear-gradient(180deg,rgba(8,11,26,.72) 0%,rgba(8,11,26,.94) 55%);
  }
}

/* editorial figure — image beside prose */
.figure{
  position:relative; overflow:hidden;
  border-radius:var(--r-lg); border:1px solid var(--line);
  background:var(--frost); aspect-ratio:16/10;
}
.figure img,.figure svg{ width:100%; height:100%; object-fit:cover; display:block; }
.figure--tall{ aspect-ratio:4/5; }
.figure--wide{ aspect-ratio:21/9; }
.figure figcaption{
  position:absolute; inset:auto 0 0 0;
  padding:var(--s5) var(--s5) var(--s4);
  background:linear-gradient(0deg,rgba(8,11,26,.9),transparent);
  font-size:.84rem; color:var(--mist);
}
.band--ink .figure{ border-color:var(--line-dark); background:var(--abyss); }

/* media header on a card — sits above existing card content */
.media{
  margin:calc(clamp(24px,2.4vw,34px) * -1) calc(clamp(24px,2.4vw,34px) * -1) clamp(20px,2vw,26px);
  border-radius:var(--r-lg) var(--r-lg) 0 0;
  overflow:hidden; aspect-ratio:16/9; background:var(--abyss);
}
.media img,.media svg{ width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .5s var(--ease); }
.ind:hover .media img,.ind:hover .media svg,
.post:hover .media img,.post:hover .media svg{ transform:scale(1.04); }
.ind .media{
  margin:calc(clamp(26px,3vw,40px) * -1) calc(clamp(26px,3vw,40px) * -1) clamp(22px,2.2vw,28px);
}

/* two-up: prose one side, figure the other */
.mediarow{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(28px,4vw,64px); align-items:center;
}
.mediarow--flip > .figure{ order:-1; }
@media (max-width:820px){
  .mediarow{ grid-template-columns:1fr; }
  .mediarow--flip > .figure{ order:0; }
}

/* ================================================================
   LIGHT-DOMINANT THEME
   ----------------------------------------------------------------
   Enterprise services sites are overwhelmingly light: white and
   near-white grounds, photography carrying the visual weight, dark
   reserved for bookends. Adding .theme-light to <html> flips the
   whole system to that model without touching a line of markup.

   The one thing that stays dark is the signature stack — a dark
   panel on a light ground reads as a product screenshot, which is
   exactly the emphasis it should have.
   ================================================================ */

.theme-light{ background:var(--porcelain); }

/* ---- hero ---- */
.theme-light .hero{ background:var(--porcelain); color:var(--ink); }
.theme-light .hero__aurora i{ opacity:.20; }
.theme-light .hero__grid{
  background-image:
    linear-gradient(to right,rgba(10,15,36,.055) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(10,15,36,.055) 1px,transparent 1px);
}
.theme-light .hero::before{ opacity:.02; }
.theme-light .hero h1{ color:var(--ink); }
.theme-light .hero h1 em{
  background:linear-gradient(96deg,var(--brass-ink) 4%,var(--aurora-ink) 58%,var(--pulse-ink) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.theme-light .hero .lede.on-dark{ color:var(--slate); }
.theme-light .hero .eyebrow.on-dark{ color:var(--aurora-ink); }
.theme-light .verbs{ border-top-color:var(--line); color:var(--slate); }
.theme-light .verbs b{ color:var(--ink); }
.theme-light .verbs span::before{ background:var(--pulse-ink); box-shadow:none; }
.theme-light .btn--ghost{ border-color:var(--line); color:var(--ink); background:var(--porcelain); }
.theme-light .btn--ghost:hover{ border-color:var(--aurora-ink); color:var(--aurora-ink); }

/* ---- nav ---- */
.theme-light .nav.is-stuck{
  background:rgba(255,255,255,.88); border-bottom-color:var(--line);
}
.theme-light .logo{ color:var(--ink); }
.theme-light .logo i{ color:var(--aurora-ink); }
.theme-light .logo span{ color:var(--pulse-ink); }
.theme-light .nav__links a,.theme-light .nav__links button{ color:var(--slate); }
.theme-light .nav__links a:hover,.theme-light .nav__links button:hover{
  color:var(--ink); background:var(--frost);
}
.theme-light .nav__links a[aria-current="page"]{ color:var(--ink); }
.theme-light .nav__links a[aria-current="page"]::after{ background:var(--aurora-ink); }
.theme-light .nav__toggle{ border-color:var(--line); background:var(--frost); color:var(--ink); }
.theme-light .dropdown{
  background:rgba(255,255,255,.98); border-color:var(--line);
  box-shadow:0 30px 70px -28px rgba(10,15,36,.28);
}
.theme-light .dropdown a{ color:var(--ink); }
.theme-light .dropdown a small{ color:var(--slate); }
.theme-light .dropdown a:hover{ background:var(--frost); }
.theme-light .dropdown__head{ color:var(--slate); }
@media (max-width:1000px){
  .theme-light .nav__links{ background:var(--porcelain); }
  .theme-light .nav__links a,.theme-light .nav__links button{ border-bottom-color:var(--line); }
}

/* ---- interior page hero ---- */
.theme-light .phero{ background:var(--frost); color:var(--ink); }
.theme-light .phero__aurora i{ opacity:.18; }
.theme-light .phero__grid{
  background-image:
    linear-gradient(to right,rgba(10,15,36,.05) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(10,15,36,.05) 1px,transparent 1px);
}
.theme-light .phero h1{ color:var(--ink); }
.theme-light .crumb{ color:var(--slate); }
.theme-light .crumb a{ color:var(--slate); }
.theme-light .crumb a:hover{ color:var(--ink); }
.theme-light .crumb span{ color:var(--brass-ink); }

/* ---- dark bands become light ---- */
.theme-light .band--ink{ background:var(--frost); color:var(--ink); }
.theme-light .band--ink::after{ opacity:0; }
.theme-light .band--ink h1,.theme-light .band--ink h2,
.theme-light .band--ink h3,.theme-light .band--ink h4{ color:var(--ink); }
.theme-light .band--ink .eyebrow.on-dark{ color:var(--aurora-ink); }
.theme-light .band--ink .lede.on-dark,
.theme-light .band--ink p.on-dark,
.theme-light .band--ink .muted.on-dark{ color:var(--slate); }
.theme-light .band--ink .tlink.on-dark{ color:var(--aurora-ink); }

.theme-light .panel--ink{
  color:var(--ink);
  background:var(--porcelain);
  border:1px solid var(--line);
}
.theme-light .panel--ink p{ color:var(--slate); }
.theme-light .panel--ink:hover{ box-shadow:var(--shadow-2); border-color:#D2D9EE; }

.theme-light .checks--dark li{ color:var(--slate); }
.theme-light .checks--dark li::before{
  background-color:rgba(110,86,248,.12);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234A2ED6' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}
.theme-light .chips--dark span{ color:var(--slate); background:var(--frost); border-color:var(--line); }

/* counts band */
.theme-light .counts{ background:var(--line); border-color:var(--line); }
.theme-light .count{ background:var(--porcelain); }
.theme-light .count b{
  background:linear-gradient(120deg,var(--ink) 20%,var(--aurora-ink) 95%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.theme-light .count strong{ color:var(--pulse-ink); }
.theme-light .count p{ color:var(--slate); }

/* reference architecture rows */
.theme-light .arch__row{
  background:
    linear-gradient(150deg,var(--porcelain),var(--porcelain)) padding-box,
    linear-gradient(120deg,rgba(110,86,248,.5),rgba(25,224,196,.22) 48%,var(--line)) border-box;
  box-shadow:var(--shadow-1);
}
.theme-light .arch__label{ color:var(--ink); }
.theme-light .arch__label small{ color:var(--slate); }

/* objections accordion */
.theme-light .qa,.theme-light .qa__item{ border-color:var(--line); }
.theme-light .qa__q{ color:var(--ink); }
.theme-light .qa__q:hover{ color:var(--aurora-ink); }
.theme-light .qa__q i{ border-color:var(--line); }
.theme-light .qa__q[aria-expanded="true"] i{
  background:rgba(110,86,248,.1); border-color:rgba(110,86,248,.35);
}
.theme-light .qa__a > p{ color:var(--slate); }
.theme-light .qa__a > p b{ color:var(--ink); }

/* technology fluency columns */
.theme-light .tech__col h3{ color:var(--pulse-ink); border-bottom-color:var(--line); }
.theme-light .tech__col li{ color:var(--slate); }

/* careers hiring steps */
.theme-light .hiring h3{ color:var(--ink) !important; }

/* marquee */
.theme-light .marquee{ background:var(--frost); border-top-color:var(--line); }
.theme-light .marquee__label{ color:var(--slate); }
.theme-light .track span{ color:var(--slate); }
.theme-light .track span:hover{ color:var(--ink); }
.theme-light .marquee__fade::before{ background:linear-gradient(90deg,var(--frost),transparent); }
.theme-light .marquee__fade::after{ background:linear-gradient(270deg,var(--frost),transparent); }

/* the figure frame on light ground */
.theme-light .band--ink .figure{ border-color:var(--line); background:var(--frost2); }

/* focus rings back to violet on light ground */
.theme-light .band--ink :focus-visible,
.theme-light .nav :focus-visible,
.theme-light .hero :focus-visible,
.theme-light .phero :focus-visible{ outline-color:var(--aurora-ink); }

/* the closer and footer stay dark — deliberate bookend */


/* ================================================================
   LEGAL / POLICY PAGES
   ================================================================ */
.legal{ font-size:.98rem; }
.legal .prose p,.legal .prose ul li{ font-size:.99rem; line-height:1.68; }
.legal .prose h2{ font-size:clamp(1.2rem,1.7vw,1.42rem); margin-top:var(--s8); }
.legal .prose h3{ font-size:1.02rem; margin-top:var(--s6); }
.updated{
  display:inline-flex; align-items:center; gap:10px; margin-bottom:var(--s6);
  padding:8px 15px; border-radius:var(--r-pill);
  background:var(--frost); border:1px solid var(--line);
  font-family:var(--font-data); font-size:.68rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--slate);
}
.notice{
  padding:var(--s5) var(--s6); margin-bottom:var(--s7);
  border-radius:var(--r); border:1px solid rgba(255,192,98,.5);
  background:rgba(255,192,98,.1);
}
.notice p{ font-size:.94rem; color:var(--brass-ink); }
.notice p + p{ margin-top:var(--s3); }
.notice strong{ color:var(--brass-ink); font-weight:600; }
.deftable{ width:100%; margin-top:var(--s5); }
.deftable th,.deftable td{
  text-align:left; padding:14px var(--s4) 14px 0;
  border-bottom:1px solid var(--line); font-size:.94rem; vertical-align:top;
}
.deftable th{
  font-family:var(--font-data); font-size:.66rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--slate);
}
.deftable td:first-child{ font-weight:600; color:var(--ink); width:32%; }
.deftable td{ color:var(--slate); }

/* ================================================================
   LEGAL / POLICY PAGES
   ================================================================ */
.legal{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,250px);
  gap:clamp(32px,5vw,80px); align-items:start; }
@media (max-width:960px){ .legal{ grid-template-columns:1fr; } }
.stamp{
  display:inline-flex; align-items:center; gap:10px; margin-bottom:var(--s6);
  padding:8px 14px; border-radius:var(--r-pill);
  background:var(--frost); border:1px solid var(--line);
  font-family:var(--font-data); font-size:.68rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--slate);
}
.stamp b{ color:var(--ink); font-weight:600; }
.prose dl{ margin-top:var(--s5); }
.prose dt{
  font-family:var(--font-display); font-weight:600; font-size:1rem;
  color:var(--ink); margin-top:var(--s5);
}
.prose dt:first-child{ margin-top:0; }
.prose dd{ margin:6px 0 0; font-size:1.02rem; line-height:1.68; color:#232B45; }
.prose table{ width:100%; margin-top:var(--s5); font-size:.95rem; }
.prose th{
  text-align:left; padding:10px 12px 10px 0; border-bottom:1px solid var(--line);
  font-family:var(--font-data); font-size:.66rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--slate);
}
.prose td{ padding:12px 12px 12px 0; border-bottom:1px solid var(--line);
  color:#232B45; vertical-align:top; }
.prose td:first-child{ font-weight:500; color:var(--ink); width:32%; }
.notice{
  margin-bottom:var(--s7); padding:var(--s5) var(--s6);
  background:rgba(255,192,98,.12); border:1px solid rgba(255,192,98,.4);
  border-radius:var(--r);
}
.notice p{ font-size:.95rem; color:#5A4212; }
.notice p b{ color:#3E2D0B; font-weight:600; }