:root{
  --bg:#0b1220; --panel:#0f172a; --card:#0d1324; --line:#1f2a44;
  --fg:#dbe6ff; --muted:#9fb2d9; --accent:#4cc2ff; --good:#50e3a4;
  --space-1:8px; --space-2:12px; --space-3:18px; --space-4:28px; --space-5:44px;
  --radius:16px; --radius-lg:22px; --wrap:1200px;
}
*{box-sizing:border-box} html,body{margin:0;padding:0}
body{background:radial-gradient(1200px 600px at 50% -80%,#17304f 0%,#0b1220 60%,#0b1220 100%),var(--bg);
     color:var(--fg); font:-apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
     line-height:1.5}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:var(--wrap); margin:0 auto; padding:0 20px}

/* Top bar */
.top{border-bottom:1px solid var(--line); position:sticky; top:0; backdrop-filter:saturate(120%) blur(6px);
     background:color-mix(in hsl, #0b1220 80%, transparent); z-index:100}
.brand{display:flex; gap:14px; align-items:center; padding:12px 0}
.brand img{height:26px}
nav{margin-left:auto; display:flex; gap:18px}
nav a{color:var(--muted); text-decoration:none}
nav a:hover{color:#fff}

/* Buttons */
.btn{display:inline-flex; gap:10px; align-items:center; justify-content:center;
  padding:.72rem 1.05rem; border-radius:999px; border:1px solid color-mix(in hsl, var(--accent) 60%, #ffffff 0%);
  background:linear-gradient(180deg, color-mix(in hsl, var(--accent) 30%, #0b1220 70%), color-mix(in hsl, #0b1220 85%, var(--accent) 15%));
  color:#00131f; font-weight:700; text-shadow:none}
.btn:hover{filter:brightness(1.1)}
.btn.ghost{background:transparent; color:#cfeaff; border-color:var(--line)}
.btn.ghost:hover{border-color:var(--accent); color:#fff}

/* Hero */
.hero{padding:64px 0 36px; border-bottom:1px solid var(--line);
  background:radial-gradient(1000px 500px at 50% -60%, rgba(76,194,255,.22), transparent 60%)}
.kicker{display:inline-block; color:#a7c9ff; background:rgba(76,194,255,.06);
  border:1px solid color-mix(in hsl, var(--accent) 25%, transparent); border-radius:999px; padding:6px 12px; margin-bottom:14px}
h1{font-size:clamp(36px, 4.8vw, 56px); line-height:1.06; letter-spacing:.2px; margin:0 0 12px}
.lead{font-size:1.12rem; color:#c9daf6; margin:0 0 16px}
.ctas{display:flex; gap:10px; flex-wrap:wrap; margin:18px 0}

/* Infobar */
.infobar{display:flex; gap:18px; flex-wrap:wrap; align-items:center; color:#b7c8e7; font-size:.95rem}
.dot{display:inline-block; width:8px; height:8px; border-radius:50%; background:#ff6060; margin-right:6px}
.infobar strong{color:#fff}

/* Grid helpers */
.section{padding:36px 0}
.grid{display:grid; gap:18px}
.cols-2{grid-template-columns:1fr}
@media(min-width:900px){.cols-2{grid-template-columns:1.2fr .8fr}}

/* Panels & cards */
.panel{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius-lg); padding:18px}
.card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden}
.muted{color:var(--muted)}

/* Audio row */
.audio-grid{display:grid; gap:16px}
@media(min-width:900px){.audio-grid{grid-template-columns:1fr 1fr}}
.player{padding:14px; border-radius:var(--radius); background:var(--card); border:1px solid var(--line)}
.pill{display:inline-block; font-size:.85rem; padding:4px 10px; border-radius:999px; border:1px solid var(--line); color:var(--muted); margin-bottom:8px}
.bar{height:6px; background:#163255; border-radius:6px; overflow:hidden}
.inner{height:100%; width:0%; background:linear-gradient(90deg, #47f0bf, #4cc2ff)}

/* Gallery */
.filters{display:flex; gap:8px; flex-wrap:wrap; margin:8px 0 12px}
.chip{background:transparent; border:1px solid var(--line); color:var(--fg); padding:.45rem .8rem; border-radius:999px}
.cards{display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:14px}
.card .thumb{aspect-ratio:16/10; background:#0f1524}
.card .body{padding:12px; color:var(--muted)}
.card strong{color:#fff}

/* Trust & logos */
.trust-grid{display:grid; gap:16px}
@media(min-width:900px){.trust-grid{grid-template-columns:260px 1fr}}
.badge{display:flex; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:16px; background:var(--card); padding:20px}
.badge .score{font-size:3.2rem; font-weight:800; color:var(--good)}
.badge small{display:block; color:var(--muted)}
.tp-panel{border:1px solid var(--line); border-radius:16px; background:var(--card); padding:16px}
.logos{padding:12px 0}
.logos .row{display:flex; gap:28px; flex-wrap:wrap; align-items:center; justify-content:center}
.logos img{opacity:.9; filter:grayscale(100%); height:32px}
.logos img:hover{opacity:1}

/* Sectors */
.sectors{display:grid; gap:14px}
@media(min-width:900px){.sectors{grid-template-columns:repeat(3,1fr)}}
.slice{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:16px}
.slice h3{margin:0 0 6px}
.slice p{color:var(--muted); margin:0 0 10px}
.slice a{color:#fff; text-decoration:none}
.slice a:hover{text-decoration:underline}

/* Quote */
.quote{background:rgba(255,255,255,.03); border:1px solid var(--line); border-radius:16px; padding:20px}
.quote blockquote{margin:0; font-size:1.05rem}
.quote footer{margin-top:10px; color:var(--muted)}

/* Footer */
.footer{border-top:1px solid var(--line); display:flex; gap:12px; justify-content:space-between; flex-wrap:wrap; color:var(--muted); padding:18px 0}
.footer a{color:var(--muted)}
.footer a:hover{color:#fff}

/* Accessibility */
:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.skip{position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden}
.skip:focus{left:12px; top:12px; width:auto; height:auto; padding:.5rem .75rem; background:#fff; color:#000; border-radius:8px; z-index:999}
.hero.compact{padding:56px 0 28px;background:linear-gradient(180deg,#0b1220,#0b1220 60%,#0b122000)}
.hero.compact h1{font-size:clamp(28px,5vw,56px);line-height:1.1;margin:0 0 .5rem;color:#e8eef8}
.hero.compact .lead{color:#9fb3c8;margin:0 0 1rem}
.ctas{display:flex;gap:10px;flex-wrap:wrap}
.btn{padding:.6rem .9rem;border-radius:999px;border:1px solid var(--line);background:#122033;color:#e8eef8;text-decoration:none}
.btn.ghost{background:transparent}
.section{padding:28px 0}
.logos .row{display:flex;gap:28px;flex-wrap:wrap;align-items:center;justify-content:center}
.logos img{opacity:.9;filter:grayscale(100%);height:28px}
details.section summary{cursor:pointer;list-style:none;padding:10px 0;color:#9fb3c8}
details.section[open] summary{color:#e8eef8}

.hero.compact{padding:56px 0 24px}.section{padding:28px 0}

.hero.compact{padding:56px 0 24px;background:#0b1220}.hero.compact h1{font-size:clamp(28px,5vw,56px);line-height:1.1;margin:0 0 .5rem;color:#e8eef8}.hero.compact .lead{color:#9fb3c8;margin:0 0 1rem}.ctas{display:flex;gap:10px;flex-wrap:wrap}.btn{padding:.6rem .9rem;border-radius:999px;border:1px solid #2a3447;background:#122033;color:#e8eef8;text-decoration:none}.btn.ghost{background:transparent}.section{padding:28px 0}

.hero.compact{padding:56px 0 24px}.section{padding:28px 0}
#live-counters .row{display:flex;gap:16px;flex-wrap:wrap;align-items:stretch}
#live-counters .box{flex:1 1 260px;background:#0f1a2a;border:1px solid #243049;border-radius:16px;padding:16px 20px}
#live-counters .label{font-size:14px;letter-spacing:.02em;color:#9fb3c8;margin-bottom:6px}
#live-counters .value{font-size:clamp(28px,6vw,44px);font-weight:700;color:#e8eef8;line-height:1.1}
#threat-level .tl-wrap{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}
#threat-level .label{font-size:14px;color:#9fb3c8;margin-bottom:6px}
#threat-level .scale{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:6px;background:#0f1a2a;border:1px solid #243049;border-radius:999px;padding:8px}
#threat-level .seg{height:14px;border-radius:999px;background:#142239;opacity:.6;transition:transform .25s ease,opacity .25s ease,background .25s ease}
#threat-level .seg.on{opacity:1}
#threat-level .seg[data-i="1"].on{background:#46c77a}
#threat-level .seg[data-i="2"].on{background:#9ad86a}
#threat-level .seg[data-i="3"].on{background:#ffd166}
#threat-level .seg[data-i="4"].on{background:#ff9f43}
#threat-level .seg[data-i="5"].on{background:#ff5b57}
#threat-level .pulse{position:absolute;inset:0;border-radius:999px;pointer-events:none;box-shadow:0 0 0 0 rgba(255,95,95,0.0);animation:none}
#threat-level .pulse.active{animation:tlPulse 1.4s ease-out infinite}
@keyframes tlPulse{0%{box-shadow:0 0 0 0 rgba(255,95,95,.35)}70%{box-shadow:0 0 0 14px rgba(255,95,95,0)}100%{box-shadow:0 0 0 0 rgba(255,95,95,0)}}
#threat-level .badge{display:inline-block;padding:.35rem .7rem;border-radius:999px;border:1px solid #2b3750;background:#121e32;color:#e8eef8;font-weight:600}
#defcon{padding:28px 0}
#defcon .wrap{display:flex;flex-direction:column;align-items:center;text-align:center}
#defcon svg{width:220px;height:220px}
#defcon .arc{stroke:#2a80ff;stroke-width:14;fill:none;stroke-linecap:round;opacity:.35}
#defcon .dot{fill:#2a80ff;animation:spin 4s linear infinite}
@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.section.logos .row{display:flex;gap:32px;flex-wrap:wrap;justify-content:center;align-items:center}
.section.logos img{height:32px;opacity:.85;filter:grayscale(100%)}
.section.intro p{max-width:680px;margin:0 auto;color:#9fb3c8;font-size:18px}
#trustpack .tp-card{background:#0f1a2a;border:1px solid #243049;border-radius:16px;padding:16px 20px;max-width:780px;margin:0 auto}
#trustpack .tp-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
#trustpack .tp-title{font-weight:700;color:#e8eef8}
#trustpack .tp-score{font-size:32px;font-weight:800;color:#46c77a}
#trustpack .tp-signals{margin:0 0 12px;padding-left:18px;color:#9fb3c8}
#a rchive .h2,#archive .h2{margin-bottom:8px}
#archive .a-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
#archive .card{background:#0f1a2a;border:1px solid #243049;border-radius:12px;overflow:hidden}
#archive .card img{display:block;width:100%;height:120px;object-fit:cover}
#archive .card .c-label{padding:8px 10px;font-size:14px;color:#c7d3e3}
:root{--bg:#0b1220;--panel:#0f1a2a;--line:#243049;--text:#e8eef8;--muted:#9fb3c8}
.light{--bg:#f7f9fc;--panel:#ffffff;--line:#dfe7f5;--text:#0b1220;--muted:#4a5870}
body{background:var(--bg);color:var(--text)}
.muted{color:var(--muted)}
:focus-visible{outline:2px solid #2a80ff;outline-offset:2px;border-radius:6px}
@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}
a{color:inherit;text-decoration:none;border-bottom:1px dotted var(--line)} a:hover{border-bottom-color:#2a80ff}
button.btn{cursor:pointer}
#testimonials .t-wrap{position:relative;min-height:52px}
#testimonials .t-slide{opacity:0;position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;color:#c7d3e3;transition:opacity .4s}
#testimonials .t-slide.on{opacity:1;position:relative}
.demo-steps{counter-reset: step;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.demo-steps li{background:#0f1a2a;border:1px solid #243049;border-radius:12px;padding:10px 12px}
.demo-steps a{display:block;text-decoration:none;border-bottom:0}
.calc .row{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin:8px 0 12px}
.calc input{width:100%;padding:.5rem .6rem;border-radius:10px;border:1px solid var(--line);background:var(--panel);color:var(--text)}
.calc .out{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.site-head{padding:10px 0 6px;background:transparent}
.brand-row{display:flex;align-items:center;gap:12px}
.brand img{height:32px;display:block}
@media (min-width:1024px){.brand img{height:36px}}
.site-head{padding:10px 0 6px;background:transparent}
.brand-row{display:flex;align-items:center;gap:12px}
.brand img{height:36px;display:block}
@media (max-width:480px){.brand img{height:30px}}
/* Optional: lighten on light theme */
body.light .brand img{filter: drop-shadow(0 0 12px rgba(22,224,160,.25));}
.site-head{padding:10px 0 6px;background:transparent}
.brand-row{display:flex;align-items:center;gap:12px}
.brand img{height:36px;display:block}
@media (max-width:480px){.brand img{height:30px}}
.threatbar{position:relative;height:10px;border-radius:999px;background:#121a2a;overflow:hidden;box-shadow:inset 0 0 0 1px #1f2a44}
.threatbar .fill{height:100%;width:30%;background:linear-gradient(90deg,#0cd6a3,#16e0a0);transition:width .8s ease}
.pulse::after{content:'';position:absolute;inset:0;border-radius:999px;box-shadow:0 0 0 0 rgba(22,224,160,.5);animation:pulse 2.2s infinite}
@keyframes pulse{to{box-shadow:0 0 0 16px rgba(22,224,160,0)}}
#deepfake-gallery .filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
#deepfake-gallery .filters .chip{padding:6px 10px;border:1px solid #263248;border-radius:999px;background:#0b1220;cursor:pointer}
#deepfake-gallery .filters .chip.active{border-color:#16e0a0;box-shadow:0 0 0 1px rgba(22,224,160,.4) inset}
#deepfake-gallery .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
#deepfake-gallery .case{display:flex;flex-direction:column;gap:6px;border:1px solid #243049;border-radius:12px;overflow:hidden;background:#0e1727;padding:0;text-align:left}
#deepfake-gallery .case img{width:100%;height:140px;object-fit:cover;display:block}
#deepfake-gallery .case .label{padding:8px 10px;font-size:14px;color:#b9c4d9}
#dg-modal{border:none;border-radius:14px;padding:0;max-width:720px;width:calc(100% - 24px);background:#0e1727;color:#dbe6ff}
#dg-modal .hd{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid #243049}
#dg-modal .bd{padding:12px}
#dg-modal .bd img{max-width:100%;display:block;border-radius:8px}
#dg-modal .close{border:1px solid #243049;background:#0b1220;border-radius:8px;padding:6px 10px;cursor:pointer}
/* Audio demo */
#demo-audio .row{display:flex;gap:12px;flex-wrap:wrap}
#demo-audio .card{flex:1 1 320px;min-width:280px;border:1px solid #243049;border-radius:12px;background:#0e1727;padding:12px}
#demo-audio .hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
#demo-audio .pill{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;letter-spacing:.02em}
#demo-audio .pill.real{background:#0e2a1f;color:#aaf3dd;border:1px solid #1a644c}
#demo-audio .pill.fake{background:#2a0e16;color:#ffc2c2;border:1px solid #6a1a27}
#demo-audio .meter{height:8px;background:#0b1220;border:1px solid #243049;border-radius:999px;overflow:hidden;opacity:.4;transition:opacity .2s}
#demo-audio .meter .fill{height:100%;transform-origin:left center;transform:scaleX(0);background:linear-gradient(90deg,#10e0a5,#5ad3ff)}
#demo-audio .controls{display:flex;gap:8px;margin-top:10px}
#demo-audio .btn-play{border:1px solid #243049;background:#0b1220;border-radius:8px;padding:6px 10px;cursor:pointer}
#demo-audio audio{width:100%;margin-top:8px}
.threatbar{position:relative;height:10px;border:1px solid #243049;border-radius:999px;background:#0b1220;overflow:hidden;margin:14px 0}
.threatbar .fill{height:100%;width:30%;background:linear-gradient(90deg,#ff9f1a,#ff3d71);transition:width .8s ease}
.pulse::after{content:'';position:absolute;inset:0;border-radius:999px;box-shadow:0 0 0 0 rgba(22,224,160,.5);animation:pulse 2.2s infinite}
@keyframes pulse{to{box-shadow:0 0 0 16px rgba(22,224,160,0)}}
#deepfake-gallery .filters{display:flex;gap:8px;margin:8px 0 12px}
#deepfake-gallery .chip{border:1px solid #243049;background:#0b1220;border-radius:999px;padding:6px 10px}
#deepfake-gallery .chip.active{background:#152034}
#deepfake-gallery .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
#deepfake-gallery .case{display:flex;flex-direction:column;gap:6px;background:#0e1727;border:1px solid #243049;border-radius:12px;padding:8px;text-align:left}
#deepfake-gallery .case img{width:100%;height:110px;object-fit:cover;border-radius:8px}
#dg-modal{border:1px solid #243049;border-radius:12px;background:#0b1220;color:#fff;padding:0;max-width:92vw}
#dg-modal .hd{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-bottom:1px solid #243049}
#dg-modal .bd{padding:12px}
#dg-modal .img{max-width:80vw;max-height:72vh;border-radius:10px}
#demo-audio .row{display:flex;gap:12px;flex-wrap:wrap}
#demo-audio .card{flex:1 1 320px;min-width:280px;border:1px solid #243049;border-radius:12px;background:#0e1727;padding:12px}
#demo-audio .hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
#demo-audio .pill{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;letter-spacing:.02em}
#demo-audio .pill.real{background:#0e2a1f;color:#aaf3dd;border:1px solid #1a644c}
#demo-audio .pill.fake{background:#2a0e16;color:#ffc2c2;border:1px solid #6a1a27}
#demo-audio .meter{height:8px;background:#0b1220;border:1px solid #243049;border-radius:999px;overflow:hidden;opacity:.45;transition:opacity .2s}
#demo-audio .meter .fill{height:100%;transform-origin:left center;transform:scaleX(0)}
#demo-audio .controls{display:flex;gap:8px;margin-top:10px}
#demo-audio .btn-play{border:1px solid #243049;background:#0b1220;border-radius:8px;padding:6px 10px;cursor:pointer}
#demo-audio audio{width:100%;margin-top:8px}
.network-nav{background:#0b1220;border-top:1px solid #252f45;border-bottom:1px solid #252f45}
.network-nav .wrap{display:flex;gap:12px;align-items:center;justify-content:center;padding:6px 10px;font-size:14px}
.network-nav a{color:#9ab7ff;text-decoration:none}
.network-nav a:hover{text-decoration:underline}
/* Visible focus outlines */
:focus{outline:2px solid #6aa6ff; outline-offset:2px}
:focus:not(:focus-visible){outline:none}
:focus-visible{outline:2px solid #6aa6ff; outline-offset:2px}

/* Links/buttons hover+focus contrast helpers */
a.btn:focus, a.btn:hover, button.btn:focus, button.btn:hover{
  filter:brightness(1.1)
}

/* Respect motion settings */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important}
}