/* Authify Combat ID — static site. Mobile first.
   Dark olive palette: near-black field green base, drab olive surfaces, a muted signal-green accent,
   amber for "expiring", red for "unknown". Mono labels echo equipment markings. */
@font-face{font-family:"Poppins";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/poppins-400.woff) format("woff")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/poppins-500.woff) format("woff")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:600 700;font-display:swap;src:url(../fonts/poppins-700.woff) format("woff")}

:root{
  /* --- palette: black-olive field base, olive drab, coyote-tan accent (no lime) --- */
  --bg:#0b0c0a;       /* page base */
  --bg-2:#10110e;     /* alternating band */
  --olive-1:#17190f;  /* cards */
  --olive-2:#1f2218;  /* raised cards */
  --olive-3:#2e3326;  /* borders, grid */
  --drab:#4b5320;     /* olive drab (OD) */
  --text:#e6e3d8;     /* off-white, warm */
  --muted:#a6a293;    /* secondary text */
  --muted-2:#817d70;  /* captions */
  --accent:#c8b27d;   /* coyote tan: buttons, highlights */
  --accent-2:#a8905a; /* darker tan: progress, dots */
  --ok:#9caf6e;       /* status: ready (muted field green, status only) */
  --amber:#d9a441;    /* status: expiring */
  --red:#d0573e;      /* status: unknown / fake */
  --line:rgba(200,178,125,.12);
  --line-2:rgba(230,227,216,.14);
  --glass:linear-gradient(160deg,rgba(230,227,216,.09),rgba(230,227,216,.025));
  --glass-bd:rgba(230,227,216,.15);

  --r:14px;--ease:cubic-bezier(.2,.8,.2,1);--spring:cubic-bezier(.34,1.56,.64,1);
  --sans:"Poppins",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --display:"Saira Condensed","Arial Narrow","Roboto Condensed","DejaVu Sans Condensed",var(--sans);
  --stencil:"Saira Stencil One","Saira Condensed","Arial Narrow",var(--sans);
  --serif:var(--sans);
  --mono:ui-monospace,"SF Mono","Cascadia Mono","Roboto Mono",Menlo,Consolas,monospace;
  --nav-h:64px;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 12px);-webkit-text-size-adjust:100%;overflow-x:clip}
body{margin:0;background:var(--bg);color:var(--text);font:400 16px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:clip}
img,video,svg{max-width:100%;display:block}
a{color:inherit}
p{margin:0}
h1,h2,h3{font-weight:600;letter-spacing:-.01em;line-height:1.05;margin:0;text-wrap:balance}
h1,h2{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.005em;line-height:.98}
h2{font-size:clamp(2.3rem,9vw,4rem)}
h3{font-size:1.1rem;letter-spacing:-.015em;line-height:1.25;font-weight:500}
em{font-style:normal;color:var(--accent)}
ul,ol{margin:0;padding:0;list-style:none}
fieldset{margin:0;padding:0;border:0;min-width:0}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:8px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--accent);color:var(--bg);padding:10px 16px;border-radius:8px;font-weight:600;text-decoration:none}
.skip:focus{top:12px}
.wrap{width:100%;max-width:1180px;margin:0 auto;padding-inline:16px}
section{padding-block:64px;position:relative}
.band{background:var(--bg-2);border-block:1px solid var(--line)}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font:500 .7rem/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}
.eyebrow::before{content:"";width:8px;height:8px;background:var(--accent);box-shadow:0 0 12px rgba(200,178,125,.7)}
.sec-head{display:grid;gap:14px;margin-bottom:28px;max-width:760px}
.lead{font-size:1.04rem;line-height:1.6;color:var(--muted);max-width:58ch}

/* buttons: squarer, more "equipment" than the civil site */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 22px;border-radius:12px;border:0;cursor:pointer;font:600 .98rem/1 var(--sans);letter-spacing:.01em;text-decoration:none;white-space:nowrap;transition:transform .45s var(--spring),box-shadow .3s,background .2s;-webkit-tap-highlight-color:transparent}
.btn:active{transform:scale(.96);transition-duration:.08s}
.btn svg{width:18px;height:18px;flex:none;transition:transform .35s var(--spring)}
.btn:hover svg{transform:translateX(3px)}
.btn-accent{background:var(--accent);color:#15120b;overflow:hidden;box-shadow:0 16px 36px -16px rgba(200,178,125,.6),inset 0 1px 0 rgba(255,255,255,.45)}
.btn-accent::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%);pointer-events:none}
@media (hover:hover){.btn-accent:hover::after{transform:translateX(120%);transition:transform .9s var(--ease)}}
.btn-ghost{background:rgba(230,227,216,.06);color:var(--text);border:1px solid var(--line-2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.btn-ghost:hover{background:rgba(230,227,216,.1)}

/* logo: the Authify mark + wordmark + product tag */
.logo{display:inline-flex;align-items:center;gap:11px;color:var(--text);text-decoration:none}
.logo svg{width:32px;height:auto}
.logo span{font-weight:600;font-size:.92rem;letter-spacing:.34em;margin-right:-.34em}
.logo small{font:400 .72rem/1 var(--stencil);letter-spacing:.16em;padding:5px 7px;border:1px solid rgba(200,178,125,.45);color:var(--accent);border-radius:4px;margin-left:8px}

/* nav */
.progress{position:fixed;left:0;right:0;top:0;height:2px;z-index:70;background:var(--accent);transform-origin:left;transform:scaleX(0);box-shadow:0 0 10px rgba(200,178,125,.7);pointer-events:none}
.nav{position:fixed;inset:0 0 auto;z-index:60;padding-top:env(safe-area-inset-top,0px);transition:background .35s,box-shadow .35s}
.nav.scrolled,.menu-open .nav,.legal-page .nav{background:rgba(11,12,10,.74);backdrop-filter:saturate(150%) blur(18px);-webkit-backdrop-filter:saturate(150%) blur(18px);box-shadow:0 1px 0 var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;height:var(--nav-h)}
.nav-links,.nav-cta{display:none}
.nav-right{display:flex;align-items:center;gap:8px}
.lang{display:inline-flex;padding:3px;border-radius:10px;background:rgba(230,227,216,.05);border:1px solid var(--line-2)}
.lang a{display:grid;place-items:center;min-width:38px;min-height:34px;border-radius:8px;font:600 .74rem/1 var(--mono);letter-spacing:.08em;color:var(--muted);text-decoration:none}
.lang a[aria-current="true"]{background:var(--accent);color:#15120b}
.menu-btn{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;border:1px solid var(--line-2);background:rgba(230,227,216,.05);color:var(--text);cursor:pointer;padding:0}
.menu-btn span{display:block;width:18px;height:2px;margin:2.5px 0;background:currentColor;transition:transform .4s var(--spring),opacity .2s}
.menu-open .menu-btn span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-open .menu-btn span:nth-child(2){opacity:0}
.menu-open .menu-btn span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mnav{position:fixed;inset:0;z-index:55;display:flex;flex-direction:column;justify-content:center;padding:calc(var(--nav-h) + 24px) 24px calc(32px + env(safe-area-inset-bottom,0px));background:rgba(11,12,10,.95);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility .35s}
.menu-open .mnav{opacity:1;visibility:visible}
.menu-open{overflow:hidden}
.mnav a:not(.btn){display:block;padding:14px 0;border-bottom:1px solid var(--line);font-size:1.8rem;font-weight:600;letter-spacing:-.03em;text-decoration:none;transform:translateY(18px);opacity:0;transition:transform .6s var(--ease),opacity .6s var(--ease)}
.menu-open .mnav a{transform:none;opacity:1}
.mnav .btn{margin-top:28px}

/* hero */
.hero{padding:calc(var(--nav-h) + 28px) 0 56px;overflow:hidden;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(800px 520px at 80% 0%,rgba(75,83,32,.45),transparent 65%),radial-gradient(600px 500px at 0% 100%,rgba(28,31,22,.9),transparent 70%)}
.grid-bg{position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:44px 44px;-webkit-mask:radial-gradient(70% 60% at 60% 30%,#000,transparent);mask:radial-gradient(70% 60% at 60% 30%,#000,transparent);transform:translate3d(0,calc(var(--hp,0) * 60px),0)}
.hero-grid{display:grid;gap:44px;align-items:center;grid-template-columns:minmax(0,1fr)}
.hero-copy{display:grid;gap:20px;justify-items:start;min-width:0;transform:translate3d(0,calc(var(--hp,0) * -50px),0);opacity:calc(1 - var(--hp,0) * .8)}
.hero-copy>*{max-width:100%}
.hero h1{font-size:clamp(2.9rem,12.5vw,6rem);line-height:.94;letter-spacing:0}
.hero h1 em{display:block}
.hero-cta{display:flex;flex-wrap:wrap;gap:10px;width:100%}
.hero-cta .btn{flex:1 1 100%}
.hero-demo{transform:translate3d(0,calc(var(--hp,0) * 40px),0);min-width:0}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips span{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:8px;background:var(--glass);border:1px solid var(--glass-bd);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);font:500 .74rem/1.2 var(--mono);letter-spacing:.04em;color:var(--text)}
.chips span::before{content:"";width:6px;height:6px;background:var(--accent)}
.w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.wi{display:inline-block;transform:translate3d(0,105%,0);transition:transform .9s var(--ease);transition-delay:calc(var(--i)*55ms + 80ms)}
.words-in .wi{transform:none}
.fade-up{animation:fadeUp 1s .35s var(--ease) both}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* generic cards */
.ico{display:grid;place-items:center;width:44px;height:44px;border-radius:10px;background:rgba(200,178,125,.1);border:1px solid rgba(200,178,125,.25);color:var(--accent)}
.ico svg{width:22px}
.three{display:grid;gap:10px}
.card{position:relative;display:grid;gap:10px;align-content:start;padding:22px;border-radius:var(--r);background:linear-gradient(160deg,var(--olive-2),var(--olive-1));border:1px solid var(--line);isolation:isolate}
.card h3{margin-top:6px}
.card p{color:var(--muted);font-size:.95rem}

/* how it works: pinned stage */
.scrolly{overflow:clip}
.scrolly::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(700px 480px at 80% 40%,rgba(75,83,32,.35),transparent 65%)}
.scrolly>*{position:relative}
.how{display:grid;gap:28px;align-items:center}
.steps{position:relative;display:grid;gap:8px}
.steps::before,.steps .prog{content:"";position:absolute;left:27px;top:28px;bottom:28px;width:2px;background:var(--line-2)}
.steps .prog{background:var(--accent);transform-origin:top;transform:scaleY(var(--sp,1));box-shadow:0 0 10px rgba(200,178,125,.6)}
.step{position:relative;display:grid;grid-template-columns:56px 1fr;gap:14px;align-items:start;padding:16px 16px 16px 0;transition:opacity .5s var(--ease),transform .5s var(--ease)}
.step .n{position:relative;z-index:1;width:40px;height:40px;margin:2px 0 0 8px;border-radius:6px;display:grid;place-items:center;font:400 1.05rem/1 var(--stencil);background:var(--accent);color:#15120b;box-shadow:0 0 0 6px var(--bg);transition:background .4s,color .4s,transform .5s var(--spring)}
.step h3{font-size:1.15rem}
.step h3 small{display:block;font:500 .66rem/1.2 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:4px}
.step p{color:var(--muted);font-size:.95rem;margin-top:4px}
.stage{margin:0;display:grid;gap:10px;min-width:0}
.asset{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:12px;padding:12px;border-radius:22px;background:var(--glass);border:1px solid var(--glass-bd);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);box-shadow:inset 0 1px 0 rgba(230,227,216,.2),0 40px 80px -40px rgba(0,0,0,.8);transition:border-color .5s,box-shadow .5s}
.art{position:relative;aspect-ratio:16/10;border-radius:14px;overflow:hidden;background:#1a2014}
.art .helmet{width:100%;height:100%;object-fit:cover}
.art .helmet rect:first-child{fill:#161b12}
.tag{position:absolute;left:12px;top:12px;display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:8px;background:rgba(11,12,10,.75);border:1px solid rgba(200,178,125,.55);color:var(--accent);font:600 .66rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.tag svg{width:14px}
.beam{position:absolute;left:0;right:0;top:0;height:30%;pointer-events:none;opacity:0;background:linear-gradient(180deg,transparent,rgba(200,178,125,.3) 70%,rgba(200,178,125,.95) 98%,transparent)}
.reticle{position:absolute;inset:14% 22%;border:1px dashed rgba(200,178,125,.0);border-radius:12px;pointer-events:none}
.a-info{display:grid;gap:10px}
.a-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.a-top b{font-weight:600}
.a-top code{font:500 .78rem/1 var(--mono);color:var(--muted)}
.a-rows2{margin:0;display:grid;gap:6px;font-size:.86rem}
.a-rows2 div{display:flex;justify-content:space-between;gap:10px;padding-bottom:6px;border-bottom:1px dashed var(--line-2);transition:opacity .4s,transform .4s var(--ease)}
.a-rows2 dt{color:var(--muted)}.a-rows2 dd{margin:0;font-family:var(--mono);font-size:.82rem}
.a-foot{display:flex;justify-content:space-between;align-items:center;gap:10px}
.a-foot .off,.a-foot .stat{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:8px;font:600 .74rem/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;transition:opacity .45s var(--ease),transform .55s var(--spring)}
.a-foot svg{width:15px}
.a-foot .off{border:1px solid var(--line-2);color:var(--muted)}
.a-foot .stat{background:var(--ok);color:#12140b}
.stage figcaption{font:500 .72rem/1.4 var(--mono);color:var(--muted-2);letter-spacing:.04em}
/* scroll-driven mode */
.scrolly.on .scrolly-track{height:280vh}
@media (min-width:980px){.scrolly.on .scrolly-track{height:230vh}}
.scrolly.on .scrolly-pin{position:sticky;top:var(--nav-h);height:calc(100svh - var(--nav-h));display:flex;align-items:center}
.scrolly.on .asset{transform:translate3d(0,calc((1 - var(--s1,0)) * 60px),0) scale(calc(.92 + var(--s1,0) * .08));opacity:calc(.25 + var(--s1,0) * .75)}
.scrolly.on .tag{transform:translate3d(calc((1 - var(--s1t,0)) * -40px),0,0) scale(calc(.6 + var(--s1t,0) * .4));opacity:var(--s1t,0)}
.scrolly.on .reticle{border-color:rgba(200,178,125,calc(var(--s3,0) * .8));inset:calc(14% + (1 - var(--s3,0)) * 10%) calc(22% + (1 - var(--s3,0)) * 10%)}
.scrolly.on .a-rows2 div{opacity:0;transform:translateX(-10px)}
.scrolly.on .a-rows2 div.in{opacity:1;transform:none}
.scrolly.on .beam{opacity:var(--bo,0);transform:translate3d(0,calc(var(--s3b,0) * 340% - 100%),0)}
.scrolly.on .a-foot .off,.scrolly.on .a-foot .stat{opacity:0;transform:scale(.7)}
.scrolly.on.s3 .a-foot .off{opacity:1;transform:none}
.scrolly.on.done .a-foot .stat{opacity:1;transform:none}
.scrolly.on.done .asset{border-color:rgba(156,175,110,.7);box-shadow:inset 0 1px 0 rgba(230,227,216,.2),0 0 0 1px rgba(200,178,125,.35),0 40px 90px -30px rgba(200,178,125,.35)}
.scrolly.on .step{opacity:.35}
.scrolly.on .step.cur{opacity:1}
.scrolly.on .step .n{background:var(--olive-2);color:var(--muted);box-shadow:0 0 0 6px var(--bg),inset 0 0 0 1px var(--line-2)}
.scrolly.on .step.on .n{background:var(--accent);color:#15120b}
.scrolly.on .step.cur .n{transform:scale(1.1);box-shadow:0 0 0 6px var(--bg),0 0 22px rgba(200,178,125,.55)}

/* use cases */
.uses{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.use{position:relative;display:flex;flex-direction:column;gap:10px;padding:18px 16px;border-radius:18px;background:var(--olive-1);border:1px solid var(--line);isolation:isolate;min-width:0}
.use .ico{width:40px;height:40px}
.use h3{font-size:1rem}
.use p{font-size:.86rem;color:var(--muted);line-height:1.5}
.st{align-self:flex-start;margin-top:auto;display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:6px;font:600 .64rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.st::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.st.ok{color:var(--ok);background:rgba(156,175,110,.12)}
.st.warn{color:var(--amber);background:rgba(217,164,65,.12)}
.st.bad{color:var(--red);background:rgba(208,87,62,.12)}

/* security */
.secu{overflow:hidden;isolation:isolate;background:linear-gradient(180deg,var(--bg),#11170e 50%,var(--bg))}
.radar{position:absolute;right:-180px;top:50%;width:560px;height:560px;margin-top:-280px;z-index:-1;border-radius:50%;pointer-events:none;
  background:repeating-radial-gradient(circle,transparent 0 69px,rgba(200,178,125,.12) 69px 70px),conic-gradient(from calc(var(--rd,0) * 1turn),rgba(200,178,125,.22),transparent 18%);
  -webkit-mask:radial-gradient(circle,#000 60%,transparent 71%);mask:radial-gradient(circle,#000 60%,transparent 71%)}
.sec-list{display:grid;gap:10px}
.sec-list li{display:grid;grid-template-columns:44px 1fr;gap:14px;padding:18px;border-radius:18px;background:var(--glass);border:1px solid var(--glass-bd);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.sec-list p{color:var(--muted);font-size:.92rem;margin-top:3px}

/* faq */
.faq{display:grid;gap:10px}
.faq details{border-radius:14px;background:var(--olive-1);border:1px solid var(--line);padding:0 18px}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:58px;padding:14px 0;font-weight:500}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:rgba(230,227,216,.08);transition:transform .45s var(--spring),background .2s,color .2s}
.faq details[open] summary::after{transform:rotate(45deg);background:var(--accent);color:#15120b}
.faq .a{padding:0 0 18px;color:var(--muted)}

/* pilot + form */
.cta{overflow:hidden;isolation:isolate}
.cta::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(700px 480px at 90% 0%,rgba(75,83,32,.45),transparent 60%),radial-gradient(600px 500px at 0% 100%,rgba(28,31,22,.9),transparent 60%)}
.cta-grid{display:grid;gap:30px;align-items:start}
.pilot{display:grid;gap:8px;margin-top:10px;counter-reset:p}
.pilot li{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:12px;border:1px dashed var(--line-2);color:var(--text);font-size:.95rem}
.pilot span{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:6px;background:rgba(200,178,125,.12);color:var(--accent);font:400 1rem/1 var(--stencil)}
.glass{background:var(--glass);border:1px solid var(--glass-bd);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);box-shadow:inset 0 1px 0 rgba(230,227,216,.2),0 40px 80px -40px rgba(0,0,0,.8)}
.form{display:grid;gap:14px;padding:20px;border-radius:var(--r)}
.fields{display:grid;gap:14px}
.f{display:grid;gap:6px}
.f label,.f legend{font-size:.82rem;color:var(--muted);font-weight:500;padding:0}
.f input,.f textarea{width:100%;font:400 16px var(--sans);color:var(--text);background:rgba(0,0,0,.3);border:1px solid var(--line-2);border-radius:10px;padding:13px 14px;outline:none;transition:border-color .2s,box-shadow .2s}
.f textarea{min-height:90px;resize:vertical}
.f input:focus,.f textarea:focus{border-color:var(--accent);box-shadow:0 0 0 4px rgba(200,178,125,.18)}
.two{display:grid;gap:14px}
.pick{display:flex;flex-wrap:wrap;gap:6px}
.pick label{position:relative;display:inline-flex;align-items:center;min-height:40px;padding:0 12px;border-radius:8px;border:1px solid var(--line-2);font-size:.85rem;color:var(--text);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.pick input{position:absolute;opacity:0;pointer-events:none}
.pick label:has(input:checked){background:var(--accent);border-color:var(--accent);color:#15120b}
.pick label:has(input:focus-visible){outline:3px solid var(--accent);outline-offset:2px}
.form .btn{width:100%}
.form-note{font-size:.76rem;color:var(--muted-2)}
.form-note a{color:var(--muted)}
.form-msg{display:none;padding:16px;border-radius:12px}
.form.sent .form-msg.ok,.form.prepared .form-msg.ok{display:block;background:rgba(200,178,125,.12);border:1px solid rgba(200,178,125,.4)}
.form.err .form-msg.bad{display:block;background:rgba(208,87,62,.12);border:1px solid rgba(208,87,62,.4)}
.form.sent .fields{display:none}
.hp{position:absolute;left:-9999px}

/* footer */
footer{background:#070906;border-top:1px solid var(--line);color:var(--muted-2);padding:40px 0 calc(110px + env(safe-area-inset-bottom,0px));font-size:.84rem}
footer .wrap{display:grid;gap:22px}
footer .def{max-width:52ch;margin-top:14px;color:var(--muted)}
footer .f-col{display:grid;gap:14px}
footer nav{display:flex;flex-wrap:wrap;gap:8px 18px}
footer nav a{color:var(--muted);text-decoration:none}
footer nav a:hover{color:var(--text)}
footer address{font-style:normal;line-height:1.7}

/* sticky mobile CTA */
.mcta{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:50;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 8px 8px 16px;border-radius:16px;background:rgba(16,17,14,.86);backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%);border:1px solid var(--line-2);box-shadow:0 20px 40px -12px rgba(0,0,0,.6);transform:translateY(150%);transition:transform .55s var(--spring)}
.mcta.show{transform:none}
.mcta b{display:block;font-size:.9rem;font-weight:600;color:var(--accent)}
.mcta small{display:block;font-size:.72rem;color:var(--muted)}
.mcta .btn{min-height:46px;padding:0 16px;font-size:.9rem}

/* legal */
.legal{padding:calc(var(--nav-h) + 48px) 0 80px}
.legal .wrap{max-width:780px}
.legal h1{font-size:clamp(2rem,7vw,3rem);margin-bottom:24px}
.legal h2{font-size:1.25rem;margin:30px 0 10px}
.legal p,.legal li{color:var(--muted);margin-bottom:10px}
.legal ul{padding-left:20px;list-style:disc}
.legal a{color:var(--accent)}

/* motion: varied entrances */
.m{transition:opacity .9s var(--ease),transform 1.05s var(--ease),filter .9s var(--ease),clip-path 1.1s var(--ease)!important;transition-delay:var(--d,0ms)!important}
.m-pre{opacity:0}
.m-pre[data-m="up"]{transform:translate3d(0,40px,0);filter:blur(8px)}
.m-pre[data-m="left"]{transform:translate3d(-50px,20px,0)}
.m-pre[data-m="right"]{transform:translate3d(50px,20px,0)}
@media(max-width:979px){.m-pre[data-m="left"],.m-pre[data-m="right"]{transform:translate3d(0,24px,0);filter:blur(8px)}}
.m-pre[data-m="tilt"]{transform:perspective(900px) rotateX(22deg) translate3d(0,46px,0) scale(.95);transform-origin:50% 100%}
.m-pre[data-m="mask"]{opacity:1;clip-path:inset(0 0 100% 0);transform:translate3d(0,22px,0)}
.m-pre[data-m="wipe"]{opacity:1;clip-path:inset(0 100% 0 0 round 14px)}
.m-pre[data-m="glass"]{transform:scale(.95);filter:blur(14px)}
.glow::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;z-index:3;background:radial-gradient(260px circle at var(--gx,50%) var(--gy,0%),rgba(200,178,125,.9),rgba(168,144,90,.2) 40%,transparent 70%);-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 .45s var(--ease)}
@media (hover:hover) and (pointer:fine){.glow{transition:transform .55s var(--spring),box-shadow .5s}.glow:hover{transform:translateY(-3px);box-shadow:0 30px 60px -30px rgba(200,178,125,.28)}.glow:hover::after{opacity:1}}

/* breakpoints */
@media (max-width:979px){
  .scrolly.on .how{gap:14px;align-content:center}
  .scrolly.on .stage{order:-1}
  .scrolly.on .steps::before,.scrolly.on .steps .prog{display:none}
  .scrolly.on .step{grid-area:1/1;opacity:0;transform:translate3d(0,14px,0);pointer-events:none;padding:12px 14px 12px 0;border-radius:16px;background:var(--glass);border:1px solid var(--glass-bd);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
  .scrolly.on .step.cur{opacity:1;transform:none;pointer-events:auto}
  .scrolly.on .stage figcaption{display:none}
}
@media (min-width:480px){.hero-cta .btn{flex:0 0 auto}.two{grid-template-columns:1fr 1fr}}
@media (min-width:768px){
  :root{--nav-h:72px}
  .wrap{padding-inline:32px}
  section{padding-block:100px}
  .three{grid-template-columns:repeat(3,1fr);gap:14px}
  .card{padding:28px}
  .uses{grid-template-columns:repeat(4,1fr);gap:12px}
  .use{padding:22px}
  .sec-list{grid-template-columns:1fr 1fr;gap:12px}
  .faq{grid-template-columns:1fr 1fr;align-items:start}
  .form{padding:28px}
  .asset{grid-template-columns:1.1fr 1fr;align-items:center;padding:14px}
  .art{aspect-ratio:1}
}
@media (min-width:980px){
  .nav-links{display:flex;gap:2px}
  .nav-links a{padding:9px 14px;border-radius:10px;color:var(--muted);text-decoration:none;font-size:.9rem}
  .nav-links a:hover{background:rgba(230,227,216,.06);color:var(--text)}
  .nav-cta{display:inline-flex;min-height:44px;padding:0 16px;font-size:.88rem}
  .menu-btn,.mnav,.mcta{display:none}
  footer{padding-bottom:40px}
  footer .wrap{grid-template-columns:1.2fr 1fr}
  .hero{padding:calc(var(--nav-h) + 56px) 0 96px;min-height:min(880px,100svh);display:flex;align-items:center}
  .hero-grid{grid-template-columns:1.2fr .8fr;gap:48px}
  .phone{--w:320px}
  .how{grid-template-columns:.8fr 1.2fr;gap:56px}
  .cta-grid{grid-template-columns:1fr 1fr;gap:60px}
}
@media (prefers-reduced-motion:reduce){
  html:not(.motion-on){scroll-behavior:auto}
  html:not(.motion-on) *,html:not(.motion-on) *::before,html:not(.motion-on) *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;transition-delay:0ms!important}
  html:not(.motion-on) .wi{transform:none}
  html:not(.motion-on) .m-pre{opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important}
  html:not(.motion-on) .hero-copy,html:not(.motion-on) .hero-demo,html:not(.motion-on) .grid-bg{transform:none!important;opacity:1!important}
  html:not(.motion-on) .progress{display:none}
}
@media (prefers-reduced-transparency:reduce){.glass,.asset,.chips span,.sec-list li{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:var(--olive-2)}}

/* ---------- phone demo: faithful copy of check.authify.ai (positions measured from app screenshots, in % of screen width) ---------- */
.demo{display:grid;justify-items:center;gap:14px;margin:0;min-width:0;
  --a-lime:var(--accent);--a-red:#ef8172;--a-text:#ebe8de;--a-grey:#b0ab9c;--a-ink:#10180f}
.phone{--w:min(300px,80vw);width:var(--w);aspect-ratio:1/1.758;border-radius:calc(var(--w)*.15);padding:calc(var(--w)*.03);background:linear-gradient(160deg,#3a403c,#0c0f0d 38%,#232926);box-shadow:0 0 0 1px rgba(255,255,255,.12),0 50px 90px -40px rgba(0,0,0,.9),0 30px 80px -30px rgba(168,144,90,.35);position:relative;transition:box-shadow .8s var(--ease)}
.phone[data-state="bad"]{box-shadow:0 0 0 1px rgba(255,255,255,.12),0 50px 90px -40px rgba(0,0,0,.9),0 30px 80px -30px rgba(208,87,62,.5)}
.screen{position:relative;height:100%;border-radius:calc(var(--w)*.125);overflow:hidden;container-type:inline-size;color:var(--a-text);isolation:isolate;font-family:var(--sans);background:#131c16}
.app-bg,.app-bg i{position:absolute;inset:0;z-index:-1}
.app-bg i{transition:opacity .8s var(--ease)}
.g-scan{background:radial-gradient(90% 40% at 50% 100%,rgba(200,178,125,.08),transparent 70%),linear-gradient(180deg,#0f100c 0%,#18190f 45%,#22231a 100%)}
.g-ok{opacity:0;background:radial-gradient(130% 75% at 50% 105%,#46512f 0%,#262b1b 45%,#0e0f0b 100%)}
.g-warn{opacity:0;background:radial-gradient(130% 75% at 50% 105%,#6a5424 0%,#3a3018 45%,#12100a 100%)}
.g-bad{opacity:0;background:radial-gradient(130% 75% at 50% 105%,#62322b 0%,#3b211c 45%,#171210 100%)}
.phone[data-state="ok"] .g-ok,.phone[data-state="warn"] .g-warn,.phone[data-state="bad"] .g-bad{opacity:1}
/* header */
.s-top{position:absolute;left:0;right:0;top:0;height:10cqw;transition:opacity .4s var(--ease)}
.app-logo{position:absolute;left:0;right:0;top:1.9cqw;margin:auto;width:max-content;display:flex;align-items:center;gap:3.2cqw}
.app-logo svg{width:8.3cqw;color:var(--a-text)}
.app-logo b{font-weight:600;font-size:4.3cqw;letter-spacing:.42em;margin-right:-.42em}
.s-lang{position:absolute;right:3.2cqw;top:1.4cqw;display:flex;align-items:center;gap:1cqw;height:8.6cqw;padding:0 1cqw;border-radius:99px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.18);font-size:2.5cqw}
.s-lang b,.s-lang i{display:grid;place-items:center;width:7.8cqw;height:6.8cqw;border-radius:99px;font-style:normal;font-weight:500;color:var(--a-text)}
.s-lang b{background:var(--a-text);color:#111}
/* views */
.s-view{position:absolute;inset:0;transition:opacity .45s var(--ease),transform .6s var(--ease)}
.s-view[aria-hidden="true"]{opacity:0;transform:translateY(3cqw) scale(.985);pointer-events:none}
.s-view>*{position:absolute;left:0;right:0;margin-inline:auto;text-align:center}
.a-status{display:flex;align-items:center;justify-content:center;gap:2.4cqw;font-size:2.85cqw;line-height:1;letter-spacing:.22em;text-transform:uppercase;font-weight:500;color:var(--a-lime);white-space:nowrap}
.a-status::before{content:"";width:2.1cqw;height:2.1cqw;border-radius:50%;background:currentColor;box-shadow:0 0 0 1.8cqw rgba(200,178,125,.1)}
.a-title{font-size:10.3cqw;line-height:1.1;font-weight:600;letter-spacing:-.035em;color:var(--a-text)}
.a-sub{width:66cqw;font-size:3.4cqw;line-height:1.5;color:#cfcabc}
.a-btn{left:4.2cqw!important;right:4.2cqw!important;height:11.4cqw;border-radius:99px;display:flex;align-items:center;justify-content:center;gap:3cqw;font-size:3.8cqw;font-weight:500}
.a-btn svg{width:4.4cqw;height:4.4cqw}
.a-btn.lime{background:var(--a-lime);color:var(--a-ink);box-shadow:0 6cqw 14cqw -5cqw rgba(200,178,125,.7)}
.a-btn.ghost{background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.2);color:var(--a-text)}
.a-btn .plus{display:grid;place-items:center;width:6.6cqw;height:6.6cqw;border-radius:50%;background:rgba(255,255,255,.14);font-size:4.4cqw;line-height:1}
.nfc-s svg{width:3.4cqw}
/* scan */
.ring{top:35.5cqw;width:30cqw;height:30cqw;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 50% 35%,#35352a,#1d1e17 75%);box-shadow:inset 0 0 0 1px rgba(200,178,125,.32),0 0 8cqw rgba(0,0,0,.35)}
.ring-in{display:grid;place-items:center}
.ring-in svg{width:12cqw;height:12cqw;color:#b9a574;transform-origin:center}
.phone[data-state="scan"] .ring-in svg{color:var(--a-lime);animation:nfcPulse 1.7s ease-in-out infinite}
.phone[data-state="scan"] .ring-in path{animation:wave 1.6s infinite}
.phone[data-state="scan"] .ring-in path:nth-child(2){animation-delay:.2s}.phone[data-state="scan"] .ring-in path:nth-child(3){animation-delay:.4s}
@keyframes nfcPulse{0%,100%{transform:scale(.96);filter:drop-shadow(0 0 .4cqw rgba(200,178,125,.15))}50%{transform:scale(1.06);filter:drop-shadow(0 0 1.6cqw rgba(200,178,125,.6))}}
@keyframes wave{0%,100%{opacity:.45}50%{opacity:1}}
@keyframes spin{to{transform:rotate(360deg)}}
.v-scan .a-status{top:72cqw}
.v-scan .a-title{top:76.3cqw}
.a-title .dots{display:inline-flex;gap:.8cqw;margin-left:.6cqw}
.a-title .dots i{width:1.9cqw;height:1.9cqw;border-radius:50%;background:#8f8b7e;animation:dot 1.2s infinite}
.a-title .dots i:nth-child(2){animation-delay:.2s}.a-title .dots i:nth-child(3){animation-delay:.4s}
@keyframes dot{0%,100%{opacity:.35}50%{opacity:1}}
.v-scan .a-sub{top:88.5cqw}
.sub-run{display:none}
.phone[data-state="scan"] .sub-run{display:inline}.phone[data-state="scan"] .sub-idle{display:none}
.a-rows{top:101.8cqw;left:4.2cqw!important;right:4.2cqw!important;display:grid;gap:1.5cqw;margin:0;padding:0;list-style:none}
.a-rows li{display:flex;align-items:center;gap:3.2cqw;height:11.2cqw;padding:0 3.7cqw;border-radius:2.8cqw;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.07);font-size:3.4cqw;color:#e2dfd4;text-align:left;transition:background .4s,border-color .4s}
.a-rows .c{position:relative;flex:none;width:6.2cqw;height:6.2cqw;border-radius:50%;border:1px solid rgba(255,255,255,.35);display:grid;place-items:center}
.a-rows .t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.a-rows .v{margin-left:auto;font-family:var(--mono);font-size:2.7cqw;color:var(--a-grey);opacity:0;transition:opacity .4s;white-space:nowrap}
.a-rows li.active{background:rgba(200,178,125,.06);border-color:rgba(200,178,125,.22)}
.a-rows li.active .c{border-color:rgba(255,255,255,.15);border-top-color:var(--a-lime);animation:spin .8s linear infinite}
.a-rows li.done .c{background:var(--a-lime);border-color:var(--a-lime);animation:pop .45s var(--spring)}
.a-rows li.done .c::after{content:"";width:2.4cqw;height:1.3cqw;border:solid var(--a-ink);border-width:0 0 .65cqw .65cqw;transform:translateY(-.3cqw) rotate(-45deg)}
.a-rows li.done .v{opacity:1}
@keyframes pop{0%{transform:scale(.4)}100%{transform:scale(1)}}
.a-check{top:141cqw;height:12.5cqw!important;cursor:pointer}
.a-cancel{top:145cqw;font-size:3.6cqw;color:#cfcabc;opacity:0;transition:opacity .3s}
.phone[data-state="scan"] .a-check{opacity:0;pointer-events:none}
.phone[data-state="scan"] .a-cancel{opacity:1}
.a-check{transition:opacity .3s}
/* original */
.portrait{top:19.5cqw;width:37cqw;height:37cqw;border-radius:5.6cqw;padding:2.3cqw;border:.45cqw solid var(--a-lime);box-shadow:0 0 8cqw rgba(200,178,125,.25)}
.portrait .pf{display:block;width:100%;height:100%;border-radius:3.7cqw;overflow:hidden}
.portrait img{width:100%;height:100%;object-fit:cover}
.badge-ok{position:absolute;right:-2.7cqw;bottom:-2.7cqw;width:16cqw;height:16cqw;border-radius:50%;display:grid;place-items:center;background:var(--a-lime);box-shadow:0 0 0 1.5cqw #101a12}
.badge-ok svg{width:6.4cqw;color:var(--a-ink)}
.v-ok .a-status{top:59.8cqw}
.v-ok .a-title{top:64.4cqw;font-weight:500;color:var(--a-lime);font-size:10.6cqw}
.a-name{top:76.2cqw;font-family:var(--serif);font-style:italic;font-weight:500;font-size:5.8cqw;line-height:1.1}
.a-meta{top:83.4cqw;font-size:3.35cqw;line-height:1.5;color:#bdb8aa}
.a-card{left:4.2cqw!important;right:4.2cqw!important;padding:3.4cqw 4.1cqw 3.6cqw;border-radius:4.6cqw;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.035));border:1px solid rgba(255,255,255,.12);text-align:left!important}
.v-ok .a-card{top:97cqw}
.a-card small{display:flex;align-items:center;justify-content:space-between;font-size:2.75cqw;letter-spacing:.17em;text-transform:uppercase;color:var(--a-grey);font-weight:500;min-height:5.2cqw}
.a-card code{display:block;font-family:var(--mono);font-size:3.9cqw;line-height:1.15;letter-spacing:.04em;margin:1cqw 0 0;color:var(--a-text)}
.a-card code.bad{color:var(--a-red)}
.a-card hr{border:0;border-top:1px solid rgba(255,255,255,.1);margin:3cqw 0 2.2cqw}
.a-pill{display:grid;place-items:center;height:5.6cqw;padding:0 2.8cqw;border-radius:99px;font-size:2.5cqw;letter-spacing:.14em;font-weight:600}
.a-pill.ok{background:var(--a-lime);color:var(--a-ink)}
.a-pill.bad{border:1px solid rgba(208,87,62,.7);color:var(--a-red);background:rgba(208,87,62,.08)}
.a-chips{display:flex;flex-wrap:nowrap;gap:1.3cqw;margin-top:3cqw}
.a-chips i{flex:none;display:inline-flex;align-items:center;gap:.9cqw;height:6.1cqw;padding:0 2.1cqw;letter-spacing:-.01em;white-space:nowrap;border-radius:99px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.03);font-style:normal;font-size:2.4cqw;color:var(--a-grey)}
.a-chips b{font-family:var(--mono);font-weight:500;font-size:2.5cqw;color:var(--a-text)}
.v-ok .b1{top:142.5cqw}
.v-ok .b2{top:155.7cqw}
/* fake */
.xmark{top:30.6cqw;width:28cqw;height:28cqw;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 50% 38%,#5d2f2a,#381d1a 80%);box-shadow:inset 0 0 0 1px rgba(208,87,62,.45)}
.xmark svg{width:9.5cqw;color:var(--a-red)}
.v-bad .a-status{top:65.2cqw;color:var(--a-red)}
.v-bad .a-status::before{box-shadow:0 0 0 1.8cqw rgba(208,87,62,.12)}
.v-bad .a-title{top:70.8cqw;font-weight:500;color:var(--a-red);font-size:10.6cqw}
.v-bad .a-sub{top:83cqw}
.v-bad .a-card{top:100.7cqw}
.v-bad .b1{top:137.8cqw}
.v-bad .b2{top:151.4cqw}
/* result entrance */
.is-result .portrait,.is-result .xmark{animation:resultIn .8s var(--spring) both}
.is-result .badge-ok{animation:resultIn .6s .35s var(--spring) both}
.is-result .v-ok .a-title,.is-result .v-bad .a-title{animation:fadeUp .6s .1s var(--ease) both}
@keyframes resultIn{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}
/* real recording inside the frame */
.s-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;pointer-events:none;transition:opacity .5s var(--ease);background:#0f1712}
.phone[data-state="video"] .s-video{opacity:1;pointer-events:auto}
.phone[data-state="video"] .s-view,.phone[data-state="video"] .s-top{opacity:0}
/* controls under the phone */
.demo-ctl{display:flex;gap:4px;padding:5px;border-radius:999px;max-width:100%}
.demo-ctl button{border:0;background:none;color:#e2dfd4;font:500 .86rem var(--sans);min-height:44px;padding:0 13px;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:background .3s,color .3s}
.demo-ctl button::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent)}
.demo-ctl button[data-run="fake"]::before{background:var(--red)}
.demo-ctl button[data-run="video"]::before{width:0;height:0;border-radius:0;background:none;border-left:7px solid currentColor;border-block:4.5px solid transparent}
.demo-ctl button[aria-pressed="true"]{background:var(--accent);color:#15120b}
.demo-ctl button[aria-pressed="true"]:not([data-run="video"])::before{background:#15120b}
.demo-note{font-size:.78rem;color:var(--muted-2);text-align:center;max-width:36ch}


/* --- Combat ID additions to the app screen --- */
.demo{--a-amber:var(--amber);--a-red:var(--red)}
.s-off{position:absolute;left:3.2cqw;top:2.6cqw;display:inline-flex;align-items:center;gap:1.2cqw;height:6.2cqw;padding:0 2.2cqw;border-radius:99px;border:1px solid rgba(230,227,216,.18);background:rgba(0,0,0,.25);font:600 2.3cqw/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--a-grey)}
.s-off svg{width:3.4cqw}

.app-logo b{font-size:3.8cqw}
.pf .helmet{width:100%;height:100%}
.v-ok .a-title{top:64.4cqw;font-weight:500;color:var(--a-lime);font-size:10.6cqw}
.v-ok .a-status{top:59.8cqw}
.v-ok .a-name{font-family:var(--sans);font-style:normal;font-weight:600;font-size:5.2cqw}
.v-ok .a-card{top:97cqw}
.v-ok .b1{top:142.5cqw}
.v-ok .b2{top:155.7cqw}
.a-card code.txt{font-family:var(--sans);font-size:3.7cqw;letter-spacing:0}
.xmark.warn{background:radial-gradient(circle at 50% 38%,#5c4a22,#352b16 80%);box-shadow:inset 0 0 0 1px rgba(217,164,65,.5)}
.xmark.warn svg{color:var(--a-amber)}
.v-warn .xmark{top:30.6cqw}
.v-warn .a-status{top:65.2cqw;color:var(--a-amber)}
.v-warn .a-status::before{box-shadow:0 0 0 1.8cqw rgba(217,164,65,.14)}
.v-warn .a-title{top:70.8cqw;font-weight:500;color:var(--a-amber);font-size:10.6cqw}
.v-warn .a-sub{top:83cqw}
.v-warn .a-card{top:97.5cqw}
.v-warn .b1{top:137.8cqw}
.v-warn .b2{top:151.4cqw}
.v-bad .a-card{top:100.7cqw}
.a-pill.warn{border:1px solid rgba(217,164,65,.7);color:var(--a-amber);background:rgba(217,164,65,.1)}
.a-btn.amber{background:var(--a-amber);color:#1a1409;box-shadow:0 6cqw 14cqw -5cqw rgba(217,164,65,.6)}
.a-btn.red{background:var(--a-red);color:#1c0c08;box-shadow:0 6cqw 14cqw -5cqw rgba(208,87,62,.55)}
.phone[data-state="warn"]{box-shadow:0 0 0 1px rgba(255,255,255,.12),0 50px 90px -40px rgba(0,0,0,.9),0 30px 80px -30px rgba(217,164,65,.45)}
.demo-ctl{background:rgba(230,227,216,.05);border:1px solid var(--line-2);border-radius:12px}
.demo-ctl button{border-radius:9px;color:var(--text)}
.demo-ctl button[data-run="warn"]::before{background:var(--amber)}
.demo-ctl button[data-run="bad"]::before{background:var(--red)}
.demo-ctl button[aria-pressed="true"]{background:var(--accent);color:#15120b}
.demo-ctl button[aria-pressed="true"]::before{background:#15120b}
.demo-note{color:var(--muted-2);font-family:var(--mono);font-size:.72rem;letter-spacing:.04em}
.logo small{white-space:nowrap}
@media (max-width:420px){.nav .logo span{font-size:.82rem;letter-spacing:.26em;margin-right:-.26em}.nav .logo small{font-size:.54rem;padding:4px 5px;margin-left:4px}.nav .logo{gap:8px}.nav .logo svg{width:28px}}
@media (max-width:359px){.nav .logo small{display:none}}

/* ===== v2: more military look ===== */
.topo{position:absolute;inset:0;z-index:-1;pointer-events:none;background-size:cover;background-position:60% 40%;opacity:.55;-webkit-mask:radial-gradient(85% 75% at 65% 35%,#000 30%,transparent 80%);mask:radial-gradient(85% 75% at 65% 35%,#000 30%,transparent 80%);transform:translate3d(0,calc(var(--hp,0) * 40px),0) scale(1.05)}
.topo.dim{opacity:.35;-webkit-mask:radial-gradient(60% 70% at 85% 50%,#000,transparent 75%);mask:radial-gradient(60% 70% at 85% 50%,#000,transparent 75%)}
.grid-bg{opacity:.5}
.hud{position:absolute;inset:calc(var(--nav-h) + 10px) 16px 14px;pointer-events:none;font:500 .6rem/1 var(--mono);letter-spacing:.14em;color:rgba(200,178,125,.55);z-index:-1}
.hud span{position:absolute}
.hud .tl{left:0;top:0}.hud .tr{right:0;top:0}.hud .bl{left:0;bottom:0}.hud .br{right:0;bottom:0;color:rgba(208,87,62,.8);animation:blink 1.6s steps(2) infinite}
@keyframes blink{50%{opacity:.2}}
.hud::before,.hud::after{content:"";position:absolute;width:18px;height:18px;border:1px solid rgba(200,178,125,.4)}
.hud::before{left:-6px;top:14px;border-right:0;border-bottom:0}.hud::after{right:-6px;bottom:14px;border-left:0;border-top:0}
@media (max-width:640px){.hud .bl,.hud .br{display:none}}
/* tactical corner brackets on panels */
.card,.use,.asset,.form,.sec-list li,.faq details{--c:rgba(200,178,125,.55);background-image:
  linear-gradient(var(--c),var(--c)),linear-gradient(var(--c),var(--c)),linear-gradient(var(--c),var(--c)),linear-gradient(var(--c),var(--c)),
  linear-gradient(var(--c),var(--c)),linear-gradient(var(--c),var(--c)),linear-gradient(var(--c),var(--c)),linear-gradient(var(--c),var(--c)),var(--panel-bg,none);
  background-repeat:no-repeat;background-size:12px 1px,1px 12px,12px 1px,1px 12px,12px 1px,1px 12px,12px 1px,1px 12px,cover;
  background-position:0 0,0 0,100% 0,100% 0,0 100%,0 100%,100% 100%,100% 100%,0 0}
.card{--panel-bg:linear-gradient(160deg,var(--olive-2),var(--olive-1));border-radius:6px}
.use{--panel-bg:linear-gradient(160deg,var(--olive-1),#131409);border-radius:6px}
.faq details{--panel-bg:linear-gradient(var(--olive-1),var(--olive-1));border-radius:6px}
.sec-list li{--panel-bg:var(--glass);border-radius:6px}
.asset{--panel-bg:var(--glass);border-radius:8px}
.form{--panel-bg:var(--glass);border-radius:8px}
.ico{border-radius:4px}
.btn{border-radius:6px;text-transform:uppercase;letter-spacing:.08em;font-size:.86rem}
.btn-accent{color:#15120b}
.chips span,.lang,.lang a,.st,.tag,.a-foot .off,.a-foot .stat,.pick label,.f input,.f textarea,.menu-btn,.mnav .btn{border-radius:4px}
.eyebrow::before{background:var(--accent);box-shadow:none;width:14px;height:2px}
.hero h1 em,h2 em{color:var(--accent)}
/* hazard stripe on the "unknown" use case */
.use:has(.st.bad)::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;border-radius:6px 6px 0 0;background:repeating-linear-gradient(-45deg,var(--red) 0 8px,#15120b 8px 16px);opacity:.85}
.use:has(.st.warn)::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;border-radius:6px 6px 0 0;background:repeating-linear-gradient(-45deg,var(--amber) 0 8px,#15120b 8px 16px);opacity:.75}
/* radar in tan */
.radar{background:repeating-radial-gradient(circle,transparent 0 69px,rgba(200,178,125,.12) 69px 70px),conic-gradient(from calc(var(--rd,0) * 1turn),rgba(200,178,125,.22),transparent 18%)}
/* app: status colours stay semantic (ready = field green), buttons tan */
.v-ok .a-status,.v-ok .a-title{color:var(--ok)}
.v-ok .a-status::before{box-shadow:0 0 0 1.8cqw rgba(156,175,110,.12)}
.portrait{border-color:var(--ok);box-shadow:0 0 8cqw rgba(156,175,110,.2)}
.badge-ok{background:var(--ok)}
.a-pill.ok{background:var(--ok);color:#12140b}
.a-rows li.done .c{background:var(--ok);border-color:var(--ok)}
.g-ok{background:radial-gradient(130% 75% at 50% 105%,#46512f 0%,#262b1b 45%,#0e0f0b 100%)}
.demo-ctl button[data-run="ok"]::before{background:var(--ok)}
.phone{background:linear-gradient(160deg,#3b3a31,#0d0d0a 38%,#27261f);box-shadow:0 0 0 1px rgba(230,227,216,.1),0 50px 90px -40px rgba(0,0,0,.9),0 30px 80px -30px rgba(200,178,125,.25)}
.phone[data-state="ok"]{box-shadow:0 0 0 1px rgba(230,227,216,.1),0 50px 90px -40px rgba(0,0,0,.9),0 30px 80px -30px rgba(156,175,110,.4)}
.art .helmet rect:first-child{fill:#15160f}

/* Bilingual intelligence positioning; original artwork and palette retained. */
.brand-hero{grid-template-columns:minmax(0,1fr);max-width:1040px;position:relative;z-index:2}
.brand-hero .hero-copy{max-width:100%;gap:28px}
.brand-hero h1{font-size:clamp(3.3rem,8.7vw,7rem);max-width:950px}
.brand-hero .lead{max-width:65ch;font-size:clamp(1rem,1.8vw,1.18rem)}
.hero:has(.brand-hero){min-height:690px;padding-top:155px;padding-bottom:100px}
.brand-hero .eyebrow{font-size:.72rem;line-height:1.7;letter-spacing:.13em}
.product-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr))}
.product-card{position:relative;overflow:hidden;background:linear-gradient(145deg,var(--olive-2),var(--olive-1));border:1px solid var(--line-2);border-radius:var(--r);padding:32px;display:flex;flex-direction:column;gap:18px}
.product-top{display:flex;justify-content:space-between;align-items:center}
.product-no,.threat-number{font:500 .85rem var(--mono);color:var(--accent);letter-spacing:.1em}
.product-card h3{font-family:var(--display);font-size:clamp(2rem,4vw,2.7rem);font-weight:700}
.product-card p{color:var(--muted);max-width:48ch}
.product-card .product-tagline{color:var(--text);font-size:1.05rem;min-height:3.3em}
.product-link{display:inline-flex;align-items:center;gap:12px;font-weight:500;color:var(--accent);text-decoration:none;margin-top:auto;padding-top:14px;z-index:1}
.product-link svg{width:20px;height:20px;flex:none}
.asset-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:64px;align-items:center}
.asset-copy{display:grid;gap:24px;justify-items:start;min-width:0}
.asset-copy h2{font-size:clamp(2.5rem,5.5vw,4.5rem)}
.benefits{display:grid;gap:14px;color:var(--text);font-size:.95rem}
.benefits li{display:flex;gap:12px;align-items:flex-start}
.benefits svg{width:18px;height:18px;color:var(--accent);flex:none;margin-top:4px}
.asset-demo{min-width:0}.asset-demo .demo{margin:0 auto}
.threat-section{isolation:isolate;overflow:hidden;background:var(--bg-2);border-block:1px solid var(--line);padding-block:90px}
.threat-section .sec-head{max-width:840px;gap:20px}
.product-sub{font:400 .8rem var(--mono);color:var(--muted)}
.threat-section .radar{opacity:.6;z-index:-1;right:-120px}
.threat-section .three{margin:36px 0}
.threat-section .card{background:rgba(23,25,15,.9)}
.threat-number{display:block;margin-bottom:20px}
.secu .sec-head{max-width:850px}
.hero-cta{gap:12px}.hero-cta .btn{white-space:normal;text-align:center}
/* Keep intrinsic text and decorative motion within narrow viewports. */
.hero-grid>*,.asset-grid>*,.cta-grid>*,.two>*,.fields>*{min-width:0}
.btn{max-width:100%}
@media(max-width:767px){
  html,body{width:100%;max-width:100%;overscroll-behavior-x:none}
  html{overflow-x:hidden}
  body{overflow-x:clip;touch-action:pan-y pinch-zoom}
  .brand-hero h1{font-size:clamp(2.2rem,10.5vw,4rem);overflow-wrap:anywhere}
  .eyebrow{max-width:100%;line-height:1.5}
  .eyebrow::before{flex:none}
  .mnav .btn,.mcta .btn{white-space:normal;text-align:center;line-height:1.3;padding-block:12px}
  .pick label{max-width:100%;padding-block:8px;line-height:1.4}
  .form,.product-card{min-width:0}
  .demo-ctl{max-width:100%;flex-wrap:wrap;justify-content:center}
}
@media(min-width:980px){.nav .btn{font-size:.82rem;padding-inline:16px}.nav-links{gap:24px}.asset-section{padding-block:100px}}
@media(max-width:767px){.hero:has(.brand-hero){min-height:auto;padding-top:130px;padding-bottom:70px}.brand-hero h1{font-size:clamp(2.2rem,10.5vw,4rem)}.brand-hero .eyebrow{font-size:.61rem;letter-spacing:.09em}.product-grid,.asset-grid{grid-template-columns:1fr}.product-card{padding:24px}.product-card .product-tagline{min-height:0}.asset-grid{gap:40px}.asset-demo{padding-top:10px}.threat-section{padding-block:64px}.product-link{font-size:.9rem}.mcta>div{display:none}.mcta .btn{width:100%;font-size:.86rem}.asset-copy .btn,.threat-section .btn{white-space:normal;text-align:center;max-width:100%;padding-block:15px}}

/* Glass panels, scroll reveals and cursor-responsive original SVG background. */
.solutions,.band{isolation:isolate}
.solutions::before{content:"";position:absolute;inset:5% 0 0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 22% 42%,rgba(200,178,125,.18),transparent 48%),radial-gradient(ellipse at 80% 65%,rgba(120,144,85,.18),transparent 43%);filter:blur(35px)}
.product-card,.card,.use,.sec-list li,.faq details{--panel-bg:linear-gradient(145deg,rgba(230,227,216,.11),rgba(230,227,216,.025) 45%,rgba(200,178,125,.045));background-color:rgba(18,21,15,.43);border-color:rgba(230,227,216,.2);backdrop-filter:blur(22px) saturate(125%);-webkit-backdrop-filter:blur(22px) saturate(125%);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 -1px 0 rgba(200,178,125,.04),0 18px 50px -25px rgba(0,0,0,.65)}
.product-card{background-image:var(--panel-bg);border-radius:14px;isolation:isolate}
.threat-section .card{background-color:rgba(18,21,15,.43);background-image:var(--panel-bg)}
.form{background-color:rgba(18,21,15,.35);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 30px 65px -30px rgba(0,0,0,.65)}
.ico{box-shadow:inset 0 1px 0 rgba(255,255,255,.12);background:linear-gradient(145deg,rgba(200,178,125,.2),rgba(200,178,125,.06));backdrop-filter:blur(10px)}
.m-pre[data-m="up"]{filter:blur(10px);transform:translate3d(0,30px,0) scale(.985)}
.m-pre[data-m="mask"]{filter:blur(5px)}
.m-in{filter:none}
.btn,.product-link,.demo-ctl button{overflow:hidden;position:relative;isolation:isolate;transition:transform .35s var(--spring),box-shadow .35s var(--ease),background .3s,border-color .3s}
.btn:focus-visible,.product-link:focus-visible{box-shadow:0 0 0 5px rgba(200,178,125,.12),0 16px 40px -18px rgba(200,178,125,.6)}
.button-ripple{position:absolute;width:var(--ripple-size);height:var(--ripple-size);margin-left:calc(var(--ripple-size) / -2);margin-top:calc(var(--ripple-size) / -2);border-radius:50%;background:rgba(255,255,255,.3);pointer-events:none;z-index:-1;animation:buttonRipple .65s var(--ease) forwards}
@keyframes buttonRipple{from{transform:scale(0);opacity:.8}to{transform:scale(1);opacity:0}}
.product-link svg,.demo-ctl button{transition:transform .4s var(--spring),color .3s,background .3s}
footer address a{display:inline-block;color:var(--accent);margin-top:12px;text-decoration:none}
footer address a:hover{text-decoration:underline}
.hero::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(500px circle at var(--spot-x,70%) var(--spot-y,30%),rgba(200,178,125,.11),transparent 70%);opacity:.35;transition:opacity .7s}
.hero.pointer-active::after{opacity:1}
.hero .topo{transform:translate3d(calc(var(--px,0) * 32px),calc(var(--hp,0) * 40px + var(--py,0) * 24px),0) scale(1.08);transition:transform .7s cubic-bezier(.2,.7,.2,1);animation:mapDrift 22s ease-in-out infinite alternate}
@keyframes mapDrift{from{translate:-5px 0}to{translate:5px 7px}}
.hero .grid-bg{transform:translate3d(calc(var(--px,0) * -16px),calc(var(--hp,0) * 60px + var(--py,0) * -12px),0);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
@media(hover:hover) and (pointer:fine){
 .product-card:hover{transform:perspective(1000px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translateY(-6px);border-color:rgba(200,178,125,.46);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 28px 65px -25px rgba(200,178,125,.2)}
 .btn:hover{transform:translateY(-3px);box-shadow:0 20px 44px -16px rgba(200,178,125,.4)}
 .btn-ghost:hover{background:rgba(230,227,216,.12);border-color:rgba(200,178,125,.4)}
 .product-link:hover{color:var(--text)}.product-link:hover svg{transform:translateX(6px)}
 .demo-ctl button:hover{transform:translateY(-2px)}
 .btn:active{transform:translateY(0) scale(.97)}
}
@media(prefers-reduced-motion:reduce){
 html:not(.motion-on) .hero .topo,html:not(.motion-on) .hero .grid-bg{transform:none!important;transition:none;animation:none;translate:none}
 html:not(.motion-on) .hero::after,html:not(.motion-on) .button-ripple{display:none}
 html:not(.motion-on) .product-card:hover,html:not(.motion-on) .btn:hover,html:not(.motion-on) .demo-ctl button:hover{transform:none}
 html:not(.motion-on) .m-pre[data-m="up"],html:not(.motion-on) .m-pre[data-m="mask"]{filter:none;transform:none;opacity:1;clip-path:none}
}
@media(prefers-reduced-transparency:reduce){.product-card,.card,.use,.sec-list li,.faq details,.form{background:var(--olive-2);backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(max-width:767px){.product-card,.card,.use{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.hero::after{opacity:.3}}

.motion-toggle{justify-self:start;background:rgba(230,227,216,.06);border:1px solid var(--line-2);border-radius:6px;padding:10px 14px;color:var(--muted);font:500 .76rem var(--sans);cursor:pointer;transition:background .25s,color .25s}
.motion-toggle:hover{color:var(--text);background:rgba(230,227,216,.12)}
.motion-toggle[hidden]{display:none}
.motion-off,.motion-off *,.motion-off *::before,.motion-off *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;transition-delay:0ms!important;scroll-behavior:auto!important}
.motion-off .hero .topo,.motion-off .hero .grid-bg{animation:none!important;translate:none!important;transform:none!important}
.motion-off .hero::after{display:none}