/* ARMOR — landing preview (phase6, 2026-10-07). Static, no framework. */
:root{
  --bg:#040A14; --bg2:#061528; --navy:#0A2540; --navy2:#073D8C;
  --ice:#4EE8FF; --blue:#1A7CFF; --blue2:#0560E0; --gold:#d4af6a; --gold2:#b08d57;
  --text:#E8F1FB; --muted:#A9BCD3; --dim:#7F93AD; --line:rgba(148,190,255,.14); --card:rgba(12,28,52,.55);
  --radius:18px; --max:1200px;
  --fd:'Montserrat',system-ui,-apple-system,'Segoe UI',sans-serif; --fb:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--fb);background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
::selection{background:var(--ice);color:var(--navy)}
:focus-visible{outline:2px solid var(--ice);outline-offset:3px;border-radius:6px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px;top:8px;z-index:200;background:var(--ice);color:var(--navy);padding:8px 14px;border-radius:8px;font-weight:700}
.skip:focus{left:8px}

/* ---------- top bar + nav ---------- */
.topbar{background:#020710;border-bottom:1px solid var(--line);font-size:12.5px;color:var(--muted)}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:36px}
.topbar a{display:inline-flex;gap:6px;align-items:center;color:#cfe3ff;white-space:nowrap}
.topbar a:hover{color:#fff}
.live{width:7px;height:7px;border-radius:50%;background:var(--ice);display:inline-block;box-shadow:0 0 0 0 rgba(78,232,255,.7);animation:pulse 2s infinite;flex:none}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(78,232,255,.6)}50%{box-shadow:0 0 0 7px rgba(78,232,255,0)}}
.tb-msg{display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.tb-long{display:none}
@media(min-width:640px){.tb-long{display:inline}}

.nav{position:sticky;top:0;z-index:90;transition:background .3s,border-color .3s,backdrop-filter .3s;border-bottom:1px solid transparent}
.nav.scrolled{background:rgba(4,10,20,.82);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);border-color:var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:12px}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
.brand img{width:38px;height:auto;filter:drop-shadow(0 0 10px rgba(78,232,255,.45));transition:transform .3s}
.brand:hover img{transform:scale(1.06)}
.wordmark{font-family:var(--fd);font-weight:800;letter-spacing:.2em;font-size:18px;line-height:1;
  background:linear-gradient(180deg,#fff 0%,#cfd8e3 55%,#8ea3bb 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.tagline{font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:#9fc4ee;margin-top:5px;white-space:nowrap}
.menu{display:none;gap:26px;align-items:center}
.menu a{font-size:14px;font-weight:500;color:#d6e4f5;position:relative;padding:6px 0}
.menu a::after{content:'';position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--ice);transform:scaleX(0);transition:transform .25s}
.menu a:hover,.menu a.active{color:#fff}.menu a:hover::after,.menu a.active::after{transform:scaleX(1)}
.nav-cta{display:flex;align-items:center;gap:8px;flex:none}
.login{display:none;font-size:14px;font-weight:600;color:#d6e4f5;padding:8px 12px;border-radius:10px}
.login:hover{color:var(--ice)}
.burger{display:inline-flex;background:none;border:1px solid var(--line);color:#fff;border-radius:10px;padding:8px;cursor:pointer}
.burger svg{width:22px;height:22px}
.mobile{display:none;border-top:1px solid var(--line);background:rgba(4,10,20,.97);backdrop-filter:blur(14px)}
.mobile.open{display:block}
.mobile nav{display:grid;padding:10px 20px 20px}
.mobile a{padding:13px 4px;border-bottom:1px solid rgba(148,190,255,.08);color:#e3eefb;font-weight:500}
.mobile a.m-login{color:var(--ice);font-weight:700;border-bottom:0;margin-top:6px}
@media(min-width:768px){.login{display:inline-flex}}
@media(min-width:1100px){.menu{display:flex}.burger{display:none}.mobile{display:none!important}}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-weight:700;font-size:13.5px;letter-spacing:.06em;text-transform:uppercase;padding:15px 26px;border-radius:12px;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s,background .25s,border-color .25s;white-space:nowrap;cursor:pointer;border:0}
.btn svg{width:17px;height:17px;flex:none}
.btn-ice{background:linear-gradient(180deg,#6FF0FF 0%,#2BB8CC 100%);color:#04203a;box-shadow:0 10px 30px -10px rgba(78,232,255,.65),inset 0 1px 0 rgba(255,255,255,.5)}
.btn-ice:hover{transform:translateY(-2px);box-shadow:0 18px 40px -12px rgba(78,232,255,.8),inset 0 1px 0 rgba(255,255,255,.5)}
.btn-blue{background:linear-gradient(180deg,var(--blue) 0%,var(--blue2) 100%);color:#fff;box-shadow:0 10px 28px -10px rgba(26,124,255,.7),inset 0 1px 0 rgba(255,255,255,.18)}
.btn-blue:hover{transform:translateY(-2px)}
.btn-ghost{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(10px)}
.btn-ghost:hover{border-color:rgba(78,232,255,.55);background:rgba(78,232,255,.08)}
.btn-gold{background:linear-gradient(90deg,var(--gold2),var(--gold));color:var(--navy);border-radius:999px;padding:16px 34px}
.btn-gold:hover{transform:scale(1.04)}
.btn-sm{padding:10px 16px;font-size:12.5px;border-radius:10px}

/* ---------- section scaffolding ---------- */
section{position:relative}
.sec{padding:96px 0}
@media(max-width:640px){.sec{padding:72px 0}}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--ice);margin-bottom:14px}
.eyebrow::before{content:'';width:22px;height:2px;background:linear-gradient(90deg,var(--ice),transparent)}
.eyebrow.gold{color:var(--gold)}.eyebrow.gold::before{background:linear-gradient(90deg,var(--gold),transparent)}
h1,h2,h3,h4{font-family:var(--fd);line-height:1.08;letter-spacing:-.01em}
h2{font-size:clamp(1.9rem,4.6vw,3.2rem);font-weight:800;margin-bottom:16px}
h3{font-size:1.2rem;font-weight:700}
.lead{font-size:clamp(1rem,1.6vw,1.15rem);color:var(--muted);max-width:680px}
.center{text-align:center}.center .lead{margin:0 auto}
.hl{color:var(--ice)}
.grad{background:linear-gradient(90deg,#fff 0%,var(--ice) 60%,var(--blue) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.head{margin-bottom:52px}

/* ---------- animated backdrop ---------- */
.bg-grid{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.bg-grid::before{content:'';position:absolute;inset:-60px;background-image:linear-gradient(rgba(120,180,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(120,180,255,.07) 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(ellipse 80% 70% at 50% 40%,#000 30%,transparent 80%);-webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 40%,#000 30%,transparent 80%);animation:gridmove 22s linear infinite}
@keyframes gridmove{to{transform:translate(56px,56px)}}
.orb{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;pointer-events:none;z-index:0}
.orb.a{width:520px;height:520px;background:radial-gradient(circle,rgba(26,124,255,.55),transparent 65%);left:-140px;top:10%;animation:drift 16s ease-in-out infinite alternate}
.orb.b{width:560px;height:560px;background:radial-gradient(circle,rgba(78,232,255,.38),transparent 65%);right:-160px;top:-80px;animation:drift 20s ease-in-out infinite alternate-reverse}
@keyframes drift{to{transform:translate(60px,40px) scale(1.08)}}

/* ---------- hero ---------- */
.hero{padding:28px 0 80px;overflow:hidden;background:radial-gradient(120% 90% at 70% 0%,#0b2c55 0%,#061528 45%,var(--bg) 100%)}
.hero .wrap{position:relative;z-index:1;display:grid;gap:34px;align-items:center}
@media(min-width:1000px){.hero{padding:36px 0 96px;min-height:calc(100vh - 108px)}.hero .wrap{grid-template-columns:1.12fr .88fr;gap:40px}}
.badge{display:inline-flex;align-items:center;gap:10px;padding:7px 14px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);border-radius:999px;font-size:11.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#e9f4ff;backdrop-filter:blur(10px)}
.hero-logo{display:flex;align-items:center;gap:16px;margin:20px 0 16px}
.hero-logo img{width:64px;filter:drop-shadow(0 0 22px rgba(78,232,255,.55))}
.hero-logo .wordmark{font-size:30px;letter-spacing:.32em}
.hero-logo .tagline{font-size:11px;letter-spacing:.3em}
.hero h1{font-size:clamp(2.4rem,6.2vw,4.5rem);font-weight:900;letter-spacing:-.025em;line-height:1.0;margin-bottom:22px}
.hero h1 .hl{background:linear-gradient(90deg,var(--ice) 0%,#9df5ff 40%,var(--blue) 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 6s ease-in-out infinite}
@keyframes shine{0%,100%{background-position:0 0}50%{background-position:100% 0}}
.hero p.lead{color:#c3d4e8;margin-bottom:32px}
.ctas{display:flex;flex-wrap:wrap;gap:12px}
@media(max-width:520px){.ctas{flex-direction:column}.ctas .btn{width:100%}}
.hero-points{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:28px;color:var(--muted);font-size:13.5px}
.hero-points span{display:inline-flex;align-items:center;gap:7px}
.hero-points svg{width:15px;height:15px;color:var(--ice)}

/* kiosk visual */
.kiosk-stage{position:relative;max-width:400px;width:78%;margin:0 auto}
@media(min-width:1000px){.kiosk-stage{width:100%;max-width:420px}}
.kiosk-stage .halo{position:absolute;inset:-14%;background:radial-gradient(circle at 50% 45%,rgba(78,232,255,.32),transparent 62%);filter:blur(10px);animation:halo 5s ease-in-out infinite}
@keyframes halo{50%{opacity:.6;transform:scale(.96)}}
.kiosk{position:relative;animation:float 7s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-10px)}}
.kiosk img{width:100%;height:auto;filter:drop-shadow(0 40px 60px rgba(0,0,0,.65))}
.screen{position:absolute;left:21.5%;top:7.1%;width:73.6%;height:67.8%;overflow:hidden;border-radius:2px;pointer-events:none}
.scan{position:absolute;left:0;right:0;height:22%;top:-25%;background:linear-gradient(180deg,transparent,rgba(78,232,255,.18) 70%,rgba(78,232,255,.6) 98%,transparent);animation:scan 4.2s cubic-bezier(.5,0,.5,1) infinite}
@keyframes scan{0%{top:-25%}100%{top:105%}}
.face-box{position:absolute;left:5%;top:5%;width:42%;height:24%;border:1.5px solid rgba(78,232,255,.0);border-radius:4px;animation:facebox 8s infinite}
.face-box::before,.face-box::after{content:'';position:absolute;width:12px;height:12px;border-color:var(--ice);border-style:solid}
.face-box::before{left:-2px;top:-2px;border-width:2px 0 0 2px}.face-box::after{right:-2px;bottom:-2px;border-width:0 2px 2px 0}
@keyframes facebox{0%,10%{opacity:0;transform:scale(1.15)}18%,60%{opacity:1;transform:scale(1)}70%,100%{opacity:0}}
.hud{position:absolute;display:flex;align-items:center;gap:9px;padding:10px 14px;border-radius:12px;background:rgba(6,21,40,.86);border:1px solid rgba(78,232,255,.35);box-shadow:0 14px 40px -12px rgba(0,0,0,.7),0 0 24px -8px rgba(78,232,255,.5);backdrop-filter:blur(10px);font-size:12.5px;font-weight:600;color:#eaf6ff;white-space:nowrap;opacity:0;transform:translateY(8px);transition:opacity .5s,transform .5s}
.hud.on{opacity:1;transform:none}
.hud .ic{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;background:rgba(78,232,255,.15);color:var(--ice);flex:none}
.hud .ic svg{width:14px;height:14px}
.hud small{display:block;font-weight:500;color:var(--dim);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase}
.hud-a{left:-8%;top:16%}.hud-b{right:-6%;top:38%}.hud-c{left:-4%;top:60%}
@media(max-width:520px){.hud{font-size:11.5px;padding:8px 11px}.hud-a{left:-12%}.hud-b{right:-12%}.hud-c{left:-10%}}

/* ---------- stats ---------- */
.stats{border-block:1px solid var(--line);background:linear-gradient(90deg,#061528,#0a2a52 50%,#061528)}
.stats .grid{display:grid;grid-template-columns:repeat(2,1fr)}
@media(min-width:720px){.stats .grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1100px){.stats .grid{grid-template-columns:repeat(6,1fr)}}
.stat{padding:26px 14px;text-align:center;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.stat b{display:block;font-family:var(--fd);font-weight:800;font-size:clamp(1.6rem,3.2vw,2.2rem);color:var(--ice);line-height:1.1}
.stat>span{font-size:13px;color:var(--muted)}

/* ---------- problem ---------- */
.problem{background:linear-gradient(180deg,var(--bg) 0%,#071225 100%)}
.pgrid{display:grid;gap:18px}
@media(min-width:860px){.pgrid{grid-template-columns:repeat(3,1fr)}}
.pcard{padding:28px;border-radius:var(--radius);border:1px solid rgba(255,120,120,.14);background:linear-gradient(180deg,rgba(60,14,24,.25),rgba(12,20,38,.5))}
.pcard .x{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(255,110,110,.12);color:#ff9a9a;margin-bottom:16px}
.pcard .x svg{width:20px;height:20px}
.pcard h3{margin-bottom:8px}
.pcard p{color:var(--muted);font-size:15px}
.vs{margin-top:22px;padding:22px 26px;border-radius:var(--radius);border:1px solid rgba(78,232,255,.25);background:linear-gradient(90deg,rgba(78,232,255,.08),rgba(26,124,255,.06));display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
.vs p{font-family:var(--fd);font-weight:700;font-size:1.15rem}

/* ---------- solution ---------- */
.split{display:grid;gap:44px;align-items:center}
@media(min-width:960px){.split{grid-template-columns:1fr 1fr;gap:64px}}
.checks{list-style:none;display:grid;gap:12px;margin:26px 0 34px}
.checks li{display:flex;gap:12px;align-items:flex-start;color:#dce8f6}
.checks li i{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:rgba(78,232,255,.14);color:var(--ice);margin-top:1px}
.checks li i svg{width:13px;height:13px}
.panel{position:relative;border-radius:24px;padding:34px;background:linear-gradient(150deg,#0b2a50 0%,#071a33 60%,#061528 100%);border:1px solid var(--line);overflow:hidden}
.panel::before{content:'';position:absolute;width:300px;height:300px;right:-100px;top:-120px;background:radial-gradient(circle,rgba(78,232,255,.35),transparent 70%)}

/* steps / how it works */
.steps{display:grid;gap:18px;counter-reset:s}
@media(min-width:900px){.steps{grid-template-columns:repeat(3,1fr)}}
.step{position:relative;padding:30px 26px 28px;border-radius:var(--radius);background:var(--card);border:1px solid var(--line);overflow:hidden}
.step .n{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;font-family:var(--fd);font-weight:800;font-size:20px;color:var(--navy);background:linear-gradient(180deg,#7ff2ff,#2bb8cc);margin-bottom:18px;box-shadow:0 0 30px -6px rgba(78,232,255,.7)}
.step h3{margin-bottom:8px}.step p{color:var(--muted);font-size:15px}
.step .bar{position:absolute;left:0;bottom:0;height:3px;width:100%;background:linear-gradient(90deg,var(--ice),var(--blue));transform-origin:left;transform:scaleX(0);transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}
.step.in .bar{transform:scaleX(1)}
.step:nth-child(2) .bar{transition-delay:.25s}.step:nth-child(3) .bar{transition-delay:.5s}
@media(min-width:900px){.steps{position:relative}}
.flow-note{margin-top:18px;color:var(--dim);font-size:14px;text-align:center}

/* ---------- feature cards (hover-lit) ---------- */
.fgrid{display:grid;gap:16px}
@media(min-width:680px){.fgrid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1040px){.fgrid{grid-template-columns:repeat(3,1fr)}}
.fcard{--mx:50%;--my:50%;position:relative;padding:28px;border-radius:var(--radius);background:rgba(10,24,46,.7);border:1px solid var(--line);overflow:hidden;transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .35s}
.fcard::before{content:'';position:absolute;inset:0;background:radial-gradient(420px circle at var(--mx) var(--my),rgba(78,232,255,.14),transparent 45%);opacity:0;transition:opacity .35s}
.fcard::after{content:'';position:absolute;inset:0;border-radius:inherit;padding:1px;background:radial-gradient(300px circle at var(--mx) var(--my),rgba(78,232,255,.7),transparent 50%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .35s}
.fcard:hover{transform:translateY(-4px);border-color:rgba(78,232,255,.25)}
.fcard:hover::before,.fcard:hover::after{opacity:1}
.fcard>*{position:relative;z-index:1}
.ficon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(180deg,rgba(78,232,255,.18),rgba(26,124,255,.12));border:1px solid rgba(78,232,255,.25);color:var(--ice);margin-bottom:18px}
.ficon svg{width:23px;height:23px}
.fcard h3{margin-bottom:8px}.fcard p{color:var(--muted);font-size:15px}
.tag{display:inline-block;margin-left:6px;font-family:var(--fb);font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ice);border:1px solid rgba(78,232,255,.35);padding:2px 7px;border-radius:999px;vertical-align:middle}

/* ---------- kiosk section ---------- */
.kiosk-sec{background:radial-gradient(80% 60% at 20% 50%,rgba(26,124,255,.14),transparent 70%),#050d1b;overflow:hidden}
.kgrid{display:grid;gap:44px;align-items:center}
@media(min-width:980px){.kgrid{grid-template-columns:.8fr 1.2fr;gap:60px}}
.specs{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-top:30px}
@media(min-width:600px){.specs{grid-template-columns:1fr 1fr}}
.spec{background:#081629;padding:22px}
.spec small{display:block;font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ice);margin-bottom:6px}
.spec b{display:block;font-family:var(--fd);font-size:1.45rem;font-weight:800;margin-bottom:4px}
.spec p{font-size:14px;color:var(--muted)}
.panels{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.chip{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#cfe6ff;padding:7px 12px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.03)}
.guard{margin-top:26px;padding:22px;border-radius:var(--radius);border:1px solid rgba(78,232,255,.22);background:linear-gradient(135deg,rgba(78,232,255,.07),rgba(26,124,255,.04))}
.guard h3{margin-bottom:6px}.guard p{color:var(--muted);font-size:15px}
.typing{font-family:var(--fd);font-weight:700;color:#fff;min-height:1.5em;margin-top:10px;font-size:1.05rem}
.typing .cur{display:inline-block;width:2px;height:1.05em;background:var(--ice);vertical-align:-2px;margin-left:3px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}

/* ---------- demo ---------- */
.vgrid{display:grid;gap:26px;max-width:880px;margin:0 auto}
@media(min-width:720px){.vgrid{grid-template-columns:1fr 1fr}}
.vcard{border-radius:22px;overflow:hidden;background:#000;border:1px solid var(--line);box-shadow:0 30px 70px -30px rgba(0,0,0,.9),0 0 0 1px rgba(78,232,255,.05)}
.vcard video{width:100%;height:auto;max-height:640px;aspect-ratio:464/832;object-fit:cover;background:#000}
.vcap{text-align:center;color:var(--muted);font-size:14.5px;margin-top:14px;font-weight:500}

/* ---------- portals ---------- */
.porgrid{display:grid;gap:16px}
@media(min-width:760px){.porgrid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1100px){.porgrid{grid-template-columns:repeat(4,1fr)}}
.pcard2 ul{list-style:none;margin-top:12px;display:grid;gap:7px}
.pcard2 li{font-size:14px;color:var(--muted);padding-left:18px;position:relative}
.pcard2 li::before{content:'';position:absolute;left:2px;top:.62em;width:6px;height:6px;border-radius:2px;background:var(--ice);opacity:.8}
.role{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);margin-bottom:6px}
.portal-cta{margin-top:30px;display:flex;flex-wrap:wrap;gap:12px;justify-content:center}

/* ---------- security ---------- */
.secgrid{display:grid;gap:16px}
@media(min-width:760px){.secgrid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1100px){.secgrid{grid-template-columns:repeat(3,1fr)}}
.shield-bg{position:absolute;right:-120px;top:40px;width:520px;opacity:.06;pointer-events:none;filter:grayscale(1)}

/* ---------- pricing ---------- */
.pricing{background:linear-gradient(135deg,#071a33 0%,#0a2540 50%,#061528 100%)}
.plans{display:grid;gap:18px;max-width:1160px;margin:0 auto;align-items:stretch}
@media(min-width:640px){.plans{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1100px){.plans{grid-template-columns:repeat(4,1fr)}}
.plan{display:flex;flex-direction:column;border-radius:var(--radius);overflow:hidden;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.12);transition:transform .3s,border-color .3s}
.plan:hover{transform:translateY(-4px);border-color:rgba(212,175,106,.45)}
.plan.feat{background:rgba(212,175,106,.08);border:2px solid var(--gold);box-shadow:0 24px 60px -20px rgba(212,175,106,.35)}
.plan .ribbon{text-align:center;padding:7px;font-size:11px;font-weight:800;letter-spacing:.24em;text-transform:uppercase;background:linear-gradient(90deg,var(--gold2),var(--gold));color:var(--navy)}
.plan .top{padding:24px 24px 18px;border-bottom:1px solid rgba(255,255,255,.1)}
.plan h3{font-size:1.2rem;margin-bottom:4px}
.plan .for{font-size:14px;color:#a9b9cc;margin-bottom:14px;min-height:2.6em}
.price{font-family:var(--fd);font-weight:800;font-size:2.3rem;color:var(--gold);line-height:1}
.price span{font-family:var(--fb);font-size:15px;font-weight:400;color:#a9b9cc}
.plan .body{padding:18px 24px 24px;display:flex;flex-direction:column;flex:1}
.plan ul{list-style:none;display:grid;gap:10px;font-size:14.5px;color:#e2ebf5;flex:1}
.plan li.no{color:#8a9bb0}
.plan .note{font-size:13px;color:#a2b2c5;margin-top:18px;padding-top:14px;border-top:1px dashed rgba(255,255,255,.18)}
.price-foot{text-align:center;margin-top:40px}
.price-foot p{color:#a9b9cc;font-size:14.5px;margin-bottom:18px}

/* ---------- why ---------- */
.why{background:radial-gradient(70% 70% at 50% 0%,rgba(78,232,255,.12),transparent 70%),var(--bg)}
.wgrid{display:grid;gap:18px}
@media(min-width:820px){.wgrid{grid-template-columns:repeat(3,1fr)}}
.wcard{padding:30px;border-radius:var(--radius);border:1px solid var(--line);background:var(--card)}
.big{font-family:var(--fd);font-weight:900;font-size:4rem;line-height:1;background:linear-gradient(180deg,#fff 0%,#9fd0ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:12px}
.wcard small{display:block;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ice);margin-bottom:8px}
.wcard p{color:var(--muted);font-size:15px}

/* ---------- contact ---------- */
.cta-box{position:relative;overflow:hidden;border-radius:28px;padding:56px 28px;text-align:center;background:linear-gradient(135deg,#0a2540 0%,#073d8c 50%,#0a2540 100%);border:1px solid rgba(78,232,255,.2)}
@media(min-width:760px){.cta-box{padding:72px 56px}}
.cta-box .orb{opacity:.45}
.cta-box>*:not(.orb){position:relative;z-index:1}
.cta-box .lead{color:#d2e2f3;margin:0 auto 32px}
.cta-box .ctas{justify-content:center}
.contact-grid{display:grid;gap:18px;margin:40px auto 0;padding-top:32px;border-top:1px solid rgba(255,255,255,.15);max-width:760px}
@media(min-width:640px){.contact-grid{grid-template-columns:repeat(4,1fr)}}
.contact-grid small{display:block;font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ice);margin-bottom:4px}
.contact-grid a:hover{color:var(--ice)}

/* ---------- footer ---------- */
footer{background:#02060d;border-top:1px solid var(--line);padding:48px 0 90px;color:#9fb1c7;font-size:13px}
footer .wrap{display:grid;gap:26px;align-items:center;text-align:center}
@media(min-width:860px){footer .wrap{grid-template-columns:1fr auto 1fr;text-align:left}footer .copy{text-align:right}}
footer .brand{justify-content:center}
@media(min-width:860px){footer .brand{justify-content:flex-start}}
.fnav{display:flex;flex-wrap:wrap;gap:8px 22px;justify-content:center;text-transform:uppercase;letter-spacing:.12em;font-size:12px}
.fnav a:hover{color:var(--ice)}

/* floating phone */
.fab{position:fixed;right:16px;bottom:16px;z-index:95;display:inline-flex;align-items:center;gap:10px;padding:14px;border-radius:999px;background:linear-gradient(180deg,var(--blue),var(--blue2));color:#fff;font-weight:700;font-size:14px;box-shadow:0 14px 34px -10px rgba(26,124,255,.75);transition:opacity .3s,transform .3s}
.fab svg{width:20px;height:20px}
.fab::before{content:'';position:absolute;inset:-4px;border-radius:999px;background:rgba(26,124,255,.4);z-index:-1;animation:ring 2s infinite}
@keyframes ring{0%,100%{transform:scale(1);opacity:.6}50%{transform:scale(1.15);opacity:0}}
.fab.hide{opacity:0;pointer-events:none;transform:scale(.6)}
.fab .t{display:none}
@media(min-width:640px){.fab{right:24px;bottom:24px;padding:15px 20px}.fab .t{display:inline}}

/* reveal */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.reveal.in{opacity:1;transform:none}
.d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}.d4{transition-delay:.32s}.d5{transition-delay:.4s}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}.hud{opacity:1;transform:none}
}

.cta-short{display:none}
@media(max-width:520px){.cta-long{display:none}.cta-short{display:inline}.tagline{font-size:8.5px;letter-spacing:.16em}.nav .wrap{height:64px}.brand img{width:32px}}
@media(max-width:360px){.nav .tagline{display:none}}