/* idsealed — corporate trust design system (accessible, high-contrast) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;600;700&display=swap');

:root{
  /* primary trust blues */
  --navy:#0B1B33; --navy-2:#132646; --ink:#0f1b2d; --slate:#44566c; --mut:#74849b;
  --blue:#0E6B54; --blue-2:#0A523F; --cyan:#2FC29A;
  /* accent (teal "secure") — kept under the old --gold names so every page updates */
  --gold:#2FC29A; --gold-2:#57D3B0; --gold-soft:#E7F7F1;
  --line:#e2e8f1; --line-2:#eef2f8; --bg:#f4f8fc; --bg-2:#fafcff; --card:#ffffff;
  --green:#1a9d59; --amber:#c1871d; --red:#d23a35;
  --shadow:0 16px 40px rgba(11,27,51,.10); --shadow-sm:0 4px 16px rgba(11,27,51,.06);
  --shadow-gold:0 12px 30px rgba(47,194,154,.20);
  --r:14px; --r-sm:10px;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --serif:var(--sans);
  --mono:'JetBrains Mono','SF Mono',Menlo,Consolas,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:var(--bg);line-height:1.6;
  -webkit-font-smoothing:antialiased;font-size:16px}
a{color:var(--blue)}
img{max-width:100%}
.container{max-width:1140px;margin:0 auto;padding:0 28px}
.muted{color:var(--mut)}
.center{text-align:center}
h1,h2{font-family:var(--sans);font-weight:700;letter-spacing:-.4px;color:var(--navy)}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line)}
.nav .container{display:flex;align-items:center;justify-content:space-between;height:70px}
.brand{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:20px;color:var(--navy);
  letter-spacing:-.5px;line-height:1;text-decoration:none}
.brand .logo{width:26px;height:34px;display:block;flex:none;background:none;border-radius:0;
  transform:translateY(-1px);  /* optical centering: lock sits low in the shield */
  filter:drop-shadow(0 2px 6px rgba(14,107,84,.25))}
.brand .wm{display:inline-block;white-space:nowrap;font-kerning:none}
.brand .wm b{margin:0;padding:0}
.nav-links{display:flex;gap:26px;align-items:center}
.nav-links a{color:var(--slate);font-weight:500;font-size:14.5px;transition:color .15s}
.nav-links a:hover,.nav-links a.on{color:var(--blue)}
.nav-links a.btn{color:#fff}            /* keep the Get Protected CTA white & legible */
.nav-links a.btn:hover{color:#fff}
/* secondary "Log in" — outlined pill, clearly subordinate to the signup CTA */
.nav-links a.loginlink{border:1.5px solid var(--line);border-radius:999px;padding:7px 15px;color:var(--slate);font-weight:600}
.nav-links a.loginlink:hover,.nav-links a.loginlink.on{color:var(--blue);border-color:var(--blue)}
[data-theme="dark"] .nav-links a.loginlink{border-color:#2b3a52;color:#b3c1d6}
[data-theme="dark"] .nav-links a.loginlink:hover,[data-theme="dark"] .nav-links a.loginlink.on{color:#4ED0A8;border-color:#4ED0A8}

/* hero Delete/Disguise/Defend list */
.ddd{list-style:none;margin:22px 0 0;max-width:560px}
.ddd li{position:relative;padding:9px 0 9px 30px;font-size:17px;color:var(--slate);line-height:1.5;
  border-bottom:1px solid var(--line-2)}
.ddd li:last-child{border-bottom:none}
.ddd li:before{content:"✓";position:absolute;left:0;top:9px;color:var(--cyan);font-weight:800}
.ddd .d{font-weight:800;color:var(--navy)}
@media(max-width:680px){.ddd li{font-size:15.5px}}
@media(max-width:820px){
  .nav .container{height:auto;flex-wrap:wrap;gap:8px;padding-top:12px;padding-bottom:12px}
  .nav-links{gap:18px;overflow-x:auto;-webkit-overflow-scrolling:touch;width:100%;padding-bottom:4px;flex-wrap:nowrap}
  .nav-links a{font-size:14px;white-space:nowrap}
}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--blue);color:#fff;font-weight:600;
  font-size:14.5px;border:none;padding:13px 24px;border-radius:8px;cursor:pointer;transition:.16s ease;
  white-space:nowrap;box-shadow:0 2px 6px rgba(14,107,84,.18)}
.btn:hover{background:var(--blue-2);transform:translateY(-1px);box-shadow:0 8px 18px rgba(14,107,84,.24)}
.btn.gold{background:#0b8a99;color:#fff;box-shadow:0 2px 6px rgba(11,138,153,.2)}
.btn.gold:hover{background:#097483;box-shadow:0 8px 18px rgba(11,138,153,.26)}
.btn.ghost{background:#fff;color:var(--navy);border:1.5px solid var(--line);box-shadow:none}
.btn.ghost:hover{border-color:var(--blue);color:var(--blue);background:#fff}
.btn.lg{padding:15px 30px;font-size:15.5px}
.btn.block{width:100%;justify-content:center}
.btn.dark{background:var(--navy)} .btn.dark:hover{background:var(--navy-2)}

/* hero */
.hero{background:
  radial-gradient(900px 420px at 82% -10%,rgba(47,194,154,.10),transparent 60%),
  radial-gradient(800px 460px at 8% 0%,rgba(14,107,84,.08),transparent 55%),
  linear-gradient(180deg,#ffffff,var(--bg));padding:76px 0 52px}
.hero h1{font-size:52px;line-height:1.08;letter-spacing:-1.2px;color:var(--navy);font-weight:800;max-width:680px}
.hero p.sub{font-size:19px;color:var(--slate);margin:22px 0 0;max-width:560px;line-height:1.65}
.pill{display:inline-flex;align-items:center;gap:8px;background:var(--gold-soft);color:#0a6b77;
  font-weight:700;font-size:12px;letter-spacing:.6px;text-transform:uppercase;padding:7px 15px;
  border-radius:30px;margin-bottom:22px;border:1px solid rgba(47,194,154,.25)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:46px;align-items:center}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}.hero{padding:48px 0 30px}.hero h1{font-size:38px}}

/* scan box */
.scanbox{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:28px}
.scanbox h3{font-size:21px;color:var(--navy);font-weight:700}
.scanbox .row{display:flex;gap:10px;margin-top:14px}
.input{width:100%;padding:13px 15px;border:1.5px solid var(--line);border-radius:var(--r-sm);font-size:15px;
  font-family:inherit;background:var(--bg-2);transition:.15s}
.input:focus{outline:none;border-color:var(--blue);background:#fff;box-shadow:0 0 0 3px rgba(14,107,84,.14)}
.field{margin-bottom:14px}
.field label{display:block;font-weight:600;font-size:12px;color:var(--slate);margin-bottom:6px;
  text-transform:uppercase;letter-spacing:.5px}
.input.invalid{border-color:var(--red);background:rgba(210,58,53,.04)}
.input.invalid:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(210,58,53,.14)}
.field-err{display:none;color:var(--red);font-size:12.5px;font-weight:600;margin-top:6px}
.field-err.show{display:block;animation:errIn .2s ease}
@keyframes errIn{from{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:none}}
[data-theme="dark"] .field-err{color:#fb8d88}

/* sections */
section.block{padding:72px 0}
.h2{font-size:36px;color:var(--navy);font-weight:800;letter-spacing:-.8px;text-align:center}
.lead{font-size:18px;color:var(--slate);text-align:center;max-width:640px;margin:14px auto 0;line-height:1.65}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:40px}
@media(max-width:860px){.grid3,.grid4{grid-template-columns:1fr}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:26px;
  box-shadow:var(--shadow-sm);transition:.2s}
.card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.card .ic{width:46px;height:46px;border-radius:10px;background:var(--gold-soft);color:#0a6b77;display:grid;
  place-items:center;font-size:20px;margin-bottom:14px;border:1px solid rgba(47,194,154,.22)}
.card h4{color:var(--navy);font-size:19px;font-weight:700;margin-bottom:8px}
.card p{color:var(--slate);font-size:15px;line-height:1.6}
.step-n{width:36px;height:36px;border-radius:50%;background:var(--blue);color:#fff;display:grid;
  place-items:center;font-weight:700;margin-bottom:13px;font-size:16px}

/* pricing */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px;align-items:stretch}
@media(max-width:860px){.tiers{grid-template-columns:1fr}}
.tier{background:#fff;border:1.5px solid var(--line);border-radius:var(--r);padding:30px;display:flex;
  flex-direction:column;box-shadow:var(--shadow-sm)}
.tier.feat{border-color:var(--blue);box-shadow:0 14px 36px rgba(14,107,84,.16);position:relative}
.tier.feat .tag{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--blue);color:#fff;
  font-size:11px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;padding:6px 15px;border-radius:14px}
.tier h3{color:var(--navy);font-size:22px;font-weight:700}
.price{font-size:46px;font-weight:800;color:var(--navy);margin:10px 0 2px;letter-spacing:-1.5px}
.price span{font-size:16px;color:var(--mut);font-weight:500;letter-spacing:0}
.tier ul{list-style:none;margin:18px 0 22px;flex:1}
.tier li{padding:9px 0 9px 28px;position:relative;color:var(--slate);font-size:15px;border-bottom:1px solid var(--line-2)}
.tier li:before{content:"\2713";position:absolute;left:0;color:var(--cyan);font-weight:800}

/* table */
.table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.table th{background:var(--navy);color:#fff;text-align:left;padding:13px 16px;font-size:11px;letter-spacing:.6px;
  text-transform:uppercase;font-weight:600}
.table td{padding:13px 16px;border-top:1px solid var(--line-2);font-size:14px;color:var(--ink)}
.table tr:nth-child(even) td{background:var(--bg-2)}
.badge{display:inline-block;padding:4px 11px;border-radius:20px;font-size:11.5px;font-weight:600}
.b-removed{background:#e4f6ec;color:var(--green)}
.b-progress{background:#e7f1fc;color:var(--blue-2)}
.b-human{background:#fbf2dd;color:var(--amber)}
.b-found{background:#fbe7e6;color:var(--red)}

/* dashboard */
.dash{display:grid;grid-template-columns:320px 1fr;gap:28px;align-items:start}
@media(max-width:900px){.dash{grid-template-columns:1fr}}
.stat{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;box-shadow:var(--shadow-sm)}
.stat .n{font-size:32px;font-weight:800;color:var(--navy);letter-spacing:-1px}
.stat .l{color:var(--mut);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.6px}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}
@media(max-width:760px){.stat-grid{grid-template-columns:repeat(2,1fr)}}
.gauge-card{background:linear-gradient(160deg,var(--navy),var(--navy-2));color:#fff;border-radius:var(--r);
  padding:26px;text-align:center;box-shadow:var(--shadow)}
.gauge-card .label{opacity:.78;font-size:11px;text-transform:uppercase;letter-spacing:.9px}
.alert{display:flex;gap:12px;background:#fff;border:1px solid var(--line);border-left:3px solid var(--cyan);
  border-radius:var(--r-sm);padding:14px 16px;margin-bottom:10px;box-shadow:var(--shadow-sm)}
.alert.good{border-left-color:var(--green)} .alert.warn{border-left-color:var(--amber)}
.alert .ai{font-size:18px}
.alert b{color:var(--navy)}

/* stepper / onboarding */
.stepper{display:flex;gap:8px;margin-bottom:30px}
.stepper .s{flex:1;text-align:center;font-size:12px;font-weight:600;color:var(--mut);padding-bottom:11px;
  border-bottom:2px solid var(--line);letter-spacing:.2px}
.stepper .s.active{color:var(--blue);border-color:var(--blue)}
.stepper .s.done{color:var(--green);border-color:var(--green)}
.panel{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:34px;box-shadow:var(--shadow)}
.sig{border:1.5px dashed var(--line);border-radius:var(--r-sm);background:var(--bg-2);padding:22px;text-align:center;
  font-size:28px;color:var(--navy);cursor:text;font-style:italic;font-weight:600}
.legal-box{max-height:190px;overflow:auto;border:1px solid var(--line);border-radius:var(--r-sm);padding:18px;
  font-size:13px;color:var(--slate);background:var(--bg-2);line-height:1.7}

/* footer */
.footer{background:var(--navy);color:#c3d2e4;padding:54px 0 32px;margin-top:72px;border-top:3px solid var(--cyan)}
.footer .container{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:28px}
@media(max-width:780px){.footer .container{grid-template-columns:1fr 1fr}}
.footer h5{color:#fff;font-size:13px;margin-bottom:12px;text-transform:uppercase;letter-spacing:.8px;font-weight:700}
.footer a{color:#c3d2e4;display:block;padding:5px 0;font-size:14px;transition:color .15s}
.footer a:hover{color:#fff}
.footer .copy{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.12);margin-top:20px;padding-top:18px;
  font-size:12.5px;color:#8ba0bb}
.note:empty{display:none}
.note{background:var(--gold-soft);border:1px solid rgba(47,194,154,.3);color:#0a6b77;border-radius:var(--r-sm);
  padding:14px 16px;font-size:13px;margin:18px 0;line-height:1.6}
.kpi-row{display:flex;gap:34px;flex-wrap:wrap;margin-top:32px}
.kpi-row .k{font-size:13px;color:var(--slate);font-weight:500}
.kpi-row .k b{display:block;font-size:28px;color:var(--navy);font-weight:800;letter-spacing:-1px}
.hide{display:none}

/* micro-interactions + elevation */
@keyframes psUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion: no-preference){
  .hero .scanbox{animation:psUp .6s ease .06s both}
  .reveal{opacity:0;transform:translateY(20px)}
  .reveal.in{opacity:1;transform:none;transition:opacity .6s cubic-bezier(.2,.7,.2,1), transform .6s cubic-bezier(.2,.7,.2,1)}
}
::selection{background:var(--gold-soft);color:var(--navy)}
.grad{background:linear-gradient(100deg,var(--blue),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
/* button sheen */
.btn{position:relative;overflow:hidden}
.btn:after{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.28),transparent);transform:skewX(-18deg);transition:left .6s ease}
.btn:hover:after{left:140%}
/* stats band */
.statsband{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;text-align:center;
  background:linear-gradient(135deg,var(--navy),var(--navy-2));border-radius:18px;padding:38px 28px;color:#fff;
  box-shadow:var(--shadow)}
@media(max-width:760px){.statsband{grid-template-columns:1fr;gap:18px}}
.statsband .s .n{font-size:42px;font-weight:800;letter-spacing:-1.5px;line-height:1}
.statsband .s .l{opacity:.82;font-size:13.5px;margin-top:6px}
.statsband .s .n .u{color:var(--gold-2)}
/* testimonials */
.quote{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:24px;box-shadow:var(--shadow-sm)}
.quote p{color:var(--ink);font-size:15px;line-height:1.6}
.quote .who{display:flex;align-items:center;gap:10px;margin-top:14px}
.quote .av{width:38px;height:38px;border-radius:50%;background:var(--gold-soft);color:#0a6b77;display:grid;place-items:center;font-weight:700}
.quote .who b{color:var(--navy);font-size:14px;display:block} .quote .who span{color:var(--mut);font-size:12px}
.stars{color:#e2a52b;font-size:14px;letter-spacing:1px}
/* comparison table */
.cmp{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.cmp th,.cmp td{padding:14px 16px;text-align:center;border-top:1px solid var(--line-2);font-size:14px}
.cmp th:first-child,.cmp td:first-child{text-align:left;color:var(--ink);font-weight:500}
.cmp thead th{background:var(--bg-2);color:var(--navy);font-weight:700;border-top:none}
.cmp thead th.us{background:var(--navy);color:#fff}
.cmp td.us{background:#f0fbfc;font-weight:700}
.cmp .yes{color:var(--green);font-weight:700} .cmp .no{color:var(--mut)}
/* back to top */
#toTop{position:fixed;right:20px;bottom:20px;width:44px;height:44px;border-radius:50%;background:var(--navy);color:#fff;
  border:none;font-size:18px;cursor:pointer;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:.25s;z-index:60}
#toTop.show{opacity:1;pointer-events:auto}
#toTop:hover{background:var(--navy-2);transform:translateY(-2px)}
/* accessible focus + nav depth on scroll */
a:focus-visible,button:focus-visible,.btn:focus-visible,input:focus-visible,select:focus-visible{
  outline:3px solid rgba(14,107,84,.45);outline-offset:2px;border-radius:6px}
.nav{transition:box-shadow .25s ease, background .25s ease}
.nav.scrolled{box-shadow:0 6px 22px rgba(11,27,51,.08);background:rgba(255,255,255,.96)}
/* gently drifting hero accent (subtle, premium) */
.hero{position:relative;overflow:hidden}
.hero > .container{position:relative;z-index:1}
@media (prefers-reduced-motion: no-preference){
  .hero:before{content:"";position:absolute;inset:-25%;pointer-events:none;
    background:radial-gradient(620px 320px at 72% 18%,rgba(47,194,154,.12),transparent 60%);
    animation:heroDrift 16s ease-in-out infinite}
}
@keyframes heroDrift{0%,100%{transform:translate(0,0)}50%{transform:translate(-4%,3%)}}
/* second, slower counter-drifting accent for depth */
@media (prefers-reduced-motion: no-preference){
  .hero:after{content:"";position:absolute;inset:-25%;pointer-events:none;z-index:0;
    background:radial-gradient(520px 300px at 18% 88%,rgba(14,107,84,.10),transparent 62%);
    animation:heroDrift2 22s ease-in-out infinite}
}
@keyframes heroDrift2{0%,100%{transform:translate(0,0)}50%{transform:translate(5%,-3%)}}

/* skip-to-content link (a11y) */
.skip-link{position:fixed;top:-60px;left:12px;z-index:10000;background:var(--navy);color:#fff;
  padding:10px 16px;border-radius:8px;font-weight:600;text-decoration:none;transition:top .18s ease}
.skip-link:focus{top:12px;outline:3px solid var(--cyan);outline-offset:2px}

/* animated "live scan" ticker inside the hero scanbox */
.scanticker{margin-top:14px;border-top:1px dashed var(--line);padding-top:12px;font-size:12.5px;color:var(--slate);min-height:20px}
.scanticker b{color:var(--navy)}
.scanticker .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#d23a35;margin-right:7px;vertical-align:middle;animation:blip 1.1s ease-in-out infinite}
@keyframes blip{0%,100%{opacity:1}50%{opacity:.25}}
@media (prefers-reduced-motion: reduce){.scanticker .dot{animation:none}}

/* "see the proof" home demo */
.proofcta{display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:center;text-align:center;flex-direction:column}

/* ===================== support chatbot popup ===================== */
#psbot-launch{position:fixed;right:22px;bottom:22px;z-index:9998;width:58px;height:58px;border-radius:50%;
  border:none;background:var(--blue);color:#fff;cursor:pointer;box-shadow:0 10px 26px rgba(14,107,84,.42);
  font-size:24px;display:grid;place-items:center;transition:transform .15s, box-shadow .15s}
#psbot-launch:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 14px 32px rgba(14,107,84,.5)}
#psbot-launch .ic{line-height:1}
#psbot-panel{position:fixed;right:22px;bottom:92px;z-index:9999;width:370px;max-width:calc(100vw - 32px);
  height:520px;max-height:calc(100vh - 130px);background:var(--card);border:1px solid var(--line);
  border-radius:18px;box-shadow:0 30px 70px rgba(14,27,45,.34);overflow:hidden;display:none;flex-direction:column}
#psbot-panel.on{display:flex;animation:psbotUp .22s ease}
@keyframes psbotUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){#psbot-panel.on{animation:none}}
.psbot-head{display:flex;align-items:center;gap:11px;padding:14px 16px;background:linear-gradient(135deg,var(--navy),var(--navy-2));color:#fff}
.psbot-head .av{width:36px;height:36px;border-radius:50%;background:var(--cyan);display:grid;place-items:center;color:#06212a;font-weight:800;flex:0 0 auto}
.psbot-head b{font-size:15px} .psbot-head .st{font-size:11.5px;color:#a8e6ec}
.psbot-head #psbot-x{margin-left:auto;background:none;border:none;color:#cfe0f0;font-size:22px;cursor:pointer;line-height:1}
.psbot-body{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;background:var(--bg)}
.psbot-msg{max-width:84%;padding:10px 13px;border-radius:13px;font-size:14px;line-height:1.5}
.psbot-msg.bot{background:var(--card);border:1px solid var(--line);color:var(--ink);align-self:flex-start;border-bottom-left-radius:4px}
.psbot-msg.me{background:var(--blue);color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.psbot-msg.bot a{color:var(--blue);font-weight:600}
.psbot-cta{display:inline-block;margin-top:8px;background:var(--blue);color:#fff !important;padding:7px 13px;border-radius:18px;font-weight:700;font-size:12.5px;text-decoration:none}
.psbot-chips{display:flex;flex-wrap:wrap;gap:7px;padding:0 14px 10px;background:var(--card);max-height:96px;overflow-y:auto}
.psbot-chip{background:var(--card);border:1px solid var(--line);color:var(--navy);border-radius:18px;padding:7px 12px;font-size:12.5px;font-weight:600;cursor:pointer}
.psbot-chip:hover{border-color:var(--blue);color:var(--blue)}
.psbot-input{display:flex;gap:8px;padding:12px 14px;border-top:1px solid var(--line);background:var(--card)}
.psbot-input input{flex:1;border:1px solid var(--line);border-radius:22px;padding:10px 14px;font-size:14px;outline:none;background:var(--bg-2);color:var(--ink)}
.psbot-input input:focus{border-color:var(--blue)}
.psbot-input .btn{padding:10px 16px}
.psbot-typing{align-self:flex-start;display:flex;gap:4px;padding:11px 13px}
.psbot-typing span{width:6px;height:6px;border-radius:50%;background:#b8c4d6;animation:psbotTb 1s infinite}
.psbot-typing span:nth-child(2){animation-delay:.15s}.psbot-typing span:nth-child(3){animation-delay:.3s}
@keyframes psbotTb{0%,60%,100%{opacity:.3}30%{opacity:1}}
[data-theme="dark"] .psbot-msg.bot{background:#0f1d34;color:var(--ink);border-color:var(--line)}
[data-theme="dark"] .psbot-chip,[data-theme="dark"] .psbot-input input{color:#dbe6f5}
#psbot-nudge{position:fixed;right:90px;bottom:30px;z-index:9998;background:var(--card);border:1px solid var(--line);
  color:var(--ink);border-radius:22px;padding:11px 16px 11px 18px;font-size:13.5px;font-weight:600;
  box-shadow:0 12px 30px rgba(14,27,45,.22);display:none;align-items:center;gap:10px;cursor:pointer;max-width:230px}
#psbot-nudge.on{display:flex;animation:psbotUp .25s ease}
#psbot-nudge:after{content:"";position:absolute;right:-7px;bottom:18px;width:12px;height:12px;background:var(--card);
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(-45deg)}
#psbot-nudge #psbot-nudge-x{background:none;border:none;color:var(--mut);font-size:18px;line-height:1;cursor:pointer;padding:0 0 0 2px}
@media(max-width:560px){#psbot-nudge{display:none !important}}
@media print{#psbot,#psbot-launch,#psbot-panel,#psbot-nudge{display:none !important}}

/* ===================== dark theme (premium, color-matched) ===================== */
.themebtn{background:none;border:1px solid var(--line);color:var(--slate);width:38px;height:38px;
  border-radius:50%;cursor:pointer;font-size:15px;display:grid;place-items:center;flex:0 0 auto;transition:.15s}
.themebtn:hover{border-color:var(--blue);color:var(--blue)}
/* smooth, premium transition when switching themes */
body,.nav,.card,.tier,.kpi,.stat,.quote,.panel,.input,.table,.cmp,.footer,.msg,.chip,.cyc,.gcard,.scanbox,.alert,.note,.pill{
  transition:background-color .28s ease, border-color .28s ease, color .28s ease}

[data-theme="dark"]{
  /* layered blue-charcoal surfaces — bg darkest, cards lifted above it */
  --bg:#0b1322; --bg-2:#0f1a2e; --card:#15233e; --card-2:#1d2f4f;
  --line:#28384f; --line-2:#1a2740;
  /* soft, easy-on-the-eyes text ramp (mut bumped for WCAG AA contrast) */
  --ink:#e9eff8; --slate:#b3c1d6; --mut:#96a7be;
  /* --blue is the action color: brand green, solid enough for white-on-green buttons */
  --blue:#128C6E; --blue-2:#0E6B54; --cyan:#2FC29A;
  --gold:#2FC29A; --gold-2:#57D3B0; --gold-soft:#0E2A22;
  --green:#3ddc84; --amber:#f2c14e; --red:#f87171;
  --shadow:0 18px 50px rgba(0,0,0,.55); --shadow-sm:0 8px 22px rgba(0,0,0,.4);
}
[data-theme="dark"] body{background:
  radial-gradient(1100px 620px at 82% -8%, rgba(47,194,154,.07), transparent 60%),
  radial-gradient(1000px 600px at -6% 8%, rgba(47,194,154,.045), transparent 60%),
  var(--bg);
  background-attachment:fixed; color:var(--ink)}

/* surfaces that were white in light mode */
[data-theme="dark"] .tier,[data-theme="dark"] .stat,[data-theme="dark"] .alert,[data-theme="dark"] .panel,
[data-theme="dark"] .quote,[data-theme="dark"] .cmp,[data-theme="dark"] .table,[data-theme="dark"] .chat,
[data-theme="dark"] .cbody,[data-theme="dark"] .cyc,[data-theme="dark"] .kpi{background:var(--card);color:var(--ink)}
[data-theme="dark"] [style*="background:#fff"]{background:var(--card) !important;border-color:var(--line) !important}
/* lift cards subtly and warm the border on hover for depth */
[data-theme="dark"] .card:hover,[data-theme="dark"] .gcard:hover{border-color:#34507a;box-shadow:var(--shadow)}

/* headings & navy-coloured text → light */
[data-theme="dark"] h1,[data-theme="dark"] h2,[data-theme="dark"] h3,[data-theme="dark"] h4,
[data-theme="dark"] .brand,[data-theme="dark"] .h2,[data-theme="dark"] .hero h1,[data-theme="dark"] .scanbox h3,
[data-theme="dark"] .card h4,[data-theme="dark"] .tier h3,[data-theme="dark"] .price,[data-theme="dark"] .stat .n,
[data-theme="dark"] .kpi .n,[data-theme="dark"] .kpi-row .k b,[data-theme="dark"] .ddd .d,[data-theme="dark"] .alert b,
[data-theme="dark"] .quote .who b,[data-theme="dark"] .scanticker b,[data-theme="dark"] .gcard,
[data-theme="dark"] .sig,[data-theme="dark"] .addon b,[data-theme="dark"] [style*="color:var(--navy)"]{color:#eef4fc !important}
[data-theme="dark"] .cmp thead th:not(.us){background:var(--bg-2);color:#eef4fc}
[data-theme="dark"] .cmp thead th.us{background:var(--blue);color:#fff}     /* keep the idsealed column highlighted + legible */
[data-theme="dark"] .cmp td.us{background:rgba(84,160,255,.12)}
[data-theme="dark"] .cmp td,[data-theme="dark"] .table td{color:var(--ink)}
[data-theme="dark"] .cmp td:first-child{color:#eef4fc}

/* accent chips that sat on a pale teal tint */
[data-theme="dark"] .pill,[data-theme="dark"] .card .ic,[data-theme="dark"] .note,[data-theme="dark"] .quote .av{color:#62e6d8}
[data-theme="dark"] .note{border-color:rgba(43,214,198,.3)}

/* nav + links */
[data-theme="dark"] .nav{background:rgba(11,19,34,.86);backdrop-filter:blur(14px)}
[data-theme="dark"] .nav.scrolled{background:rgba(11,19,34,.95);box-shadow:0 6px 22px rgba(0,0,0,.5)}
[data-theme="dark"] .nav-links a{color:#b3c1d6}
[data-theme="dark"] .nav-links a:hover,[data-theme="dark"] .nav-links a.on{color:#4ED0A8}
[data-theme="dark"] a{color:#4ED0A8}            /* readable links on dark (buttons keep white via .btn) */
[data-theme="dark"] .grad{background:linear-gradient(100deg,#5aa0ff,#34e0d0);-webkit-background-clip:text;background-clip:text;color:transparent}
[data-theme="dark"] .footer a{color:#c3d2e4}
[data-theme="dark"] .footer a:hover{color:#fff}

/* inputs */
[data-theme="dark"] .input{background:#0f1a2e;color:var(--ink);border-color:var(--line)}
[data-theme="dark"] .input:focus{background:#12203a;border-color:var(--blue);box-shadow:0 0 0 3px rgba(84,160,255,.18)}
[data-theme="dark"] ::placeholder{color:#6f819b}

/* buttons */
[data-theme="dark"] .btn.ghost{background:transparent;color:#dbe6f5;border-color:#33486a}
[data-theme="dark"] .btn.ghost:hover{border-color:var(--blue);color:#bcd6ff;background:rgba(84,160,255,.06)}
[data-theme="dark"] .btn.gold{background:#119b8c} [data-theme="dark"] .btn.gold:hover{background:#15b0a0}

/* chatbot + chips */
[data-theme="dark"] .chip,[data-theme="dark"] .copy{background:var(--card);color:#dbe6f5;border-color:var(--line)}
[data-theme="dark"] .chip:hover{border-color:var(--blue);color:#bcd6ff}
[data-theme="dark"] .msg.bot{background:#0f1d34;color:var(--ink);border-color:var(--line)}
[data-theme="dark"] .msg.bot a{color:#4ED0A8}
[data-theme="dark"] .chips{background:var(--card)}

/* status badges → translucent, glowing */
[data-theme="dark"] .b-removed{background:rgba(61,220,132,.16);color:#5fe6a0}
[data-theme="dark"] .b-progress{background:rgba(84,160,255,.16);color:#86b8ff}
[data-theme="dark"] .b-human{background:rgba(242,193,78,.16);color:#f3cd73}
[data-theme="dark"] .b-found{background:rgba(248,113,113,.16);color:#fb918c}

/* onboarding selected plan, pricing add-on */
[data-theme="dark"] .planopt{border-color:var(--line)}
[data-theme="dark"] .planopt.sel{background:rgba(84,160,255,.12);box-shadow:0 0 0 3px rgba(84,160,255,.16)}

/* richer hero glows on dark */
@media (prefers-reduced-motion: no-preference){
  [data-theme="dark"] .hero:before{background:radial-gradient(640px 340px at 74% 16%,rgba(43,214,198,.20),transparent 62%)}
  [data-theme="dark"] .hero:after{background:radial-gradient(560px 320px at 16% 88%,rgba(84,160,255,.18),transparent 64%)}
}
[data-theme="dark"] ::selection{background:rgba(43,214,198,.28);color:#eef4fc}
[data-theme="dark"] .footer{border-top-color:var(--cyan)}

/* print: clean dashboards & reports on paper (hide chrome/interactive bits) */
@media print{
  .nav,.footer,#toTop,.skip-link,.scanticker,#ticker,.btn,.proofcta button{display:none !important}
  body{background:#fff !important;color:#000}
  .reveal{opacity:1 !important;transform:none !important}
  .card,.tier,.kpi,.quote,.statsband,.cmp,.table{box-shadow:none !important;border-color:#ccc !important;break-inside:avoid}
  a[href]:after{content:""}
  section.block{padding:14px 0 !important}
  .hero:before,.hero:after{display:none !important}
}

/* mobile */
@media(max-width:760px){
  /* stack any remaining 2-col / fixed-width grids (incl. inline styles, via !important) */
  #topgrid, #sacredGrid, .ctad, .tgrid, .charts{grid-template-columns:1fr !important}
  /* wide tables scroll instead of overflowing the page */
  .table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
}
@media(max-width:680px){
  html{-webkit-text-size-adjust:100%}
  .container{padding:0 18px}
  .hero{padding:40px 0 26px}
  .hero h1{font-size:30px;line-height:1.12}
  .hero p.sub{font-size:16.5px}
  .ddd li{padding-left:28px}
  .h2{font-size:26px}
  h1{font-size:34px}
  section.block{padding:42px 0}
  .scanbox{padding:22px}
  .card{padding:22px}
  .tier{padding:24px}
  .table{white-space:nowrap}
  .btn.lg{padding:14px 22px;font-size:15px}
  /* full-width primary actions read better on phones */
  .hero .btn.lg,.center .btn.lg{width:100%;justify-content:center}
  .footer .container{grid-template-columns:1fr 1fr;gap:22px}
  /* comfortable tap targets */
  .nav-links a,.btn,.chip,.qtopic{min-height:44px;display:inline-flex;align-items:center}
  .price{font-size:40px}
  .statsband .s .n{font-size:36px}
}
@media(max-width:480px){
  /* stack the 2-up form/field rows on small phones */
  [style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr !important}
  .container{padding:0 15px}
  .hero h1{font-size:27px}
  .h2{font-size:23px}
  h1{font-size:29px}
  .pill{font-size:11px}
  .btn{font-size:14.5px}
  .quote{padding:20px}
  /* chat popup goes essentially full-width on tiny screens */
  #psbot-panel{right:10px;left:10px;width:auto;bottom:84px}
  #psbot-launch{right:16px;bottom:16px}
}

/* ============================================================================
   bespoke v3 — "balanced matrix-tech" layer
   Clean trust layout underneath; tech DNA woven through: mono data accents,
   faint engineering grid, terminal ticker, mint glow. Symmetric + smooth.
   ========================================================================== */

/* two-tone wordmark: "id" mint · "sealed" ink (auto-adapts to dark + footer) */
.brand .wm{letter-spacing:-.5px}
.brand .wm{color:var(--cyan);font-weight:700}
.brand .wm b{color:var(--navy);font-weight:800}
.footer .brand .wm b{color:#fff}
[data-theme="dark"] .brand .wm b{color:#e9eff8}

/* selection + focus — small touches that read as craftsmanship */
::selection{background:rgba(47,194,154,.30)}
a:focus-visible,.btn:focus-visible,button:focus-visible,.input:focus-visible{
  outline:2px solid var(--cyan);outline-offset:2px;border-radius:6px}

/* engineering grid behind the hero — fades out radially, never busy */
.hero{position:relative}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(11,27,51,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(11,27,51,.05) 1px,transparent 1px);
  background-size:42px 42px;
  -webkit-mask-image:radial-gradient(720px 420px at 74% -4%,#000 30%,transparent 72%);
  mask-image:radial-gradient(720px 420px at 74% -4%,#000 30%,transparent 72%)}
.hero>.container{position:relative}
[data-theme="dark"] .hero::before{
  background-image:linear-gradient(rgba(47,194,154,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(47,194,154,.07) 1px,transparent 1px)}

/* gradient headline accent */
.grad{background:linear-gradient(98deg,var(--cyan) 4%,var(--blue) 92%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
[data-theme="dark"] .grad{background:linear-gradient(98deg,#57D3B0 4%,#2FC29A 92%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* buttons: soft gradient + lift; press feedback */
.btn{background:linear-gradient(180deg,#128C6E,var(--blue))}
.btn:hover{background:linear-gradient(180deg,#0F7A5F,var(--blue-2))}
.btn:active{transform:translateY(0);box-shadow:0 2px 6px rgba(14,107,84,.2)}
.btn.ghost,.btn.dark{background:#fff}
.btn.dark{background:var(--navy)}
[data-theme="dark"] .btn.ghost{background:transparent}

/* data values speak in mono — the tech tell */
.pill,.field label,.kpi-row .k b,.stat .n,.streak .n,.sim .big,.wywa-stat .wn,
.scanticker,.badge{font-family:var(--mono);font-variant-numeric:tabular-nums}
.pill{letter-spacing:1.1px;font-size:11px}

/* terminal ticker with a live cursor */
.scanticker{font-size:12px}
.scanticker::after{content:"▌";color:var(--cyan);margin-left:2px;
  animation:cursorBlink 1.05s steps(1) infinite}
@keyframes cursorBlink{0%,49%{opacity:1}50%,100%{opacity:0}}

/* cards: mint edge on hover — consistent, calm */
.card:hover,.tier:hover{border-color:rgba(47,194,154,.45)}
.tier{transition:.2s}

/* symmetric section rhythm */
section.block{padding:76px 0}
@media(max-width:680px){section.block{padding:52px 0}}

/* slim scrollbar, brand thumb */
*{scrollbar-width:thin;scrollbar-color:rgba(47,194,154,.5) transparent}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:rgba(47,194,154,.45);border-radius:8px}
::-webkit-scrollbar-track{background:transparent}

/* respect reduced motion everywhere */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;
    transition-duration:.01ms !important;scroll-behavior:auto !important}
}

/* sticky scan CTA (retention hook on marketing pages) */
.stickycta{position:fixed;left:50%;transform:translateX(-50%) translateY(90px);bottom:18px;z-index:60;
  display:flex;align-items:center;gap:14px;background:linear-gradient(135deg,var(--navy),var(--navy-2));
  color:#fff;border:1px solid rgba(47,194,154,.35);border-radius:999px;padding:10px 10px 10px 20px;
  box-shadow:0 18px 50px rgba(11,27,51,.35);transition:transform .35s cubic-bezier(.34,1.3,.4,1);opacity:0}
.stickycta.show{transform:translateX(-50%) translateY(0);opacity:1}
.stickycta .t{font-size:13.5px;font-weight:600;white-space:nowrap}
.stickycta .t b{color:#9fe6c4}
.stickycta .go{background:linear-gradient(180deg,#2FC29A,#128C6E);color:#06211a;font-weight:800;
  font-size:13.5px;border:none;border-radius:999px;padding:9px 18px;cursor:pointer;white-space:nowrap}
.stickycta .x{background:none;border:none;color:rgba(255,255,255,.55);font-size:16px;cursor:pointer;padding:4px 8px 4px 0}
@media(max-width:560px){.stickycta{width:calc(100% - 24px)}.stickycta .t{font-size:12.5px;white-space:normal}}

/* ============================================================================
   mobile excellence layer — nothing loses quality on a phone, some things gain
   ========================================================================== */
@media(max-width:680px){
  /* iOS: inputs under 16px trigger auto-zoom — never let that happen */
  .input,.lg-input,input,select,textarea{font-size:16px !important}
  /* comfortable thumb targets (Apple HIG: 44pt minimum) */
  .btn,.nav-links a.btn,.themebtn,.loginlink{min-height:44px}
  .nav-links a{padding:8px 2px}
  /* fluid headline scale — big impact, never clipped */
  .hero h1{font-size:clamp(30px,8.5vw,38px)}
  .h2{font-size:clamp(24px,6.5vw,30px)}
  /* tables scroll sideways instead of crushing */
  .table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}
  /* cards breathe on small screens */
  .card{padding:20px}
  .scanbox{padding:22px 18px}
  /* the sticky CTA respects the home-indicator area */
  .stickycta{bottom:calc(12px + env(safe-area-inset-bottom))}
  /* wywa banner stats stack cleanly */
  .wywa-row{gap:10px}
  .wywa-stat{min-width:calc(50% - 6px)}
}
/* touch devices: replace hover lifts with press feedback (no dead hover states) */
@media(hover:none){
  .card:hover,.tier:hover{transform:none}
  .btn:active{transform:scale(.98)}
  .card:active{border-color:rgba(47,194,154,.45)}
}
/* very small phones */
@media(max-width:380px){
  .container{padding:0 18px}
  .kpi-row{gap:10px}
  .brand{font-size:18px}
}

/* ============================================================================
   light mode, elevated — warm, alive, never flat
   ========================================================================== */
:root:not([data-theme="dark"]) body, [data-theme="light"] body{
  background:
    radial-gradient(1200px 700px at 85% -12%, rgba(47,194,154,.075), transparent 55%),
    radial-gradient(900px 560px at -8% 12%, rgba(14,107,84,.05), transparent 55%),
    var(--bg);
  background-attachment:fixed}
[data-theme="light"] .card,:root:not([data-theme="dark"]) .card{
  border-top:1px solid #fff}  /* subtle top highlight = physical depth */
[data-theme="light"] .card:hover,:root:not([data-theme="dark"]) .card:hover{
  box-shadow:0 18px 44px rgba(11,27,51,.12),0 0 0 1px rgba(47,194,154,.25)}
/* light nav gets the mint hairline treatment */
:root:not([data-theme="dark"]) .nav,[data-theme="light"] .nav{
  border-bottom:1px solid transparent;
  background:linear-gradient(rgba(255,255,255,.92),rgba(255,255,255,.92)) padding-box,
    linear-gradient(90deg,transparent,rgba(47,194,154,.5),transparent) border-box}
/* pills glow softly in light */
:root:not([data-theme="dark"]) .pill,[data-theme="light"] .pill{
  box-shadow:0 3px 14px rgba(47,194,154,.16)}
/* stat numbers get the mint underline flourish */
.stat .n{position:relative}
.stat .n::after{content:"";position:absolute;left:50%;bottom:-4px;width:22px;height:2.5px;
  transform:translateX(-50%);border-radius:2px;background:linear-gradient(90deg,var(--cyan),transparent);opacity:.65}

/* ============================================================================
   matrix accents — measured, never loud
   ========================================================================== */
/* footer: terminal statusline + faint grid texture */
.footer{position:relative;overflow:hidden}
.footer::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(47,194,154,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(47,194,154,.045) 1px,transparent 1px);
  background-size:40px 40px;
  -webkit-mask-image:radial-gradient(700px 320px at 85% 110%,#000 20%,transparent 75%);
  mask-image:radial-gradient(700px 320px at 85% 110%,#000 20%,transparent 75%)}
.footer .container{position:relative}
.footer .term{grid-column:1/-1;margin-top:14px;font-family:var(--mono);font-size:10px;
  letter-spacing:2px;color:#54718f;text-align:center}
.footer .term .tcur{color:var(--cyan);margin-left:3px;animation:cursorBlink 1.05s steps(1) infinite}
@media(max-width:680px){.footer .term{font-size:8.5px;letter-spacing:1.2px}}

/* dashboard gauge card: slow scanline sweep — the score feels *live* */
.gauge-card{position:relative;overflow:hidden}
.gauge-card::after{content:"";position:absolute;left:0;right:0;top:-45%;height:38%;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(47,194,154,.04) 45%,rgba(47,194,154,.10) 50%,rgba(47,194,154,.04) 55%,transparent);
  animation:gaugeScan 9s linear infinite}
@keyframes gaugeScan{0%{top:-45%}100%{top:135%}}
@media (prefers-reduced-motion: reduce){.gauge-card::after{display:none}}

/* mobile flourish: the phone experience gets its own moments, not leftovers */
@media(max-width:680px){
  /* hero grid texture tightens so it reads on a narrow viewport */
  .hero::before{background-size:34px 34px;
    -webkit-mask-image:radial-gradient(420px 340px at 78% -4%,#000 25%,transparent 74%);
    mask-image:radial-gradient(420px 340px at 78% -4%,#000 25%,transparent 74%)}
  /* founding gate: numbers stay huge, meter stays dramatic */
  .gate-h{font-size:clamp(23px,7vw,28px)}
  .gate-pos{font-size:29px}
  .gate-meter{padding:13px 14px}
  .gate-share{flex-direction:column}
  /* wywa banner keeps its glow without crowding */
  .wywa-head{font-size:14px}
  /* footer statusline wraps gracefully */
  .footer .term{line-height:1.9;white-space:normal}
}

/* ============================================================================
   v4 — the hero is ALWAYS the dark matrix moment (both themes).
   Drama above the fold, clean reading below. Highest-converting split.
   ========================================================================== */
.hero{background:
  radial-gradient(900px 460px at 80% -10%,rgba(47,194,154,.16),transparent 60%),
  radial-gradient(700px 420px at 6% 4%,rgba(47,194,154,.07),transparent 55%),
  linear-gradient(168deg,#081020 0%,#0B1B33 55%,#0a1f30 100%) !important;
  border-bottom:1px solid rgba(47,194,154,.22)}
.hero::before{background-image:linear-gradient(rgba(47,194,154,.07) 1px,transparent 1px),
  linear-gradient(90deg,rgba(47,194,154,.07) 1px,transparent 1px) !important}
.hero h1{color:#fff !important}
.hero p.sub{color:#a9bcd6 !important}
.hero .ddd li{color:#b6c6dc;border-bottom-color:rgba(255,255,255,.08)}
.hero .ddd .d{color:#fff}
.hero .pill{background:rgba(47,194,154,.12);color:#8fddc4;border-color:rgba(47,194,154,.35)}
.hero .kpi-row .k{color:#8fa3bd}
.hero .kpi-row .k b{color:#2FC29A}
.hero .btn.ghost{background:transparent;color:#cdd8ec;border-color:rgba(255,255,255,.22)}
.hero .btn.ghost:hover{border-color:#2FC29A;color:#2FC29A}
/* the scan box is the vault window inside the dark hero */
.hero .scanbox{background:linear-gradient(180deg,rgba(13,26,48,.92),rgba(10,21,38,.95));
  border:1px solid rgba(47,194,154,.3);box-shadow:0 30px 80px rgba(0,0,0,.4)}
.hero .scanbox h3{color:#fff}
.hero .scanbox .muted{color:#8fa3bd !important}
.hero .scanbox b{color:#cdd8ec}
.hero .scanbox .field label{color:#7a90ac}
.hero .scanbox .input{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16);color:#fff}
.hero .scanbox .input::placeholder{color:#6d83a1}
.hero .scanbox .input:focus{background:rgba(255,255,255,.09);border-color:#2FC29A;box-shadow:0 0 0 3px rgba(47,194,154,.16)}
.hero .scanticker{color:#7fa895}

/* ============================================================================
   mobile nav — polished top bar: brand + theme up top, buttery swipe row below
   ========================================================================== */
html{-webkit-tap-highlight-color:transparent}
@media(max-width:820px){
  .nav{backdrop-filter:none;background:var(--card)}      /* no blur = no scroll jank */
  [data-theme="dark"] .nav{background:#0d1830}
  .nav .container{position:relative;padding-top:10px;padding-bottom:8px}
  .brand{height:44px;display:inline-flex;align-items:center;flex:none}
  .brand .logo{width:24px;height:31px}
  .brand .wm{font-size:19px}
  .themebtn{position:absolute;top:10px;right:20px;width:40px;height:40px}
  .nav-links{padding-right:0;scrollbar-width:none}
  .nav-links::-webkit-scrollbar{display:none}
  .nav-links a.btn{padding:9px 16px;min-height:38px}
  .nav-links a.loginlink{padding:6px 13px}
  /* fade hint that the row scrolls */
  .nav .container::after{content:"";position:absolute;right:0;bottom:8px;width:34px;height:34px;
    pointer-events:none;background:linear-gradient(90deg,transparent,var(--card))}
  [data-theme="dark"] .nav .container::after{background:linear-gradient(90deg,transparent,#0d1830)}
}

/* ============================================================================
   homepage live seal map
   ========================================================================== */
.sealmap{position:relative;border:1px solid rgba(47,194,154,.3);border-radius:18px;overflow:hidden;
  background:radial-gradient(120% 120% at 50% 0%,#0a1828,#070f1a);box-shadow:0 30px 80px rgba(11,27,51,.35)}
.sealmap .head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
  padding:15px 18px;border-bottom:1px solid rgba(47,194,154,.18)}
.sealmap .head .t{font-family:var(--mono);font-size:12px;letter-spacing:1.8px;color:#8fddc4}
.sealmap .head .n{font-family:var(--mono);font-size:12px;color:#cdd8ec}
.sealmap .head .n b{color:#2FC29A;font-size:15px}
.sealmap svg{display:block;width:100%;height:auto}
.sealmap .cap{position:absolute;left:16px;bottom:13px;font-family:var(--mono);font-size:11px;
  color:#7fa895;background:rgba(7,15,26,.75);border:1px solid rgba(47,194,154,.25);
  border-radius:8px;padding:6px 11px;max-width:75%;transition:opacity .4s}
@keyframes sealPing{0%{r:3;opacity:.95}100%{r:26;opacity:0}}
.sealmap .ping{animation:sealPing 2.2s ease-out forwards}
@media(max-width:680px){.sealmap .head{padding:12px 14px}.sealmap .cap{font-size:9.5px}}
