/* ============================================================================
   ACS SECURITY GROUP — Design System  "Operations Console"
   Obsidian + gold master, green (Greenlight / live monitoring) & teal
   (Project Defense / virtual ops) division accents. Surveillance-HUD detailing.
   One file. Mobile-first. Authored for the 2026 redesign.
   ========================================================================== */

/* ---------- 1. Tokens ---------------------------------------------------- */
:root{
  /* aurora foundation — deep near-black with glow-friendly warmth */
  --bg:        #08090c;
  --bg-1:      #0b0d12;
  --bg-2:      #10131a;
  --bg-3:      #171b24;
  --bg-4:      #202633;
  --line:      rgba(255,255,255,.075);
  --line-2:    rgba(255,255,255,.14);
  --line-gold: rgba(216,179,92,.38);

  /* ink */
  --ink:   #f5f7fa;
  --ink-2: #c4ccd6;
  --ink-3: #8a93a1;
  --ink-4: #76808f; /* ≥4.5:1 — small functional text */

  /* aurora gold — champagne, luminous */
  --gold:        #d8b35c;
  --gold-bright: #e9cd8a;
  --gold-deep:   #a8853c;
  --gold-grad:   linear-gradient(135deg,#e9cd8a 0%,#d8b35c 48%,#b08a3e 100%);
  --gold-wash:   rgba(216,179,92,.10);

  /* division accents — unified to gold (was Greenlight green / Defense teal) */
  --green:      var(--gold);
  --green-dim:  rgba(216,179,92,.14);
  --teal:       var(--gold);
  --teal-dim:   rgba(216,179,92,.14);
  --alert:      #e35743;   /* detection / intercept — used sparingly */
  --alert-dim:  rgba(227,87,67,.16);

  /* type */
  --font-display:'Sora',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-mono:'JetBrains Mono','SFMono-Regular',ui-monospace,monospace;

  /* metrics */
  --container: 1240px;
  --container-wide: 1400px;
  --radius:   16px;
  --radius-sm: 10px;
  --radius-lg: 24px;
  --pad-section: clamp(4.5rem, 9vw, 8.5rem);
  --fs-section: clamp(2.2rem,5.5vw,4.2rem); /* standard section heading */
  --fs-section-xl: clamp(2.4rem,7vw,5.4rem); /* big section moment (coverage, etc.) */
  --fs-display: clamp(2.8rem,8vw,6.8rem); /* page-hero h1 */
  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);

  --shadow-1: 0 2px 10px rgba(0,0,0,.3);
  --shadow-2: 0 18px 50px -22px rgba(0,0,0,.7);
  --shadow-gold: 0 14px 40px -18px rgba(216,179,92,.55);

  --header-h: 74px; /* nav only (utility bar removed) */
}
@media(max-width:860px){:root{--header-h:74px}}

/* ---------- 2. Reset / base --------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;background:var(--bg)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  font-family:var(--font-body);
  background:var(--bg);
  color:var(--ink-2);
  line-height:1.6;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:clip;
}
html{overflow-x:clip}
img,svg,video{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:none}
ul{list-style:none}
input,textarea,select{font:inherit;color:inherit}
::selection{background:var(--gold);color:#0a0c0f}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:4px}

/* subtle operational grain on the whole page */
body::after{
  content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.025;
  background-image: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='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- 3. Typography ----------------------------------------------- */
h1,h2,h3,h4,h5{font-family:var(--font-display);color:var(--ink);line-height:1.08;font-weight:700;letter-spacing:-.02em}
.display{font-size:clamp(2.7rem,6.2vw,5.1rem);font-weight:800;letter-spacing:-.035em;line-height:1.02}
h2,.h2{font-size:clamp(2rem,4.2vw,3.3rem);font-weight:700}
h3,.h3{font-size:clamp(1.4rem,2.4vw,1.95rem)}
h4,.h4{font-size:1.18rem;font-weight:600}
.lede{font-size:clamp(1.05rem,1.5vw,1.32rem);color:var(--ink-2);line-height:1.55;font-weight:330}
.muted{color:var(--ink-3)}
strong{color:var(--ink);font-weight:600}
p{max-width:68ch}

/* eyebrow — mono operational label with leading tick */
.eyebrow{
  font-family:var(--font-mono);font-size:.75rem;font-weight:600;letter-spacing:.28em;
  text-transform:uppercase;color:var(--gold);display:inline-flex;align-items:center;gap:.7em;
}
.eyebrow::before{content:none}
.eyebrow.center::after{content:"";width:26px;height:1px;background:var(--gold);opacity:.7}
.eyebrow.green{color:var(--green)}.eyebrow.green::before,.eyebrow.green::after{background:var(--green)}
.eyebrow.teal{color:var(--teal)}.eyebrow.teal::before,.eyebrow.teal::after{background:var(--teal)}

/* mono micro-tag — 12px floor (functional text); diegetic HUD labels opt down via .diegetic */
.mono-tag{font-family:var(--font-mono);font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3)}
.rec{display:inline-flex;align-items:center;gap:.45em;font-family:var(--font-mono);font-size:.66rem;letter-spacing:.14em;color:var(--ink-2);text-transform:uppercase}
.rec::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--alert);box-shadow:0 0 0 0 var(--alert);animation:rec 2s infinite}
@keyframes rec{0%{box-shadow:0 0 0 0 rgba(227,87,67,.5)}70%{box-shadow:0 0 0 6px rgba(227,87,67,0)}100%{box-shadow:0 0 0 0 rgba(227,87,67,0)}}

/* ---------- 4. Layout --------------------------------------------------- */
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:clamp(1.15rem,4vw,2rem)}
.container.wide{max-width:var(--container-wide)}
.container.narrow{max-width:920px}
section{position:relative}
.section{padding-block:var(--pad-section)}
.section.tight{padding-block:clamp(3rem,6vw,5rem)}
.bg-1{background:var(--bg-1)}.bg-2{background:var(--bg-2)}



.section-head{max-width:760px;margin-bottom:clamp(2.4rem,4vw,3.6rem)}
.section-head .eyebrow{margin-bottom:1.1rem}
.section-head .lede{margin-top:1.1rem}
.section-head.center{margin-inline:auto;text-align:center}
.section-head.center .eyebrow{justify-content:center}

/* index number for sections (mirrors the brief styling) */
.sec-index{font-family:var(--font-mono);font-size:.8rem;color:var(--ink-4);letter-spacing:.2em}

/* grids */
.grid{display:grid;gap:1.4rem}
.g-2{grid-template-columns:repeat(2,1fr)}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:980px){.g-3,.g-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.g-2,.g-3,.g-4{grid-template-columns:1fr}}

/* ---------- 5. Buttons -------------------------------------------------- */
.btn{
  --bg:transparent;display:inline-flex;align-items:center;gap:.65em;justify-content:center;
  font-family:var(--font-display);font-weight:600;font-size:.95rem;letter-spacing:-.01em;
  padding:.92em 1.5em;border-radius:999px;border:1px solid transparent;
  transition:transform .35s var(--ease),background .3s,box-shadow .35s,border-color .3s,color .3s;
  white-space:nowrap;position:relative;
}
.btn svg{width:1.05em;height:1.05em;transition:transform .35s var(--ease)}
.btn:hover{transform:translateY(-2px)}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.45;pointer-events:none;transform:none;box-shadow:none}
.btn:hover svg{transform:translateX(3px)}
.btn-primary{background:var(--gold-grad);color:#0a0c0f;box-shadow:var(--shadow-gold)}
.btn-primary:hover{box-shadow:0 18px 46px -16px rgba(216,179,92,.7)}
.btn-ghost{border-color:var(--line-2);color:var(--ink);background:rgba(255,255,255,.02)}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold);background:var(--gold-wash)}
.btn-light{background:var(--ink);color:#0a0c0f}
.btn-light:hover{background:#fff}
.btn-lg{padding:1.05em 1.9em;font-size:1.02rem}
.btn-sm{padding:.66em 1.1em;font-size:.85rem}
.btn-block{display:flex;width:100%}

/* text link with arrow */
.tlink{display:inline-flex;align-items:center;gap:.5em;min-height:24px;padding:.25em 0;font-family:var(--font-display);font-weight:600;
  color:var(--ink);font-size:.95rem;transition:color .25s}
.tlink svg{width:1em;height:1em;transition:transform .3s var(--ease)}
.tlink:hover{color:var(--gold)}.tlink:hover svg{transform:translateX(4px)}
.tlink.gold{color:var(--gold)}
.tlink.green{color:var(--green)}.tlink.green:hover{color:var(--green)}
.tlink.teal{color:var(--teal)}.tlink.teal:hover{color:var(--teal)}

/* cover link — direct child of .panel / .stack-card / .hpanel; makes the whole
   surface clickable for pointer users while the visible link serves keyboard/SR */
.cover-link{position:absolute;inset:0;z-index:4;border-radius:inherit}
.panel:has(.cover-link:hover) .tlink svg,
.hpanel:has(.cover-link:hover) .tlink svg{transform:translateX(4px)}
.panel:has(.cover-link:hover) .tlink{color:var(--ink)}
.stack-card:has(.cover-link:hover) .btn-light{background:#fff;transform:translateY(-2px)}
.hpanel.hp-cta:has(.cover-link:hover) .btn-primary{transform:translateY(-2px)}

/* ---------- 6. Division pills / chips ----------------------------------- */
.pill{display:inline-flex;align-items:center;gap:.5em;font-family:var(--font-mono);font-size:.7rem;
  font-weight:600;letter-spacing:.16em;text-transform:uppercase;padding:.42em .8em;border-radius:999px;
  border:1px solid var(--line-2);color:var(--ink-2);background:rgba(255,255,255,.03)}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.pill.physical{color:var(--gold);border-color:var(--line-gold);background:var(--gold-wash)}
.pill.greenlight{color:var(--green);border-color:rgba(216,179,92,.32);background:var(--green-dim)}
.pill.defense{color:var(--teal);border-color:rgba(216,179,92,.32);background:var(--teal-dim)}
.pill.alert{color:var(--alert);border-color:rgba(227,87,67,.32);background:var(--alert-dim)}
/* Habib 2026-06-14 — pill/chip "boxes" removed site-wide (cluttered + looked forced) */
.pill,.street-chip,.gx-chip,.sc-chips,.street-chips,.footer-divisions,.gx-chips{display:none!important}
/* Habib 2026-06-14 — ONE consistent gold accent; no green/teal coloured words anywhere */
.eyebrow.green,.eyebrow.teal{color:var(--gold)}
.eyebrow.green::before,.eyebrow.green::after,.eyebrow.teal::before,.eyebrow.teal::after{background:var(--gold)}
.sc-no.green,.sc-no.teal,.tlink.green,.tlink.teal,.svc.greenlight h3,.svc.defense h3{color:var(--gold)}
h2 .green,h2 .teal,h3 .green,h3 .teal,.giant .green,.giant .teal{color:inherit}
/* Habib 2026-06-14 — cap HERO headline size so longer factual headlines fit the hero frame (no clipping) */
.panel .panel-inner .giant,.panel .panel-inner h1{font-size:clamp(2.3rem,5.2vw,4.4rem)!important;line-height:1.04;letter-spacing:-.03em}
/* Habib 2026-06-14 — Virtual Guard hero: Sentinel robot CENTERED behind the headline on a clean dark backdrop */
.vsg-hero{background:var(--bg)!important;overflow:hidden}
.vsg-hero::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(58% 66% at 50% 40%,rgba(216,179,92,.14),transparent 72%),radial-gradient(46% 56% at 72% 88%,rgba(216,179,92,.08),transparent 72%)}
.vsg-hero .vsg-robot{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;max-width:none!important;margin:0!important;opacity:1!important;z-index:1!important}
.vsg-hero .vsg-robot::before{content:none}
.vsg-hero .vsg-robot canvas,.vsg-hero .vsg-robot .spline-canvas{position:absolute;inset:0;width:100%!important;height:100%!important;display:block;-webkit-mask-image:none!important;mask-image:none!important}
.vsg-hero .vsg-robot .spline-fallback{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;right:auto!important;bottom:auto!important;object-fit:contain!important;opacity:.92;-webkit-mask-image:none!important;mask-image:none!important}
.vsg-hero .vsg-hero-content{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;margin:0 auto;max-width:920px}
.vsg-hero .vsg-hero-content::before{content:"";position:absolute;inset:-14% -24%;z-index:-1;pointer-events:none;
  background:radial-gradient(52% 46% at 50% 50%,rgba(8,9,12,.66),rgba(8,9,12,.24) 58%,transparent 80%)}
.vsg-hero .vsg-hero-content .eyebrow{justify-content:center}
.vsg-hero .vsg-hero-content .giant{text-shadow:0 6px 36px rgba(8,9,12,.88),0 2px 9px rgba(8,9,12,.72)}
.vsg-hero .vsg-hero-content .oneline{max-width:60ch;text-shadow:0 2px 14px rgba(8,9,12,.94)}
.vsg-hero .vsg-hero-content .hero-actions{justify-content:center}
@media(max-width:900px){ .vsg-hero{height:92svh!important} .vsg-hero .vsg-hero-content{padding-top:6svh} }

/* ---------- 7. Viewfinder / framed media -------------------------------- */
.viewfinder{position:relative;overflow:hidden;border-radius:var(--radius);background:var(--bg-2)}
.viewfinder>img,.viewfinder>video{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease-out)}
.viewfinder .corner{position:absolute;width:22px;height:22px;border:2px solid rgba(245,247,250,.85);z-index:3;pointer-events:none}
.viewfinder .corner.tl{top:14px;left:14px;border-right:0;border-bottom:0}
.viewfinder .corner.tr{top:14px;right:14px;border-left:0;border-bottom:0}
.viewfinder .corner.bl{bottom:14px;left:14px;border-right:0;border-top:0}
.viewfinder .corner.br{bottom:14px;right:14px;border-left:0;border-top:0}
.viewfinder .vf-tag{position:absolute;z-index:3;left:16px;bottom:14px;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.8)}
.viewfinder .vf-tag.tr{left:auto;right:16px;bottom:auto;top:14px}
.viewfinder::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,11,14,0) 45%,rgba(9,11,14,.55) 100%);pointer-events:none}
.viewfinder.lit .corner{border-color:var(--gold)}
.viewfinder.green .corner{border-color:var(--green)}
.viewfinder.teal .corner{border-color:var(--teal)}
.viewfinder.alert .corner{border-color:var(--alert)}

/* ---------- 8. Header / nav --------------------------------------------- */
.site-header{position:fixed;top:0;left:0;right:0;z-index:1000;transition:background .4s,border-color .4s,backdrop-filter .4s}
.site-header::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,11,14,.85),rgba(9,11,14,0));opacity:1;transition:opacity .4s;z-index:-1}
.site-header.scrolled{background:rgba(9,11,14,.86);backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid var(--line)}
.site-header.scrolled::before{opacity:0}

/* (utility bar removed 2026-06-17) */

.nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:74px;gap:1.5rem}
.brand{display:flex;align-items:center;gap:.7rem;flex-shrink:0}
.brand img{height:38px;width:auto;flex:none;object-fit:contain}
.nav-links{display:flex;align-items:center;gap:.35rem}
.nav-links>li>a,.nav-links>li>button{display:inline-flex;align-items:center;gap:.4em;padding:.6em .85em;border-radius:8px;
  font-size:.92rem;font-weight:600;color:var(--ink-2);transition:color .2s,background .2s}
.nav-links>li>a:hover,.nav-links>li>button:hover,.nav-links>li.open>button{color:var(--ink);background:rgba(255,255,255,.05)}
.nav-links .caret{width:.7em;height:.7em;transition:transform .3s}
.nav-links li.open .caret{transform:rotate(180deg)}
.nav-cta{display:flex;align-items:center;gap:.7rem;flex-shrink:0;justify-self:end}
.signin-nav{font-size:.72rem;padding:.42em .58em;border:1px solid rgba(216,179,92,.42);cursor:pointer;white-space:nowrap;transition:transform .22s cubic-bezier(.16,1,.3,1),background .22s ease,border-color .22s ease,box-shadow .22s ease}
.signin-nav:hover{transform:translateY(-2px) scale(1.05);border-color:var(--gold);background:rgba(216,179,92,.14);box-shadow:0 8px 22px rgba(0,0,0,.4)}
@media(max-width:1120px){.signin-nav{font-size:.68rem;padding:.4em .5em}}
.nav-toggle{display:none;width:44px;height:44px;border-radius:10px;border:1px solid var(--line-2);align-items:center;justify-content:center}
.nav-toggle span{position:relative;width:20px;height:2px;background:var(--ink);transition:.3s}
.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;left:0;width:20px;height:2px;background:var(--ink);transition:.3s}
.nav-toggle span::before{top:-6px}.nav-toggle span::after{top:6px}
.nav-toggle.active span{background:transparent}
.nav-toggle.active span::before{top:0;transform:rotate(45deg)}
.nav-toggle.active span::after{top:0;transform:rotate(-45deg)}

/* mega-menu */
.mega{position:absolute;left:0;right:0;top:100%;background:rgba(11,14,19,.97);backdrop-filter:blur(20px);
  border-top:1px solid var(--line-gold);border-bottom:1px solid var(--line);
  opacity:0;visibility:hidden;transform:translateY(-8px);transition:.3s var(--ease);box-shadow:var(--shadow-2)}
.nav-item.open .mega{opacity:1;visibility:visible;transform:translateY(0)}
.mega-inner{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:2.2rem;padding:2.4rem clamp(1.15rem,4vw,2rem) 2.6rem}
.mega-col h5,.mega-col .fcol-h{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem;font-weight:600}
.mega-col.greenlight h5{color:var(--green)}.mega-col.defense h5{color:var(--teal)}
.mega-col li a{display:block;padding:.42em 0;color:var(--ink-2);font-size:.92rem;transition:color .2s,padding .2s;border-bottom:1px solid transparent}
.mega-col li a:hover{color:var(--gold);padding-left:.4em}
.mega-feature{background:linear-gradient(160deg,var(--bg-3),var(--bg-1));border:1px solid var(--line);border-radius:var(--radius);padding:1.5rem;display:flex;flex-direction:column;justify-content:space-between}
.mega-feature .ft-label{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
.mega-feature h4{margin:.6rem 0 .4rem;color:var(--ink)}
.mega-feature p{font-size:.88rem;color:var(--ink-3);margin-bottom:1rem}

/* ---------- 9. Mobile drawer -------------------------------------------- */
.mobile-nav{position:fixed;inset:0;z-index:1100;background:var(--bg);transform:translateX(100%);
  transition:transform .42s var(--ease);overflow-y:auto;padding:5.5rem 1.4rem 3rem;display:flex;flex-direction:column}
.mobile-nav.open{transform:translateX(0)}
.mobile-nav .m-group{border-bottom:1px solid var(--line)}
.mobile-nav .m-group>button,.mobile-nav>a.m-link{width:100%;display:flex;align-items:center;justify-content:space-between;
  padding:1.05rem .2rem;font-family:var(--font-display);font-size:1.15rem;color:var(--ink);font-weight:600}
.mobile-nav .m-sub{max-height:0;overflow:hidden;transition:max-height .4s var(--ease)}
.mobile-nav .m-group.open .m-sub{max-height:600px}
.mobile-nav .m-sub a{display:block;padding:.6rem .2rem;color:var(--ink-3);font-size:.98rem}
.mobile-nav .m-sub a:hover{color:var(--gold)}
.mobile-nav .m-group>button .caret{transition:transform .3s}
.mobile-nav .m-group.open>button .caret{transform:rotate(180deg)}
.mobile-cta{margin-top:1.6rem;display:flex;flex-direction:column;gap:.8rem}
@media(max-width:1080px){
  .nav-links,.nav-cta .btn-ghost{display:none}
  .nav-toggle{display:inline-flex}
}

/* ---------- 12. Cards --------------------------------------------------- */
.card{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  transition:transform .45s var(--ease),border-color .35s,box-shadow .45s;display:flex;flex-direction:column;position:relative}
.card:hover{transform:translateY(-5px);border-color:var(--line-gold);box-shadow:var(--shadow-2)}
.card-media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--bg-3)}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease-out)}
.card:hover .card-media img{transform:scale(1.06)}
.card-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(9,11,14,.6))}
.card-media .pill{position:absolute;top:14px;left:14px;z-index:2}
.card-body{padding:1.5rem 1.5rem 1.6rem;display:flex;flex-direction:column;gap:.6rem;flex:1}
.card-body h3{font-size:1.28rem}
.card-body p{font-size:.92rem;color:var(--ink-3);flex:1}
.card-body .tlink{margin-top:.4rem}

/* service card (icon-led, no image) */
.svc{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius);padding:1.7rem;
  transition:transform .4s var(--ease),border-color .3s,background .3s;position:relative;overflow:hidden;height:100%}
.svc::before{content:"";position:absolute;left:0;top:0;height:100%;width:3px;background:var(--gold-grad);transform:scaleY(0);transform-origin:top;transition:transform .4s var(--ease)}
.svc:hover{transform:translateY(-4px);border-color:var(--line-2);background:var(--bg-3)}
.svc:hover::before{transform:scaleY(1)}
.svc.greenlight::before{background:var(--green)}.svc.defense::before{background:var(--teal)}
.svc-ico{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:var(--gold-wash);border:1px solid var(--line-gold);color:var(--gold);margin-bottom:1.2rem}
.svc.greenlight .svc-ico{background:var(--green-dim);border-color:rgba(216,179,92,.3);color:var(--green)}
.svc.defense .svc-ico{background:var(--teal-dim);border-color:rgba(216,179,92,.3);color:var(--teal)}
.svc-ico svg{width:24px;height:24px}
.svc h3{font-size:1.18rem;margin-bottom:.5rem}
.svc p{font-size:.9rem;color:var(--ink-3);margin-bottom:1rem}
.svc ul{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1.1rem}
.svc ul li{font-size:.85rem;color:var(--ink-2);padding-left:1.3em;position:relative}
.svc ul li::before{content:"";position:absolute;left:0;top:.55em;width:6px;height:6px;border-right:1.5px solid var(--gold);border-bottom:1.5px solid var(--gold);transform:rotate(-45deg)}

/* stat block */
.stat{display:flex;flex-direction:column;gap:.3rem}
.stat .num{font-family:var(--font-display);font-weight:800;font-size:clamp(2.4rem,4.5vw,3.6rem);
  color:var(--ink);line-height:1;letter-spacing:-.04em;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.stat .lbl{font-size:.86rem;color:var(--ink-3);max-width:22ch}
.stat .sub{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-4)}

/* ---------- 13. Process stepline — vertical milestone --------------- */
.stepline{position:relative;display:block;max-width:680px;margin:0 auto;padding:0;background:none;border:0;border-radius:0;overflow:visible}
.stepline::before{content:"";position:absolute;left:23px;top:26px;bottom:26px;width:2px;background:linear-gradient(180deg,var(--gold) 0%,rgba(212,168,83,.45) 55%,var(--line) 100%)}
.stepline .step{position:relative;display:block;background:none;border:0;border-radius:0;padding:0 0 1.95rem 4.6rem;min-height:52px;cursor:default;transition:none}
.stepline .step:last-child{padding-bottom:0}
.stepline .step .s-no{position:absolute;left:0;top:0;width:48px;height:48px;margin:0;display:flex;align-items:center;justify-content:center;border-radius:50%;font-family:var(--font-mono);font-size:1rem;font-weight:600;letter-spacing:0;color:var(--gold-bright);background:var(--bg-2);border:1.5px solid var(--gold);box-shadow:0 6px 16px rgba(0,0,0,.35);transition:border-color .35s,box-shadow .35s,color .35s}
.stepline .step h4{font-size:1.18rem;line-height:1.22;margin:.62rem 0 .32rem;letter-spacing:-.01em}
.stepline .step h4:last-child{margin:0;min-height:48px;display:flex;align-items:center}
.stepline .step p{font-size:.92rem;line-height:1.5;color:var(--ink-3);max-width:48ch;margin:0}
.stepline .step::after{content:none}
.stepline .step.active .s-no,.stepline .step.on .s-no,.stepline .step:hover .s-no{border-color:var(--gold-bright);color:#fff;box-shadow:0 0 0 4px rgba(212,168,83,.12),0 0 22px rgba(212,168,83,.4)}
@media(max-width:600px){.stepline .step{padding-left:3.9rem;padding-bottom:1.6rem}.stepline .step .s-no{width:42px;height:42px;font-size:.9rem}.stepline::before{left:20px}}

/* ---------- 13b. Proof video (real footage) ------------------------- */
.proofvid{max-width:1000px;margin:0 auto}
.proofvid video{width:100%;height:auto;display:block;border-radius:var(--radius);border:1px solid var(--line);background:#000;box-shadow:0 24px 70px rgba(0,0,0,.55)}
.proofvid figcaption{margin-top:1rem;text-align:center}

/* ---------- 14. Split / feature blocks ---------------------------------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.split.rev>.split-media{order:-1}
@media(max-width:900px){.split{grid-template-columns:1fr}.split.rev>.split-media{order:0}}
.split-media{position:relative}
.feature-list{display:flex;flex-direction:column;gap:1.1rem;margin-top:1.8rem}
.feature-list li{display:flex;gap:1rem;align-items:flex-start}
.feature-list .fi-ico{flex-shrink:0;width:38px;height:38px;border-radius:10px;background:var(--gold-wash);border:1px solid var(--line-gold);
  display:flex;align-items:center;justify-content:center;color:var(--gold)}
.feature-list .fi-ico svg{width:19px;height:19px}
.feature-list h4{font-size:1rem;margin-bottom:.2rem}
.feature-list p{font-size:.88rem;color:var(--ink-3)}

/* ---------- 16. Case studies -------------------------------------------- */
.case{position:relative;border-radius:var(--radius);overflow:hidden;min-height:430px;display:flex;align-items:flex-end;
  border:1px solid var(--line)}
.case img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease-out)}
.case:hover img{transform:scale(1.05)}
.case::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,9,12,.5) 0%,rgba(8,9,12,.74) 40%,rgba(8,9,12,.96))}
.case-body{position:relative;z-index:2;padding:1.8rem;width:100%}
.case-body .pill{margin-bottom:.9rem}
.case-body h3{font-size:1.4rem;margin-bottom:.5rem;text-shadow:0 2px 16px rgba(0,0,0,.72)}
.case-body p{font-size:.9rem;color:#e7ebf1;text-shadow:0 1px 12px rgba(0,0,0,.82)}
.case-body p strong{color:#fff;font-weight:700}
.case-metrics{display:flex;gap:1.6rem;margin-top:1.2rem;padding-top:1.2rem;border-top:1px solid var(--line-2)}
.case-metrics .cm b{display:block;font-family:var(--font-display);font-weight:700;font-size:1.5rem;color:var(--gold)}
.case-metrics .cm span{font-size:.72rem;color:var(--ink-3)}

/* horizontal scroll rail */
.rail{display:flex;gap:1.4rem;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1rem;scrollbar-width:thin;scrollbar-color:var(--gold) transparent}
.rail::-webkit-scrollbar{height:6px}.rail::-webkit-scrollbar-thumb{background:var(--gold);border-radius:3px}
.rail>*{scroll-snap-align:start;flex:0 0 clamp(300px,40vw,440px)}

/* ---------- 17. Industries grid ----------------------------------------- */
.ind-tile{position:relative;border-radius:var(--radius-sm);overflow:hidden;aspect-ratio:1/1;border:1px solid var(--line);
  display:flex;align-items:flex-end;padding:1.1rem;transition:.4s var(--ease)}
.ind-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(.3);transition:.6s}
.ind-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,11,14,.2),rgba(9,11,14,.85))}
.ind-tile span{position:relative;z-index:2;font-family:var(--font-display);font-weight:600;font-size:.98rem;color:#fff}
.ind-tile:hover{border-color:var(--gold)}
.ind-tile:hover img{filter:grayscale(0);transform:scale(1.07)}

/* ---------- 18. Why-switch (problem/correction) ------------------------- */
.switch-row{display:grid;grid-template-columns:1fr auto 1fr;gap:1.6rem;align-items:center;padding:1.5rem 0;border-bottom:1px solid var(--line)}
.switch-row .prob{color:var(--ink-3)}
.switch-row .prob b{color:var(--ink-2);display:block;margin-bottom:.2rem;font-family:var(--font-display)}
.switch-row .arrow{color:var(--gold);font-family:var(--font-mono)}
.switch-row .fix b{color:var(--gold);display:block;margin-bottom:.2rem;font-family:var(--font-display)}
.switch-row .fix{color:var(--ink-2)}
@media(max-width:760px){.switch-row{grid-template-columns:1fr;gap:.5rem}.switch-row .arrow{display:none}}

/* ---------- 19. Accordion / FAQ ----------------------------------------- */
.acc{border-top:1px solid var(--line)}
.acc-item{border-bottom:1px solid var(--line)}
.acc-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.4rem 0;
  text-align:left;font-family:var(--font-display);font-weight:600;font-size:1.08rem;color:var(--ink);transition:color .25s}
.acc-q:hover{color:var(--gold)}
.acc-q .ico{flex-shrink:0;width:24px;height:24px;position:relative}
.acc-q .ico::before,.acc-q .ico::after{content:"";position:absolute;background:var(--gold);transition:.3s}
.acc-q .ico::before{top:11px;left:3px;width:18px;height:2px}
.acc-q .ico::after{top:3px;left:11px;width:2px;height:18px}
.acc-item.open .acc-q .ico::after{transform:rotate(90deg);opacity:0}
.acc-a{max-height:0;overflow:hidden;transition:max-height .4s var(--ease)}
.acc-a-inner{padding:0 0 1.4rem;color:var(--ink-3);font-size:.95rem;max-width:75ch}

/* ---------- 20. Tabs / comparison --------------------------------------- */
.tabs{display:inline-flex;gap:.3rem;background:var(--bg-2);border:1px solid var(--line);border-radius:999px;padding:.35rem}
.tab{padding:.6em 1.2em;border-radius:999px;font-size:.88rem;font-weight:600;color:var(--ink-3);font-family:var(--font-display);transition:.3s}
.tab.active{background:var(--gold-grad);color:#0a0c0f}
.compare{width:100%;border-collapse:collapse;font-size:.92rem}
.compare th,.compare td{padding:1rem 1.1rem;text-align:left;border-bottom:1px solid var(--line)}
.compare thead th{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
.compare tbody th{color:var(--ink-2);font-weight:500;font-family:var(--font-body)}
.compare td{color:var(--ink-3)}
.compare .yes{color:var(--green)}.compare .no{color:var(--ink-4)}
.compare tr:hover td,.compare tr:hover th{background:rgba(255,255,255,.018)}

/* ---------- 21. Spec module --------------------------------------------- */
.specs{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.spec{background:var(--bg-2);padding:1.1rem 1.3rem}
.spec dt{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-4);margin-bottom:.35rem}
.spec dd{font-family:var(--font-display);font-size:1.05rem;color:var(--ink);font-weight:600}
@media(max-width:600px){.specs{grid-template-columns:1fr}}

/* ---------- 22. Forms --------------------------------------------------- */
.field{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.1rem}
.field label{font-family:var(--font-mono);font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.field input,.field select,.field textarea{background:var(--bg-2);border:1px solid var(--line-2);border-radius:10px;
  padding:.85em 1em;color:var(--ink);transition:border-color .25s,box-shadow .25s;width:100%}
.field input::placeholder,.field textarea::placeholder{color:var(--ink-4)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-wash)}
.field textarea{resize:vertical;min-height:120px}
.field.error input,.field.error select,.field.error textarea{border-color:var(--alert);box-shadow:0 0 0 3px var(--alert-dim)}
.field .error-msg{display:none;font-size:.8rem;color:var(--alert);margin-top:.3rem}
.field.error .error-msg{display:block}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
@media(max-width:600px){.form-row{grid-template-columns:1fr}}
.selector-chips{display:flex;flex-wrap:wrap;gap:.6rem}
.chip{padding:.6em 1.05em;border-radius:999px;border:1px solid var(--line-2);font-size:.88rem;color:var(--ink-2);transition:.25s;background:var(--bg-2)}
.chip:hover{border-color:var(--line-gold)}
.chip.active{background:var(--gold-wash);border-color:var(--gold);color:var(--gold)}
.form-note{font-size:.8rem;color:var(--ink-4);margin-top:.5rem}

/* ---------- 23. CTA band ------------------------------------------------ */
.cta-band{position:relative;overflow:hidden;border-radius:var(--radius-lg);border:1px solid var(--line-gold);
  background:linear-gradient(135deg,var(--bg-2),var(--bg-1));padding:clamp(2.4rem,5vw,4rem)}
.cta-band::before{content:"";position:absolute;right:-10%;top:-40%;width:420px;height:420px;border-radius:50%;
  background:radial-gradient(circle,rgba(216,179,92,.18),transparent 65%)}
.cta-band .inner{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.cta-band h2{max-width:18ch}
@media(max-width:720px){
  .cta-band{padding:1.7rem}
  .cta-band .inner{flex-direction:column;align-items:stretch;justify-content:flex-start}
  .cta-band .inner>form{min-width:0!important;max-width:none!important;width:100%!important}
  .cta-band .hero-actions .btn{white-space:normal;width:100%;text-align:center}
}

/* ---------- 24. Footer -------------------------------------------------- */
.site-footer{background:var(--bg-1);border-top:1px solid var(--line);padding-top:clamp(3.5rem,6vw,5.5rem)}
.footer-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:2.2rem;padding-bottom:3rem;border-bottom:1px solid var(--line)}
.footer-brand img{height:40px;margin-bottom:1.2rem}
.footer-brand p{font-size:.9rem;color:var(--ink-3);max-width:34ch}
.footer-divisions{display:flex;gap:.8rem;margin-top:1.4rem;flex-wrap:wrap}
.footer-col h5,.footer-col .fcol-h{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3);margin-bottom:1.1rem}
.footer-col li{margin-bottom:.25rem}
.footer-col a{font-size:.9rem;color:var(--ink-3);transition:color .2s;display:inline-block;padding:.3rem 0}.footer-col a:hover{color:var(--gold)}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;padding:1.8rem 0}
/* (footer legal links removed 2026-06-17) */
.footer-bottom .copy{font-family:var(--font-mono);font-size:.72rem;color:var(--ink-4);letter-spacing:.05em}
@media(max-width:860px){.footer-top{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}}
@media(max-width:520px){.footer-top{grid-template-columns:1fr}}

/* ---------- 25. Motion / reveal ----------------------------------------- */
[data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
[data-reveal].in{opacity:1;transform:none}
[data-reveal][data-d="1"]{transition-delay:.08s}
[data-reveal][data-d="2"]{transition-delay:.16s}
[data-reveal][data-d="3"]{transition-delay:.24s}
[data-reveal][data-d="4"]{transition-delay:.32s}
[data-reveal][data-d="5"]{transition-delay:.4s}
@media (prefers-reduced-motion:reduce){
  [data-reveal]{opacity:1;transform:none;transition:none}
  .rec::before,.hero-scroll .bar::after,.u-247::before{animation:none}
  *{scroll-behavior:auto!important}
}

/* ---------- 24a. AURORA COMPONENTS --------------------------------------- */
/* glow card — rounded, gradient border, cursor-aware radial glow (--mx/--my set by acs.js) */
.glowcard{position:relative;background:rgba(16,19,26,.66);border-radius:20px;padding:1.6rem;
  border:1px solid transparent;background-clip:padding-box;overflow:hidden}
.glowcard::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;
  background:linear-gradient(135deg,rgba(233,205,138,.5),rgba(216,179,92,.28) 50%,rgba(216,179,92,.22));
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.glowcard::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;
  background:radial-gradient(220px circle at var(--mx,50%) var(--my,50%),rgba(216,179,92,.16),transparent 70%);
  transition:opacity .35s}
.glowcard:hover::after{opacity:1}

/* blur-to-sharp reveal (calm rhythm) — pair with data-reveal */
.bts[data-reveal]{opacity:0;filter:blur(14px);transform:translateY(18px);
  transition:opacity .9s var(--ease-out),filter 1.1s var(--ease-out),transform .9s var(--ease-out)}
.bts[data-reveal].in{opacity:1;filter:blur(0);transform:none}
@media (prefers-reduced-motion:reduce){.bts[data-reveal]{opacity:1;filter:none;transform:none;transition:none}}

/* fit-word — acs.js scales [data-fit] so the word always spans its container.
   The clamp is the no-JS / pre-JS fallback so declarations are always huge. */
[data-fit]{display:block;white-space:nowrap;line-height:.92;font-weight:800;letter-spacing:-.04em;
  font-family:var(--font-display);font-size:clamp(3.2rem,11vw,12rem)}

/* sentinel scene — the interactive ACS robot character */
.sentinel-scene{position:relative;min-height:108svh;display:flex;align-items:center;overflow:clip}
.sentinel-wrap{position:absolute;right:max(2vw,calc((100vw - 1400px)/2));bottom:0;height:min(92svh,980px);
  aspect-ratio:768/1344;z-index:2}
.sentinel-glow{position:absolute;inset:-12%;background:radial-gradient(ellipse 50% 42% at 50% 58%,rgba(216,179,92,.22),transparent 65%);
  filter:blur(10px);opacity:.7;transition:opacity .5s;pointer-events:none}
.sentinel-inner{position:absolute;inset:0;will-change:transform;animation:sentinel-breathe 6s ease-in-out infinite}
@keyframes sentinel-breathe{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.sentinel-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;
  filter:drop-shadow(0 30px 60px rgba(0,0,0,.6))}
.sentinel-hb{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;mix-blend-mode:screen}

/* the gold HEARTBEAT — lub-dub, then rest */
.hb{animation:hbpulse 1.9s ease-in-out infinite}
@keyframes hbpulse{
  0%{opacity:.22}
  8%{opacity:1}
  16%{opacity:.35}
  26%{opacity:.85}
  42%{opacity:.22}
  100%{opacity:.22}
}
@media (prefers-reduced-motion:reduce){.hb{animation:none;opacity:.55}}
.sentinel-wrap:hover .sentinel-glow{opacity:1}
.sentinel-callout{position:absolute;display:flex;align-items:center;gap:.6em;font-family:var(--font-mono);
  font-size:.68rem;letter-spacing:.18em;color:var(--gold-bright);text-transform:uppercase;white-space:nowrap;
  opacity:0;transform:translateX(-8px);transition:opacity .5s var(--ease),transform .5s var(--ease);pointer-events:none}
.sentinel-callout::before{content:"";width:34px;height:1px;background:var(--gold)}
.sentinel-callout.cright{flex-direction:row-reverse;transform:translateX(8px)}
.sentinel-wrap:hover .sentinel-callout,.sentinel-wrap.lit .sentinel-callout{opacity:1;transform:none}
.sentinel-wrap:hover .sentinel-callout:nth-of-type(3),.sentinel-wrap.lit .sentinel-callout:nth-of-type(3){transition-delay:.1s}
.sentinel-wrap:hover .sentinel-callout:nth-of-type(4),.sentinel-wrap.lit .sentinel-callout:nth-of-type(4){transition-delay:.2s}
@media(max-width:900px){
  .sentinel-scene{min-height:auto;flex-direction:column;align-items:stretch}
  .sentinel-wrap{position:relative;right:auto;margin:1.5rem auto 0;height:64svh}
  .sentinel-callout{display:none}
}
@media (prefers-reduced-motion:reduce){
  .sentinel-img{animation:none}
  .sentinel-callout{opacity:1;transform:none}
}

/* borderlight — gold pulse runner host (svg injected by borderlight.js) */
[data-borderlight]{position:relative}
.borderlight-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:6;overflow:visible}
.borderlight-svg rect{fill:none;stroke-width:1.5;stroke-linecap:round}
.borderlight-base{stroke:rgba(216,179,92,.14)}
.borderlight-run{stroke:url(#blgrad);stroke-dasharray:160 1400;animation:blrun 7s linear infinite}
@keyframes blrun{to{stroke-dashoffset:-1560}}
@media (prefers-reduced-motion:reduce){.borderlight-run{animation:none;opacity:.35}}

/* windsor streets — 2.5D parallax chapter */
.streets{position:relative;min-height:135svh;overflow:clip}
.streets .st-layer{position:absolute;inset:-8% 0;background-size:cover;background-position:center;will-change:transform}
.streets .st-sky{opacity:.9}
.streets .st-mid{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 16%,#000 90%,transparent);
  mask-image:linear-gradient(180deg,transparent 0,#000 16%,#000 90%,transparent)}
.streets .st-trails{mix-blend-mode:screen;opacity:.5}
.streets .st-veil{position:absolute;inset:0;background:linear-gradient(180deg,var(--bg) 0,rgba(8,9,12,.25) 18%,rgba(8,9,12,.35) 60%,var(--bg) 100%)}
.streets .st-content{position:relative;z-index:3;padding:18svh 0 14svh}
.street-chips{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.6rem}
.street-chip{display:inline-flex;align-items:center;gap:.6em;font-family:var(--font-mono);font-size:.7rem;
  letter-spacing:.2em;color:var(--ink-2);border:1px solid var(--line-2);border-radius:999px;padding:.55em 1em;
  background:rgba(8,9,12,.55);backdrop-filter:blur(6px)}
.street-chip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 10px var(--gold)}
.streets[data-progress] .st-sky{transform:translateY(calc(var(--p,0)*-5%)) scale(1.04)}
.streets[data-progress] .st-mid{transform:translateY(calc(var(--p,0)*-13%)) scale(1.06)}
.streets[data-progress] .st-trails{transform:translateY(calc(var(--p,0)*-22%)) scale(1.08)}
@media (prefers-reduced-motion:reduce){.streets .st-layer{transform:none!important}}

/* word-knockout band (kinetic moment, footage inside letters) */
.koband{position:relative;height:72svh;overflow:clip;background:var(--bg)}
.koband video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.koband svg{position:absolute;inset:0;width:100%;height:100%}
.koband .ko-sub{position:absolute;left:0;right:0;bottom:9%;text-align:center;z-index:3}
@media(max-width:900px){.koband{height:46svh}}

/* ---------- 24b. WORLD LAYER (continuous atmosphere behind every page) --- */
.world-canvas{position:fixed;inset:0;z-index:-1;width:100%;height:100%;display:block}
body.world-on{background:transparent}
body.world-on .bg-1{background:rgba(13,16,21,.60)}
body.world-on .bg-2{background:rgba(18,22,29,.55)}
body.world-on .guardian-scene{background:transparent}
body.world-on .marquee{background:rgba(13,16,21,.5);backdrop-filter:blur(2px)}
body.world-on .site-footer{background:rgba(13,16,21,.78);backdrop-filter:blur(6px)}
body.world-on .proofstrip{background:rgba(13,16,21,.6)}

/* chapter slam — big entrances for headlines/blocks (use with data-reveal) */
.slam[data-reveal]{opacity:0;transform:translateY(70px) skewY(2.4deg) scale(.965);
  transition:transform 1s cubic-bezier(.16,1.18,.28,1),opacity .55s ease-out}
.slam[data-reveal].in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.slam[data-reveal]{transform:none;opacity:1;transition:none}}

/* ---------- 24c. Hero primitives (actions / scroll cue / corners) -------- */
.hero-actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2.2rem}
.hero-corner{position:absolute;width:30px;height:30px;border:2px solid var(--gold);z-index:2;opacity:.65}
.hero-corner.tl{top:90px;left:24px;border-right:0;border-bottom:0}
.hero-corner.br{bottom:24px;right:24px;border-left:0;border-top:0}
.hero-scroll{position:absolute;left:50%;bottom:1.6rem;transform:translateX(-50%);z-index:3;display:flex;flex-direction:column;align-items:center;gap:.5rem;color:var(--ink-3)}
.hero-scroll .bar{width:1px;height:42px;background:linear-gradient(var(--gold),transparent);position:relative;overflow:hidden}
.hero-scroll .bar::after{content:"";position:absolute;top:-50%;left:0;width:100%;height:50%;background:var(--gold);animation:scrolldot 2s var(--ease) infinite}
@keyframes scrolldot{0%{top:-50%}100%{top:100%}}

/* ---------- 25a. PORTAL (city -> site scrub hero) ------------------------- */
.portal{height:200vh;position:relative;background:transparent}
.portal-stick{position:sticky;top:0;height:100svh;overflow:clip}
.hero-frame{position:absolute;inset:0;overflow:hidden;background:#05070a;will-change:transform,border-radius;transform-origin:center center}
/* construction "on the jobsite" band (after the hero box) */
.constr-grid{display:grid;grid-template-columns:1.35fr 1fr;grid-auto-rows:minmax(220px,1fr);gap:1rem;margin-top:2.2rem}
.constr-grid figure{position:relative;margin:0;border-radius:var(--radius-lg);overflow:clip;border:1px solid var(--line-2)}
.constr-grid figure img{width:100%;height:100%;object-fit:cover;display:block}
.constr-grid figure::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 42%,rgba(8,9,12,.86))}
.constr-grid figcaption{position:absolute;left:1.1rem;bottom:1rem;z-index:1;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.05em;color:#fff;text-transform:uppercase}
.constr-tall{grid-row:span 2}
@media(max-width:760px){.constr-grid{grid-template-columns:1fr 1fr}.constr-tall{grid-row:auto;grid-column:1 / -1}}
.city-plate{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;will-change:transform;
  transform:scale(calc(1.04 + var(--p,0)*0.55)) translateY(calc(var(--p,0)*-4%))}
.scrub-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0}
.portal-vignette{position:absolute;inset:0;pointer-events:none;z-index:2;
  background:radial-gradient(ellipse at 50% 55%,transparent 52%,rgba(5,7,10,.62) 100%),
             linear-gradient(180deg,rgba(5,7,10,.55),transparent 30%,transparent 72%,rgba(5,7,10,.7))}
.portal-scan{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.45;
  background:repeating-linear-gradient(180deg,rgba(255,255,255,0) 0 2px,rgba(255,255,255,.014) 2px 3px)}

.feed-glitch{position:absolute;inset:0;z-index:5;pointer-events:none;opacity:0;display:flex;align-items:center;justify-content:center;
  background:
   repeating-linear-gradient(180deg,rgba(9,11,14,.92) 0 3px,rgba(20,26,34,.92) 3px 5px),
   #0a0d12}
.feed-glitch .fg-label{font-family:var(--font-mono);font-size:clamp(.8rem,1.6vw,1.05rem);letter-spacing:.3em;color:var(--green);
  text-transform:uppercase;display:flex;align-items:center;gap:1em}
.feed-glitch .fg-label::before,.feed-glitch .fg-label::after{content:"";width:42px;height:1px;background:var(--green)}

.portal-hud{position:absolute;z-index:6;inset:0;pointer-events:none;font-family:var(--font-mono)}
.portal-hud .ph-row{position:absolute;left:0;right:0;display:flex;justify-content:space-between;padding-inline:clamp(1.15rem,4vw,2rem)}
.portal-hud .ph-top{top:calc(var(--header-h) + 14px)}
.portal-hud .ph-bottom{bottom:1.4rem}
.portal-hud .ph-alt{font-size:.75rem;letter-spacing:.18em;color:var(--ink-2);text-shadow:0 1px 4px rgba(0,0,0,.9)}

.portal-title{position:absolute;z-index:4;left:0;right:0;bottom:clamp(2.5rem,7vw,5.5rem)}
.portal-title .giant{text-shadow:0 4px 30px rgba(0,0,0,.55)}
.portal-end{position:absolute;z-index:4;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;opacity:0;pointer-events:none}
.portal-end.live{pointer-events:auto}
.portal-end h2{text-shadow:0 4px 30px rgba(0,0,0,.65)}
.portal-end .hero-actions{justify-content:center}

.rm-only{display:none}
@media (prefers-reduced-motion:reduce){
  .portal{height:100svh}
  .city-plate{transform:none}
  .scrub-canvas,.feed-glitch,.portal-end{display:none}
  .rm-only{display:flex}
}

/* ---------- 25c. Cross-page portal transitions --------------------------- */
@media not (prefers-reduced-motion:reduce){
  @view-transition{navigation:auto}
  ::view-transition-old(root){animation:vt-out .4s var(--ease) both}
  ::view-transition-new(root){animation:vt-in .5s var(--ease) both}
}
@keyframes vt-out{to{opacity:0;transform:scale(1.045)}}
@keyframes vt-in{from{opacity:0;transform:scale(.984)}}

/* ---------- 25b. Skip link / proof line / cue swap ----------------------- */
.skip-link{position:fixed;top:-100px;left:1rem;z-index:2000;background:var(--gold-grad);color:#0a0c0f;
  font-family:var(--font-display);font-weight:600;font-size:.9rem;padding:.7em 1.2em;border-radius:999px;transition:top .25s}
.skip-link:focus-visible{top:1rem;outline-offset:2px}

.proofline{display:flex;flex-wrap:wrap;gap:.9rem 2rem;margin-top:2.2rem;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.16)}
.proofline span{display:inline-flex;align-items:center;gap:.55em;font-family:var(--font-mono);font-size:.75rem;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
.proofline svg{width:15px;height:15px;color:var(--gold);flex-shrink:0}

.cue-m{display:none}
@media(max-width:899px){.cue-d{display:none}.cue-m{display:inline}}

/* ---------- 26. Utilities ----------------------------------------------- */
.text-center{text-align:center}
.mx-auto{margin-inline:auto}
.mt-2{margin-top:1.2rem}.mt-3{margin-top:2rem}.mt-4{margin-top:3rem}
.gold{color:var(--gold)}.green{color:var(--green)}.teal{color:var(--teal)}.white{color:var(--ink)}
.maxw-50{max-width:50ch}
.flex{display:flex}.aic{align-items:center}.jcb{justify-content:space-between}.gap-1{gap:.6rem}.gap-2{gap:1.2rem}.wrap{flex-wrap:wrap}

.relative{position:relative}

/* ---------- 27. Operator console (homepage tech demo) ------------------- */
.console{border:1px solid var(--line-2);border-radius:var(--radius-lg);overflow:hidden;background:linear-gradient(160deg,var(--bg-2),var(--bg-1));box-shadow:var(--shadow-2)}
.console-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 1.2rem;border-bottom:1px solid var(--line);background:rgba(0,0,0,.28);flex-wrap:wrap}
.console-body{display:grid;grid-template-columns:1.7fr 1fr;gap:1px;background:var(--line)}
@media(max-width:860px){.console-body{grid-template-columns:1fr}}
.cam-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)}
.cam{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--bg-3)}
.cam img{width:100%;height:100%;object-fit:cover;filter:contrast(1.05) brightness(.9) saturate(.9)}
.cam-id{position:absolute;left:8px;bottom:7px;font-family:var(--font-mono);font-size:.58rem;letter-spacing:.1em;color:rgba(255,255,255,.85);text-shadow:0 1px 3px #000}
.cam.active{outline:2px solid var(--alert);outline-offset:-2px;z-index:1}
.cam .track{position:absolute;top:30%;left:42%;width:50px;height:80px;border:2px solid var(--alert);box-shadow:0 0 12px rgba(227,87,67,.5);animation:trackpulse 1.6s infinite}
@keyframes trackpulse{0%,100%{opacity:.5}50%{opacity:1}}
.cam-flag{position:absolute;top:7px;right:7px;font-family:var(--font-mono);font-size:.52rem;letter-spacing:.08em;color:#fff;background:var(--alert);padding:.2em .5em;border-radius:3px}
.console-side{background:var(--bg-2);padding:1.3rem 1.4rem}
.console-side h4{font-size:.95rem;margin-bottom:1rem}
.ev-log{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.4rem}
.ev-log li{display:flex;gap:.8rem;align-items:center;font-size:.8rem}
.ev-log .t{font-family:var(--font-mono);font-size:.75rem;color:var(--ink-4);flex-shrink:0}
.ev-log .d{color:var(--ink-2);display:flex;align-items:center;gap:.5em}
.ev-log .dot{width:7px;height:7px;border-radius:50%;background:var(--ink-4);flex-shrink:0}
.ev-log .dot.alert{background:var(--alert)}.ev-log .dot.teal{background:var(--teal)}.ev-log .dot.gold{background:var(--gold)}.ev-log .dot.green{background:var(--green)}
.sys-health{border-top:1px solid var(--line);padding-top:1rem}
.sys-health .mono-tag{display:block;margin-bottom:.7rem}
.sh-row{display:flex;justify-content:space-between;font-size:.82rem;padding:.3rem 0;color:var(--ink-3)}
.sh-row b{font-family:var(--font-mono);font-size:.78rem}

/* ---------- 28b. SCROLL CHOREOGRAPHY (visual-first system) -------------- */
:where([data-progress]){--p:0}
:where(.stack-card){--cover:0}

/* giant kinetic type */
.giant{font-size:clamp(3rem,10.5vw,9rem);line-height:.94;letter-spacing:-.045em;font-weight:800;padding-bottom:.16em}
.giant-xl{font-size:clamp(3.4rem,13vw,12rem);line-height:.9;letter-spacing:-.05em;font-weight:800;padding-bottom:.16em}
.oneline{font-size:clamp(1.05rem,1.8vw,1.45rem);color:var(--ink-2);font-weight:330;max-width:44ch;text-shadow:0 1px 12px rgba(8,9,12,.5)}

/* marquee */
.marquee{overflow:clip;border-block:1px solid var(--line);background:var(--bg-1);padding-block:1.05rem}
.marquee-track{display:flex;gap:3.2rem;width:max-content;animation:marq 36s linear infinite;
  font-family:var(--font-display);font-weight:700;font-size:clamp(1rem,2vw,1.5rem);letter-spacing:.01em;color:var(--ink-3);white-space:nowrap}
.marquee-track span{display:flex;align-items:center;gap:3.2rem}
.marquee-track .mq-star{color:var(--gold);font-size:.8em}
@keyframes marq{to{transform:translateX(-50%)}}

/* full-bleed story panels (PEOPLE / TECHNOLOGY / RESPONSE) */
.panel{position:relative;height:100svh;overflow:clip;display:flex;align-items:center}
.panel>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(calc(1.16 - var(--p)*.16))}
/* Ken Burns: slow continuous zoom on hero backgrounds (overrides the scroll-zoom on hero panels only) */
@keyframes kenburns{0%{transform:scale(1.03) translate3d(0,0,0)}100%{transform:scale(1.15) translate3d(0,-2%,0)}}
.kb-hero>img{animation:kenburns 26s ease-in-out infinite alternate;transform-origin:50% 42%}
@media(prefers-reduced-motion:reduce){.kb-hero>img{animation:none;transform:scale(1.04)}}
.panel::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,11,14,.66),rgba(9,11,14,.18) 45%,rgba(9,11,14,.78));z-index:1}
.panel .panel-inner{position:relative;z-index:2;width:100%}
.panel .panel-no{font-family:var(--font-mono);font-size:.75rem;letter-spacing:.3em;color:var(--gold);display:block;margin-bottom:1rem}
.panel h2{color:#fff}
.panel .oneline{margin-top:1.2rem;color:var(--ink);font-weight:400;text-shadow:0 2px 18px rgba(8,9,12,.92),0 1px 4px rgba(8,9,12,.85)}
.panel .tlink{margin-top:1.6rem}
.panel .panel-hud{position:absolute;top:calc(var(--header-h) + 1rem);left:0;right:0;z-index:2;display:flex;justify-content:space-between;padding-inline:clamp(1.15rem,4vw,2rem);pointer-events:none}
.panel.teal .panel-no{color:var(--teal)}
.panel.green .panel-no{color:var(--green)}

/* sticky stacking capability cards */
.stack{position:relative}
.stack-card{position:sticky;height:86svh;border-radius:var(--radius-lg);overflow:clip;display:flex;align-items:flex-end;
  border:1px solid var(--line-2);margin-bottom:5vh;background:var(--bg-2);box-shadow:0 -18px 60px -30px rgba(0,0,0,.8);
  transform:scale(calc(1 - var(--cover)*.05));transform-origin:center top}
.stack-card:nth-child(1){top:9vh}.stack-card:nth-child(2){top:10.5vh}.stack-card:nth-child(3){top:12vh}.stack-card:nth-child(4){top:13.5vh}
.stack-card>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.stack-card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,11,14,.12) 30%,rgba(9,11,14,.85));z-index:1}
.stack-card::after{content:"";position:absolute;inset:0;background:#090b0e;opacity:calc(var(--cover)*.55);z-index:3;pointer-events:none;border-radius:inherit}
.sc-body{position:relative;z-index:2;padding:clamp(1.6rem,4vw,3.2rem);width:100%;display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap}
.sc-title{font-size:clamp(2.1rem,5.5vw,4.3rem);letter-spacing:-.04em;line-height:1;color:#fff}
.sc-no{font-family:var(--font-mono);font-size:.75rem;letter-spacing:.26em;color:var(--gold);display:block;margin-bottom:.9rem}
.sc-no.teal{color:var(--teal)}.sc-no.green{color:var(--green)}
.sc-line{margin-top:.9rem;font-size:clamp(.98rem,1.4vw,1.18rem);color:var(--ink-2);max-width:40ch;font-weight:330}
.sc-meta{display:flex;flex-direction:column;align-items:flex-end;gap:1rem}
.sc-chips{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:flex-end}

/* horizontal scroll rail (pinned) */
.hwrap{position:relative}
.hpin{position:sticky;top:0;height:100svh;overflow:clip;display:flex;flex-direction:column;justify-content:center}
.htrack{display:flex;gap:clamp(1rem,2.6vw,2.2rem);padding-inline:clamp(1.15rem,4vw,2rem);will-change:transform}
.hpanel{flex:0 0 clamp(300px,68vw,860px);height:68svh;position:relative;border-radius:var(--radius-lg);overflow:clip;border:1px solid var(--line);display:flex;align-items:flex-end}
.hpanel>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hpanel::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,11,14,.05) 35%,rgba(9,11,14,.88))}
.hp-body{position:relative;z-index:2;padding:clamp(1.4rem,3vw,2.4rem);width:100%;display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;flex-wrap:wrap}
.hp-body h3{font-size:clamp(1.5rem,3vw,2.5rem);color:#fff;letter-spacing:-.03em}
.hp-body .hp-line{color:var(--ink-2);font-size:.95rem;margin-top:.4rem;max-width:42ch}
.hp-metric{text-align:right}
.hp-metric b{display:block;font-family:var(--font-display);font-weight:800;font-size:clamp(1.8rem,3.4vw,2.8rem);color:var(--gold);line-height:1}
.hp-metric span{font-size:.78rem;color:var(--ink-3)}
.hpanel.hp-cta{background:linear-gradient(150deg,var(--bg-3),var(--bg-1));align-items:center;justify-content:center;text-align:center;border-color:var(--line-gold)}
.hpanel.hp-cta::after{display:none}
.hhead{padding-inline:clamp(1.15rem,4vw,2rem);margin-bottom:2.2rem;display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;flex-wrap:wrap}
@media(max-width:899px){
  .hwrap{height:auto!important}
  .hpin{position:static;height:auto;overflow:visible}
  .htrack{overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1rem;transform:none!important;scrollbar-width:thin;scrollbar-color:var(--gold) transparent}
  .htrack>*{scroll-snap-align:start;flex-basis:84vw}
  .hpanel{height:62svh}
}

/* giant industry rows + floating peek image */
.xrows{border-top:1px solid var(--line)}
.xrow{display:flex;align-items:center;gap:1.6rem;padding:clamp(1.2rem,2.6vw,1.9rem) 0;border-bottom:1px solid var(--line);
  font-family:var(--font-display);font-weight:700;letter-spacing:-.035em;color:var(--ink-3);
  font-size:clamp(1.7rem,4.6vw,3.4rem);line-height:1;transition:color .3s,padding-left .35s var(--ease)}
.xrow .x-no{font-family:var(--font-mono);font-size:.75rem;letter-spacing:.2em;color:var(--ink-4);font-weight:500;min-width:2.4em}
.xrow .x-arrow{margin-left:auto;width:1em;height:1em;color:var(--ink-4);transition:color .3s,transform .35s var(--ease);flex-shrink:0}
.xrow:hover{color:var(--ink);padding-left:.45em}
.xrow:hover .x-arrow{color:var(--gold);transform:translateX(6px) rotate(-45deg)}
.xpeek{position:fixed;z-index:60;width:min(330px,26vw);aspect-ratio:4/3;border-radius:14px;overflow:clip;pointer-events:none;
  opacity:0;transform:scale(.92) rotate(2deg);transition:opacity .25s,transform .35s var(--ease);border:1px solid var(--line-2);box-shadow:var(--shadow-2)}
.xpeek img{width:100%;height:100%;object-fit:cover}
.xpeek.show{opacity:1;transform:scale(1) rotate(0)}
@media(pointer:coarse),(max-width:900px){.xpeek{display:none}}

/* end CTA */
.endcta{padding-block:clamp(6rem,13vw,11rem);text-align:center;position:relative;overflow:clip}
.endcta .giant-xl{background:linear-gradient(160deg,#fff 30%,var(--gold-bright));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.endcta .hero-actions{justify-content:center}
.endcta::before{content:"";position:absolute;left:50%;top:18%;width:680px;height:680px;transform:translateX(-50%);
  background:radial-gradient(circle,rgba(216,179,92,.13),transparent 62%);pointer-events:none}

/* standardized closing CTA, matches homepage's endband */
.endband{position:relative;text-align:center;padding:7.5rem 0 8.5rem;background:radial-gradient(125% 120% at 50% 0%,#10141c,#08090c 62%)}
.endband .hero-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-top:2.4rem}

/* standardized closing coverage map */
.cover-final{position:relative;min-height:88vh;overflow:hidden;background:#080a0e}
.cover-final iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}

@media (prefers-reduced-motion:reduce){
  .marquee-track{animation:none}
  .pinhero{height:auto}
  .pinhero .ph-stick{position:relative;height:100svh}
  .pinhero .hero-content,.pinhero .hero-media video,.panel>img,.stack-card{transform:none;opacity:1}
  .stack-card{position:relative;top:0!important;height:auto;min-height:70svh}
  .hwrap{height:auto!important}.hpin{position:static;height:auto}
  .htrack{overflow-x:auto;transform:none!important}
}

/* ---------- 28. CTA aside ----------------------------------------------- */
.cta-aside{display:flex;flex-direction:column;gap:1rem;min-width:290px}
.aside-row{display:flex;gap:.9rem;align-items:flex-start;padding:1rem 1.1rem;background:rgba(255,255,255,.025);border:1px solid var(--line);border-radius:12px}
.aside-row svg{width:22px;height:22px;color:var(--gold);flex-shrink:0;margin-top:2px}
.aside-row b{display:block;font-family:var(--font-display);color:var(--ink);font-size:.95rem}
.aside-row span{font-size:.82rem;color:var(--ink-3)}

/* ---- 27 · reel frame + spline sentinel stage (Aurora-live additions) ---- */
.reel-frame{max-width:340px;margin-inline:auto;position:relative;z-index:2}
.reel-frame video{width:100%;height:auto;display:block;aspect-ratio:9/16;object-fit:cover;border-radius:22px;border:1px solid rgba(216,179,92,.35);background:#000;box-shadow:0 30px 80px rgba(0,0,0,.55),0 0 0 6px rgba(255,255,255,.03)}
@media(max-width:760px){.reel-frame{max-width:300px}}
.spline-stage{position:relative}
.spline-stage spline-viewer,.spline-stage .spline-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;-webkit-mask-image:radial-gradient(120% 120% at 50% 45%,#000 55%,transparent 92%);mask-image:radial-gradient(120% 120% at 50% 45%,#000 55%,transparent 92%)}
.spline-stage .spline-fallback{position:absolute;right:8%;bottom:0;height:88%;width:auto;transition:opacity .9s var(--ease,ease)}
.spline-stage.spline-live .spline-fallback{opacity:0}

/* ---- 28 · sentinel credential — lit ACS badge beside the spline robot ---- */
.sentinel-cred{position:absolute;left:5%;bottom:9%;z-index:3;display:flex;flex-direction:column;align-items:center;gap:.6rem;pointer-events:none}
.sentinel-cred img{width:88px;height:auto;position:relative;z-index:1;filter:drop-shadow(0 8px 22px rgba(0,0,0,.55))}
.cred-glow{position:absolute;top:-24px;left:50%;margin-left:-78px;width:156px;height:156px;border-radius:50%;background:radial-gradient(circle,rgba(233,205,138,.55) 0%,rgba(233,205,138,.18) 45%,transparent 70%);filter:blur(7px)}
.cred-tag{font-family:'JetBrains Mono',monospace;font-size:.62rem;font-weight:600;letter-spacing:.22em;color:var(--gold-bright);text-shadow:0 0 14px rgba(233,205,138,.45);white-space:nowrap}
@media(max-width:760px){.sentinel-cred{left:50%;margin-left:-62px;bottom:3%}.sentinel-cred img{width:72px}}

/* ---- 29 · mobile fixes: fallback fills stage, proofline stacks clean ---- */
.spline-stage .spline-fallback{position:absolute;inset:0;width:100%;height:100%;right:auto;bottom:auto;object-fit:cover;-webkit-mask-image:radial-gradient(120% 120% at 50% 45%,#000 55%,transparent 92%);mask-image:radial-gradient(120% 120% at 50% 45%,#000 55%,transparent 92%)}
.utility-bar .rec{font-size:.68rem;letter-spacing:.18em}
@media(max-width:600px){
  .proofline{flex-direction:column;align-items:flex-start;gap:.6rem}
  .proofline span{width:auto}
}

/* ---- 30 · single live console screen (virtual ops centre) ---- */
.cam-single{position:relative;border-radius:10px;overflow:hidden;aspect-ratio:16/10;min-height:220px}
.cam-single img{width:100%;height:100%;object-fit:cover;display:block}
.cam-single .cam-id{position:absolute;left:10px;bottom:10px}
.cam-single .cam-flag{position:absolute;right:10px;top:10px}

/* ---- 31 · case "monitoring screen" panel (no-photo virtual case) ---- */
.case-screen{position:absolute;inset:0;background:radial-gradient(130% 110% at 75% 15%,#141b22 0%,#0a0c10 60%);background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 5px)}
.cs-rec{position:absolute;top:1.1rem;left:1.4rem;font-family:'JetBrains Mono',monospace;font-size:.7rem;letter-spacing:.12em;color:var(--alert)}
.cs-zone{position:absolute;top:1.2rem;right:1.4rem;font-family:'JetBrains Mono',monospace;font-size:.6rem;letter-spacing:.1em;color:var(--ink-4)}

/* ===========================================================================
   32 · AURORA FIELD (c14 background, site-wide) + heading light-up sweep
   =========================================================================== */
.aurora-bg{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:var(--bg)}
.ab-grain{position:absolute;inset:0;opacity:.5;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E")}
.ab-blob{position:absolute;border-radius:50%;mix-blend-mode:screen;filter:blur(90px);will-change:transform}
.ab-1{width:46vw;height:46vw;min-width:560px;min-height:560px;top:-14vh;left:-8vw;background:radial-gradient(ellipse,rgba(216,179,92,.28) 0%,transparent 70%)}
.ab-2{width:40vw;height:40vw;min-width:480px;min-height:480px;top:8vh;right:-7vw;background:radial-gradient(ellipse,rgba(88,199,221,.13) 0%,transparent 70%)}
.ab-3{width:52vw;height:52vw;min-width:600px;min-height:600px;bottom:-18vh;left:18vw;background:radial-gradient(ellipse,rgba(78,207,102,.12) 0%,transparent 70%)}
.ab-4{width:34vw;height:34vw;min-width:420px;min-height:420px;top:40vh;right:14vw;background:radial-gradient(ellipse,rgba(216,179,92,.16) 0%,transparent 70%)}
@media (prefers-reduced-motion:no-preference){
  .ab-1{animation:ab-drift-a 19s ease-in-out infinite alternate}
  .ab-2{animation:ab-drift-b 23s ease-in-out infinite alternate}
  .ab-3{animation:ab-drift-c 27s ease-in-out infinite alternate}
  .ab-4{animation:ab-drift-d 21s ease-in-out infinite alternate}
}
@keyframes ab-drift-a{from{transform:translate(0,0) scale(1)}to{transform:translate(120px,80px) scale(1.15)}}
@keyframes ab-drift-b{from{transform:translate(0,0) scale(1)}to{transform:translate(-80px,120px) scale(.9)}}
@keyframes ab-drift-c{from{transform:translate(0,0) scale(1)}to{transform:translate(-100px,-60px) scale(1.1)}}
@keyframes ab-drift-d{from{transform:translate(0,0) scale(1)}to{transform:translate(60px,-90px) scale(1.05)}}

/* sections turn translucent so the field reads through (stronger than before) */
body.world-on .bg-1{background:rgba(12,14,19,.42)}
body.world-on .bg-2{background:rgba(16,20,27,.40)}

/* heading light-up: gold shimmer sweeps across display headings on the field */
.giant,.giant-xl{
  background:linear-gradient(110deg,#ffffff 0%,#f0ede6 30%,var(--gold-bright) 50%,#f0ede6 70%,#ffffff 100%);
  background-size:230% auto;-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
@media (prefers-reduced-motion:no-preference){
  .giant,.giant-xl{animation:textsweep 7.5s linear infinite}
  @keyframes textsweep{0%{background-position:0% center}100%{background-position:230% center}}
}
/* gold shimmer now applies to ALL display headings — no over-photo exception (per Habib 2026-06-15) */