/* Shared design system for the marketing site's two product pages: the
   dual-product homepage and /agent/. Lifted verbatim out of the old
   single-page homepage, so both render from one source instead of two
   copies drifting apart. */
:root{
  --page:#f7f8f6;
  --surface:#ffffff;
  --surface-muted:#eef3f1;
  --ink:#111827;
  --text:#334155;
  --muted:#64748b;
  --line:#dbe3df;
  --line-strong:#bcc9c4;
  --accent:#4f46e5;
  --accent-dark:#4338ca;
  --teal:#4f46e5;
  --teal-soft:#eef2ff;
  --red:#b42318;
  --red-soft:#fee4df;
  --amber:#b54708;
  --amber-soft:#fff1d6;
  --violet:#6d28d9;
  --violet-soft:#eee7ff;
  --night:#111827;
  --night-soft:#1f2937;
  --max:1320px;
  --radius:8px;
  --shadow:0 20px 50px -36px rgba(17,24,39,.35),0 1px 2px rgba(17,24,39,.08);
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--page);color:var(--text);font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:16px;line-height:1.58;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.modal-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
img{max-width:100%;display:block}
::selection{background:var(--accent);color:#fff}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
.eyebrow{font-family:var(--mono);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:0;color:var(--teal)}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{color:var(--ink);letter-spacing:0;line-height:1.08}
h2 .hl,h3 .hl{color:var(--accent)}
h1{font-size:64px;font-weight:850;margin-bottom:22px}
h2{font-size:42px;font-weight:820;margin-bottom:16px}
h3{font-size:20px;font-weight:760;margin-bottom:8px}
p{margin-bottom:0}
.lead{font-size:22px;line-height:1.55;color:var(--text);max-width:860px;text-align:justify}
.section-lead{font-size:18px;color:var(--text);max-width:760px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:11px 17px;border-radius:8px;border:1px solid transparent;background:var(--accent);color:#fff;font-weight:750;font-size:14px;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease,color .16s ease}
.btn:hover{transform:translateY(-1px);background:var(--accent-dark);box-shadow:0 16px 28px -22px rgba(37,99,235,.8)}
.btn:focus-visible,.field input:focus,.field select:focus,.field textarea:focus{outline:3px solid rgba(37,99,235,.2);outline-offset:2px}
.btn.secondary{background:var(--surface-muted);border-color:var(--line);color:var(--ink)}
.btn.secondary:hover{background:#e8ede9}
.btn.ghost{background:#fff;color:var(--ink);border-color:var(--line)}
.btn.ghost:hover{background:#f8faf9;border-color:var(--line-strong);box-shadow:none}
.btn.text{background:transparent;color:var(--ink);padding-inline:6px;border-color:transparent}
.btn.text:hover{box-shadow:none;background:transparent;color:var(--accent)}
.btn-purple{background:var(--accent);color:#fff}
.btn-purple:hover{background:var(--accent-dark);box-shadow:0 16px 28px -22px rgba(37,99,235,.8)}
.btn-white{background:#fff;color:var(--ink);border-color:var(--line)}
.btn-white:hover{background:#f8faf9;border-color:var(--line-strong);box-shadow:none}
.icon{width:18px;height:18px;flex:0 0 auto}

.site-header{position:sticky;top:0;z-index:50;background:rgba(247,248,246,.88);backdrop-filter:blur(16px) saturate(1.2);border-bottom:1px solid rgba(219,227,223,.85)}
.nav{position:relative;height:72px;display:flex;align-items:center;gap:24px}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink);font-weight:850;font-size:18px;white-space:nowrap}
.brand img{width:31px;height:31px}
.brand span span{color:var(--accent)}
.nav-links{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:22px}
.nav-links a{font-size:14px;font-weight:680;color:#475569}
.nav-links a:hover{color:var(--ink)}
.nav-actions{margin-left:auto;display:flex;align-items:center;gap:10px}
.menu-toggle{display:none;width:42px;height:42px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);align-items:center;justify-content:center}

.hero{position:relative;isolation:isolate;min-height:min(60vh,680px);display:flex;align-items:flex-start;overflow:hidden;background:radial-gradient(760px 380px at 50% 18%,rgba(79,70,229,.08),transparent 66%),radial-gradient(640px 360px at 92% 10%,rgba(238,242,255,.95),transparent 64%),radial-gradient(620px 360px at 4% 92%,rgba(79,70,229,.07),transparent 68%),linear-gradient(180deg,#fff 0%,#f8faf9 100%)}
/* The 1px rule plus the lower ring being sliced by overflow:hidden read as a hard
   cut across the seam. .hero-fade replaces both with a dissolve into the next
   section's opening colour (#fff). It clears the rings on z-index 0, but sits
   earlier in the DOM than .wrap, so the copy on z-index 1 stays crisp. */
.hero-fade{position:absolute;left:0;right:0;bottom:0;height:clamp(64px,14vh,140px);z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.72) 58%,#fff 100%)}
.hero:before{content:"";position:absolute;left:max(-330px,calc((100vw - var(--max))/2 - 360px));bottom:-360px;width:720px;aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(circle,rgba(79,70,229,.14) 0 2px,transparent 2px 54px);mask-image:radial-gradient(circle at center,#000 0 58%,transparent 76%);-webkit-mask-image:radial-gradient(circle at center,#000 0 58%,transparent 76%);opacity:.44;pointer-events:none;z-index:0}
.hero:after{content:"";position:absolute;right:max(-300px,calc((100vw - var(--max))/2 - 330px));top:-360px;width:760px;aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(circle,rgba(79,70,229,.16) 0 2px,transparent 2px 58px);mask-image:radial-gradient(circle at center,#000 0 56%,transparent 75%);-webkit-mask-image:radial-gradient(circle at center,#000 0 56%,transparent 75%);opacity:.38;pointer-events:none;z-index:0}
.hero .wrap{position:relative;z-index:1;width:100%;padding-top:clamp(48px,7vw,80px);padding-bottom:clamp(32px,5vw,52px);display:flex;flex-direction:column;align-items:center;text-align:center}
.hero-copy{min-width:0}
.hero-label{display:inline-flex;align-items:center;gap:10px;padding:7px 11px;border:1px solid rgba(219,227,223,.92);border-radius:999px;background:rgba(255,255,255,.74);box-shadow:0 18px 46px -34px rgba(79,70,229,.72);backdrop-filter:blur(12px);color:var(--ink);font-family:var(--mono);font-size:12px;font-weight:700;margin-bottom:24px}
.pulse{width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 5px rgba(34,197,94,.14)}
.hero h1{color:var(--ink);max-width:860px;font-size:clamp(32px,4.2vw + 14px,54px);line-height:1.1}
.hero .lead{text-align:center;margin-inline:auto}
.hero h1 em{font-style:normal;color:var(--teal)}
.hero h1 span{display:block;color:var(--text);font-size:36px;font-weight:720;margin-top:14px}
.hero h1 mark{background:none}
.hero h1 mark.h-ai{color:var(--accent)}
.hero h1 mark.h-live{color:var(--accent)}
.hero h1 .h-workflow{color:var(--muted);font-size:.72em;font-weight:700;display:block;margin-top:4px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px;justify-content:center}
.hero-proof{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px;max-width:860px;min-width:0;justify-content:center}
.proof-chip{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border-radius:999px;background:rgba(255,255,255,.74);border:1px solid rgba(219,227,223,.92);box-shadow:0 12px 32px -28px rgba(79,70,229,.75);backdrop-filter:blur(12px);color:var(--ink);font-size:11.5px;font-weight:650}
.proof-chip i{display:block;width:8px;height:8px;border-radius:50%;background:var(--teal)}
.hero-visual{position:relative;min-height:430px;display:grid;place-items:center}
.hero-visual:after{content:"";position:absolute;inset:56px 16px 18px;border-radius:18px;background:radial-gradient(circle at 50% 12%,rgba(45,212,191,.2),transparent 48%),rgba(79,70,229,.12);filter:blur(34px);pointer-events:none}
.decision-stack{position:relative;width:min(100%,540px);margin:auto}
.decision-stack:before{content:"";position:absolute;inset:-14px;border:1px solid rgba(199,210,254,.16);border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.018));box-shadow:0 34px 90px -58px rgba(0,0,0,.92)}
.decision-stack:after{content:"";position:absolute;left:30px;right:30px;bottom:-16px;height:28px;border-radius:999px;background:rgba(0,0,0,.36);filter:blur(22px)}
.command-surface{position:relative;z-index:2;border:1px solid rgba(199,210,254,.2);border-radius:10px;background:linear-gradient(180deg,rgba(15,23,42,.94),rgba(15,23,42,.82));backdrop-filter:blur(18px);box-shadow:0 30px 90px -58px rgba(0,0,0,.95),inset 0 1px 0 rgba(255,255,255,.12);overflow:hidden}
.command-surface:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(148,163,184,.06) 1px,transparent 1px),linear-gradient(rgba(148,163,184,.06) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(180deg,#000,transparent 78%);pointer-events:none}
.command-head{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 18px;border-bottom:1px solid rgba(199,210,254,.14);background:rgba(15,23,42,.58)}
.command-head b{display:block;color:#fff;font-size:14px}
.command-head span{display:block;color:#9fb0c4;font-family:var(--mono);font-size:11px;margin-top:2px}
.status-pill{display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(129,140,248,.28);border-radius:999px;padding:7px 10px;color:#c7d2fe;font-family:var(--mono);font-size:11px;font-weight:780;background:rgba(129,140,248,.08)}
.status-pill i{width:7px;height:7px;border-radius:50%;background:#22c55e}
.command-body{position:relative;z-index:1;padding:16px 18px;display:flex;flex-direction:column;gap:14px}
.candidate-card{border:1px solid rgba(255,255,255,.14);border-radius:8px;background:rgba(255,255,255,.08);padding:14px 16px;display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center}
.candidate-info{min-width:0}
.candidate-label{font-family:var(--mono);font-size:10px;text-transform:uppercase;color:#c7d2fe;font-weight:800;margin-bottom:8px;letter-spacing:.04em}
.candidate-name{color:#fff;font-size:22px;font-weight:850;line-height:1.1;margin-bottom:4px}
.candidate-role{color:#9fb0c4;font-size:12px}
.integrity-ring{position:relative;width:104px;height:104px;flex:0 0 auto}
.integrity-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.integrity-ring circle{fill:none;stroke-width:9}
.ring-track{stroke:rgba(255,255,255,.10)}
.ring-value{stroke:#ff5b46;stroke-linecap:round;stroke-dasharray:326.7;stroke-dashoffset:52;filter:drop-shadow(0 0 6px rgba(255,91,70,.45))}
.ring-label{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.ring-label b{font-family:var(--mono);font-size:26px;line-height:1;color:#fff;font-weight:800}
.ring-label span{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:#9fb0c4;font-weight:700}
.timeline{display:grid;gap:9px}
.timeline-row{display:grid;grid-template-columns:46px 1fr auto;gap:8px;align-items:center;padding:8px 9px;border-radius:8px;background:rgba(255,255,255,.085);border:1px solid rgba(255,255,255,.12)}
.timeline-row time{font-family:var(--mono);font-size:10px;color:#9fb0c4}
.timeline-row b{font-size:12px;color:#edf6f8}
.severity{font-family:var(--mono);font-size:10px;font-weight:800;border-radius:999px;padding:4px 7px;background:rgba(239,68,68,.16);color:#ffb4aa}
.severity.warn{background:rgba(245,158,11,.16);color:#ffd08a}.severity.ok{background:rgba(20,184,166,.16);color:#c7d2fe}
.decision-footer{position:relative;z-index:1;margin:0 18px 18px;padding:12px 14px;border-radius:8px;background:#f8faf9;color:var(--ink);display:flex;align-items:center;justify-content:space-between;gap:12px;box-shadow:0 20px 60px -40px rgba(0,0,0,.9)}
.decision-footer b{display:block;font-size:13px}
.decision-footer span{display:block;font-size:11px;color:var(--muted);font-family:var(--mono);margin-top:2px}
.decision-footer .seal{width:36px;height:36px;border-radius:8px;background:#fff;display:grid;place-items:center;flex:0 0 auto;border:1px solid var(--line)}
.decision-footer .seal img{width:24px;height:24px}
.hero-panel{margin-top:32px;display:grid;grid-template-columns:repeat(4,1fr);border:1px solid rgba(255,255,255,.17);background:rgba(255,255,255,.08);backdrop-filter:blur(18px);border-radius:8px;overflow:hidden;max-width:920px}
.hero-stat{padding:20px;border-right:1px solid rgba(255,255,255,.14)}
.hero-stat:last-child{border-right:0}
.hero-stat b{display:block;color:#fff;font-family:var(--mono);font-size:24px;line-height:1.1;margin-bottom:7px}
.hero-stat span{display:block;color:#cbd5e1;font-size:13px;line-height:1.45}
.outcome-strip{padding:18px 0 22px;background:var(--night);border-top:1px solid rgba(255,255,255,.12)}
.outcome-strip .hero-panel{margin-top:0;max-width:100%}

section{padding:88px 0}
section.hero{padding:0}
section.outcome-strip{padding:18px 0 22px}
.band{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:34px}
.section-head .copy{max-width:800px}
.section-head .aside{font-family:var(--mono);font-size:12px;color:var(--muted);max-width:270px;border-left:2px solid var(--line);padding-left:16px}
.logo-strip{padding:24px 0;background:#fff;border-bottom:1px solid var(--line)}
.logo-strip .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.logo-strip span{font-family:var(--mono);font-size:12px;color:var(--muted);font-weight:700;text-transform:uppercase}
.trust-items{display:flex;gap:10px;flex-wrap:wrap}
.trust-items b{display:inline-flex;align-items:center;justify-content:center;height:32px;padding:0 12px;border:1px solid var(--line);border-radius:999px;color:var(--ink);background:#f8faf9;font-size:13px}

.offer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}

/* Why it matters ----------------------------------------------------- */
.why-section{background:linear-gradient(180deg,#fff 0%,#f4f6f4 100%);border-bottom:1px solid var(--line)}
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:38px}
.why-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:12px;padding:28px 26px;box-shadow:var(--shadow);overflow:hidden}
.why-card:before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:var(--red)}
.why-card.c2:before{background:var(--accent)}
.why-card.c3:before{background:var(--amber)}
.why-stat{font-family:var(--mono);font-size:46px;font-weight:850;line-height:1;letter-spacing:-.02em;color:var(--red);margin:6px 0 14px}
.why-card.c2 .why-stat{color:var(--accent)}
.why-card.c3 .why-stat{color:var(--amber)}
.why-card h3{font-size:17px;margin-bottom:9px}
.why-card p{font-size:14px;color:var(--text);line-height:1.55;margin-bottom:20px}
.why-src{margin-top:auto;display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:11px;font-weight:750;color:var(--muted);border-top:1px solid var(--line);padding-top:14px;transition:color .16s ease}
.why-src:hover{color:var(--accent)}
.why-src svg{width:12px;height:12px;flex:0 0 auto}
.why-more{margin-top:28px;display:inline-flex;align-items:center;gap:8px;font-weight:750;font-size:15px;color:var(--accent);transition:gap .16s ease}
.why-more:hover{gap:12px}
.why-more svg{width:17px;height:17px}

/* Two-laptop "how it works" scene ------------------------------------ */
.iw-stage{margin-top:8px;position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:0;padding:30px 26px 26px}
.iw-stage:before{content:"";position:absolute;inset:0;border-radius:16px;background:radial-gradient(640px 300px at 50% 40%,rgba(79,70,229,.06),transparent 70%),linear-gradient(90deg,rgba(148,163,184,.08) 1px,transparent 1px),linear-gradient(rgba(148,163,184,.08) 1px,transparent 1px);background-size:100% 100%,40px 40px,40px 40px;-webkit-mask-image:radial-gradient(circle at 50% 30%,#000,transparent 82%);mask-image:radial-gradient(circle at 50% 30%,#000,transparent 82%);pointer-events:none}
.stage-note{grid-column:1/-1;margin:22px auto 0;max-width:660px;text-align:center;font-size:13.5px;color:var(--muted)}
.stage-note b{color:var(--ink);font-weight:750}

.lap{position:relative;z-index:1;width:100%;max-width:580px}
.lap.left{justify-self:end}
.lap.right{justify-self:start}
.lap-frame{position:relative;border:2px solid #2b3650;border-bottom:0;border-radius:12px 12px 3px 3px;background:#0b1120;padding:9px 9px 0;box-shadow:0 60px 100px -30px rgba(15,23,42,.6),0 24px 48px -18px rgba(15,23,42,.45),0 4px 14px -4px rgba(15,23,42,.35),inset 0 1px 0 rgba(255,255,255,.07)}
.lap-frame:before{content:"";position:absolute;top:3.5px;left:50%;transform:translateX(-50%);width:4px;height:4px;border-radius:50%;background:#050810;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.lap-screen{position:relative;border-radius:5px;overflow:hidden;background:linear-gradient(180deg,#0d1526,#0a1020);aspect-ratio:16/10}
.lap-base{height:20px;border-radius:0 0 13px 13px;background:linear-gradient(180deg,#1e2438,#12172a 55%,#0e1322);border:2px solid #2b3650;border-top:0;position:relative;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.lap-base:after{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:80px;height:5px;border-radius:0 0 7px 7px;background:#0a1020;box-shadow:inset 0 -1px 0 rgba(255,255,255,.05)}
.lap-base:before{content:"";position:absolute;bottom:4px;left:50%;transform:translateX(-50%);width:64px;height:9px;border-radius:3px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06)}
.lap-cap{margin-top:14px;text-align:center;font-family:var(--mono);font-size:11px;font-weight:800;letter-spacing:.05em;color:#8496b1;text-transform:uppercase}

/* Recruiter's screen is presented inside an open Chrome window, tab + address bar included */
.chrome-bar{display:flex;align-items:center;gap:7px;padding:6px 9px;background:#202124;border-bottom:1px solid rgba(255,255,255,.07)}
.chrome-dots{display:flex;gap:4px;flex:0 0 auto}
.chrome-dots i{display:block;width:6px;height:6px;border-radius:50%}
.chrome-dots i:nth-child(1){background:#ff5f57}
.chrome-dots i:nth-child(2){background:#febc2e}
.chrome-dots i:nth-child(3){background:#28c840}
.chrome-tab{display:flex;align-items:center;gap:4px;padding:3px 8px;border-radius:5px 5px 0 0;background:#35363a;color:#e8eaed;font-family:var(--mono);font-size:7.5px;white-space:nowrap;flex:0 0 auto}
.chrome-tab img{width:9px;height:9px}
.chrome-url{display:flex;align-items:center;gap:4px;flex:1;min-width:0;padding:3px 9px;border-radius:10px;background:#303134;color:#9aa0a6;font-family:var(--mono);font-size:7.5px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.chrome-url svg{width:8px;height:8px;color:#8ab4f8;flex:0 0 auto}
.chrome-live{margin-left:auto;display:inline-flex;align-items:center;gap:4px;color:#7dd3a8;font-family:var(--mono);font-size:7.5px;white-space:nowrap;flex:0 0 auto}
.chrome-live i{width:5px;height:5px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 2px rgba(34,197,94,.16)}

.scr-bar{display:flex;align-items:center;gap:6px;padding:6px 9px;background:rgba(255,255,255,.045);border-bottom:1px solid rgba(255,255,255,.07);font-family:var(--mono);font-size:8.5px;letter-spacing:.03em;color:#8ea0bc}
.scr-bar .live{display:inline-flex;align-items:center;gap:5px;color:#7dd3a8}
.scr-bar .live i{width:6px;height:6px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.16)}
.scr-bar .grow{margin-left:auto;color:#6b7c98}

.call{position:relative;padding:11px;display:grid;grid-template-columns:1fr 1fr;gap:8px;height:calc(100% - 25px)}
.tile{position:relative;border-radius:6px;overflow:hidden;background:linear-gradient(155deg,#26324b,#161f33);display:grid;place-items:center;border:1px solid rgba(255,255,255,.06)}
.tile .av{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-family:var(--mono);font-weight:850;font-size:13px;color:#0b1120}
.tile.you .av{background:linear-gradient(160deg,#a5b4fc,#818cf8)}
.tile.cand .av{background:linear-gradient(160deg,#7dd3a8,#34d399)}
.tile em{position:absolute;left:5px;bottom:5px;font-style:normal;font-family:var(--mono);font-size:8px;color:#e2e8f0;background:rgba(0,0,0,.55);padding:1px 6px;border-radius:4px}

.ai-overlay{position:absolute;right:11px;bottom:11px;width:68%;border-radius:7px;background:linear-gradient(180deg,#1d1638,#160f2b);border:1px solid rgba(167,139,250,.55);box-shadow:0 20px 42px -22px rgba(0,0,0,.85);opacity:0;transform:translateY(16px) scale(.96);transition:opacity .5s cubic-bezier(.2,.9,.3,1.1),transform .5s cubic-bezier(.2,.9,.3,1.1)}
.ai-overlay.show{opacity:1;transform:none}
.ai-head{display:flex;align-items:center;gap:5px;padding:5px 8px;background:rgba(167,139,250,.18);border-radius:7px 7px 0 0;font-family:var(--mono);font-size:8px;font-weight:800;letter-spacing:.04em;color:#d9ccff;text-transform:uppercase}
.ai-head svg{width:11px;height:11px;flex:0 0 auto}
.ai-head .float{margin-left:auto;opacity:.7;font-size:7.5px}
.ai-body{padding:7px 9px;font-size:9px;line-height:1.55;color:#c3b1f2}
.ai-body .q{color:#8b79c4;margin-bottom:3px}
.ai-body .a{color:#e5dcff}
.ai-body .a:after{content:"";display:inline-block;width:5px;height:9px;margin-left:2px;vertical-align:-1px;background:#c9b6ff;border-radius:1px;opacity:0}
.ai-overlay.show .ai-body .a:after{animation:caret 1s infinite}
.ai-scan{position:absolute;inset:-1px;border:2px solid #ff6b52;border-radius:8px;opacity:0;pointer-events:none;transition:opacity .3s ease}
.ai-scan.show{opacity:1;animation:scanPulse 1.4s ease infinite}
.ai-tag{position:absolute;top:-9px;right:8px;font-family:var(--mono);font-size:7.5px;font-weight:850;letter-spacing:.05em;color:#fff;background:#e5442b;padding:2px 6px;border-radius:5px;box-shadow:0 6px 14px -6px rgba(229,68,43,.9);opacity:0;transform:translateY(4px) scale(.8);transition:opacity .35s ease,transform .35s ease}
.ai-tag.show{opacity:1;transform:none}

.mon{padding:11px;display:flex;flex-direction:column;gap:6px;height:calc(100% - 32px)}
.mon-brand{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:8px;font-weight:800;letter-spacing:.05em;color:#c7d2fe;text-transform:uppercase}
.mon-brand img{width:13px;height:13px}
.mon-brand .pill{margin-left:auto;display:inline-flex;align-items:center;gap:4px;padding:2px 6px;border-radius:999px;background:rgba(129,140,248,.14);color:#c7d2fe;font-size:7.5px}
.mon-brand .pill i{width:5px;height:5px;border-radius:50%;background:#22c55e}
.sig{display:flex;align-items:center;gap:7px;padding:5px 8px;border-radius:6px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);font-size:9.5px;color:#dbe4f0;opacity:0;transform:translateX(10px);transition:opacity .45s ease,transform .45s ease}
.sig.show{opacity:1;transform:none}
.sig.hi.show{background:rgba(255,107,82,.09);border-color:rgba(255,107,82,.35)}
.keys{position:absolute;left:11px;bottom:11px;display:flex;gap:5px;opacity:0;transition:opacity .35s ease;z-index:2}
.keys.show{opacity:1}
.key{font-family:var(--mono);font-size:9px;font-weight:800;color:#dbe4f0;background:linear-gradient(180deg,#2a3550,#1b2740);border:1px solid rgba(255,255,255,.16);border-bottom-width:2px;border-radius:5px;padding:4px 7px;box-shadow:0 2px 0 rgba(0,0,0,.4);transition:transform .08s ease,box-shadow .08s ease,background .12s ease,border-color .12s ease}
.keys.press .key{transform:translateY(1px);box-shadow:0 1px 0 rgba(0,0,0,.4);background:linear-gradient(180deg,#3a4a75,#2a3550)}
.keys.press .key:last-child{background:linear-gradient(180deg,#8b79e0,#5f4fc0);border-color:rgba(167,139,250,.7);color:#fff}
.ai-overlay.copying .ai-body .a{background:rgba(167,139,250,.32);border-radius:3px;box-shadow:0 0 0 2px rgba(167,139,250,.18)}
.sig .d{width:7px;height:7px;border-radius:50%;flex:0 0 auto}
.sig .d.red{background:#ff6b52;box-shadow:0 0 0 3px rgba(255,107,82,.16)}
.sig .d.amber{background:#f5a623;box-shadow:0 0 0 3px rgba(245,166,35,.16)}
.sig .d.green{background:#34d399;box-shadow:0 0 0 3px rgba(52,211,153,.16)}
.sig .lvl{margin-left:auto;font-family:var(--mono);font-size:7.5px;font-weight:850;letter-spacing:.04em;padding:2px 6px;border-radius:999px}
.sig .lvl.high{background:rgba(255,107,82,.18);color:#ffb4a6}
.sig .lvl.rev{background:rgba(245,166,35,.18);color:#ffd18a}
.sig .lvl.clr{background:rgba(52,211,153,.16);color:#9de9c6}
.mon-score{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:9px;border-top:1px solid rgba(255,255,255,.08)}
.score-ring{position:relative;width:62px;height:62px;flex:0 0 auto}
.score-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.score-ring circle{fill:none;stroke-width:7}
.sr-track{stroke:rgba(255,255,255,.1)}
.sr-val{stroke:#ff6b52;stroke-linecap:round;stroke-dasharray:175.9;stroke-dashoffset:104;filter:drop-shadow(0 0 5px rgba(255,107,82,.45))}
.sr-num{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px}
.sr-num b{font-family:var(--mono);font-size:20px;line-height:1;color:#fff;font-weight:800}
.sr-num span{font-size:7px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#8ea0bc}
.mon-score .meta b{display:block;font-size:11px;color:#fff}
.mon-score .meta span{display:block;font-family:var(--mono);font-size:8.5px;color:#9fb0c4;margin-top:2px}
.mon-score .meta .rep{display:inline-flex;align-items:center;gap:5px;margin-top:6px;font-family:var(--mono);font-size:8px;font-weight:800;color:#9de9c6;text-transform:uppercase;letter-spacing:.04em}
.mon-score .meta .rep svg{width:11px;height:11px}

.beam{position:relative;z-index:1;align-self:center;display:flex;flex-direction:column;align-items:center;justify-content:center;width:130px;padding:0 6px}
.beam-arrow{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;background:var(--teal-soft);border:1px solid rgba(79,70,229,.22);box-shadow:0 14px 30px -12px rgba(79,70,229,.5)}
.beam-arrow svg{width:24px;height:24px;color:var(--accent)}
.iw-stage.in .beam-arrow{animation:arrowNudge 1.5s ease-in-out infinite}

@keyframes arrowNudge{0%,100%{transform:translateX(0);box-shadow:0 14px 30px -12px rgba(79,70,229,.5)}50%{transform:translateX(10px);box-shadow:0 14px 34px -10px rgba(79,70,229,.75)}}
@keyframes arrowNudgeV{0%,100%{transform:translateY(0) rotate(90deg);box-shadow:0 14px 30px -12px rgba(79,70,229,.5)}50%{transform:translateY(10px) rotate(90deg);box-shadow:0 14px 34px -10px rgba(79,70,229,.75)}}
@keyframes scanPulse{0%{box-shadow:0 0 0 0 rgba(255,107,82,.5)}70%{box-shadow:0 0 0 8px rgba(255,107,82,0)}100%{box-shadow:0 0 0 0 rgba(255,107,82,0)}}
@keyframes caret{0%,49%{opacity:1}50%,100%{opacity:0}}

.showcase-3d{margin-top:72px;perspective:1800px;perspective-origin:50% 40%;padding:40px 0 80px}
.showcase-stage{position:relative;height:560px;transform-style:preserve-3d;transform:rotateX(14deg) rotateY(-12deg);max-width:1080px;margin:0 auto}
.float-card{position:absolute;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 30px 60px -25px rgba(17,24,39,.35),0 12px 30px -15px rgba(79,70,229,.2);padding:18px;transform-style:preserve-3d;transition:transform .6s ease}
.float-card:before{content:"";position:absolute;inset:0;border-radius:14px;background:linear-gradient(155deg,rgba(255,255,255,.7),rgba(255,255,255,0));pointer-events:none}
.fc-label{font-family:var(--mono);font-size:10px;font-weight:800;color:var(--teal);text-transform:uppercase;letter-spacing:.06em;margin-bottom:10px}
.fc-sub{font-size:11px;color:var(--muted);font-family:var(--mono);margin-top:6px}
.fc-bignum{font-family:var(--mono);font-size:54px;font-weight:850;line-height:1;color:var(--teal)}
.fc-meter{height:6px;background:#eef0ef;border-radius:999px;overflow:hidden;margin-top:12px}
.fc-meter i{display:block;height:100%;background:var(--teal);border-radius:999px}

.card-dashboard{left:50%;top:20px;width:520px;transform:translate(-50%,0) translateZ(40px);padding:0;overflow:hidden}
.fcd-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line);background:#fafbfa}
.fcd-head b{display:block;font-size:14px;color:var(--ink)}
.fcd-head span{display:block;font-size:11px;color:var(--muted);font-family:var(--mono);margin-top:2px}
.fcd-pill{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;background:var(--teal-soft);color:var(--teal);font-family:var(--mono);font-size:10px;font-weight:800}
.fcd-pill i{width:6px;height:6px;border-radius:50%;background:#22c55e}
.fcd-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-bottom:1px solid var(--line)}
.fcd-stats > div{padding:14px 18px;border-right:1px solid var(--line)}
.fcd-stats > div:last-child{border-right:0}
.fcd-stats b{display:block;font-family:var(--mono);font-size:26px;line-height:1;font-weight:850}
.fcd-stats b.good{color:#0e9f6e}.fcd-stats b.risk{color:var(--red)}.fcd-stats b.warn{color:var(--amber)}
.fcd-stats span{display:block;font-size:10px;color:var(--muted);font-family:var(--mono);text-transform:uppercase;letter-spacing:.05em;margin-top:5px}
.fcd-timeline{padding:12px 14px;display:flex;flex-direction:column;gap:6px}
.fcdt-row{display:grid;grid-template-columns:46px 1fr auto;gap:10px;align-items:center;padding:7px 10px;border-radius:7px;background:#fafbfa;border:1px solid var(--line);font-size:12px}
.fcdt-row time{font-family:var(--mono);font-size:10px;color:var(--muted)}
.fcdt-row b{font-size:12px;color:var(--ink);font-weight:700}
.fcdt-row .severity{font-family:var(--mono);font-size:10px;font-weight:800;padding:3px 7px;border-radius:999px;background:#fee4df;color:var(--red)}
.fcdt-row .severity.warn{background:#fff1d6;color:var(--amber)}
.fcdt-row .severity.ok{background:#dcfce7;color:#057a55}
.fcd-foot{display:flex;align-items:center;gap:12px;padding:14px 18px;background:#fafbfa;border-top:1px solid var(--line)}
.fcd-seal{width:32px;height:32px;border-radius:7px;background:#fff;display:grid;place-items:center;border:1px solid var(--line);flex:0 0 auto}
.fcd-seal img{width:22px;height:22px}
.fcd-foot b{display:block;font-size:12px;color:var(--ink)}
.fcd-foot span{display:block;font-size:10px;color:var(--muted);font-family:var(--mono);margin-top:1px}

.card-signals{left:2%;top:90px;width:220px;transform:translateZ(110px) rotateY(8deg)}
.card-signals .fc-row{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line);font-size:12px}
.card-signals .fc-row:last-child{border-bottom:0}
.card-signals .fc-row b{font-size:12px;color:var(--ink);font-weight:700}
.card-signals .fc-row span{font-family:var(--mono);font-size:10px;color:var(--muted);text-transform:uppercase}

.card-score{right:3%;top:40px;width:200px;transform:translateZ(140px) rotateY(-10deg)}

.card-seal{left:8%;bottom:30px;width:180px;text-align:center;transform:translateZ(180px) rotateY(12deg) rotateX(-4deg)}
.seal-big{width:64px;height:64px;border-radius:14px;background:linear-gradient(155deg,var(--teal-soft),#fff);display:grid;place-items:center;margin:0 auto 12px;border:1px solid var(--teal-soft);box-shadow:0 10px 24px -10px rgba(79,70,229,.4)}
.seal-big img{width:42px;height:42px}

.card-pipeline{right:6%;bottom:30px;width:200px;transform:translateZ(160px) rotateY(-12deg) rotateX(-3deg)}
.card-pipeline .fc-pl{display:flex;align-items:baseline;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
.card-pipeline .fc-pl:last-child{border-bottom:0}
.card-pipeline .fc-pl span{font-family:var(--mono);font-size:22px;font-weight:850;color:var(--ink);line-height:1;min-width:30px}
.card-pipeline .fc-pl em{font-style:normal;font-size:11px;color:var(--muted);font-family:var(--mono);text-transform:uppercase;letter-spacing:.05em}

.dot{display:inline-block;width:8px;height:8px;border-radius:50%}
.dot.red{background:var(--red)}.dot.amber{background:var(--amber)}.dot.green{background:#0e9f6e}

.ui-previews{margin-top:64px;display:flex;flex-direction:column;gap:18px}
.preview-label{font-family:var(--mono);font-size:11px;font-weight:800;color:var(--teal);text-transform:uppercase;letter-spacing:.06em;margin-top:28px}
.preview-label:first-child{margin-top:0}
.ui-mock{background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);overflow:hidden}
.mock-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 22px;border-bottom:1px solid var(--line);background:#fafbfa}
.mock-head b{display:block;color:var(--ink);font-size:15px}
.mock-head span{display:block;color:var(--muted);font-family:var(--mono);font-size:11px;margin-top:3px}
.mock-head.dark{background:#0f172a;color:#fff;border-bottom-color:rgba(255,255,255,.12)}
.mock-head.dark b{color:#fff}.mock-head.dark span{color:#9fb0c4}
.mock-tabs{display:flex;gap:6px}
.mock-tabs span{font-family:var(--mono);font-size:11px;font-weight:700;text-transform:uppercase;color:var(--muted);padding:7px 11px;border-radius:6px;border:1px solid transparent}
.mock-tabs span.active{color:var(--teal);background:var(--teal-soft);border-color:var(--teal-soft)}
.mock-table{display:flex;flex-direction:column}
.mock-row{display:grid;grid-template-columns:2fr 1fr 1fr 1.2fr 1fr;gap:14px;align-items:center;padding:14px 22px;border-bottom:1px solid var(--line);font-size:13px;color:var(--ink)}
.mock-row:last-child{border-bottom:0}
.mock-row.head{background:#fafbfa;color:var(--muted);font-family:var(--mono);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.mock-row b{display:block;font-size:14px}
.mock-row em{display:block;font-style:normal;color:var(--muted);font-size:11px;font-family:var(--mono);margin-top:2px}
.num-cell{font-family:var(--mono);font-size:18px;font-weight:850}
.num-cell.good{color:#0e9f6e}.num-cell.risk{color:var(--red)}.num-cell.mid{color:var(--amber)}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px}
.dot.red{background:var(--red)}.dot.amber{background:var(--amber)}.dot.green{background:#0e9f6e}
.pill{display:inline-flex;align-items:center;padding:5px 10px;border-radius:999px;font-family:var(--mono);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.pill.ok{background:#dcfce7;color:#057a55}
.pill.warn{background:#fef3c7;color:#92400e}
.pill.neutral{background:#e5e7eb;color:#374151}

.mock-score-big{display:flex;flex-direction:column;align-items:flex-end}
.mock-score-big b{font-family:var(--mono);font-size:34px;line-height:1;color:var(--teal)}
.mock-score-big span{font-size:11px;font-family:var(--mono);color:var(--muted);text-transform:uppercase;margin-top:6px}
.screen-body{display:grid;grid-template-columns:1fr 1fr;gap:0}
.screen-col{padding:20px 22px;border-right:1px solid var(--line)}
.screen-col:last-child{border-right:0}
.screen-label{font-family:var(--mono);font-size:10px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:14px}
.bar-row{display:grid;grid-template-columns:1fr 1fr 36px;align-items:center;gap:12px;margin-bottom:10px;font-size:13px;color:var(--ink)}
.bar{height:6px;background:#eef0ef;border-radius:999px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--teal);border-radius:999px}
.bar-row em{font-style:normal;font-family:var(--mono);font-size:12px;font-weight:800;color:var(--ink);text-align:right}
.qa-block{padding:14px;border:1px solid var(--line);border-radius:8px;background:#fafbfa;margin-bottom:14px}
.qa-q{font-size:13px;font-weight:700;color:var(--ink);margin-bottom:8px}
.qa-a{font-size:12px;color:var(--text);line-height:1.5;margin-bottom:10px;font-style:italic}
.qa-grade{display:flex;align-items:center;gap:10px}
.qa-grade em{font-style:normal;font-size:11px;color:var(--muted)}
.qa-recommend{display:flex;align-items:center;justify-content:space-between;padding-top:12px;border-top:1px solid var(--line)}
.qa-recommend b{font-size:13px;color:var(--ink)}

.console-mock .mock-head{background:#0f172a;color:#fff}
.console-body{display:grid;grid-template-columns:240px 1fr;gap:0;background:#0f172a;color:#fff}
.console-side{padding:20px;border-right:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;gap:14px}
.console-stat{display:flex;align-items:baseline;gap:10px}
.console-stat b{font-family:var(--mono);font-size:30px;line-height:1}
.console-stat b.risk{color:#ff9a8e}.console-stat b.warn{color:#ffd08a}.console-stat b.good{color:#86efac}
.console-stat span{font-size:11px;color:#9fb0c4;text-transform:uppercase;font-family:var(--mono);letter-spacing:.05em}
.console-legend{margin-top:auto;padding-top:14px;border-top:1px solid rgba(255,255,255,.1)}
.console-legend b{display:block;font-size:11px;font-family:var(--mono);color:#9fb0c4;text-transform:uppercase;margin-bottom:8px}
.risk-meter{height:6px;background:rgba(255,255,255,.1);border-radius:999px;overflow:hidden;margin-bottom:6px}
.risk-meter i{display:block;height:100%;background:linear-gradient(90deg,#86efac,#ffd08a,#ff9a8e);border-radius:999px}
.console-legend em{font-style:normal;font-family:var(--mono);font-size:11px;color:#ffd08a}
.console-timeline{padding:16px 20px;display:flex;flex-direction:column;gap:8px}
.ct-row{display:grid;grid-template-columns:80px 1fr auto;gap:12px;align-items:center;padding:9px 12px;border-radius:8px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}
.ct-row time{font-family:var(--mono);font-size:11px;color:#9fb0c4}
.ct-row b{font-size:12px;color:#edf6f8}

.report-mock{max-width:760px;margin:0 auto;width:100%}
.report-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 26px;background:linear-gradient(180deg,#fafbfa,#fff);border-bottom:1px solid var(--line)}
.seal-row{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:11px;font-weight:800;color:var(--teal);text-transform:uppercase;letter-spacing:.05em}
.seal-row .seal{width:36px;height:36px;border-radius:8px;background:#fff;display:grid;place-items:center;border:1px solid var(--line)}
.seal-row .seal img{width:24px;height:24px}
.report-body{padding:8px 26px 22px}
.report-section{padding:14px 0;border-bottom:1px dashed var(--line);display:grid;grid-template-columns:160px 1fr;gap:18px;align-items:start;font-size:13px;color:var(--ink)}
.report-section b{font-family:var(--mono);font-size:11px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.report-list{margin:0;padding-left:18px}
.report-list li{font-size:13px;color:var(--ink);margin-bottom:4px}
.report-foot{display:flex;align-items:center;justify-content:space-between;padding-top:16px;font-family:var(--mono);font-size:11px}
.report-foot span{color:var(--muted)}
.report-foot b{color:var(--teal);text-transform:uppercase;letter-spacing:.05em}
.offer-card{background:#fff;border:1px solid var(--line);border-radius:8px;padding:26px;box-shadow:var(--shadow);min-height:280px;display:flex;flex-direction:column}
.offer-card .num{font-family:var(--mono);font-size:12px;color:var(--muted);font-weight:750;margin-bottom:18px}
.offer-card .badge{width:48px;height:48px;border-radius:8px;display:grid;place-items:center;margin-bottom:18px}
.badge.screen{background:var(--teal-soft);color:var(--teal)}
.badge.verify{background:var(--red-soft);color:var(--red)}
.badge.decide{background:var(--violet-soft);color:var(--violet)}
.offer-card ul{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:11px}
.offer-card li{display:flex;gap:9px;color:#475569;font-size:14px}
.offer-card li:before{content:"";width:7px;height:7px;margin-top:8px;border-radius:50%;background:currentColor;flex:0 0 auto;opacity:.55}
.product-flow{margin-top:22px;padding:24px 20px;border:1px solid var(--line);border-radius:8px;background:#fff;display:flex;align-items:flex-start;justify-content:center;gap:14px;flex-wrap:wrap;color:var(--ink);box-shadow:var(--shadow)}
.flow-step{display:inline-flex;flex-direction:column;align-items:center;gap:10px;width:110px;max-width:100%;color:var(--ink);font-family:var(--mono);font-size:11px;font-weight:780;text-transform:uppercase;text-align:center;line-height:1.3;overflow-wrap:break-word}
.flow-step i{display:flex;align-items:center;justify-content:center;width:54px;height:54px;border-radius:50%;border:1px solid var(--line);background:#f8faf9;color:var(--teal);font-family:var(--mono);font-size:15px;font-weight:850;font-style:normal}
.flow-arrow{display:inline-flex;align-items:center;justify-content:center;color:var(--teal);height:54px}

.privacy-section{background:var(--page);color:var(--text);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.privacy-section .wrap{position:relative}
.privacy-head{max-width:760px;margin-bottom:44px}
.privacy-never-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;text-align:center}
.pci-badge{width:72px;height:72px;border-radius:16px;display:grid;place-items:center;margin:0 auto 18px}
.pci-badge .icon{width:30px;height:30px}
.pci-badge.c-red{background:var(--red-soft);color:var(--red)}
.pci-badge.c-violet{background:var(--violet-soft);color:var(--violet)}
.pci-badge.c-amber{background:var(--amber-soft);color:var(--amber)}
.pci-badge.c-teal{background:var(--teal-soft);color:var(--teal)}
.pci-item h4{font-size:15px;font-weight:750;color:var(--ink);margin:0 0 8px}
.pci-item p{font-size:13px;color:var(--muted);margin:0;line-height:1.55}

/* Report section: one centred report card. Each signal sits on a timeline spine and expands
   in place to show what it means, while a segmented scrubber auto-plays down the list. */
.report-layout{max-width:940px;margin:40px auto 0}
.report-demo{--spine:98px;position:relative;background:linear-gradient(180deg,#fff,#fbfcff);border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 46px 70px -34px rgba(15,23,42,.38),0 16px 30px -14px rgba(15,23,42,.22),0 1px 0 rgba(255,255,255,.6) inset}
.report-head{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 26px;border-bottom:1px solid var(--line);background:var(--surface-muted);border-radius:16px 16px 0 0;flex-wrap:wrap}
.report-id{display:flex;flex-direction:column;gap:6px}
.report-id .rid-cand{font-size:17px;font-weight:800;color:var(--ink)}
.report-id .rid-meta{font-family:var(--mono);font-size:12px;color:var(--muted)}
.report-signed{display:inline-flex;align-items:center;gap:6px;margin-top:2px;padding:4px 10px;border-radius:999px;background:var(--teal-soft);color:var(--accent-dark);font-family:var(--mono);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;width:fit-content}
.report-signed svg{width:12px;height:12px}
.report-score{display:flex;align-items:center;gap:14px}
.rep-ring{position:relative;width:78px;height:78px;flex:0 0 auto}
.rep-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.rep-ring circle{fill:none;stroke-width:8}
.rep-ring .rr-track{stroke:var(--line)}
.rep-ring .rr-val{stroke:var(--red);stroke-linecap:round;stroke-dasharray:213.6;stroke-dashoffset:126}
.rep-ring .rr-num{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.rep-ring .rr-num b{font-family:var(--mono);font-size:24px;line-height:1;color:var(--ink);font-weight:850}
.rep-ring .rr-num span{font-size:8.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.report-verdict b{display:block;font-size:15px;color:var(--red);font-weight:800}
.report-verdict span{display:block;font-size:12.5px;color:var(--muted);margin-top:2px;max-width:220px}
/* Playback scrubber: one segment per signal, filling while that signal is being shown */
.rscrub{display:flex;gap:5px;padding:12px 26px;background:var(--surface-muted);border-bottom:1px solid var(--line)}
.rscrub i{position:relative;flex:1;height:3px;border-radius:3px;background:var(--line);overflow:hidden}
.rscrub i b{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:3px;background:#0e9f6e}
.rscrub i[data-sev="crit"] b{background:var(--red)}
.rscrub i[data-sev="warn"] b{background:var(--amber)}

/* The timeline spine runs behind the dots, connecting every signal in the session */
.rlines{position:relative}
.rline-wrap{position:relative;border-top:1px solid var(--line);transition:background .3s ease}
.rline-wrap:first-child{border-top:none}
.rline-wrap:before{content:"";position:absolute;left:var(--spine);top:0;bottom:0;width:2px;margin-left:-1px;background:var(--line)}
.rline-wrap:first-child:before{top:28px}
.rline-wrap:last-child:before{bottom:auto;height:28px}
.rline-wrap[data-sev="crit"].active{background:var(--red-soft)}
.rline-wrap[data-sev="warn"].active{background:var(--amber-soft)}
.rline-wrap[data-sev="info"].active{background:#eefaf4}
.rline-wrap.active:after{content:"";position:absolute;left:0;top:-1px;bottom:0;width:3px;background:#0e9f6e}
.rline-wrap[data-sev="crit"].active:after{background:var(--red)}
.rline-wrap[data-sev="warn"].active:after{background:var(--amber)}
.rline{position:relative;z-index:1;width:100%;display:grid;grid-template-columns:52px 16px minmax(0,1fr) auto auto;align-items:center;column-gap:12px;padding:16px 26px;background:none;border:0;text-align:left;font:inherit;color:inherit;cursor:pointer;-webkit-appearance:none;appearance:none}
.rline:focus-visible{outline:2px solid var(--accent);outline-offset:-3px}
.rtime{font-family:var(--mono);font-size:11.5px;color:var(--muted);white-space:nowrap}
.rdot{display:flex;align-items:center;justify-content:center}
.rd{width:10px;height:10px;border-radius:50%;transition:transform .3s ease,box-shadow .3s ease}
.rd.crit{background:var(--red);box-shadow:0 0 0 3px rgba(180,35,24,.14)}
.rd.warn{background:var(--amber);box-shadow:0 0 0 3px rgba(181,71,8,.14)}
.rd.info{background:#0e9f6e;box-shadow:0 0 0 3px rgba(14,159,110,.14)}
.rline-wrap.active .rd{transform:scale(1.2)}
.rline-wrap[data-sev="crit"].active .rd{box-shadow:0 0 0 5px rgba(180,35,24,.2)}
.rline-wrap[data-sev="warn"].active .rd{box-shadow:0 0 0 5px rgba(181,71,8,.2)}
.rline-wrap[data-sev="info"].active .rd{box-shadow:0 0 0 5px rgba(14,159,110,.2)}
.rtitle{font-size:14.5px;font-weight:730;color:var(--ink)}
.rdur{font-family:var(--mono);font-style:normal;font-size:10.5px;font-weight:750;color:var(--muted);margin-left:9px;padding:2px 6px;border-radius:5px;background:rgba(15,23,42,.05);white-space:nowrap}
.rpill{font-family:var(--mono);font-size:10.5px;font-weight:850;letter-spacing:.04em;text-transform:uppercase;padding:3px 9px;border-radius:999px;white-space:nowrap}
.rpill.crit{background:var(--red-soft);color:var(--red)}
.rpill.warn{background:var(--amber-soft);color:var(--amber)}
.rpill.info{background:#e3f7ee;color:#0e9f6e}
.rcaret{width:15px;height:15px;color:var(--muted);transition:transform .3s ease}
.rline-wrap.active .rcaret{transform:rotate(180deg)}
/* The detail opens inside the row itself, so nothing overflows the card at any width */
.rdrawer{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s cubic-bezier(.4,0,.2,1)}
.rline-wrap.active .rdrawer{grid-template-rows:1fr}
.rdrawer > div{overflow:hidden;min-height:0}
.rdrawer p{margin:0;padding:0 26px 18px calc(var(--spine) + 20px);font-size:14px;line-height:1.62;color:var(--text);opacity:0;transform:translateY(-6px);transition:opacity .28s ease,transform .28s ease}
.rline-wrap.active .rdrawer p{opacity:1;transform:none;transition-delay:.12s}
.report-foot{padding:14px 26px;font-size:12px;color:var(--muted);background:var(--surface-muted);border-top:1px solid var(--line);border-radius:0 0 16px 16px}

.pricing-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.pricing-grid-3{grid-template-columns:repeat(3,1fr);max-width:951px;margin:0 auto}
.price-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:8px;padding:22px;display:flex;flex-direction:column;min-height:460px}
.price-card.featured{border-color:var(--accent);box-shadow:0 0 0 3px rgba(37,99,235,.12),var(--shadow)}
.plan-pill{position:absolute;right:16px;top:16px;background:var(--accent);color:#fff;border-radius:999px;padding:4px 9px;font-size:11px;font-weight:800}
.tier{font-size:15px;font-weight:820;color:var(--ink);margin-bottom:14px}
.amount{font-size:36px;line-height:1;color:var(--ink);font-weight:850;margin-bottom:10px}
.amount span{font-size:14px;color:var(--muted);font-weight:650}
.plan-sub{font-size:13px;color:var(--muted);min-height:42px}
.price-card ul{list-style:none;padding:0;margin:22px 0;display:grid;gap:10px}
.price-card li{display:flex;gap:9px;font-size:13px;color:#475569}
.price-card li:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--teal);flex:0 0 auto;margin-top:8px}
.price-card .btn{margin-top:auto;width:100%}
.license-pricing-block{margin-top:0}

.brand-section{background:linear-gradient(180deg,#fff 0%,#f8faf9 100%);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.brand-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:6px}
.brand-card{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:28px 26px;box-shadow:var(--shadow)}
.brand-ic{width:46px;height:46px;border-radius:11px;display:grid;place-items:center;background:var(--teal-soft);color:var(--accent);border:1px solid rgba(79,70,229,.16);margin-bottom:18px}
.brand-ic .icon{width:22px;height:22px}
.brand-card h3{font-size:17px;font-weight:820;margin:0 0 8px;line-height:1.25}
.brand-card p{font-size:14px;color:var(--muted);margin:0;line-height:1.6}
.brand-foot{margin:26px auto 0;max-width:640px;text-align:center;font-size:14px;color:var(--muted);line-height:1.6}
.brand-foot .btn{margin-top:16px}

.faq-list{display:grid;gap:10px}
details.faq{background:#fff;border:1px solid var(--line);border-radius:8px}
details.faq[open]{border-color:var(--line-strong)}
.faq summary{list-style:none;cursor:pointer;padding:20px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq h3{font-size:17px;font-weight:450;margin:0}
.faq .answer{padding:0 22px 22px;color:#526173;font-size:15px;max-width:900px}
.chev{transition:transform .16s ease;flex:0 0 auto}
details[open] .chev{transform:rotate(180deg)}

.cta{background:var(--night);color:#cbd5e1}
.cta-box{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center}
.cta h2{color:#fff;margin-bottom:10px}
.cta p{font-size:18px;max-width:720px}
.badges-section{background:#fff;border-top:1px solid var(--line);padding:36px 0}
.badges-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:16px}
.badges-row a{display:inline-flex;flex:0 0 auto;opacity:.85;transition:opacity .18s ease}
.badges-row a:hover{opacity:1}
.badges-row img{display:block;height:40px;width:auto}
@media (max-width:620px){.badges-row{gap:12px}.badges-row img{height:34px}}

footer{background:#fff;border-top:1px solid var(--line);padding:44px 0 24px}
.footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:28px;margin-bottom:34px}
.footer-grid p{font-size:14px;color:var(--muted);max-width:330px;margin-top:12px}
.footer-grid h4{margin:0 0 12px;color:var(--ink);font-size:13px;text-transform:uppercase;letter-spacing:0}
.footer-grid a{display:block;color:#526173;font-size:14px;margin:8px 0}
.footer-grid a:hover{color:var(--accent)}
.footer-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:20px;color:var(--muted);font-size:13px}

.modal{position:fixed;inset:0;background:rgba(15,23,42,.62);z-index:100;display:none;align-items:center;justify-content:center;padding:22px}
.modal.open{display:flex}
.modal-card{width:min(720px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:8px;border:1px solid var(--line);box-shadow:0 35px 100px -40px rgba(15,23,42,.9)}
.modal-head{display:flex;justify-content:space-between;gap:18px;align-items:start;padding:24px 24px 18px;border-bottom:1px solid var(--line)}
.modal-head h2{font-size:28px;margin:0}
.modal-head h2 .accent-word{color:var(--accent)}
.modal-head p{font-size:14px;color:var(--muted);margin-top:8px}
.close{width:40px;height:40px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);cursor:pointer}
.demo-form{padding:22px 24px 24px;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field{display:grid;gap:6px}
.field.wide{grid-column:1/-1}
.field label{font-size:13px;font-weight:760;color:var(--ink)}
.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:8px;background:#fbfcfb;color:var(--ink);padding:11px 12px;min-height:44px}
.field textarea{min-height:96px;resize:vertical}
.form-actions{grid-column:1/-1;display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:6px}
.form-actions span{font-size:12px;color:var(--muted)}
.form-actions .form-error{color:#b91c1c}
.form-actions .btn[disabled]{opacity:.6;pointer-events:none}
/* Honeypot: visually and programmatically hidden from humans; bots that auto-fill trip it. */
.hp-field{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
/* An explicit `display` beats the `hidden` attribute, so re-assert display:none for hidden panels. */
.demo-form[hidden],.demo-done[hidden]{display:none}
.demo-done{padding:40px 24px 44px;text-align:center;display:grid;justify-items:center;gap:10px}
.demo-done .check{width:54px;height:54px;border-radius:50%;background:#dcfce7;color:#16a34a;display:grid;place-items:center;margin-bottom:4px}
.demo-done h3{font-size:22px;letter-spacing:-0.02em}
.demo-done p{color:var(--muted);max-width:380px}

.reveal{opacity:0;transform:translateY(14px);transition:opacity .45s ease,transform .45s ease}
.reveal.in{opacity:1;transform:none}

@media (max-width:1100px){
  h1{font-size:54px}
  h2{font-size:36px}
  .pricing-grid{grid-template-columns:repeat(2,1fr)}
  .hero-panel{grid-template-columns:repeat(2,1fr)}
  .hero-stat:nth-child(2){border-right:0}
  .hero-stat:nth-child(1),.hero-stat:nth-child(2){border-bottom:1px solid rgba(255,255,255,.14)}
}
@media (max-width:880px){
  .menu-toggle{display:inline-flex}
  .nav{height:66px}
  .nav-links{position:absolute;left:16px;right:16px;top:72px;transform:none;display:none;flex-direction:column;align-items:stretch;gap:0;margin:0;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);padding:8px}
  .nav-links.open{display:flex}
  .nav-links a{padding:12px;border-radius:7px}
  .nav-links a:hover{background:#f4f7f5}
  .nav-actions .btn.text{display:none}
  h1{font-size:40px}
  .hero h1 .h-workflow{font-size:.7em}
  .hero{min-height:auto}
  .hero:before{width:520px;left:-300px;bottom:-270px;opacity:.34}
  .hero:after{width:540px;right:-310px;top:-260px;opacity:.3}
  .hero .wrap{gap:24px;padding-top:52px;padding-bottom:40px}
  .hero-visual{min-height:360px}
  .hero-proof{flex-wrap:wrap}
  .proof-chip{white-space:normal}
  .hero-visual:after{display:none}
  .decision-stack{width:100%;transform:none;mask-image:none;-webkit-mask-image:none}
  .lead{font-size:18px;max-width:100%}
  .section-head,.cta-box{grid-template-columns:1fr;display:grid}
  .report-demo{--spine:77px;transform:none;box-shadow:var(--shadow)}
  .report-head{padding:16px 18px;gap:16px}
  .report-id .rid-cand{font-size:15px}
  .report-id .rid-meta{font-size:11px}
  .rep-ring{width:60px;height:60px}
  .rep-ring .rr-num b{font-size:19px}
  .rep-ring .rr-num span{font-size:10px}
  .report-verdict b{font-size:13.5px}
  .report-verdict span{font-size:11.5px;max-width:170px}
  .rscrub{padding:11px 16px;gap:4px}
  .rline{grid-template-columns:44px 14px minmax(0,1fr) auto auto;column-gap:10px;padding:14px 16px}
  .rtitle{font-size:13.5px}
  .rtime{font-size:11.5px}
  .rpill{font-size:11px;padding:2px 7px}
  .rdrawer p{font-size:13.5px;padding-right:16px;padding-bottom:15px}
  .report-foot{padding:13px 16px}
  .section-head{align-items:start}
  .why-grid,.offer-grid,.footer-grid,.brand-grid{grid-template-columns:1fr}
  /* Touch. 22px rows with 16px between them are hard to hit; padding keeps the
     rows contiguous so the taller target costs no extra dead space. */
  .footer-grid a{margin:0;padding:11px 0}
  .footer-bottom a{display:inline-block;padding:10px 6px}
  .iw-stage{grid-template-columns:minmax(0,1fr);padding:22px 16px 18px}
  .lap.left,.lap.right{justify-self:center}
  .lap{max-width:430px;margin:0 auto}
  .beam{width:100%;padding:8px 0}
  .iw-stage.in .beam-arrow{animation:arrowNudgeV 1.6s ease-in-out infinite}
  .product-flow{align-items:flex-start;justify-content:flex-start}
  .cta-box .btn{justify-self:start}
}
@media (max-width:620px){
  body{overflow-x:hidden}
  .wrap{padding:0 16px}
  .lap-screen{aspect-ratio:8/7}
  /* The two laptop mocks are drawn at a miniature scale that works on a wide
     screen but lands between 6px and 9px on a phone. The taller 8/7 screen
     here buys the vertical room to bring every label back over 9.5px. */
  .scr-bar{font-size:10.5px;padding:7px 10px}
  .chrome-tab,.chrome-url,.chrome-live{font-size:9.5px}
  .chrome-tab img{width:11px;height:11px}
  .chrome-url svg{width:10px;height:10px}
  .tile em{font-size:10px;padding:2px 7px}
  .ai-overlay{width:82%}
  .ai-tag{font-size:9.5px}
  .ai-head{font-size:10px}
  .ai-head .float{font-size:9px}
  .ai-body{font-size:11px}
  .mon-brand{font-size:10px}
  .mon-brand .pill{font-size:9.5px}
  .sig{font-size:11px;padding:6px 9px}
  .sig .lvl{font-size:9.5px}
  .sr-num b{font-size:18px}
  .sr-num span{font-size:9.5px}
  .mon-score .meta b{font-size:12px}
  .mon-score .meta span{font-size:10.5px}
  .mon-score .meta .rep{font-size:9.5px}
  .lap-cap{font-size:12px}
  section{padding:56px 0}
  h1{font-size:32px}
  h2{font-size:26px}
  .hero h1 .h-workflow{font-size:.65em}
  .hero .lead{font-size:15px}
  .nav-actions .js-demo{display:none}
  .hero .wrap{padding-top:28px;padding-bottom:28px;gap:16px}
  .hero:before{width:390px;left:-250px;bottom:-210px;opacity:.26}
  .hero:after{width:420px;right:-270px;top:-210px;opacity:.24}
  .hero-label{font-size:11px;margin-bottom:14px}
  .hero-actions{margin-top:20px;flex-direction:column;align-items:stretch}
  .hero-proof{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-bottom:12px}
  .proof-chip{font-size:11px;padding:5px 10px}
  .hero-visual{min-height:0}
  .command-body{gap:10px;padding:12px}
  .command-head{padding:13px 14px}
  .candidate-card{padding:12px;grid-template-columns:1fr;gap:14px;align-items:flex-start}
  .integrity-ring{width:88px;height:88px}
  .timeline-row{grid-template-columns:48px 1fr;align-items:start}
  .timeline-row .severity{grid-column:2}
  .timeline-row:nth-child(n+3){display:none}
  .decision-footer{align-items:flex-start}
  .form-actions{flex-direction:column;align-items:stretch}
  .hero-panel,.pricing-grid{grid-template-columns:1fr}
  .privacy-never-grid{grid-template-columns:repeat(2,1fr)}
  .hero-stat{border-right:0;border-bottom:1px solid rgba(255,255,255,.14)}
  .hero-stat:last-child{border-bottom:0}
  .demo-form{grid-template-columns:1fr}
  .footer-bottom{display:grid}
  .faq h3{font-size:15px}
  .proof-chip{font-size:11px;padding:5px 9px}
  /* Phones: the row becomes two lines, time and severity above the signal title */
  .report-demo{--spine:23px}
  .rline{grid-template-columns:14px minmax(0,1fr) auto;column-gap:12px;row-gap:5px;padding:13px 16px}
  .rdot{grid-area:1/1/2/2}
  .rtime{grid-area:1/2/2/3;justify-self:start}
  .rpill{grid-area:1/3/2/4}
  .rtitle{grid-area:2/2/3/4;font-size:14px;line-height:1.35}
  .rcaret{display:none}
  .rdur{display:inline-block;margin-left:7px}
  .rline-wrap:first-child:before{top:24px}
  .rline-wrap:last-child:before{height:24px}
  .rdrawer p{font-size:13px;padding-bottom:14px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
  .report-demo{transform:none!important}
}