/* ============================================================
   DARK VECTOR TECHNOLOGIES — daggeros web identity
   Design tokens lifted directly from the DaggerOS SPECTRE /
   Cinematic design system. Accent != severity. Restraint is
   the payload. 90% near-black, one breathing signature object.
   ============================================================ */

/* ---------- Fonts (real brand stack) ---------- */
@font-face{
  font-family:"Inter";
  src:url("../assets/fonts/Inter-Variable.woff2") format("woff2");
  font-weight:100 900; font-display:swap;
}
@font-face{
  font-family:"Inter Display";
  src:url("../assets/fonts/InterDisplay-Regular.woff2") format("woff2");
  font-weight:400; font-display:swap;
}
@font-face{
  font-family:"JetBrains Mono";
  src:url("../assets/fonts/JetBrainsMono-Regular.woff2") format("woff2");
  font-weight:400; font-display:swap;
}
@font-face{
  font-family:"JetBrains Mono";
  src:url("../assets/fonts/JetBrainsMono-Bold.woff2") format("woff2");
  font-weight:700; font-display:swap;
}

:root{
  /* near-black elevation ramp (cold, blue-cast — never pure black) */
  --void:#06080A;     --void-alt:#060810;
  --surface:#0A0D10;  --elevated:#101419;
  --input:#14181E;    --hover:#1C232C;   --active:#142E44;
  --border:#1A2028;   --border-soft:#12171D;

  /* text — never pure white */
  --t-bright:#ECF4FF; --t-main:#C6D2E2;
  --t-dim:#7A8AA0;    --t-faint:#465260;

  /* accents — chrome only, used sparingly */
  --cyan:#00D9FF;     --amber:#FFA928;
  --steel:#7896B9;    --opal:#5F7DA0;  --opal-rim:#8AA8C6;
  --blue:#2A6BC8;     --blue-deep:#204080; --blue-glow:#70C0E0;

  /* severity — MEANING ONLY */
  --off:#848E9C; --ok:#60A874; --warn:#C49E46; --serious:#C6843A; --crit:#FF3838;

  /* type */
  --mono:"JetBrains Mono","IBM Plex Mono",ui-monospace,monospace;
  --sans:"Inter",system-ui,-apple-system,sans-serif;
  --display:"Inter Display","Inter",system-ui,sans-serif;

  /* geometry & motion */
  --grid:8px; --radius:2px; --hair:1px;
  --ease:cubic-bezier(.16,1,.3,1);   /* weighted spring-out, no bounce */
  --ease-io:cubic-bezier(.65,0,.35,1);
  --d-1:.2s; --d-2:.35s; --d-3:.9s;
  --focus:0 0 0 2px var(--void),0 0 0 3px var(--cyan);
  --maxw:1240px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  background:var(--void);
  color:var(--t-main);
  font-family:var(--sans);
  font-size:16px; line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  cursor:none;            /* custom reticle replaces it on desktop */
}
@media (hover:none){ body{cursor:auto} }

/* selection */
::selection{background:rgba(0,217,255,.22);color:var(--t-bright)}

/* ---------- typographic furniture ---------- */
h1,h2,h3,h4{color:var(--t-bright);font-family:var(--display);font-optical-sizing:auto;font-weight:700;line-height:1.08;letter-spacing:-.01em;text-wrap:balance}
h1{font-size:clamp(2.6rem,6vw,5rem);letter-spacing:-.025em}
h2{font-size:clamp(1.9rem,4vw,3.1rem);letter-spacing:-.018em}
h3{font-size:clamp(1.2rem,2vw,1.55rem);line-height:1.2}
p{max-width:62ch}
p,.hero-sub,.section-head p{text-wrap:pretty}
a{color:inherit;text-decoration:none}

/* global focus-visible + button physicality (a11y + tactility) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
.mtile:focus-visible,.pal-item:focus-visible,.std:focus-visible{outline:none;box-shadow:var(--focus)}
.btn:active,.nav-cta:active,.mb-launch:active,.boot-skip:active{transform:translateY(0) scale(.97)}
section[id]{scroll-margin-top:104px}
.reveal{will-change:opacity,transform}
.nav-links a.cur{color:var(--cyan)}
.nav-links a.cur::after{content:"";display:block;height:1px;background:var(--cyan);margin-top:3px;box-shadow:0 0 6px var(--cyan)}

.mono{font-family:var(--mono);font-feature-settings:"tnum" 1,"zero" 1}
.eyebrow{
  font-family:var(--mono);font-size:.72rem;font-weight:700;
  letter-spacing:.32em;text-transform:uppercase;color:var(--steel); /* cyan rationed to live/interactive state */
}
.dim{color:var(--t-dim)}
.amber{color:var(--amber)}
.cyan{color:var(--cyan)}

/* ---------- layout ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
section{position:relative;padding:120px 0}
.section-head{max-width:760px;margin-bottom:64px}
.section-head h2{margin:14px 0 18px}
.section-head p{color:var(--t-dim);font-size:1.08rem;max-width:64ch}

/* hairline rule with a node */
.rule{height:1px;background:var(--border);position:relative}
.rule::before{content:"";position:absolute;left:0;top:-1px;width:42px;height:3px;background:var(--cyan);box-shadow:0 0 12px var(--cyan)}

/* ============================================================
   GLOBAL TEXTURE LAYERS — grit pass (vignette + scanline + grain)
   Always on top, very low alpha. "Earned, not painted on."
   ============================================================ */
.grit{position:fixed;inset:0;pointer-events:none;z-index:900}
.grit.vignette{background:radial-gradient(120% 100% at 50% 38%,transparent 55%,rgba(0,0,0,.55) 100%)}
.grit.scan{
  background:repeating-linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,0) 3px,rgba(0,0,0,.045) 3px,rgba(0,0,0,.045) 4px);
  mix-blend-mode:multiply;opacity:.9}
.grit.grain{opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* classification banners — top & bottom, SF-706 UNCLASSIFIED */
.classban{
  position:fixed;left:0;right:0;height:20px;z-index:950;
  background:#007A33;color:#fff;font-family:var(--mono);font-size:.62rem;
  font-weight:700;letter-spacing:.34em;text-align:center;line-height:20px;
  text-transform:uppercase;pointer-events:none}
.classban.top{top:0}
.classban.bot{bottom:0}

/* ---------- custom dagger reticle cursor ---------- */
.reticle{position:fixed;top:0;left:0;width:26px;height:26px;z-index:999;pointer-events:none;
  transform:translate(-50%,-50%);transition:opacity .3s,width .18s var(--ease),height .18s var(--ease);mix-blend-mode:screen}
.reticle::before,.reticle::after{content:"";position:absolute;background:var(--cyan);box-shadow:0 0 6px var(--cyan)}
.reticle::before{left:50%;top:0;width:1px;height:100%;transform:translateX(-50%)}
.reticle::after{top:50%;left:0;height:1px;width:100%;transform:translateY(-50%)}
.reticle i{position:absolute;inset:4px;border:1px solid rgba(0,217,255,.5);border-radius:50%}
.reticle.hot{width:40px;height:40px}
.reticle.hot i{border-color:var(--amber);box-shadow:0 0 10px var(--amber)}
.dot{position:fixed;width:3px;height:3px;background:var(--amber);border-radius:50%;z-index:999;pointer-events:none;transform:translate(-50%,-50%);box-shadow:0 0 6px var(--amber)}

/* ============================================================
   NAV
   ============================================================ */
header.nav{position:fixed;top:20px;left:0;right:0;z-index:800;
  transition:background .4s,backdrop-filter .4s,border-color .4s;border-bottom:1px solid transparent}
header.nav.solid{background:rgba(6,8,10,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}
.nav-in{max-width:var(--maxw);margin:0 auto;padding:14px 28px;display:flex;align-items:center;gap:32px}
.brand{display:flex;align-items:center;gap:12px;font-family:var(--mono);font-weight:700;
  letter-spacing:.18em;color:var(--t-bright);font-size:.82rem;text-transform:uppercase}
.brand img{width:34px;height:34px;object-fit:contain;filter:drop-shadow(0 0 8px rgba(42,107,200,.5))}
.brand b{color:var(--cyan);font-weight:700}
.nav-links{display:flex;gap:26px;margin-left:auto}
.nav-links a{font-size:.82rem;letter-spacing:.04em;color:var(--t-dim);transition:color .25s}
.nav-links a:hover{color:var(--t-bright)}
.nav-cta{font-family:var(--mono);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--void);background:var(--cyan);padding:10px 16px;border-radius:var(--radius);font-weight:700;
  transition:transform .25s var(--ease),box-shadow .25s}
.nav-cta:hover{box-shadow:0 0 22px rgba(0,217,255,.55);transform:translateY(-1px)}
.nav-toggle{display:none;background:none;border:1px solid var(--border);color:var(--t-main);
  padding:8px 10px;border-radius:var(--radius);font-family:var(--mono);font-size:.7rem;cursor:none}
@media(max-width:880px){
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;
    background:rgba(6,8,10,.97);backdrop-filter:blur(16px);border-top:1px solid var(--border);padding:8px 0}
  .nav-links.open{display:flex}
  .nav-links a{padding:14px 28px;border-bottom:1px solid var(--border-soft)}
  .nav-toggle{display:block;margin-left:auto}
  .nav-cta{display:none}
}

/* ============================================================
   HERO
   ============================================================ */
.hero{min-height:100vh;display:flex;align-items:center;padding-top:80px;overflow:hidden}
#orb,#hexbg{position:absolute;inset:0;width:100%;height:100%;z-index:0}
#hexbg{opacity:.55}
.hero-grad{position:absolute;inset:0;z-index:1;
  background:radial-gradient(70% 60% at 50% 42%,transparent 40%,rgba(6,8,10,.65) 100%),
             linear-gradient(180deg,transparent 60%,var(--void) 100%)}
.hero-in{position:relative;z-index:2;width:100%}
.hero h1{margin:18px 0 24px;max-width:16ch}
.hero h1 .ghost{color:var(--t-dim)}
.hero-sub{font-size:1.15rem;color:var(--t-dim);max-width:54ch;margin-bottom:38px}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.btn{font-family:var(--mono);font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;
  padding:15px 26px;border-radius:var(--radius);display:inline-flex;align-items:center;gap:10px;
  transition:transform .25s var(--ease),box-shadow .25s,background .25s,border-color .25s;cursor:none}
.btn-primary{background:var(--cyan);color:var(--void)}
.btn-primary:hover{box-shadow:0 0 28px rgba(0,217,255,.5);transform:translateY(-2px)}
.btn-ghost{border:1px solid var(--border);color:var(--t-main);background:rgba(16,20,25,.4)}
.btn-ghost:hover{border-color:var(--steel);color:var(--t-bright);transform:translateY(-2px)}
.hero-meta{position:absolute;bottom:46px;left:0;right:0;z-index:2}
.hero-meta .wrap{display:flex;gap:40px;flex-wrap:wrap;font-family:var(--mono);font-size:.74rem;color:var(--t-dim);letter-spacing:.06em}
.hero-meta b{color:var(--cyan);font-weight:700}
.scrollcue{position:absolute;bottom:46px;right:34px;z-index:3;font-family:var(--mono);font-size:.62rem;
  letter-spacing:.3em;color:var(--t-faint);writing-mode:vertical-rl;text-transform:uppercase}

/* ============================================================
   STAT STRIP
   ============================================================ */
.stats{padding:64px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--void-alt)}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border)}
.stat{background:var(--void-alt);padding:30px 24px}
.stat .num{font-family:var(--mono);font-weight:700;font-size:clamp(2rem,4vw,2.8rem);color:var(--t-bright);font-feature-settings:"tnum" 1}
.stat .num .u{color:var(--cyan);font-size:.5em;vertical-align:super;margin-left:2px}
.stat .lbl{font-size:.8rem;color:var(--t-dim);margin-top:8px;letter-spacing:.04em}
@media(max-width:760px){.stat-grid{grid-template-columns:repeat(2,1fr)}}

/* ============================================================
   SENSE-DECIDE-EFFECT
   ============================================================ */
.flow{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border)}
.flow-step{background:var(--surface);padding:40px 32px;position:relative}
.flow-step .k{font-family:var(--mono);font-size:.74rem;color:var(--cyan);letter-spacing:.2em}
.flow-step h3{margin:14px 0 12px}
.flow-step p{color:var(--t-dim);font-size:.96rem}
.flow-step .arrow{position:absolute;right:-13px;top:50%;transform:translateY(-50%);color:var(--steel);z-index:2;font-size:1.2rem}
.gate{margin-top:30px;border:1px solid var(--border);background:linear-gradient(180deg,rgba(255,169,40,.06),transparent);
  padding:26px 30px;display:flex;gap:20px;align-items:center;border-radius:var(--radius)}
.gate .sigil{font-family:var(--mono);color:var(--amber);font-size:1.6rem}
.gate p{margin:0;color:var(--t-main)}
.gate b{color:var(--amber)}
@media(max-width:760px){.flow{grid-template-columns:1fr}.flow-step .arrow{display:none}}

/* ============================================================
   MISSION CONSOLE — the interactive centerpiece
   ============================================================ */
.console{position:relative;border:1px solid var(--border);background:#04060a;border-radius:var(--radius);
  overflow:hidden;box-shadow:0 40px 120px rgba(0,0,0,.5)}
.console-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.10;filter:saturate(.7);
  pointer-events:none;z-index:0}
.console::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:repeating-linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,0) 3px,rgba(0,0,0,.04) 3px,rgba(0,0,0,.04) 4px),
  radial-gradient(120% 100% at 50% 0%,rgba(0,217,255,.05),transparent 55%)}
.console-bar,.console-foot,.console-body{position:relative;z-index:2}
.console-bar{display:flex;align-items:center;gap:16px;padding:13px 18px;border-bottom:1px solid var(--border);
  background:rgba(10,13,16,.7);font-size:.68rem;letter-spacing:.12em}
.console-bar .cb-id{color:var(--t-bright)} .console-bar .cb-id b{color:var(--cyan)}
.console-bar .cb-mid{color:var(--cyan);margin:0 auto;letter-spacing:.34em}
.console-bar .cb-status{color:var(--t-dim);display:flex;align-items:center;gap:9px}
.livedot{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 8px var(--ok);display:inline-block;animation:live 1.6s ease-in-out infinite}
@keyframes live{0%,100%{opacity:.4}50%{opacity:1}}
@media(prefers-reduced-motion:reduce){.livedot{animation:none;opacity:1}}
.console-body{display:grid;grid-template-columns:1.05fr 1fr;gap:1px;background:var(--border)}
.mission-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#06080a;grid-auto-rows:minmax(74px,1fr);align-content:stretch}
.mtile{position:relative;text-align:left;background:var(--surface);border:none;border-bottom:1px solid var(--border-soft);
  padding:16px 16px 16px 18px;cursor:none;color:inherit;font-family:var(--sans);overflow:hidden;transition:background .25s,box-shadow .25s;
  display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.mtile::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--cyan);
  transform:scaleY(0);transform-origin:top;transition:transform .3s var(--ease)}
.mtile:hover{background:var(--elevated)}
.mtile.active{background:var(--elevated)}
.mtile.active::before{transform:scaleY(1)}
.mtile .mtag{display:inline-block;font-family:var(--mono);font-size:.58rem;font-weight:700;letter-spacing:.14em;
  padding:2px 6px;border:1px solid currentColor;border-radius:2px;opacity:.92}
.mtile .mname{display:block;margin:9px 0 3px;font-size:.98rem;font-weight:700;color:var(--t-bright);letter-spacing:-.01em}
.mtile .mline{display:block;font-size:.76rem;color:var(--t-dim);line-height:1.35}
.mtile .mgo{position:absolute;right:14px;top:16px;color:var(--t-faint);transition:.25s;font-size:.8rem}
.mtile.active .mgo,.mtile:hover .mgo{color:var(--cyan);transform:translateX(2px)}
/* tag colors */
.t-cyan{color:var(--cyan)} .t-amber{color:var(--amber)} .t-steel{color:var(--steel)}
.t-teal{color:#3CC8B4} .t-blue{color:var(--blue-glow)} .t-ok{color:var(--ok)} .t-serious{color:var(--serious)}
/* brief panel */
.mission-brief{background:var(--surface);padding:30px 30px 28px;min-height:560px}
.mission-brief.swap{animation:briefin .5s var(--ease)}
@keyframes briefin{from{opacity:.2;transform:translateY(6px)}to{opacity:1;transform:none}}
.mb-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.mb-head h3{font-size:1.5rem;color:var(--t-bright)}
.mb-head .mtag{font-family:var(--mono);font-size:.62rem;font-weight:700;letter-spacing:.14em;padding:3px 7px;border:1px solid currentColor;border-radius:2px}
.mb-line{font-family:var(--mono);color:var(--cyan);font-size:.92rem;margin-bottom:16px;min-height:1.4em;letter-spacing:.01em}
.mb-brief{color:var(--t-dim);font-size:.95rem;margin-bottom:22px}
.mb-sec{margin-bottom:20px}
.mb-lbl{display:block;font-size:.64rem;letter-spacing:.22em;color:var(--t-faint);margin-bottom:11px;text-transform:uppercase}
.mb-threats{display:flex;flex-wrap:wrap;gap:7px}
.mb-threats span{font-family:var(--mono);font-size:.72rem;color:var(--serious);border:1px solid rgba(198,132,58,.35);
  background:rgba(198,132,58,.06);padding:5px 9px;border-radius:2px;letter-spacing:.02em}
.mb-caps{list-style:none;display:grid;gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.mb-caps li{background:var(--elevated);padding:12px 14px}
.mb-caps li b{display:block;color:var(--t-bright);font-size:.88rem;margin-bottom:2px;font-weight:600}
.mb-caps li span{display:block;color:var(--t-dim);font-size:.8rem;font-family:var(--mono);line-height:1.4}
.mb-outcome{margin:22px 0;padding:16px 18px;border-left:2px solid var(--amber);background:linear-gradient(90deg,rgba(255,169,40,.06),transparent)}
.mb-outcome span{display:block;font-size:.6rem;letter-spacing:.2em;color:var(--amber);margin-bottom:6px}
.mb-outcome p{color:var(--t-main);font-size:1.02rem;font-weight:500}
.mb-launch{width:100%;margin-top:6px;background:rgba(0,217,255,.08);border:1px solid var(--cyan);color:var(--cyan);
  font-size:.74rem;letter-spacing:.14em;font-weight:700;padding:14px;border-radius:var(--radius);cursor:none;
  transition:.3s;text-align:center}
.mb-launch:hover{background:var(--cyan);color:var(--void);box-shadow:0 0 26px rgba(0,217,255,.45)}
.mb-launch.fired{background:var(--amber);border-color:var(--amber);color:var(--void);box-shadow:0 0 26px rgba(255,169,40,.5)}
.console-foot{padding:11px 18px;border-top:1px solid var(--border);background:rgba(10,13,16,.7);
  font-size:.66rem;letter-spacing:.06em;color:var(--t-dim)}
.console-foot b{color:var(--t-bright)} .console-foot b.amber{color:var(--amber)}
@media(max-width:920px){
  .console-body{grid-template-columns:1fr}
  .mission-grid{max-height:none;grid-template-columns:1fr 1fr}
  .mission-brief{min-height:0}
  .console-bar .cb-mid{display:none}
}
@media(max-width:520px){.mission-grid{grid-template-columns:1fr}}

/* "real footage" still in showcase */
.footage{position:relative;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:#04060a;margin-top:18px}
.footage img{width:100%;display:block;filter:saturate(.85)}
.footage .corner{position:absolute;width:18px;height:18px;border-color:var(--cyan);opacity:.6;z-index:3}
.footage .corner.tl{top:10px;left:10px;border-top:1px solid;border-left:1px solid}
.footage .corner.tr{top:10px;right:10px;border-top:1px solid;border-right:1px solid}
.footage .corner.bl{bottom:10px;left:10px;border-bottom:1px solid;border-left:1px solid}
.footage .corner.br{bottom:10px;right:10px;border-bottom:1px solid;border-right:1px solid}
.footage figcaption{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;
  padding:12px 16px;font-size:.64rem;letter-spacing:.1em;color:var(--t-main);
  background:linear-gradient(transparent,rgba(4,6,10,.94))}
.footage figcaption .livedot{background:var(--crit);box-shadow:0 0 8px var(--crit);margin-right:7px}

/* ============================================================
   PILLARS — why it wins
   ============================================================ */
.pillars{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--border);border:1px solid var(--border)}
.pillar{background:var(--surface);padding:40px 34px;transition:background .3s}
.pillar:hover{background:var(--elevated)}
.pillar .n{font-family:var(--mono);color:var(--steel);font-size:.8rem;letter-spacing:.1em}
.pillar h3{margin:14px 0 12px;color:var(--t-bright)}
.pillar p{color:var(--t-dim);font-size:.96rem}
@media(max-width:760px){.pillars{grid-template-columns:1fr}}

/* ============================================================
   RADAR / PRODUCT SHOWCASE
   ============================================================ */
.showcase{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.radar-frame{border:1px solid var(--border);background:#04060a;border-radius:var(--radius);position:relative;aspect-ratio:1/1;overflow:hidden}
.radar-frame canvas{width:100%;height:100%;display:block}
.radar-frame .corner{position:absolute;width:18px;height:18px;border-color:var(--cyan);opacity:.6}
.radar-frame .corner.tl{top:8px;left:8px;border-top:1px solid;border-left:1px solid}
.radar-frame .corner.tr{top:8px;right:8px;border-top:1px solid;border-right:1px solid}
.radar-frame .corner.bl{bottom:8px;left:8px;border-bottom:1px solid;border-left:1px solid}
.radar-frame .corner.br{bottom:8px;right:8px;border-bottom:1px solid;border-right:1px solid}
.radar-frame .hud{position:absolute;top:14px;left:16px;font-family:var(--mono);font-size:.64rem;color:var(--t-dim);letter-spacing:.08em;z-index:3}
.radar-frame .hud b{color:var(--ok)}
.showcase ul{list-style:none;margin-top:22px}
.showcase li{padding:13px 0 13px 26px;position:relative;border-top:1px solid var(--border-soft);color:var(--t-main);font-size:.96rem}
.showcase li::before{content:"▲";position:absolute;left:0;top:14px;color:var(--amber);font-size:.7rem}
@media(max-width:880px){.showcase{grid-template-columns:1fr}}

/* console gallery */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:54px}
.shot{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;position:relative;background:#04060a}
.shot img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.85) contrast(1.02);transition:transform .6s var(--ease)}
.shot:hover img{transform:scale(1.04)}
.shot figcaption{position:absolute;bottom:0;left:0;right:0;padding:10px 14px;font-family:var(--mono);
  font-size:.66rem;letter-spacing:.08em;color:var(--t-main);background:linear-gradient(transparent,rgba(4,6,10,.92))}
@media(max-width:760px){.gallery{grid-template-columns:1fr}}

/* ============================================================
   PROOF / STANDARDS
   ============================================================ */
.proof-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:48px;align-items:start}
.proof-card{border:1px solid var(--border);background:var(--surface);padding:30px;border-radius:var(--radius);margin-bottom:16px}
.proof-card .eyebrow{margin-bottom:10px}
.proof-card h3{margin-bottom:10px}
.proof-card p{color:var(--t-dim);font-size:.95rem}
.std-wall{display:flex;flex-wrap:wrap;gap:8px}
.std{font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;color:var(--t-dim);
  border:1px solid var(--border);padding:9px 12px;border-radius:var(--radius);background:var(--void-alt);transition:.25s}
.std:hover{border-color:var(--steel);color:var(--t-bright)}
@media(max-width:880px){.proof-grid{grid-template-columns:1fr}}

/* ============================================================
   COMPANY
   ============================================================ */
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border)}
.member{background:var(--surface);padding:32px 28px}
.member .role{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;color:var(--cyan);text-transform:uppercase}
.member h4{margin:12px 0 6px;color:var(--t-bright);font-size:1.15rem}
.member p{color:var(--t-dim);font-size:.9rem}
.org-meta{display:flex;flex-wrap:wrap;gap:30px;margin-top:30px;font-family:var(--mono);font-size:.78rem;color:var(--t-dim)}
.org-meta b{color:var(--t-bright)}
@media(max-width:760px){.team{grid-template-columns:1fr}}

/* ============================================================
   CTA / CONTACT
   ============================================================ */
.cta-band{border:1px solid var(--border);background:
   radial-gradient(80% 120% at 50% 0%,rgba(0,217,255,.07),transparent 60%),var(--surface);
   padding:72px 40px;text-align:center;border-radius:var(--radius)}
.cta-band h2{margin-bottom:18px}
.cta-band p{margin:0 auto 32px;color:var(--t-dim)}
.form{max-width:640px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:14px;text-align:left}
.form .full{grid-column:1/-1}
.form label{display:block;font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--t-dim);margin-bottom:7px}
.form input,.form select,.form textarea{width:100%;background:var(--input);border:1px solid var(--border);
  color:var(--t-bright);font-family:var(--sans);font-size:.94rem;padding:12px 14px;border-radius:var(--radius);cursor:none;transition:border-color .25s,box-shadow .25s}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 0 1px rgba(0,217,255,.3)}
.form textarea{min-height:110px;resize:vertical}
.gate-note{font-family:var(--mono);font-size:.72rem;color:var(--amber);margin-top:8px;display:flex;gap:8px;align-items:flex-start;justify-content:center}
.form-msg{grid-column:1/-1;font-family:var(--mono);font-size:.82rem;color:var(--ok);min-height:1.2em}

/* ============================================================
   FOOTER
   ============================================================ */
footer{border-top:1px solid var(--border);background:var(--void-alt);padding:60px 0 50px}
.foot{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px}
.foot .brand{margin-bottom:16px}
.foot p{color:var(--t-dim);font-size:.88rem;max-width:40ch}
.foot h5{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--t-dim);margin-bottom:14px}
.foot a{display:block;color:var(--t-main);font-size:.9rem;padding:5px 0;transition:color .2s}
.foot a:hover{color:var(--cyan)}
.foot-tag{font-family:var(--mono);font-size:1rem;letter-spacing:.2em;color:var(--t-bright);text-transform:uppercase;margin-top:40px}
.foot-legal{margin-top:30px;padding-top:24px;border-top:1px solid var(--border);display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;
  font-family:var(--mono);font-size:.7rem;color:var(--t-faint);letter-spacing:.05em}
@media(max-width:760px){.foot{grid-template-columns:1fr}}

/* ============================================================
   SCROLL REVEAL
   ============================================================ */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal[data-d="1"]{transition-delay:.08s}
.reveal[data-d="2"]{transition-delay:.16s}
.reveal[data-d="3"]{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* ============================================================
   BOOT CEREMONY
   ============================================================ */
body.booting{overflow:hidden}
#boot{position:fixed;inset:0;z-index:1000;background:var(--void);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px;
  transition:opacity 1s var(--ease),visibility 1s}
#boot.out{opacity:0;visibility:hidden}
.boot-mark{display:flex;align-items:center;gap:14px;opacity:0;transform:translateY(8px);
  transition:opacity 1s var(--ease),transform 1s var(--ease)}
.boot-mark.reveal-mark{opacity:1;transform:none}
.boot-mark img{width:54px;height:54px;filter:drop-shadow(0 0 16px rgba(42,107,200,.6))}
.boot-mark .wm{font-family:var(--mono);font-weight:700;font-size:1.4rem;letter-spacing:.42em;color:var(--t-bright)}
.boot-mark .wm b{color:var(--cyan)}
.boot-log{width:min(520px,84vw);font-family:var(--mono);font-size:.74rem}
.boot-row{display:grid;grid-template-columns:96px 1fr auto;gap:14px;align-items:center;
  padding:7px 0;border-bottom:1px solid var(--border-soft);opacity:0;transform:translateX(-8px);
  transition:opacity .4s var(--ease),transform .4s var(--ease)}
.boot-row.on{opacity:1;transform:none}
.boot-row .bk{color:var(--cyan);letter-spacing:.12em}
.boot-row .bv{color:var(--t-dim)}
.boot-row .bok{color:var(--ok);letter-spacing:.1em;font-size:.66rem}
.boot-skip{position:absolute;bottom:40px;right:40px;font-family:var(--mono);font-size:.66rem;
  letter-spacing:.2em;color:var(--t-faint);text-transform:uppercase;background:none;border:1px solid var(--border);
  padding:8px 14px;border-radius:var(--radius);cursor:none;transition:.25s}
.boot-skip:hover{color:var(--t-main);border-color:var(--steel)}
.boot-bar{width:min(520px,84vw);height:1px;background:var(--border);position:relative;overflow:hidden}
.boot-bar::after{content:"";position:absolute;left:0;top:0;height:100%;width:30%;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);animation:bootscan 1.6s linear infinite}
@keyframes bootscan{from{left:-30%}to{left:100%}}

/* ============================================================
   COMMAND PALETTE
   ============================================================ */
#palette{position:fixed;inset:0;z-index:980;background:rgba(4,6,10,.72);backdrop-filter:blur(8px);
  display:none;align-items:flex-start;justify-content:center;padding-top:14vh}
#palette.open{display:flex}
.pal-box{width:min(560px,92vw);background:var(--elevated);border:1px solid var(--border);
  border-radius:var(--radius);box-shadow:0 30px 80px rgba(0,0,0,.6),0 0 0 1px rgba(0,217,255,.12);overflow:hidden;
  animation:palin .25s var(--ease)}
@keyframes palin{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
.pal-box .pal-top{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--border)}
.pal-box .pal-top span{font-family:var(--mono);color:var(--cyan);font-size:.8rem}
.pal-box input{flex:1;background:none;border:none;outline:none;color:var(--t-bright);font-family:var(--sans);font-size:1rem;cursor:none}
.pal-box .esc{font-family:var(--mono);font-size:.6rem;color:var(--t-faint);border:1px solid var(--border);padding:3px 7px;border-radius:3px}
.pal-list{max-height:340px;overflow:auto}
.pal-item{display:flex;justify-content:space-between;align-items:center;padding:13px 18px;cursor:none;
  font-size:.92rem;color:var(--t-main);border-left:2px solid transparent}
.pal-item.sel,.pal-item:hover{background:var(--hover);border-left-color:var(--cyan);color:var(--t-bright)}
.pal-item .pal-go{font-family:var(--mono);color:var(--t-faint);font-size:.8rem}
.pal-empty{padding:18px;color:var(--t-dim);font-family:var(--mono);font-size:.85rem}
.pal-hint{position:fixed;bottom:30px;left:28px;z-index:700;font-family:var(--mono);font-size:.66rem;
  letter-spacing:.08em;color:var(--t-faint);border:1px solid var(--border);background:rgba(10,13,16,.7);
  backdrop-filter:blur(6px);padding:7px 11px;border-radius:var(--radius);cursor:none;transition:.25s}
.pal-hint:hover{color:var(--t-main);border-color:var(--steel)}
.pal-hint b{color:var(--cyan)}
@media(max-width:760px){.pal-hint{display:none}}

/* rare rgb-split glitch hook */
.glitch{position:relative}
.glitch.fire::before,.glitch.fire::after{content:attr(data-text);position:absolute;left:0;top:0;width:100%}
.glitch.fire::before{color:var(--crit);transform:translateX(-2px);opacity:.6}
.glitch.fire::after{color:var(--cyan);transform:translateX(2px);opacity:.6}

/* ============================================================
   MISSION CONSOLE — interaction polish (beam, telemetry, audio, focus)
   ============================================================ */
.mission-brief{position:relative;overflow:hidden}
.mission-brief.swap::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;z-index:5;pointer-events:none;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);box-shadow:0 0 16px var(--cyan);
  animation:scanbeam .6s var(--ease) forwards}
@keyframes scanbeam{0%{transform:translateY(0);opacity:.9}100%{transform:translateY(600px);opacity:0}}
@media(prefers-reduced-motion:reduce){.mission-brief.swap::after{display:none}}
.mtile:focus-visible{outline:1px solid var(--cyan);outline-offset:-3px}
.console-bar .cb-tel{color:var(--t-faint);font-size:.62rem;letter-spacing:.07em;white-space:nowrap}
.console-bar .cb-tel b{color:var(--steel)} .console-bar .cb-tel .syn{color:var(--ok)}
.cb-audio{font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;color:var(--t-dim);background:none;
  border:1px solid var(--border);padding:5px 9px;border-radius:2px;cursor:none;transition:.2s}
.cb-audio:hover{color:var(--t-bright);border-color:var(--steel)}
.cb-audio.on{color:var(--cyan);border-color:var(--cyan);box-shadow:0 0 10px rgba(0,217,255,.3)}
@media(max-width:760px){.console-bar .cb-tel{display:none}}
.member-li{display:inline-block;margin-top:14px;font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;
  color:var(--steel);border-bottom:1px solid transparent;transition:.2s}
.member-li:hover{color:var(--cyan);border-bottom-color:var(--cyan)}

/* ============================================================
   HARDWARE / AIRFRAME band (real hardware = the page's color event)
   ============================================================ */
.hw{position:relative;min-height:86vh;display:flex;align-items:center;overflow:hidden;padding:0}
.hw-bg{position:absolute;inset:0;background-size:cover;background-position:center 58%;z-index:0}
.hw-grad{position:absolute;inset:0;z-index:1;background:
  linear-gradient(90deg,rgba(6,8,10,.95) 0%,rgba(6,8,10,.72) 40%,transparent 72%),
  linear-gradient(0deg,var(--void),transparent 26%,transparent 72%,rgba(6,8,10,.55))}
.hw-in{position:relative;z-index:2}
.hw-in h2{margin:16px 0 18px;max-width:15ch}
.hw-in .ghost{color:var(--t-dim)}
.hw-in p{color:var(--t-main);max-width:48ch;margin-bottom:30px}
.hw-tag{position:absolute;right:28px;bottom:26px;z-index:2;font-size:.64rem;letter-spacing:.12em;color:var(--t-dim);display:flex;align-items:center;gap:8px}
.hw-tag .livedot{background:var(--crit);box-shadow:0 0 8px var(--crit)}
@media(max-width:760px){.hw{min-height:78vh}
  .hw-grad{background:linear-gradient(0deg,var(--void) 12%,rgba(6,8,10,.62) 62%,rgba(6,8,10,.25))}}

/* ============================================================
   BLACKECHO band (blurred screen backdrop · the two laws)
   ============================================================ */
.be{position:relative;overflow:hidden;padding:120px 0}
.be-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.16;z-index:0}
.be-grad{position:absolute;inset:0;z-index:1;background:
  radial-gradient(85% 85% at 28% 50%,rgba(6,8,10,.72),var(--void) 80%),
  repeating-linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,0) 3px,rgba(0,0,0,.05) 3px,rgba(0,0,0,.05) 4px)}
.be-in{position:relative;z-index:2;max-width:780px}
.be-in h2{margin:16px 0 18px}
.be-in p{color:var(--t-dim);margin-bottom:30px;max-width:62ch}
.be-laws{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.be-law{border:1px solid var(--border);border-left:2px solid var(--amber);background:rgba(16,20,25,.55);padding:20px 22px;backdrop-filter:blur(2px)}
.be-law span{font-family:var(--mono);font-size:.62rem;letter-spacing:.22em;color:var(--amber)}
.be-law p{color:var(--t-main);font-size:.96rem;margin:9px 0 0}
@media(max-width:620px){.be-laws{grid-template-columns:1fr}}

/* ============================================================
   FIELD / T-REX band (real ops + after-hours)
   ============================================================ */
.field-grid{display:grid;grid-template-columns:1.45fr 1fr;gap:16px}
.field-shot{position:relative;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:#04060a;min-height:300px}
.field-shot img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.9) contrast(1.02);transition:transform .8s var(--ease)}
.field-shot:hover img{transform:scale(1.03)}
.field-shot figcaption{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;
  padding:12px 15px;font-size:.62rem;letter-spacing:.08em;color:var(--t-main);background:linear-gradient(transparent,rgba(4,6,10,.93))}
.field-shot figcaption .livedot{background:var(--crit);box-shadow:0 0 8px var(--crit);margin-right:6px}
@media(max-width:760px){.field-grid{grid-template-columns:1fr}}

/* ============================================================
   FILM · MEET DAGGER (custom portrait player)
   ============================================================ */
.film{padding:120px 0}
.film-head{text-align:center;max-width:620px;margin:0 auto 50px}
.film-head p{margin:0 auto}
.film-stage{display:flex;justify-content:center}
.film-frame{position:relative;width:min(468px,92vw);aspect-ratio:4/5;background:#04060a;
  border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;
  box-shadow:0 40px 120px rgba(0,0,0,.6),0 0 0 1px rgba(0,217,255,.06)}
.film-frame video{width:100%;height:100%;object-fit:cover;display:block;background:#04060a}
.film-frame .corner{position:absolute;width:18px;height:18px;border-color:var(--cyan);opacity:.5;z-index:6;transition:opacity .4s}
.film-frame.playing .corner{opacity:.18}
.film-frame .corner.tl{top:10px;left:10px;border-top:1px solid;border-left:1px solid}
.film-frame .corner.tr{top:10px;right:10px;border-top:1px solid;border-right:1px solid}
.film-frame .corner.bl{bottom:10px;left:10px;border-bottom:1px solid;border-left:1px solid}
.film-frame .corner.br{bottom:10px;right:10px;border-bottom:1px solid;border-right:1px solid}
.film-play{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;
  background:radial-gradient(60% 60% at 50% 48%,rgba(4,6,10,.12),rgba(4,6,10,.5));border:none;cursor:none;transition:opacity .5s var(--ease)}
.film-frame.playing .film-play{opacity:0;pointer-events:none}
.fp-disc{position:relative;width:84px;height:84px;border:1px solid var(--cyan);border-radius:50%;display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 30px rgba(0,217,255,.35),inset 0 0 18px rgba(0,217,255,.12);transition:transform .3s var(--ease),box-shadow .3s}
.fp-disc::after{content:"";position:absolute;inset:-9px;border:1px solid rgba(0,217,255,.3);border-radius:50%;animation:fppulse 2.4s ease-out infinite}
.film-play:hover .fp-disc{transform:scale(1.08);box-shadow:0 0 46px rgba(0,217,255,.55),inset 0 0 18px rgba(0,217,255,.22)}
.fp-tri{color:var(--cyan);font-size:1.4rem;margin-left:5px;text-shadow:0 0 12px var(--cyan)}
.fp-label{font-size:.66rem;letter-spacing:.22em;color:var(--t-bright);opacity:.88}
@keyframes fppulse{0%{transform:scale(1);opacity:.6}100%{transform:scale(1.42);opacity:0}}
@media(prefers-reduced-motion:reduce){.fp-disc::after{animation:none}}
.film-hud{position:absolute;top:0;left:0;right:0;z-index:4;display:flex;justify-content:space-between;align-items:center;
  padding:12px 14px;font-size:.62rem;letter-spacing:.1em;color:var(--t-main);background:linear-gradient(rgba(4,6,10,.7),transparent);pointer-events:none}
.film-hud .livedot{background:var(--crit);box-shadow:0 0 8px var(--crit);margin-right:6px}
.film-bar{position:absolute;bottom:0;left:0;right:0;height:3px;z-index:4;background:rgba(255,255,255,.07)}
.film-prog{height:100%;width:0;background:var(--cyan);box-shadow:0 0 10px var(--cyan);transition:width .15s linear}

/* mission-grid: kill the empty trailing cell (odd tile count spans the row) */
.mtile:last-child:nth-child(odd){grid-column:1 / -1}
.mtile:last-child:nth-child(odd) .mline{max-width:none}

/* ── mobile performance & polish ───────────────────────────── */
@media(max-width:760px){
  section{padding:88px 0}
  .hero{padding-top:64px}
  h1{font-size:clamp(2.2rem,9vw,3.2rem)}
  .console-foot{font-size:.58rem;letter-spacing:.02em}
  .mb-head h3{font-size:1.25rem}
}
@media(hover:none){
  /* touch: drop the heavy hover-scale transforms */
  .shot:hover img,.field-shot:hover img{transform:none}
}

/* ============================================================
   PER-MISSION IDENTITY — console re-skins on select (accent cross-fades)
   Accent is cool-chrome ONLY; severity channels stay reserved for meaning.
   ============================================================ */
@property --accent{syntax:'<color>';inherits:true;initial-value:#00D9FF}
.console{--accent:#00D9FF;--accent-rgb:0,217,255;transition:--accent .5s var(--ease)}
.mission-grid{position:relative}
.mtile::before{background:var(--accent)}
.mtile.active .mgo,.mtile:hover .mgo{color:var(--accent)}
.cb-id b{color:var(--accent)}
.mb-line{color:var(--accent)}
.mb-launch{border-color:var(--accent);color:var(--accent)}
.mb-launch:hover{background:var(--accent);color:var(--void);box-shadow:0 0 26px rgba(var(--accent-rgb),.45)}
.mission-brief.swap::after{background:linear-gradient(90deg,transparent,var(--accent),transparent);box-shadow:0 0 16px var(--accent)}
.mb-head{position:relative;z-index:1}
.mb-glyph{position:absolute;top:-8px;right:-4px;font-size:118px;line-height:1;color:var(--accent);opacity:.06;
  pointer-events:none;z-index:0;transition:color .5s,opacity .5s}
.mb-code{margin-left:auto;font-family:var(--mono);font-size:.58rem;letter-spacing:.26em;color:var(--accent);
  border:1px solid currentColor;border-radius:2px;padding:3px 7px;opacity:.85;white-space:nowrap}

/* ============================================================
   THE HUMAN GATE — hold-to-authorize ceremony
   ============================================================ */
#gate{position:fixed;inset:0;z-index:1001;display:none;align-items:center;justify-content:center;
  background:rgba(2,4,7,.86);backdrop-filter:blur(10px);padding:24px}
#gate.open{display:flex}
.gate-box{width:min(444px,94vw);background:var(--elevated);border:1px solid var(--border);border-radius:var(--radius);
  padding:28px 30px 24px;text-align:center;position:relative;box-shadow:0 40px 120px rgba(0,0,0,.7),0 0 0 1px rgba(255,169,40,.12);animation:palin .3s var(--ease)}
.gate-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.gate-head .eyebrow{color:var(--amber)}
.gate-x{font-family:var(--mono);font-size:.6rem;color:var(--t-faint);border:1px solid var(--border);background:none;padding:4px 8px;border-radius:3px;cursor:none;transition:.2s}
.gate-x:hover{color:var(--t-main);border-color:var(--steel)}
.gate-mission{font-size:.74rem;letter-spacing:.16em;color:var(--cyan);margin-bottom:12px}
.gate-coa{font-size:.9rem;color:var(--t-dim);margin:0 auto 22px;max-width:40ch}
.gate-plate{position:relative;width:158px;height:158px;margin:0 auto 16px;cursor:none;border-radius:50%;
  display:flex;align-items:center;justify-content:center;touch-action:none;user-select:none;transition:transform .15s var(--ease)}
.gate-plate:active{transform:scale(.97)}
.gate-ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.gr-bg{fill:none;stroke:var(--border);stroke-width:4}
.gr-fill{fill:none;stroke:var(--amber);stroke-width:4;stroke-linecap:round;transition:stroke-dashoffset .06s linear;filter:drop-shadow(0 0 6px var(--amber))}
.gate-plate.done .gr-fill{stroke:var(--ok);filter:drop-shadow(0 0 9px var(--ok))}
.gate-plate-label{font-size:.8rem;letter-spacing:.14em;color:var(--t-bright);line-height:1.35;z-index:1}
.gate-plate.done .gate-plate-label{color:var(--ok)}
.gate-status{font-size:.66rem;letter-spacing:.08em;color:var(--t-dim);margin-bottom:18px;min-height:1.2em}
.gate-status.warn{color:var(--amber)} .gate-status.ok{color:var(--ok)}
.gate-actions{display:flex;gap:12px;justify-content:center}
.gate-cancel,.gate-again{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;padding:10px 18px;border-radius:var(--radius);
  cursor:none;border:1px solid var(--border);background:none;color:var(--t-main);transition:.2s}
.gate-cancel:hover{border-color:var(--steel);color:var(--t-bright)}
.gate-again{border-color:var(--ok);color:var(--ok)}
.gate-again:hover{background:rgba(96,168,116,.12)}

/* ============================================================
   TAMPER-EVIDENT EVIDENCE LEDGER
   ============================================================ */
.ledger{position:fixed;right:24px;bottom:30px;z-index:820;font-family:var(--mono)}
.ledger-toggle{display:flex;align-items:center;gap:8px;font-size:.64rem;letter-spacing:.1em;color:var(--t-dim);
  background:rgba(10,13,16,.82);backdrop-filter:blur(6px);border:1px solid var(--border);padding:8px 12px;border-radius:var(--radius);cursor:none;transition:.2s}
.ledger-toggle:hover{color:var(--t-bright);border-color:var(--steel)}
.ledger-toggle .livedot{width:6px;height:6px;background:var(--ok)}
.ledger-toggle b{color:var(--cyan)}
.ledger.open .ledger-toggle{color:var(--t-bright);border-color:var(--cyan)}
.ledger-panel{display:none;position:absolute;bottom:calc(100% + 8px);right:0;width:min(384px,92vw);
  background:var(--elevated);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 30px 80px rgba(0,0,0,.6);overflow:hidden}
.ledger.open .ledger-panel{display:block;animation:palin .25s var(--ease)}
.ledger-head{display:flex;justify-content:space-between;align-items:center;padding:11px 14px;border-bottom:1px solid var(--border);font-size:.58rem;letter-spacing:.08em;color:var(--t-dim)}
.ledger-verdict{color:var(--ok)} .ledger-verdict.broken{color:var(--crit)}
.ledger-list{max-height:236px;overflow:auto;padding:5px 0}
.ledger-row{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center;padding:7px 14px;font-size:.6rem;border-left:2px solid transparent;transition:background .3s}
.lr-i{color:var(--t-faint)} .lr-ev{color:var(--t-main);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lr-h{color:var(--steel);letter-spacing:.04em}
.ledger-row.broken{border-left-color:var(--crit);background:rgba(255,56,56,.07)}
.ledger-row.broken .lr-h,.ledger-row.broken .lr-ev{color:var(--crit)}
.ledger-actions{display:flex;align-items:center;gap:9px;padding:11px 14px;border-top:1px solid var(--border);flex-wrap:wrap}
.ledger-actions button{font-size:.6rem;letter-spacing:.1em;padding:7px 11px;border-radius:var(--radius);cursor:none;border:1px solid var(--border);background:none;color:var(--t-main);transition:.2s}
#ledgerTamper{border-color:rgba(198,72,72,.5);color:var(--crit)} #ledgerTamper:hover{background:rgba(255,56,56,.1)}
#ledgerReseal{border-color:var(--ok);color:var(--ok)} #ledgerReseal:hover{background:rgba(96,168,116,.12)}
.ledger-note{flex:1;min-width:130px;font-size:.52rem;color:var(--t-faint);letter-spacing:.03em;line-height:1.3}
@media(max-width:760px){.ledger{right:10px;bottom:26px}}

/* ============================================================
   EXCHANGE-RATIO CALCULATOR
   ============================================================ */
.xchg{display:grid;grid-template-columns:1fr 1.3fr;gap:48px;align-items:center}
.xchg-control label{display:block;font-size:.78rem;letter-spacing:.1em;color:var(--t-dim);margin-bottom:18px}
.xchg-control label b{color:var(--cyan);font-size:1.1rem}
.xchg-illus{display:block;margin-top:16px;font-size:.6rem;letter-spacing:.1em;color:var(--t-faint)}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:3px;background:var(--border);border-radius:2px;cursor:none;outline:none}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--cyan);box-shadow:0 0 14px rgba(0,217,255,.6);cursor:none;border:none}
input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--cyan);box-shadow:0 0 14px rgba(0,217,255,.6);cursor:none;border:none}
.xbar{margin-bottom:18px}
.xbar-head{display:flex;justify-content:space-between;font-size:.74rem;color:var(--t-main);margin-bottom:8px;letter-spacing:.04em}
.xbar-head .mono{font-size:.92rem;color:var(--t-bright)}
.xbar-track{height:10px;background:var(--input);border:1px solid var(--border);border-radius:2px;overflow:hidden}
.xbar-fill{height:100%;width:0;transition:width .4s var(--ease)}
.xbar-fill.threat{background:var(--steel)}
.xbar-fill.legacy{background:linear-gradient(90deg,var(--serious),var(--crit));box-shadow:0 0 12px rgba(255,56,56,.4)}
.xchg-ratio{display:flex;align-items:baseline;gap:12px;margin:24px 0 14px;padding-top:18px;border-top:1px solid var(--border)}
.xchg-ratio .mono{font-size:.66rem;letter-spacing:.18em;color:var(--t-dim)}
.xchg-ratio b{font-family:var(--display);font-size:2.2rem;color:var(--crit);letter-spacing:-.02em}
.xchg-invert{color:var(--t-dim);font-size:.95rem;border-left:2px solid var(--cyan);padding-left:16px}
@media(max-width:880px){.xchg{grid-template-columns:1fr;gap:30px}}

/* ============================================================
   OPERATOR HUD — lock-on brackets
   ============================================================ */
.hud-lock{position:fixed;inset:0;pointer-events:none;z-index:998}
.hl.c{position:fixed;top:0;left:0;width:8px;height:8px;border:1px solid var(--cyan);opacity:0;
  transition:opacity .25s;will-change:transform}
.hud-lock.locked .hl.c{opacity:.8;box-shadow:0 0 6px rgba(0,217,255,.45)}
.hl.c.tl{border-right:none;border-bottom:none}
.hl.c.tr{border-left:none;border-bottom:none}
.hl.c.bl{border-right:none;border-top:none}
.hl.c.br{border-left:none;border-top:none}
.hl-read{position:fixed;top:0;left:0;font-family:var(--mono);font-size:.54rem;letter-spacing:.06em;color:var(--cyan);
  opacity:0;transition:opacity .25s;white-space:nowrap;text-shadow:0 0 6px rgba(0,217,255,.4);will-change:transform}
.hud-lock.locked .hl-read{opacity:.75}

/* ============================================================
   SATURATION CINEMATIC — "when every domain hits at once"
   ============================================================ */
.sat{min-height:100vh;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--void)}
#satCanvas{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.sat-grad{position:absolute;inset:0;z-index:1;background:radial-gradient(75% 75% at 50% 50%,transparent 38%,rgba(6,8,10,.74) 100%)}
.sat-overlay{position:relative;z-index:2;text-align:center;padding:0 24px;pointer-events:none}
.sat-overlay .eyebrow{color:var(--steel)}
.sat-line{font-size:clamp(1.8rem,4.6vw,3.4rem);max-width:18ch;margin:14px auto 22px;transition:opacity .5s}
.sat-readout{font-size:.78rem;letter-spacing:.2em;color:var(--t-dim);min-height:1.4em}
.sat-readout b{color:var(--serious)}
.sat-readout.calm b{color:var(--ok)}
.sat-replay{margin-top:26px;pointer-events:auto;background:rgba(10,13,16,.5);border:1px solid var(--border);color:var(--t-main);
  padding:12px 22px;border-radius:var(--radius);font-size:.72rem;letter-spacing:.14em;cursor:none;transition:.2s}
.sat-replay:hover{border-color:var(--cyan);color:var(--t-bright)}

/* ============================================================
   PASSIVE SPECTRUM WATERFALL
   ============================================================ */
.spectrum-frame{position:relative;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:#04060a;aspect-ratio:21/9}
.spectrum-frame canvas{width:100%;height:100%;display:block}
.spec-hud{position:absolute;top:0;left:0;right:0;z-index:3;display:flex;justify-content:space-between;
  padding:12px 15px;font-size:.62rem;letter-spacing:.1em;color:var(--t-main);background:linear-gradient(rgba(4,6,10,.55),transparent);pointer-events:none}
.spec-hud .livedot{background:var(--ok);margin-right:6px}
.spec-callout{position:absolute;top:0;bottom:0;z-index:4;opacity:0;transition:opacity .5s;pointer-events:none;transform:translateX(-50%)}
.spec-callout.on{opacity:1}
.sc-br{position:absolute;top:10%;bottom:24%;left:0;width:0;border-left:1px solid var(--crit);box-shadow:0 0 8px var(--crit)}
.sc-br::before,.sc-br::after{content:"";position:absolute;left:-4px;width:9px;height:1px;background:var(--crit)}
.sc-br::before{top:0} .sc-br::after{bottom:0}
.sc-tx{position:absolute;top:12%;left:12px;font-size:.58rem;line-height:1.55;color:var(--crit);white-space:nowrap;text-shadow:0 0 6px rgba(4,6,10,.9)}
.sc-tx b{color:var(--crit)}
@media(max-width:760px){.spectrum-frame{aspect-ratio:4/3} .sc-tx{font-size:.5rem}}

/* ============================================================
   PLATFORM SIGNAL CONDUIT — the human gate, made visible
   ============================================================ */
.flow .arrow{display:none}
.conduit{position:relative;height:74px;margin-bottom:26px}
.conduit canvas{width:100%;height:100%;display:block}
.flow-gate{position:absolute;top:50%;left:66%;transform:translate(-50%,-50%);font-family:var(--mono);font-size:.58rem;
  letter-spacing:.1em;color:var(--amber);background:rgba(6,8,10,.88);border:1px solid var(--amber);padding:7px 11px;
  border-radius:2px;cursor:none;white-space:nowrap;transition:.25s;z-index:2}
.flow-gate:hover{background:var(--amber);color:var(--void);box-shadow:0 0 18px rgba(255,169,40,.5)}
.flow-gate.authorized{color:var(--ok);border-color:var(--ok);background:rgba(6,8,10,.88);box-shadow:0 0 16px rgba(96,168,116,.4)}
.fs-status{display:block;margin-top:16px;font-size:.62rem;letter-spacing:.12em;color:var(--steel);padding-top:12px;border-top:1px solid var(--border-soft)}
.fs-status.lock{color:var(--amber)}
.flow-step.committed{box-shadow:inset 2px 0 0 var(--ok)}
.flow-step.committed .fs-status{color:var(--ok)}
@media(max-width:760px){.conduit{display:none}}

/* ============================================================
   HERO elevation — scroll parallax + animated cue
   ============================================================ */
.hero-in{will-change:transform}
.hero-in .wrap{transform:translateY(calc(var(--hp,0) * -28px));opacity:calc(1 - var(--hp,0)*1.05)}
.scrollcue{writing-mode:horizontal-tb;display:flex;flex-direction:column;align-items:center}
.scrollcue span{font-size:.6rem;letter-spacing:.32em}
.scrollcue .track{display:block;width:1px;height:34px;margin-top:8px;background:linear-gradient(var(--steel),transparent);position:relative;overflow:hidden}
.scrollcue .track::after{content:"";position:absolute;left:-1px;top:-7px;width:3px;height:7px;background:var(--cyan);box-shadow:0 0 6px var(--cyan);animation:cueDot 1.9s ease-in-out infinite}
@keyframes cueDot{0%{top:-7px;opacity:0}25%{opacity:1}100%{top:34px;opacity:0}}
.scrollcue.gone{opacity:0;transition:opacity .5s}
@media(prefers-reduced-motion:reduce){.scrollcue .track::after{animation:none}.hero-in .wrap{transform:none;opacity:1}}

/* ============================================================
   WHY-IT-WINS — living pillar proof-demos
   ============================================================ */
.pillar-demo{margin-top:20px;height:84px;border:1px solid var(--border);border-radius:var(--radius);background:#04060a;overflow:hidden;position:relative}
.pillar-demo canvas{width:100%;height:100%;display:block}
.pillar-demo.egress{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:var(--void-alt)}
.eg-num{font-family:var(--mono);font-size:2.4rem;font-weight:700;color:var(--ok);font-feature-settings:"tnum" 1;line-height:1}
.eg-lbl{font-size:.54rem;letter-spacing:.1em;color:var(--t-dim)}
.pillar-demo.evid{display:flex;align-items:center;justify-content:center;gap:3px;padding:0 10px;background:var(--void-alt)}
.evid-b{display:flex;flex-direction:column;align-items:center;gap:2px;font-family:var(--mono)}
.evid-b .eb-h{font-size:.62rem;color:var(--steel);letter-spacing:.02em}
.evid-b .eb-i{font-size:.48rem;color:var(--t-faint)}
.evid-b.broken .eb-h,.evid-b.broken .eb-i{color:var(--crit)}
.evid-link{color:var(--t-faint);font-size:.7rem}
.pillar-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px}
.pdemo-btn{font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;color:var(--cyan);background:none;border:1px solid var(--border);padding:6px 10px;border-radius:var(--radius);cursor:none;transition:.2s;white-space:nowrap}
.pdemo-btn:hover{border-color:var(--cyan)}
.pdemo-status{font-size:.58rem;letter-spacing:.07em;color:var(--ok);text-align:right}
.pdemo-status.alert{color:var(--crit)} .pdemo-status.warn{color:var(--amber)}

/* ============================================================
   PROOF — maturity readout, phase timeline, scanning standards
   ============================================================ */
.maturity-bar{display:flex;justify-content:space-between;align-items:center;padding:11px 16px;border:1px solid var(--border);
  background:var(--void-alt);border-radius:var(--radius);font-size:.62rem;letter-spacing:.1em;color:var(--t-dim);margin-bottom:26px}
.maturity-bar .livedot{margin-right:7px}
.phase-block{margin-bottom:36px}
.phase-rail{display:flex;gap:3px;align-items:flex-end;height:26px}
.phase-rail .ph{flex:1;height:13px;background:var(--border);transition:background .3s,height .25s var(--ease),box-shadow .3s;cursor:none}
.phase-rail .ph.lit{background:var(--cyan);box-shadow:0 0 5px rgba(0,217,255,.35)}
.phase-rail .ph:hover{height:24px;background:#9fe8ff}
.phase-cap{display:flex;justify-content:space-between;font-size:.56rem;letter-spacing:.1em;color:var(--t-faint);margin-top:9px}
.phase-cap span:nth-child(2){color:var(--cyan)}
.readout-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);margin-bottom:42px}
.readout-grid .stat{background:var(--void-alt)}
.readout-grid .trl{font-size:clamp(2rem,4vw,2.8rem);font-weight:700;color:var(--cyan)}
@media(max-width:680px){.readout-grid{grid-template-columns:1fr}}
.std{cursor:none;position:relative}
.std::before{content:"○";margin-right:6px;color:var(--t-faint);font-size:.72em;transition:color .3s}
.std.aud::before{content:"◉";color:var(--ok)}
.std:hover::after{content:attr(data-gloss);position:absolute;left:0;top:calc(100% + 6px);white-space:nowrap;
  font-family:var(--sans);font-size:.72rem;letter-spacing:0;text-transform:none;font-weight:400;color:var(--t-main);
  background:var(--elevated);border:1px solid var(--border);padding:6px 9px;border-radius:2px;z-index:6;pointer-events:none;box-shadow:0 10px 28px rgba(0,0,0,.55)}
.acq-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.acq{font-family:var(--mono);font-size:.7rem;letter-spacing:.04em;color:var(--t-dim);border:1px solid var(--border);
  background:var(--void-alt);padding:8px 12px;border-radius:var(--radius);cursor:none;transition:.2s}
.acq:hover{color:var(--t-bright);border-color:var(--steel)}
.acq.active{color:var(--cyan);border-color:var(--cyan)}
.acq-desc{font-size:.84rem;min-height:1.4em;color:var(--t-main);letter-spacing:.02em}

/* ============================================================
   COMPANY dossier + ORG registry + CONTACT terminal
   ============================================================ */
.member.dossier{position:relative;padding-top:40px}
.member.dossier .corner{position:absolute;width:13px;height:13px;border-color:var(--steel);opacity:.45;transition:.25s}
.member.dossier .corner.tl{top:10px;left:10px;border-top:1px solid;border-left:1px solid}
.member.dossier .corner.tr{top:10px;right:10px;border-top:1px solid;border-right:1px solid}
.member.dossier .corner.bl{bottom:10px;left:10px;border-bottom:1px solid;border-left:1px solid}
.member.dossier .corner.br{bottom:10px;right:10px;border-bottom:1px solid;border-right:1px solid}
.member.dossier:hover .corner{opacity:.9;border-color:var(--cyan)}
.dos-head{position:absolute;top:13px;left:28px;right:28px;display:flex;justify-content:space-between;font-size:.55rem;letter-spacing:.1em;color:var(--t-faint)}
.dos-active{color:var(--ok)}
.org-registry{margin-top:30px;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.org-head{display:flex;justify-content:space-between;align-items:center;padding:11px 16px;border-bottom:1px solid var(--border);background:var(--void-alt);font-size:.56rem;letter-spacing:.1em;color:var(--t-dim)}
.org-head .livedot{margin-right:7px}
.org-rows{display:flex;flex-wrap:wrap;gap:1px;background:var(--border)}
.org-chip{flex:1;min-width:170px;display:flex;align-items:center;gap:8px;background:var(--surface);border:none;padding:14px 16px;
  font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;color:var(--t-dim);cursor:none;transition:background .2s;text-align:left}
.org-chip b{color:var(--t-bright)}
.org-chip:not(.static):hover{background:var(--elevated)}
.org-chip .oc-copy{margin-left:auto;color:var(--steel);font-size:.66rem}
.org-chip.copied b,.org-chip.copied .oc-copy{color:var(--ok)}
.org-chip.static{cursor:default}
.handshake{max-width:640px;margin:0 auto 18px;text-align:left;font-size:.6rem;letter-spacing:.06em;color:var(--t-dim);min-height:1.2em}
.handshake .hs-row{opacity:0;transition:opacity .3s}
.handshake .hs-row.on{opacity:1}
.handshake .hs-ok{color:var(--ok)}
.form .fld{position:relative}
.field-glyph{position:absolute;right:12px;bottom:12px;font-family:var(--mono);font-size:.82rem;color:var(--t-faint);pointer-events:none;transition:color .2s}
.field-glyph.ok{color:var(--ok)} .field-glyph.bad{color:var(--crit)} .field-glyph.typing{color:var(--amber)}

/* ============================================================
   CONTESTED-EDGE — cut-the-link toggle on the radar
   ============================================================ */
.cut-link{position:absolute;bottom:14px;right:14px;z-index:5;font-family:var(--mono);font-size:.58rem;letter-spacing:.08em;
  color:var(--amber);background:rgba(6,8,10,.82);border:1px solid var(--amber);padding:7px 11px;border-radius:2px;cursor:none;transition:.2s}
.cut-link:hover{background:var(--amber);color:var(--void);box-shadow:0 0 16px rgba(255,169,40,.45)}
.cut-link.cut{color:var(--ok);border-color:var(--ok)}
.radar-frame .hud .rh-link{color:var(--ok)}
.radar-frame .hud .rh-link.sev{color:var(--crit)}
@keyframes radshake{0%,100%{transform:translate(0,0)}20%{transform:translate(-2px,1px)}40%{transform:translate(2px,-1px)}60%{transform:translate(-1px,-1px)}80%{transform:translate(1px,1px)}}
.radar-frame.shake{animation:radshake .42s linear}
