/* ColdBunker — tokens from CB-WEB-001 SEC-03/04. Dark only. */
:root{color-scheme:dark;--bg:#0D0F10;--bg-2:#15181A;--bg-3:#1E2327;--line:#2C3236;--concrete:#434A4E;--fg:#E8E3D8;--fg-dim:#969C9E;--cold:#51D2E2;--cold-deep:#15707E;--hazard:#F2A71B;--alert:#E5484D;--ok:#57C98A;
--font-display:"Saira Condensed","Arial Narrow",system-ui,sans-serif;--font-body:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;--font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;--maxw:1080px;
--hazard-stripe:repeating-linear-gradient(-45deg,var(--hazard) 0 14px,#0D0F10 14px 28px)}
@font-face{font-family:"Saira Condensed";font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/saira-condensed-600.woff2) format("woff2")}
@font-face{font-family:"Saira Condensed";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/saira-condensed-700.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/barlow-400.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/barlow-400i.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/barlow-500.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/barlow-600.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400 500;font-display:swap;src:url(/fonts/jetbrains-mono-400.woff2) format("woff2")}
@font-face{font-family:"Barlow Fallback";src:local("Arial");size-adjust:96%;ascent-override:95%;descent-override:22%;line-gap-override:0%}
@font-face{font-family:"Saira Fallback";src:local("Arial Narrow"),local("Arial");size-adjust:88%;ascent-override:100%;descent-override:30%}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--bg) ;color:var(--fg);font:400 16px/1.6 var(--font-body),"Barlow Fallback";min-height:100vh;position:relative;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
body>*{position:relative;z-index:1}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
a{color:var(--cold);text-decoration:none}
a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
:focus-visible{outline:2px solid var(--cold);outline-offset:3px}
.skip{position:absolute;left:-999px;top:8px;background:var(--cold);color:#0D0F10;padding:8px 12px;z-index:99;font-family:var(--font-mono);font-size:12px}
.skip:focus{left:8px}
h1,h2,h3,.display{font-family:var(--font-display),"Saira Fallback";text-transform:uppercase;letter-spacing:.02em;line-height:1;font-weight:700;text-wrap:balance}
h1{font-size:clamp(42px,8vw,94px);line-height:.92}
h2{font-size:clamp(27px,3.6vw,40px);margin-bottom:16px}
h3{font-size:21px;font-weight:600;letter-spacing:.04em;margin-bottom:8px}
p{max-width:65ch}
.dim{color:var(--fg-dim)}
.mono,.eyebrow,.code{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.2em;font-size:11px}
.eyebrow{color:var(--hazard);display:block;margin-bottom:12px}
.eyebrow.dim{color:var(--fg-dim)}
.code{display:inline-block;background:var(--bg-3);color:var(--cold);border:1px solid var(--line);padding:3px 8px;font-size:12px;letter-spacing:.12em;text-transform:none;border-radius:3px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px}
.ic{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:square;stroke-linejoin:miter;flex:none}
.ic-lg{width:48px;height:48px}
/* header */
.hdr{position:sticky;top:0;z-index:40;background:rgba(13,15,16,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.hdr-in{display:flex;align-items:center;justify-content:space-between;gap:16px;height:64px}
.lockup{display:flex;align-items:center;gap:12px;color:var(--fg)}
.lockup:hover{text-decoration:none}
.lockup .ic{width:30px;height:30px;color:var(--cold)}
.lockup .tick{stroke:var(--hazard)}
.wordmark{font-family:var(--font-display),"Saira Fallback";font-weight:700;font-size:22px;letter-spacing:.06em;text-transform:uppercase;line-height:1}
.wordmark b{color:var(--cold);font-weight:700}
.nav{display:flex;align-items:center;gap:26px}
.nav a{color:var(--fg-dim);font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.nav a:hover,.nav a[aria-current]{color:var(--fg);text-decoration:none}
.nav a[aria-current]{color:var(--cold)}
.nav .btn,.nav .btn:hover{color:#0D0F10;letter-spacing:.06em;font-size:15px}
.nav .btn.btn-ghost,.nav .btn.btn-ghost:hover{color:var(--cold)}
.burger{display:none;background:var(--bg-3);border:1px solid var(--line);color:var(--fg);width:42px;height:38px;border-radius:3px;cursor:pointer;align-items:center;justify-content:center}
/* buttons: blast-door switches */
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-display),"Saira Fallback";font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:17px;padding:12px 20px;border-radius:3px;border:1px solid var(--cold);background:var(--cold);color:#0D0F10;cursor:pointer;line-height:1;transition:filter .12s,transform .08s,box-shadow .12s}
.btn:hover{text-decoration:none;filter:brightness(1.08)}
.btn:active{transform:translateY(1px);box-shadow:inset 0 2px 0 rgba(0,0,0,.35)}
.btn .ic{width:18px;height:18px}
.btn-ghost{background:transparent;color:var(--cold)}
.btn-ghost:hover{background:rgba(81,210,226,.08)}
.btn-steel{background:var(--bg-3);border-color:var(--concrete);color:var(--fg)}
.btn-steel:hover{background:#262c31}
.btn-sm{font-size:15px;padding:9px 14px}
/* LEDs */
.led{display:inline-block;width:9px;height:9px;border-radius:50%;flex:none;position:relative;top:-1px}
.led-ok{background:var(--ok);box-shadow:0 0 8px var(--ok);animation:led 2.4s ease-in-out infinite}
.led-alert{background:var(--alert);box-shadow:0 0 8px var(--alert);animation:led 1.1s ease-in-out infinite}
.led-haz{background:var(--hazard);box-shadow:0 0 8px var(--hazard)}
.led-cold{background:var(--cold);box-shadow:0 0 8px var(--cold)}
@keyframes led{0%,100%{opacity:1}50%{opacity:.45}}
/* structure */
.zone{padding:clamp(56px,8vw,96px) 0}
.zone+.zone{border-top:1px solid var(--line)}
.hazard{height:14px;background:var(--hazard-stripe);opacity:.85;border-top:1px solid #000;border-bottom:1px solid #000}
.stamp{font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--fg-dim);border:1px solid var(--line);padding:4px 8px;display:inline-block}
.stamp.haz{color:var(--hazard);border-color:rgba(242,167,27,.5)}
.prerelease{background:#17130a;border-bottom:1px solid #3a2e12;color:var(--fg);font-size:14px}
.prerelease .wrap{display:flex;gap:12px;align-items:center;padding-top:9px;padding-bottom:9px}
.prerelease b{color:var(--hazard);font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;margin-right:4px}
.prerelease .led{margin-top:0}
.panel{background:var(--bg-2);border:1px solid var(--line);border-radius:3px;padding:24px;box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.panel-steel{background:linear-gradient(180deg,#232a2f,#1a1f23);border-color:var(--concrete)}
.callout{border-left:3px solid var(--cold);background:var(--bg-2);padding:16px 18px;margin:18px 0}
.callout.caution{border-color:var(--hazard)}
.callout.forbidden{border-color:var(--alert);background:rgba(229,72,77,.08)}
.callout .eyebrow{margin-bottom:6px}
.grid{display:grid;gap:18px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.placard{position:relative;display:block;background:linear-gradient(180deg,#232a2f,#181d21);border:1px solid var(--concrete);border-top:3px solid var(--cold);border-radius:3px;padding:22px 20px 20px;color:var(--fg);transition:transform .12s,border-color .12s}
.placard:hover{text-decoration:none;transform:translateY(-2px);border-color:var(--cold-deep)}
.placard::before,.placard::after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:var(--concrete);box-shadow:inset 0 1px 1px rgba(0,0,0,.6);bottom:8px}
.placard::before{left:8px}.placard::after{right:8px}
.placard .ic-lg{color:var(--cold);margin-bottom:14px}
.placard.infra .ic-lg{color:var(--hazard)}
.placard.infra{border-top-color:var(--hazard)}
.placard .cat{display:block;margin-bottom:10px}
.placard h3{margin-bottom:2px}
.placard .fn{color:var(--fg-dim);font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;display:block;margin-bottom:12px}
.placard p{font-size:15px;color:var(--fg-dim)}
.rows{list-style:none;display:grid;gap:12px}
.rows li{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;background:var(--bg-2);border:1px solid var(--line);border-radius:3px}
.rows .led{margin-top:8px}
.rows b{font-family:var(--font-display),"Saira Fallback";font-weight:600;text-transform:uppercase;letter-spacing:.04em;font-size:19px;display:block;line-height:1.1}
.rows span{color:var(--fg-dim);font-size:15px}
.cols h3{color:var(--fg)}
.cols .code{margin-bottom:12px}
.cols p{color:var(--fg-dim);font-size:15px}
.list{padding-left:0;list-style:none;display:grid;gap:8px}
.list li{padding-left:22px;position:relative;color:var(--fg-dim)}
.list li::before{content:"";position:absolute;left:0;top:10px;width:10px;height:2px;background:var(--cold)}
.list.haz li::before{background:var(--hazard)}
/* hero */
.hero{padding:clamp(56px,9vw,120px) 0 clamp(48px,7vw,88px);position:relative;overflow:hidden}
.hero-in{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:40px;align-items:center}
.hero p.lede{font-size:clamp(17px,1.6vw,20px);color:var(--fg-dim);margin:22px 0 28px;max-width:40rem}
.ctas{display:flex;gap:12px;flex-wrap:wrap}
.door{width:min(100%,420px);justify-self:center;color:var(--cold);opacity:.9}
.door svg{width:100%;height:auto;fill:none;stroke:currentColor;stroke-width:1.6;display:block}
.door .plate{stroke:var(--concrete)}
.door .spokes{transform-origin:200px 200px;animation:settle 1.4s cubic-bezier(.2,.8,.2,1) both}
.door .tick{stroke:var(--hazard)}
.door .seam{stroke:var(--line)}
@keyframes settle{from{transform:rotate(-15deg)}to{transform:rotate(0)}}
.hero-meta{display:flex;gap:18px;flex-wrap:wrap;margin-top:28px}
/* footer */
.ftr{border-top:1px solid var(--line);background:var(--bg-2);padding:40px 0 28px;margin-top:40px}
.ftr-in{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px}
.ftr h4{font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--fg-dim);margin-bottom:12px;font-weight:500}
.ftr ul{list-style:none;display:grid;gap:8px}
.ftr a{color:var(--fg)}
.ftr p{color:var(--fg-dim);font-size:14px;margin-top:12px}
.ftr-bot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:30px;padding-top:16px;border-top:1px solid var(--line);color:var(--fg-dim);font-size:13px}
/* page pieces */
.page-head{padding:clamp(48px,7vw,80px) 0 clamp(28px,4vw,44px)}
.page-head p{color:var(--fg-dim);font-size:18px;margin-top:14px}
.spec{display:grid;grid-template-columns:160px 1fr;gap:8px 18px;font-size:15px}
.spec dt{font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-dim);padding-top:4px}
.spec dd{color:var(--fg)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.prose p+p{margin-top:12px}
.prose h2{margin-top:44px}
.prose h2:first-child{margin-top:0}
.prose h3{margin-top:28px}
.prose ul{margin-top:10px}
.prose .grid{margin:22px 0 10px}
.prose .spec{margin:16px 0 8px}
.prose .ctas{margin-top:30px}
.pun{font-style:italic;color:var(--fg-dim);margin-top:10px}
.plat{display:flex;gap:14px;align-items:center}
.plat .ic-lg{color:var(--cold);width:40px;height:40px}
.price{font-family:var(--font-display),"Saira Fallback";font-size:34px;text-transform:uppercase;letter-spacing:.02em;margin:8px 0 4px}
.tbl{width:100%;border-collapse:collapse;font-size:15px}
.tbl th{font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-dim);text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);font-weight:500}
.tbl td{padding:12px;border-bottom:1px solid var(--line);vertical-align:top}
.tbl td:first-child{font-weight:600}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.led-ok,.led-alert{animation:none}.door .spokes{animation:none}.placard,.btn{transition:none}}
@media (max-width:860px){.nav{position:absolute;top:64px;left:0;right:0;background:var(--bg-2);border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;padding:12px 20px 18px;gap:0;display:none}.nav a{padding:12px 0;font-size:13px}.nav .btn{margin-top:10px;justify-content:center}.nav.open{display:flex}.burger{display:inline-flex}.hero-in{grid-template-columns:1fr}.door{width:min(70%,320px)}.ftr-in{grid-template-columns:1fr 1fr}}
@media (max-width:720px){.g2,.g3,.two{grid-template-columns:1fr}.spec{grid-template-columns:1fr;gap:2px 0}.spec dd{margin-bottom:10px}}
@media (max-width:480px){.ftr-in{grid-template-columns:1fr}.ctas .btn{width:100%;justify-content:center}}

/* ===================== BUNKER v2 (2026-10-21) ===================== */
.hero2{position:relative;overflow:hidden;padding:clamp(48px,7vw,96px) 0 clamp(56px,8vw,110px);background:
 radial-gradient(70% 60% at 70% 40%,rgba(81,210,226,.07),transparent 70%),
 linear-gradient(180deg,#0b0d0e 0%,var(--bg) 40%,#0a0c0d 100%)}
.hero2::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 2px,rgba(255,255,255,.012) 2px 3px);pointer-events:none}
.hero2-in{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center}
.hero2 h1{display:flex;flex-direction:column;margin:14px 0 18px}
.hero2 h1 span{display:block;transform:translateY(24px);opacity:0;animation:stamp .5s cubic-bezier(.2,.9,.2,1) forwards}
.hero2 h1 .w1{animation-delay:.1s}.hero2 h1 .w2{animation-delay:.3s;color:var(--cold)}.hero2 h1 .w3{animation-delay:.5s}
@keyframes stamp{0%{transform:translateY(24px) scale(1.04);opacity:0}60%{opacity:1}100%{transform:none;opacity:1}}
.hero2 .lede{font-size:clamp(17px,1.5vw,20px);color:var(--fg-dim);margin:0 0 24px;max-width:38rem}
.beacon{position:absolute;top:-120px;right:-120px;width:720px;height:720px;pointer-events:none;opacity:.5;
 background:conic-gradient(from 0deg,transparent 0 84%,rgba(242,167,27,.22) 92%,transparent 100%);border-radius:50%;filter:blur(18px);animation:beacon 7s linear infinite;mix-blend-mode:screen}
@keyframes beacon{to{transform:rotate(360deg)}}
.conduit{position:absolute;left:0;right:0;height:10px;background:linear-gradient(180deg,#2a3135,#171b1e 60%,#0e1113);border-top:1px solid #343c41;border-bottom:1px solid #000;pointer-events:none}
.conduit::before,.conduit::after{content:"";position:absolute;top:-4px;width:26px;height:18px;background:#20262a;border:1px solid #343c41;border-radius:3px}
.conduit::before{left:8%}.conduit::after{right:12%}
.conduit.top{top:0}.conduit.bottom{bottom:0}
#mist{position:absolute;left:0;right:0;bottom:0;width:100%;height:260px;pointer-events:none;opacity:.7}
/* readouts */
.hud{list-style:none;margin-top:26px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 18px;max-width:520px}
.hud li{display:flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;padding:7px 0;border-bottom:1px solid var(--line);opacity:0;animation:hudin .4s ease forwards}
.hud .h0{animation-delay:1.2s}.hud .h1{animation-delay:1.4s}.hud .h2{animation-delay:1.6s}.hud .h3{animation-delay:1.8s}.hud .h4{animation-delay:2s}
@keyframes hudin{to{opacity:1}}
.hud .k{color:var(--fg-dim);flex:1}.hud .v{color:var(--fg)}
/* door scene */
.doorscene{position:relative;aspect-ratio:1/1;max-width:520px;width:100%;justify-self:center;overflow:hidden;border-radius:12px}
.inside{position:absolute;inset:6%;border-radius:10px;background:radial-gradient(60% 50% at 50% 35%,#0f2a30,#0a1518 55%,#070b0c 100%);overflow:hidden;box-shadow:inset 0 0 0 2px #1a2024,inset 0 0 60px #000}
.inside .glow{position:absolute;inset:-30%;background:radial-gradient(circle at 50% 40%,rgba(81,210,226,.35),transparent 55%);opacity:0;transition:opacity 1.2s ease 1.6s}
.doorscene.open .inside .glow{opacity:1}
.inside .floorgrid{position:absolute;left:-40%;right:-40%;bottom:0;height:55%;background:repeating-linear-gradient(90deg,rgba(81,210,226,.14) 0 1px,transparent 1px 40px),repeating-linear-gradient(0deg,rgba(81,210,226,.14) 0 1px,transparent 1px 28px);transform:perspective(500px) rotateX(62deg);transform-origin:bottom;opacity:.5}
.racks{list-style:none;position:absolute;left:19%;right:19%;top:19%;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.racks .ic-lg{width:34px;height:34px}
.racks li{background:linear-gradient(180deg,#161c20,#0e1316);border:1px solid #27313a;border-top:2px solid var(--cold);border-radius:4px;padding:9px 4px 7px;display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--cold);font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;opacity:0;transform:translateY(10px);transition:opacity .5s ease,transform .5s ease}
.racks li span{color:var(--fg-dim)}
.doorscene.open .racks li{opacity:1;transform:none}
.doorscene.open .racks .r0{transition-delay:1.9s}.doorscene.open .racks .r1{transition-delay:2.05s}.doorscene.open .racks .r2{transition-delay:2.2s}.doorscene.open .racks .r3{transition-delay:2.35s}.doorscene.open .racks .r4{transition-delay:2.5s}.doorscene.open .racks .r5{transition-delay:2.65s}
.inside .frost{position:absolute;inset:0;background:radial-gradient(circle at 50% 120%,rgba(200,240,255,.12),transparent 55%);mix-blend-mode:screen}
.doorframe{position:absolute;inset:0;z-index:2;border-radius:12px;pointer-events:none;background:linear-gradient(180deg,#262d32,#15191c);box-shadow:inset 0 0 0 1px #3a4248,inset 0 0 0 14px #1b2024,inset 0 0 0 15px #000,0 30px 80px -30px #000;
 -webkit-mask:radial-gradient(circle at 50% 50%,transparent 43.5%,#000 44%);mask:radial-gradient(circle at 50% 50%,transparent 43.5%,#000 44%)}
.door{position:absolute;inset:0;transition:transform 1.9s cubic-bezier(.75,0,.25,1) 1.5s;z-index:1;will-change:transform}
.doorscene.open .door{transform:translateX(-97%)}
.doorfront{position:absolute;inset:0}
.doorsvg{position:absolute;inset:0;width:100%;height:100%}
.doorback{position:absolute;inset:6.3%;border-radius:50%;background:radial-gradient(circle at 40% 40%,#1f2529,#0e1114 70%);transform:rotateY(180deg) translateZ(0.5px);backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:inset 0 0 0 8px #2a3136,inset 0 0 0 10px #000}
.doorsvg .dring{fill:none;stroke:#2f373d;stroke-width:3}
.doorsvg .rivets circle{fill:#3a4248;stroke:#0d0f10;stroke-width:1.5}
.doorsvg .bolt{fill:#39424a;stroke:#0d0f10;stroke-width:2;transition:transform .7s cubic-bezier(.5,0,.2,1) .9s}
.doorscene.open .bolt{transform:translateY(44px)}
.doorsvg .bolts{transform-box:fill-box}
.doorsvg .bolt{transform-box:view-box}
.doorsvg .wheel{transform-origin:0 0;transition:transform 1.2s cubic-bezier(.4,0,.2,1)}
.doorscene.open .wheel{transform:rotate(-135deg)}
.doorsvg .spk{stroke:#9aa5ad;stroke-width:14;stroke-linecap:round;fill:none}
.doorsvg .hub{fill:#2a3136;stroke:#9aa5ad;stroke-width:6}.doorsvg .hub2{fill:#9aa5ad}
.doorsvg .tick{stroke:var(--hazard);stroke-width:8;stroke-linecap:round}
.doorsvg .stencil{font-family:var(--font-display),"Saira Fallback";font-weight:700;font-size:40px;letter-spacing:.12em;fill:#4a545b;opacity:.9}
.doorsvg .stencil.s2{font-size:20px;fill:#3d464c}
.doorbtn{position:absolute;z-index:4;left:50%;bottom:10px;transform:translateX(-50%);background:var(--bg-3);border:1px solid var(--concrete);color:var(--fg-dim);font-family:var(--font-mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;padding:8px 12px;border-radius:3px;cursor:pointer}
.doorbtn:hover{color:var(--fg);border-color:var(--cold)}
/* hazard drift */
.hazard.anim{background-size:40px 100%;animation:drift 6s linear infinite}
@keyframes drift{to{background-position:40px 0}}
/* zero section */
.zero{background:linear-gradient(180deg,#0e1112,var(--bg))}
.zero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:18px;margin-top:28px}
.monitor canvas{width:100%;height:240px;display:block;background:#0a0d0e;border:1px solid var(--line);margin-top:12px}
.mon-legend{display:flex;gap:18px;flex-wrap:wrap;margin-top:10px;font-size:12.5px;color:var(--fg-dim);align-items:center}
.mon-legend span{display:inline-flex;align-items:center;gap:8px}
.mon-legend .mono{margin-left:auto;color:var(--fg)}
.mon-legend b{color:var(--cold)}
.term{font-family:var(--font-mono);font-size:12.5px;line-height:1.7;color:var(--fg-dim);white-space:pre-wrap;word-break:break-word;margin:0}
.term .ln{display:block;opacity:0;animation:tline .01s linear forwards}
.term .l0{animation-delay:.3s;color:var(--fg)}.term .l1{animation-delay:1.1s}.term .l2{animation-delay:1.8s}.term .l3{animation-delay:2.5s}.term .l4{animation-delay:3.4s;color:var(--ok)}.term .l5{animation-delay:4s;color:var(--ok)}.term .l6{animation-delay:4.6s;color:var(--ok)}.term .l7{animation-delay:5.4s;color:var(--cold);font-weight:500}
@keyframes tline{to{opacity:1}}
.term .cur{display:inline-block;width:8px;height:14px;background:var(--cold);vertical-align:-2px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.bigzero{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:28px}
.bigzero li{background:var(--bg-2);padding:18px 16px;display:flex;flex-direction:column;gap:2px}
.bigzero b{font-family:var(--font-display),"Saira Fallback";font-size:clamp(40px,5vw,64px);line-height:1;color:var(--cold)}
.bigzero span{font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-dim)}
/* lockers */
.lockers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:28px}
.locker{position:relative;display:block;min-height:300px;border-radius:4px;overflow:hidden;background:var(--bg-2);border:1px solid var(--line);color:var(--fg);box-shadow:inset 0 0 0 1px #000}
.locker:hover{text-decoration:none}
.ldoor{position:absolute;inset:0;background:linear-gradient(180deg,#262d32 0%,#1b2024 55%,#15191c 100%);border-top:3px solid var(--cold);display:flex;flex-direction:column;justify-content:space-between;padding:16px;transition:transform .7s cubic-bezier(.6,.05,.3,1);z-index:2}
.ldoor::before{content:"";position:absolute;inset:10px;border:1px solid #333c42;border-radius:2px}
.ldoor::after{content:"";position:absolute;left:14px;right:14px;top:46%;height:6px;background:repeating-linear-gradient(90deg,#0d0f10 0 2px,transparent 2px 6px);opacity:.5}
.ldoor .num{font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;color:var(--fg-dim)}
.ldoor .handle{position:absolute;right:22px;top:50%;width:10px;height:44px;border-radius:3px;background:linear-gradient(90deg,#9aa5ad,#5d676e);transform:translateY(-50%);box-shadow:0 2px 0 #000}
.ldoor .lname{font-family:var(--font-display),"Saira Fallback";font-weight:700;text-transform:uppercase;font-size:34px;letter-spacing:.04em;color:#4a545b}
.locker:hover .ldoor,.locker:focus-visible .ldoor,.locker.open .ldoor{transform:translateY(-92%)}
.lin{position:relative;padding:22px 18px 20px;display:flex;flex-direction:column;gap:6px;min-height:300px;background:radial-gradient(80% 60% at 50% 0%,rgba(81,210,226,.14),transparent 70%)}
.lin .ic-lg{color:var(--cold)}
.lin h3{margin:4px 0 0}
.lin .fn{font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-dim)}
.lin p{font-size:14.5px;color:var(--fg-dim);margin-top:6px}
.lin .more{margin-top:auto;color:var(--cold);font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;display:inline-flex;gap:8px;align-items:center}
.lin .more .ic{width:16px;height:16px}
/* sync */
.syncwrap{margin:26px 0 22px;padding:8px 10px}
.sync{width:100%;height:auto;display:block}
.sync .wire{stroke:#2f373d;stroke-width:6;fill:none;stroke-dasharray:10 8;animation:wire 2s linear infinite}
@keyframes wire{to{stroke-dashoffset:-36}}
.sync .dev{fill:#15191c;stroke:#3a4248;stroke-width:2}
.sync .scr{fill:#0f2328;stroke:var(--cold-deep)}
.sync .key{stroke:var(--hazard);stroke-width:3;fill:none;stroke-linecap:round}
.sync .keyg{animation:keyknock 4.8s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes keyknock{0%,60%,100%{transform:translateX(0)}70%{transform:translateX(14px)}78%{transform:translateX(0)}}
.sync .bar{fill:var(--alert)}
.sync .op{fill:#141a1d;stroke:var(--hazard);stroke-width:2}
.sync .opmast{stroke:var(--hazard);stroke-width:3;fill:none}
.sync .slot{fill:#0d1113;stroke:#2f373d;animation:slot 4.8s steps(1) infinite}
.sync .s0{animation-delay:0s}.sync .s1{animation-delay:.6s}.sync .s2{animation-delay:1.2s}.sync .s3{animation-delay:1.8s}.sync .s4{animation-delay:2.4s}
@keyframes slot{0%,45%{fill:#0d1113}50%,80%{fill:#12343b}85%,100%{fill:#0d1113}}
.sync .crate rect{fill:#17333a;stroke:var(--cold);stroke-width:2}
.sync .crate path{stroke:var(--cold);stroke-width:1.5;opacity:.7}
.sync .lbl{font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;fill:var(--fg-dim)}
.sync .lbl.dim{font-size:9.5px;fill:#5d676e}
/* caution placard */
.placard-caution{position:relative;display:grid;grid-template-columns:28px 1fr;background:linear-gradient(180deg,#1c1a14,#15140f);border:1px solid #3a3320;border-radius:4px;overflow:hidden}
.pc-stripe{background:var(--hazard-stripe);background-size:40px 100%;animation:drift 8s linear infinite}
.pc-body{padding:28px 28px 26px}
.pc-body h2{color:var(--fg)}
.pc-body p{color:var(--fg-dim)}
.pc-body p+p{margin-top:12px}
.pc-light{position:absolute;top:18px;right:18px;width:14px;height:14px;border-radius:50%;background:var(--hazard);box-shadow:0 0 18px var(--hazard);animation:led 1.6s ease-in-out infinite}
.final{text-align:left}
/* reveal */
.rv{opacity:.35;transform:translateY(12px);transition:opacity .6s ease,transform .6s ease}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
 .hero2 h1 span,.hud li,.term .ln{animation:none;opacity:1;transform:none}
 .beacon,.hazard.anim,.pc-stripe,.sync .wire,.sync .keyg,.sync .slot,.pc-light,.term .cur{animation:none}
 .door,.doorsvg .wheel,.doorsvg .bolt,.inside .glow,.racks li,.ldoor{transition:none}
 .doorscene .door{transform:translateX(-97%)}.doorscene .inside .glow{opacity:1}.doorscene .racks li{opacity:1;transform:none}
 .rv{opacity:1;transform:none;transition:none}
 #mist{display:none}
}
@media (max-width:980px){.hero2-in{grid-template-columns:1fr;gap:34px}.doorscene{max-width:420px}.zero-grid{grid-template-columns:1fr}.lockers{grid-template-columns:repeat(2,minmax(0,1fr))}.bigzero{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.lockers{grid-template-columns:1fr}.locker{min-height:260px}.lin{min-height:260px}.hud{grid-template-columns:1fr}.beacon{width:420px;height:420px;top:-80px;right:-160px}.placard-caution{grid-template-columns:18px 1fr}.pc-body{padding:22px 18px}}
@media (hover:none){.locker .ldoor{transform:translateY(-92%)}.locker .ldoor .lname{opacity:0}}

/* ===================== BUNKER v3 ===================== */
.spine{position:fixed;left:22px;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#1b2024,#2a3136);z-index:5;pointer-events:none;border-left:1px solid #000;border-right:1px solid #3a4248}
.spine i{position:absolute;left:0;right:0;height:120px;background:linear-gradient(180deg,transparent,var(--cold),transparent);animation:spine 5s linear infinite;opacity:.8}
@keyframes spine{from{top:-120px}to{top:100%}}
/* hero v3: corridor */
.hero2{background:
 radial-gradient(60% 50% at 72% 55%,rgba(81,210,226,.10),transparent 70%),
 linear-gradient(180deg,#0a0c0d 0%,#101314 30%,#0c0e0f 100%)}
.hero2 .pipes{position:absolute;left:0;right:0;top:0;width:100%;height:90px;pointer-events:none;opacity:.95}
.hero2 .pipes .valve g{transform-box:fill-box;transform-origin:center;animation:valve 9s linear infinite}
@keyframes valve{to{transform:rotate(360deg)}}
.hero2 .pipes .cagelight rect:last-child{animation:flick 7s steps(1) infinite}
@keyframes flick{0%,100%{opacity:.9}41%{opacity:.9}42%{opacity:.3}44%{opacity:.9}73%{opacity:.9}74%{opacity:.5}75%{opacity:.9}}
.hero2 .cone{position:absolute;top:60px;width:520px;height:520px;pointer-events:none;background:conic-gradient(from 160deg at 50% 0%,transparent 0deg,rgba(223,246,255,.10) 12deg,rgba(223,246,255,.10) 28deg,transparent 40deg);filter:blur(6px);opacity:.8;mix-blend-mode:screen}
.hero2 .cone.c1{left:calc(16.7% - 260px)}.hero2 .cone.c2{left:calc(50% - 260px);animation:flick 7s steps(1) infinite}.hero2 .cone.c3{left:calc(83.3% - 260px)}
.hero2 .floor{position:absolute;left:-30%;right:-30%;bottom:0;height:42%;pointer-events:none;background:repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 1px,transparent 1px 90px),repeating-linear-gradient(0deg,rgba(255,255,255,.05) 0 1px,transparent 1px 48px);transform:perspective(600px) rotateX(64deg);transform-origin:bottom;opacity:.7;-webkit-mask:linear-gradient(180deg,transparent,#000 40%);mask:linear-gradient(180deg,transparent,#000 40%)}
.hero2 .torch{position:absolute;inset:0;pointer-events:none;background:radial-gradient(260px 260px at var(--mx,70%) var(--my,45%),rgba(223,246,255,.07),transparent 70%);mix-blend-mode:screen}
.hero2-in{padding-top:64px;min-height:min(76vh,820px)}
.doorscene{max-width:600px;box-shadow:0 40px 120px -40px #000,0 0 0 1px #000}
.doorscene.enter{transition:transform .2s linear}
.hero2 .conduit.top{display:none}
.wallcode{position:absolute;right:20px;bottom:12px;font-family:var(--font-display),"Saira Fallback";font-weight:700;font-size:clamp(60px,12vw,160px);letter-spacing:.06em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.07);line-height:1;pointer-events:none;user-select:none}
/* zone wall chrome */
.zone{position:relative;overflow:hidden}
.zone[data-code]::before{content:attr(data-code);position:absolute;right:20px;top:18px;font-family:var(--font-mono);font-size:11px;letter-spacing:.24em;color:var(--fg-dim);border:1px solid var(--line);padding:4px 8px;opacity:.9}
.zone[data-code]::after{content:attr(data-code);position:absolute;left:-10px;bottom:-30px;font-family:var(--font-display),"Saira Fallback";font-weight:700;font-size:clamp(90px,16vw,220px);letter-spacing:.04em;color:transparent;-webkit-text-stroke:1px rgba(232,227,216,.06);line-height:1;pointer-events:none;user-select:none}
.zone .light{position:absolute;top:0;left:50%;width:700px;height:420px;margin-left:-350px;pointer-events:none;background:conic-gradient(from 165deg at 50% 0%,transparent 0deg,rgba(223,246,255,.07) 10deg,rgba(223,246,255,.07) 20deg,transparent 30deg);filter:blur(8px);mix-blend-mode:screen}
.zone .light::before{content:"";position:absolute;left:50%;top:0;width:34px;height:8px;margin-left:-17px;background:#2a3136;border:1px solid #3a4248;border-top:0;border-radius:0 0 3px 3px}
.rivetrow{height:8px;background:radial-gradient(circle at 10px 4px,#3a4248 2px,#0d0f10 2.5px,transparent 3px) 0 0/40px 8px repeat-x,#15181a;border-top:1px solid #1e2327;border-bottom:1px solid #000}
/* cable demo */
.cable{background:linear-gradient(180deg,#0e1112,var(--bg))}
.cablewrap{margin-top:26px;display:grid;grid-template-columns:1.2fr .8fr;gap:22px;align-items:center}
.cableviz svg{width:100%;height:auto;display:block}
.cableviz .box{fill:#121719;stroke:var(--cold);stroke-width:1.5}
.cableviz .box.dim{stroke:#3a4248}
.cableviz .lbl{font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;fill:var(--fg-dim)}
.cableviz .wire{stroke:#9aa5ad;stroke-width:5;fill:none;stroke-linecap:round}
.cableviz .wire-b,.cableviz .jack rect{stroke:#5d676e}
.cableviz .jack rect{fill:#1b2024;stroke-width:1.5}
.cableviz .plug rect,.cableviz .plug path{fill:#2a3136;stroke:#9aa5ad;stroke-width:1.5}
.cableviz .plug,.cableviz .wire-a{transition:transform .8s cubic-bezier(.6,0,.3,1)}
.cableviz .spark path{stroke:var(--hazard);stroke-width:2;fill:none;opacity:0}
.cablewrap.off .plug,.cablewrap.off .wire-a{transform:translateX(-70px)}
.cablewrap.off .spark path{animation:sparkle .5s ease-out 1}
@keyframes sparkle{0%{opacity:1}100%{opacity:0;transform:translate(-8px,-6px)}}
.cablewrap.off .box.dim{stroke:#2c3236;opacity:.4}
.switch{display:flex;align-items:center;gap:14px;background:none;border:0;cursor:pointer;color:var(--fg);text-align:left;padding:0}
.sw-track{width:66px;height:34px;border-radius:17px;background:#1b2024;border:1px solid var(--concrete);position:relative;box-shadow:inset 0 2px 6px #000;flex:none}
.sw-knob{position:absolute;top:3px;left:34px;width:26px;height:26px;border-radius:50%;background:linear-gradient(180deg,#8ee6f2,#51d2e2);box-shadow:0 0 12px rgba(81,210,226,.6);transition:left .25s ease,background .25s}
.cablewrap.off .sw-knob{left:4px;background:linear-gradient(180deg,#5d676e,#434a4e);box-shadow:none}
.sw-label{display:flex;flex-direction:column;line-height:1.2}
.sw-label b{font-family:var(--font-display),"Saira Fallback";text-transform:uppercase;letter-spacing:.06em;font-size:18px;font-weight:600}
.sw-label span{font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--cold)}
.cablewrap.off .sw-label span{color:var(--hazard)}
.stamp.big{margin-top:18px;font-size:13px;color:var(--ok);border-color:rgba(87,201,138,.5);padding:8px 12px}
.applist{list-style:none;grid-column:1 / -1;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.applist li{display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--line);padding:10px 12px;font-family:var(--font-display),"Saira Fallback";text-transform:uppercase;letter-spacing:.04em;font-size:17px}
.applist .st{margin-left:auto;font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;color:var(--ok);text-transform:uppercase}
.cablenote{grid-column:1 / -1;font-size:14px;color:var(--fg-dim);margin:0}
/* lockers v3 */
.lockers{grid-template-columns:repeat(3,minmax(0,1fr))}
.locker{min-height:380px}
.lin{min-height:380px;padding-top:14px}
.ldoor{padding:14px 16px;background:linear-gradient(180deg,#262d32 0%,#1b2024 60%,#15191c 100%)}
.ldoor::after{display:none}
.ldoor .vents{position:absolute;left:16px;right:16px;top:44px;display:grid;gap:5px}
.ldoor .vents i{display:block;height:4px;background:#0d0f10;border-bottom:1px solid #333c42;border-radius:2px}
.ldoor .plate{position:absolute;left:16px;right:60px;top:50%;transform:translateY(-50%);background:#0f1214;border:1px solid #3a4248;color:#6b757c;font-family:var(--font-display),"Saira Fallback";font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:22px;padding:10px 12px;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.ldoor .lname{display:none}
.ldoor .lled{position:absolute;right:20px;top:16px;width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 8px var(--ok);animation:led 2.4s ease-in-out infinite}
.lmeta{display:flex;align-items:center;gap:10px;margin-top:12px}
.lmeta .ic{color:var(--cold)}
.scr{position:relative;height:120px;border-radius:4px;background:#0a0d0e;border:1px solid #1e2327;overflow:hidden;box-shadow:inset 0 0 0 1px #000}
.scr::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 2px,rgba(255,255,255,.02) 2px 3px);pointer-events:none}
/* draft */
.scr-draft .t{position:absolute;left:14px;height:6px;border-radius:3px;background:#2d3a44;width:0;animation:type 6s ease-in-out infinite}
.scr-draft .t1{top:22px;--w:72%}.scr-draft .t2{top:40px;--w:60%;animation-delay:.6s}.scr-draft .t3{top:58px;--w:78%;animation-delay:1.2s}.scr-draft .t4{top:76px;--w:40%;animation-delay:1.8s;background:var(--cold-deep)}
@keyframes type{0%{width:0}30%{width:var(--w)}80%{width:var(--w)}100%{width:0}}
.scr-draft .caret{position:absolute;left:14px;top:92px;width:2px;height:12px;background:var(--cold);animation:blink 1s steps(1) infinite}
/* grid */
.scr-grid{display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(4,1fr);gap:2px;padding:8px 8px 40px}
.scr-grid .c{display:block;background:#121a1e;border:1px solid #1e2a31;animation:cell 5s ease-in-out infinite}
.scr-grid .c0{animation-delay:0.00s}.scr-grid .c1{animation-delay:0.17s}.scr-grid .c2{animation-delay:0.34s}.scr-grid .c3{animation-delay:0.51s}.scr-grid .c4{animation-delay:0.68s}.scr-grid .c5{animation-delay:0.85s}.scr-grid .c6{animation-delay:1.02s}.scr-grid .c7{animation-delay:1.19s}.scr-grid .c8{animation-delay:1.36s}.scr-grid .c9{animation-delay:1.53s}.scr-grid .c10{animation-delay:1.70s}.scr-grid .c11{animation-delay:1.87s}.scr-grid .c12{animation-delay:2.04s}.scr-grid .c13{animation-delay:2.21s}.scr-grid .c14{animation-delay:2.38s}.scr-grid .c15{animation-delay:2.55s}.scr-grid .c16{animation-delay:2.72s}.scr-grid .c17{animation-delay:2.89s}.scr-grid .c18{animation-delay:0.06s}.scr-grid .c19{animation-delay:0.23s}
@keyframes cell{0%,100%{background:#121a1e}12%{background:var(--cold-deep)}30%{background:#15303a}}
.scr-grid .bars{position:absolute;left:10px;right:10px;bottom:8px;height:28px;display:flex;align-items:flex-end;gap:6px}
.scr-grid .bars b{flex:1;background:var(--cold);opacity:.7;animation:bar 4s ease-in-out infinite;transform-origin:bottom}
.scr-grid .b1{height:40%}.scr-grid .b2{height:70%;animation-delay:.3s}.scr-grid .b3{height:55%;animation-delay:.6s}.scr-grid .b4{height:90%;animation-delay:.9s}
@keyframes bar{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}
/* briefing */
.scr-brief .slide{position:absolute;inset:10px 10px 22px;background:#121a1e;border:1px solid #1e2a31;opacity:0;animation:slide 7.5s ease-in-out infinite;padding:12px}
.scr-brief .slide i{display:block;height:8px;background:#2d3a44;border-radius:2px;margin-bottom:8px;width:60%}
.scr-brief .slide i+i{width:85%;height:5px;background:#243038}
.scr-brief .s2{animation-delay:2.5s}.scr-brief .s3{animation-delay:5s}
.scr-brief .s2 i:first-child{background:var(--cold-deep)}.scr-brief .s3 i:first-child{width:35%}
@keyframes slide{0%{opacity:0;transform:translateX(12px)}6%{opacity:1;transform:none}30%{opacity:1;transform:none}36%{opacity:0;transform:translateX(-12px)}100%{opacity:0}}
.scr-brief .dots{position:absolute;bottom:7px;left:50%;transform:translateX(-50%);display:flex;gap:5px}
.scr-brief .dots i{width:5px;height:5px;border-radius:50%;background:#2d3a44}
.scr-brief .dots i:first-child{background:var(--cold)}
/* dispatch */
.scr-mail .env{position:absolute;left:14px;top:22px;width:86px;height:58px;background:#1a2228;border:1px solid #2d3a44;border-radius:3px;overflow:hidden}
.scr-mail .flap{position:absolute;left:0;right:0;top:0;height:50%;background:#243038;clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;animation:flap 5s ease-in-out infinite}
@keyframes flap{0%,30%{transform:scaleY(-1) translateY(0)}45%,100%{transform:scaleY(1)}}
.scr-mail .body{position:absolute;inset:0}
.scr-mail .seal{position:absolute;left:68px;top:52px;width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#8ee6f2,var(--cold-deep));color:#0D0F10;font:700 8px/30px var(--font-mono);text-align:center;letter-spacing:.1em;transform:scale(0);animation:sealit 5s ease-out infinite}
@keyframes sealit{0%,50%{transform:scale(0)}58%{transform:scale(1.25)}64%,100%{transform:scale(1)}}
.scr-mail .line{position:absolute;left:116px;height:6px;border-radius:3px;background:#2d3a44}
.scr-mail .l1{top:34px;width:70px}.scr-mail .l2{top:50px;width:46px}
/* relay */
.scr-relay .bub{position:absolute;left:12px;width:58%;height:18px;border-radius:9px;background:#1f2a31;opacity:0;animation:bub 7s ease-in-out infinite}
.scr-relay .bub.me{left:auto;right:12px;background:var(--cold-deep)}
.scr-relay .b1{top:14px}.scr-relay .b2{top:38px;animation-delay:1.1s;width:46%}.scr-relay .b3{top:62px;animation-delay:2.2s;width:64%}.scr-relay .b4{top:86px;animation-delay:3.3s;width:40%}
@keyframes bub{0%{opacity:0;transform:translateY(6px)}8%{opacity:1;transform:none}75%{opacity:1}85%,100%{opacity:0}}
.scr-relay .lock{position:absolute;right:10px;top:10px;width:10px;height:8px;border:1.5px solid var(--cold);border-radius:2px}
.scr-relay .lock::before{content:"";position:absolute;left:1.5px;top:-6px;width:5px;height:6px;border:1.5px solid var(--cold);border-bottom:0;border-radius:4px 4px 0 0}
/* periscope */
.scr-peri .tabs{position:absolute;left:8px;right:8px;top:8px;display:flex;gap:4px}
.scr-peri .tabs i{flex:1;height:10px;background:#141c21;border:1px solid #1e2a31;border-radius:3px 3px 0 0}
.scr-peri .tabs i.on{background:#1f2a31}
.scr-peri .page{position:absolute;left:8px;right:8px;top:24px;bottom:8px;background:#121a1e;border:1px solid #1e2a31;padding:10px}
.scr-peri .pl{display:block;height:6px;background:#243038;border-radius:3px;margin-bottom:8px;width:90%}
.scr-peri .pl.short{width:55%}
.scr-peri .shield{position:absolute;right:14px;background:rgba(229,72,77,.15);border:1px solid var(--alert);color:#ffb3b3;font:600 8px/1 var(--font-mono);letter-spacing:.12em;padding:4px 6px;border-radius:2px;opacity:0;animation:shield 6s ease-out infinite}
.scr-peri .shield{top:34px}.scr-peri .s2{top:56px;animation-delay:1.4s}.scr-peri .s3{top:78px;animation-delay:2.8s}
@keyframes shield{0%{opacity:0;transform:translateX(10px)}10%{opacity:1;transform:none}60%{opacity:1}75%,100%{opacity:0}}
/* page-head chrome for inner pages */
.page-head{position:relative;overflow:hidden;background:linear-gradient(180deg,#0a0c0d,var(--bg))}
.page-head .pipes{position:absolute;left:0;right:0;top:0;width:100%;height:70px;opacity:.9;pointer-events:none}
.page-head .wrap{position:relative;padding-top:70px}
@media (prefers-reduced-motion:reduce){.spine i,.hero2 .pipes .valve g,.hero2 .pipes .cagelight rect:last-child,.hero2 .cone.c2,.scr *,.ldoor .lled,.cableviz .spark path{animation:none}.scr-draft .t{width:var(--w)}.scr-brief .s1{opacity:1}.scr-relay .bub{opacity:1}.scr-peri .shield{opacity:1}.scr-mail .seal{transform:scale(1)}}
@media (max-width:1180px){.spine{display:none}}
@media (max-width:980px){.cablewrap{grid-template-columns:1fr}.applist{grid-template-columns:repeat(3,minmax(0,1fr))}.hero2 .cone{display:none}.hero2-in{min-height:0}.doorscene{max-width:460px}}
@media (max-width:720px){.lockers{grid-template-columns:1fr}.applist{grid-template-columns:repeat(2,minmax(0,1fr))}.zone[data-code]::before{top:10px;right:12px}.wallcode{display:none}}

/* ===================== DOORWAY v4 ===================== */
.hero2-in{display:block;min-height:0;padding-top:44px;padding-bottom:0}
.hero2-copy{max-width:780px;margin-bottom:38px}
.hero2 h1{margin:12px 0 16px}
.hero2 .ctas{margin-bottom:0}
.hero2 .hud{display:none}
.doorway{position:relative;border-radius:6px;overflow:hidden;box-shadow:0 50px 120px -50px #000,0 0 0 1px #000;background:#15191c}
.lintel,.sill{position:relative;background:linear-gradient(180deg,#2a3136,#1b2024);border-top:1px solid #3a4248;border-bottom:1px solid #000;display:flex;align-items:center;gap:18px;padding:0 18px;min-height:46px}
.sill{background:linear-gradient(180deg,#1f2529,#15191c);justify-content:center;min-height:40px}
.rv-strip{position:absolute;left:10px;right:10px;top:4px;display:flex;justify-content:space-between;pointer-events:none}
.rv-strip i{width:5px;height:5px;border-radius:50%;background:#3a4248;box-shadow:inset 0 1px 1px rgba(0,0,0,.7),0 1px 0 rgba(255,255,255,.05)}
.sill .rv-strip{top:auto;bottom:4px}
.lintel .stencil{font-family:var(--font-display),"Saira Fallback";font-weight:700;text-transform:uppercase;letter-spacing:.16em;font-size:13px;color:#5d676e;white-space:nowrap;padding-top:4px}
.hudstrip{list-style:none;display:flex;gap:22px;margin:0 auto;padding-top:4px;flex-wrap:wrap;justify-content:center}
.hudstrip li{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.hudstrip .k{color:var(--fg-dim)}.hudstrip .v{color:var(--fg)}
.opening{position:relative;aspect-ratio:2.3/1;overflow:hidden;background:#07090a}
.chamber{position:absolute;inset:0;background:radial-gradient(70% 90% at 50% 100%,#0f2a30 0%,#0a1518 45%,#060a0b 100%);overflow:hidden}
.chamber .ceil{position:absolute;left:0;right:0;top:0;height:100%;display:flex;justify-content:space-around;pointer-events:none}
.chamber .ceil i{width:34%;height:100%;background:conic-gradient(from 160deg at 50% 0%,transparent 0deg,rgba(223,246,255,.11) 14deg,rgba(223,246,255,.11) 26deg,transparent 40deg);filter:blur(6px);mix-blend-mode:screen;opacity:0;transition:opacity 1.4s ease 2s}
.doorway.open .chamber .ceil i{opacity:1}
.chamber .ceil i:nth-child(2){animation:flick 7s steps(1) infinite}
.backwall{position:absolute;left:5%;right:5%;top:12%;bottom:26%;display:flex;align-items:center}
.cells{list-style:none;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;width:100%}
.cell{position:relative;background:linear-gradient(180deg,#151c20,#0d1215);border:1px solid #27313a;border-top:2px solid var(--cold);border-radius:4px;padding:16px 8px 12px;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;color:var(--cold);opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .5s ease;box-shadow:0 0 30px -10px rgba(81,210,226,.35)}
.cell b{font-family:var(--font-display),"Saira Fallback";font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:clamp(14px,1.6vw,20px);color:var(--fg);line-height:1}
.cell span{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-dim)}
.cell .cled{position:absolute;top:8px;right:8px;width:6px;height:6px;border-radius:50%;background:var(--ok);box-shadow:0 0 6px var(--ok);animation:led 2.4s ease-in-out infinite}
.cell .ic-lg{width:clamp(26px,3vw,40px);height:clamp(26px,3vw,40px)}
.doorway.open .cell{opacity:1;transform:none}
.doorway.open .c0{transition-delay:2.2s}.doorway.open .c1{transition-delay:2.32s}.doorway.open .c2{transition-delay:2.44s}.doorway.open .c3{transition-delay:2.56s}.doorway.open .c4{transition-delay:2.68s}.doorway.open .c5{transition-delay:2.8s}
.floor2{position:absolute;left:-20%;right:-20%;bottom:0;height:34%;background:repeating-linear-gradient(90deg,rgba(81,210,226,.16) 0 1px,transparent 1px 70px),repeating-linear-gradient(0deg,rgba(81,210,226,.16) 0 1px,transparent 1px 26px);transform:perspective(500px) rotateX(60deg);transform-origin:bottom;opacity:.6}
.chamber #mist{position:absolute;left:0;right:0;bottom:0;width:100%;height:60%;opacity:.8}
.seamglow{position:absolute;left:50%;top:0;bottom:0;width:6px;margin-left:-3px;background:var(--cold);box-shadow:0 0 40px 12px rgba(81,210,226,.55);opacity:0;transition:opacity .5s ease 1.4s;z-index:3}
.doorway.open .seamglow{opacity:1;transition:opacity .9s ease 1.6s;animation:seamfade 1.8s ease 1.7s forwards}
@keyframes seamfade{to{opacity:0}}
.leaf{position:absolute;top:0;bottom:0;width:50%;z-index:4;background:linear-gradient(180deg,#2c3338 0%,#20262a 45%,#181d20 100%);box-shadow:inset 0 0 0 1px #3a4248,inset 0 0 60px rgba(0,0,0,.6);transition:transform 2s cubic-bezier(.76,0,.24,1) 1.3s;will-change:transform;overflow:hidden}
.leaf.left{left:0}.leaf.right{right:0}
.leaf::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.02) 0 2px,transparent 2px 7px);pointer-events:none}
.leaf .ribs{position:absolute;left:6%;right:6%;top:18%;height:64%;background:repeating-linear-gradient(180deg,transparent 0 22%,#161a1d 22% 23.5%,#3a4248 23.5% 24.5%,transparent 24.5% 33%);opacity:.9;pointer-events:none}
.leaf .edge{position:absolute;top:0;bottom:0;width:22px;background:var(--hazard-stripe);background-size:100% 40px;opacity:.9;border-left:1px solid #000;border-right:1px solid #000}
.leaf.left .edge{right:0}.leaf.right .edge{left:0}
.stencil-big{position:absolute;top:50%;transform:translateY(-50%);font-family:var(--font-display),"Saira Fallback";font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:clamp(34px,7vw,110px);color:#2f373d;text-shadow:0 1px 0 rgba(255,255,255,.04);line-height:1;pointer-events:none;user-select:none}
.leaf.left .stencil-big{left:10%}.leaf.right .stencil-big{left:16%}
.plate2{position:absolute;left:14%;bottom:12%;font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#6b757c;border:1px solid #3a4248;padding:6px 10px;background:#15191c}
.wheel2{position:absolute;left:80%;top:50%;width:clamp(70px,13%,140px);height:auto;transform:translate(-50%,-50%);transition:transform 1.3s cubic-bezier(.4,0,.2,1);filter:drop-shadow(0 6px 10px rgba(0,0,0,.6))}
.doorway.open .wheel2{transform:translate(-50%,-50%) rotate(-170deg)}
.doorway.open .leaf.left{transform:translateX(-101%)}
.doorway.open .leaf.right{transform:translateX(101%)}
.doorbtn{position:static;transform:none;z-index:auto;margin:0}
@media (prefers-reduced-motion:reduce){.leaf,.wheel2,.cell,.chamber .ceil i,.seamglow{transition:none;animation:none}.doorway .leaf.left{transform:translateX(-101%)}.doorway .leaf.right{transform:translateX(101%)}.doorway .cell{opacity:1;transform:none}.doorway .chamber .ceil i{opacity:1}.cell .cled{animation:none}}
@media (max-width:980px){.opening{aspect-ratio:1.5/1}.cells{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.backwall{top:9%;bottom:22%}.lintel .stencil:last-child{display:none}.plate2{display:none}}
@media (max-width:720px){.opening{aspect-ratio:1.15/1}.cell{padding:12px 6px 10px}.cell span{display:none}.lintel{min-height:0;padding:8px 12px;flex-wrap:wrap;gap:8px}.lintel .stencil{display:none}.hudstrip{gap:10px 14px;justify-content:flex-start}.hudstrip .k{display:none}.hudstrip li{font-size:10.5px}.hero2-copy{margin-bottom:28px}}

/* ===================== v5: door-first hero + inner-page chrome ===================== */
.hero2-in{padding-top:36px}
.hero2-copy{max-width:none;margin:36px 0 0;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:28px 48px;align-items:end}
.hero2-copy .eyebrow{grid-column:1 / -1;margin-bottom:0}
.hero2 h1{font-size:clamp(40px,6.4vw,78px);margin:0}
.hero2 h1 span{display:inline-block;margin-right:.18em}
.hero2 .lede{margin:0 0 18px;font-size:clamp(16px,1.3vw,18px)}
.opening{aspect-ratio:2.6/1}
.doorway{box-shadow:0 60px 140px -50px #000,0 0 0 1px #000,0 0 0 8px #15191c,0 0 0 9px #000}
.page-head.corridor{padding:0 0 clamp(26px,4vw,40px);background:radial-gradient(60% 50% at 72% 55%,rgba(81,210,226,.08),transparent 70%),linear-gradient(180deg,#0a0c0d 0%,#101314 30%,#0c0e0f 100%);min-height:300px}
.page-head.corridor::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 2px,rgba(255,255,255,.012) 2px 3px);pointer-events:none}
.page-head.corridor .cone{position:absolute;top:60px;width:520px;height:520px;pointer-events:none;background:conic-gradient(from 160deg at 50% 0%,transparent 0deg,rgba(223,246,255,.10) 12deg,rgba(223,246,255,.10) 28deg,transparent 40deg);filter:blur(6px);opacity:.8;mix-blend-mode:screen}
.page-head.corridor .cone.c1{left:calc(16.7% - 260px)}.page-head.corridor .cone.c2{left:calc(50% - 260px);animation:flick 7s steps(1) infinite}.page-head.corridor .cone.c3{left:calc(83.3% - 260px)}
.page-head.corridor .floor{position:absolute;left:-30%;right:-30%;bottom:0;height:46%;pointer-events:none;background:repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 1px,transparent 1px 90px),repeating-linear-gradient(0deg,rgba(255,255,255,.05) 0 1px,transparent 1px 48px);transform:perspective(600px) rotateX(64deg);transform-origin:bottom;opacity:.7;-webkit-mask:linear-gradient(180deg,transparent,#000 40%);mask:linear-gradient(180deg,transparent,#000 40%)}
.page-head.corridor .wallcode{right:20px;bottom:6px}
.page-head.corridor .pipes .valve g{transform-box:fill-box;transform-origin:center;animation:valve 9s linear infinite}
.page-head.corridor .pipes .cagelight rect:last-child{animation:flick 7s steps(1) infinite}
.page-head.corridor .wrap{padding-top:120px}
.page-head.corridor h1{font-size:clamp(40px,7vw,86px)}
.page-head.corridor p{color:var(--fg-dim)}
.apphead{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.8fr);gap:30px;align-items:center}
.apphead .scr{height:200px;border-color:#27313a;box-shadow:0 0 0 1px #000,0 30px 80px -30px rgba(81,210,226,.35),inset 0 0 0 1px #000}
.apphead .scr-draft .t{height:9px}.apphead .scr-draft .t1{top:30px}.apphead .scr-draft .t2{top:56px}.apphead .scr-draft .t3{top:82px}.apphead .scr-draft .t4{top:108px}.apphead .scr-draft .caret{top:134px;height:16px}
.apphead .scr-grid{grid-template-rows:repeat(5,1fr);padding-bottom:56px}.apphead .scr-grid .bars{height:40px}
.apphead .scr-brief .slide{inset:16px 16px 30px;padding:18px}.apphead .scr-brief .slide i{height:12px}.apphead .scr-brief .slide i+i{height:8px}
.apphead .scr-mail .env{left:24px;top:40px;width:130px;height:88px}.apphead .scr-mail .seal{left:110px;top:92px;width:44px;height:44px;font-size:11px;line-height:44px}.apphead .scr-mail .line{left:180px;height:9px}.apphead .scr-mail .l1{top:60px;width:120px}.apphead .scr-mail .l2{top:84px;width:80px}
.apphead .scr-relay .bub{height:28px;border-radius:14px}.apphead .scr-relay .b1{top:20px}.apphead .scr-relay .b2{top:62px}.apphead .scr-relay .b3{top:104px}.apphead .scr-relay .b4{top:146px}
.apphead .scr-peri .tabs{top:12px}.apphead .scr-peri .tabs i{height:16px}.apphead .scr-peri .page{top:36px;bottom:12px;padding:16px}.apphead .scr-peri .pl{height:9px;margin-bottom:12px}.apphead .scr-peri .shield{font-size:10px;padding:6px 8px}.apphead .scr-peri .shield{top:50px}.apphead .scr-peri .s2{top:84px}.apphead .scr-peri .s3{top:118px}
.panel{background:linear-gradient(180deg,#171c20,#121619);border-color:#27303a;box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 20px 50px -40px #000}
.panel .code{margin-bottom:12px}
.placard.infra{background:linear-gradient(180deg,#24292b,#181c1e);border-top-color:var(--hazard)}
.tbl,.spec{position:relative}
.zone .light{z-index:0}
.zone .wrap{position:relative;z-index:1}
@media (max-width:980px){.hero2-copy{grid-template-columns:1fr;gap:18px}.apphead{grid-template-columns:1fr}.page-head.corridor .cone{display:none}.page-head.corridor .wrap{padding-top:96px}}
@media (max-width:720px){.hero2 h1 span{display:block}.page-head.corridor .wallcode{display:none}}

/* ===================== v6: full suite · no uploads ===================== */
.suitestrip{background:linear-gradient(180deg,#15181a,#101314);border-top:1px solid #2c3236;border-bottom:1px solid #000;position:relative;z-index:2}
.suitestrip-in{display:grid;grid-template-columns:minmax(260px,.9fr) minmax(0,1.6fr);gap:24px 40px;align-items:center;padding-top:26px;padding-bottom:26px}
.ss-claim{display:flex;flex-direction:column;gap:6px}
.ss-claim .eyebrow{margin:0}
.ss-claim strong{font-family:var(--font-display),"Saira Fallback";font-weight:700;text-transform:uppercase;letter-spacing:.02em;font-size:clamp(24px,2.6vw,34px);line-height:1;color:var(--fg)}
.ss-sub{color:var(--fg-dim);font-size:15px}
.ss-sub em{font-style:normal;color:var(--cold);font-weight:600}
.ss-apps{list-style:none;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.ss-apps li{display:flex;flex-direction:column;align-items:flex-start;gap:4px;background:var(--bg);border:1px solid var(--line);border-left:3px solid var(--cold);padding:10px 10px 9px}
.ss-apps .ic{color:var(--cold);width:20px;height:20px}
.ss-apps b{font-family:var(--font-display),"Saira Fallback";font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:16px;line-height:1}
.ss-apps span{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-dim)}
.hero2-copy .lede strong{color:var(--fg);font-weight:600}
.noupload{background:linear-gradient(180deg,var(--bg),#0e1112)}
.compare{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:28px}
.cmp{margin:0;background:linear-gradient(180deg,#171c20,#121619);border:1px solid #27303a;border-radius:4px;padding:14px 14px 16px;position:relative;overflow:hidden}
.cmp-cloud{border-top:3px solid var(--alert)}
.cmp-bunker{border-top:3px solid var(--cold)}
.cmp svg{width:100%;height:auto;display:block;background:#0a0d0e;border:1px solid #1e2327}
.cmp figcaption{margin-top:12px;font-size:14px;color:var(--fg-dim)}
.cmp figcaption b{color:var(--fg);font-family:var(--font-display),"Saira Fallback";text-transform:uppercase;letter-spacing:.04em;font-size:17px;font-weight:600;margin-right:6px}
.cmp .hidden{fill:none;stroke:none}
.cmp .lbl{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;fill:var(--fg)}
.cmp .lbl.dim{fill:var(--fg-dim);font-size:9px}
.cmp .cloud path{fill:#1c1416;stroke:var(--alert);stroke-width:1.5}
.cmp .cloud.dead path{fill:#121619;stroke:#3a4248;stroke-dasharray:5 5}
.cmp .cloud.dead .x{stroke:var(--alert);stroke-width:3;stroke-dasharray:none;fill:none}
.cmp .laptop rect{fill:#15191c;stroke:#3a4248;stroke-width:1.5}
.cmp .laptop.lit rect{stroke:var(--cold)}
.cmp .wire{fill:none;stroke:#3a4248;stroke-width:2;stroke-dasharray:6 6}
.cmp .wire.up{animation:wireup 1.2s linear infinite}
@keyframes wireup{to{stroke-dashoffset:-24}}
.cmp .wire.blocked{stroke:var(--fg-dim);stroke-dasharray:3 5}
.cmp .bar{fill:var(--alert)}
.cmp .up rect{fill:#2a1a1c;stroke:var(--alert);stroke-width:1.5}
.cmp .vault rect{fill:#0f2328;stroke:var(--cold);stroke-width:1.5}
.cmp .vault circle,.cmp .vault path{fill:none;stroke:var(--cold);stroke-width:1.5}
.cmp .stay rect{fill:#17333a;stroke:var(--cold);stroke-width:1.5;animation:stay 3s ease-in-out infinite}
.cmp .stay rect:nth-child(2){animation-delay:.4s}.cmp .stay rect:nth-child(3){animation-delay:.8s}.cmp .stay rect:nth-child(4){animation-delay:1.2s}
@keyframes stay{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.cells .cell span{letter-spacing:.1em;white-space:nowrap;font-size:9px}
.hudstrip{gap:14px}
@media (max-width:1300px){.lintel .stencil{display:none}}
@media (prefers-reduced-motion:reduce){.cmp .wire.up,.cmp .stay rect{animation:none}}
@media (max-width:980px){.suitestrip-in{grid-template-columns:1fr}.ss-apps{grid-template-columns:repeat(3,minmax(0,1fr))}.compare{grid-template-columns:1fr}}
@media (max-width:540px){.ss-apps{grid-template-columns:repeat(2,minmax(0,1fr))}}
