:root { --ink:#172033; --muted:#64748b; --blue:#2563eb; --blue-dark:#1d4ed8; --line:#dce3ec; --pale:#f5f7fa; --navy:#172033; --white:#fff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:#fff; font-family:'Segoe UI',Arial,sans-serif; line-height:1.45; }
a { color:inherit; text-decoration:none; }
button { font:inherit; cursor:pointer; }
.shell { width:min(1160px,calc(100% - 48px)); margin:0 auto; }
.site-header { height:78px; display:flex; align-items:center; gap:32px; padding:0 max(24px,calc((100% - 1160px)/2)); border-bottom:1px solid #edf0f4; background:#fff; position:sticky; top:0; z-index:10; }
.brand { display:flex; align-items:center; gap:10px; font:700 15px 'Segoe UI',Arial,sans-serif; letter-spacing:.12em; white-space:nowrap; }
.brand-mark,.tiny-mark { display:grid; place-items:center; border-radius:2px; background:var(--blue); color:#fff; font:700 15px 'Segoe UI',Arial,sans-serif; width:29px; height:29px; letter-spacing:0; }
.site-nav { display:flex; gap:30px; margin-left:auto; color:#526176; font-size:14px; }
.site-nav a:hover,.text-link:hover,.card-link:hover { color:var(--blue); }
.button { border:1px solid transparent; border-radius:2px; padding:10px 16px; font-weight:600; display:inline-flex; justify-content:center; align-items:center; gap:18px; transition:background .2s,border-color .2s; }
.button:hover { transform:none; }
.button-primary { color:#fff; background:var(--blue); box-shadow:0 10px 20px #2563eb26; }
.button-primary:hover { background:var(--blue-dark); }
.button-light { background:#fff; color:var(--ink); }
.button-small { padding:10px 14px; font-size:13px; }
.menu-toggle { display:none; background:none; border:0; color:var(--muted); }
.hero { min-height:600px; padding:78px 0 78px; display:grid; grid-template-columns:1fr 1.15fr; align-items:center; gap:45px; }
.eyebrow { margin:0 0 18px; color:var(--blue); font:700 11px 'Segoe UI',Arial,sans-serif; letter-spacing:.15em; text-transform:uppercase; }
.pulse-dot { display:inline-block; width:7px; height:7px; background:#22c55e; border-radius:50%; margin-right:7px; box-shadow:0 0 0 4px #22c55e1c; }
h1,h2,h3 { font-family:'Segoe UI',Arial,sans-serif; line-height:1.12; margin:0; }
h1 { font-size:clamp(37px,4.6vw,56px); letter-spacing:-.035em; max-width:560px; }
h1 em,h2 em { font-style:normal; color:var(--blue); }
.hero-text { color:var(--muted); max-width:490px; font-size:17px; margin:25px 0 30px; }
.hero-actions { display:flex; align-items:center; gap:25px; }
.text-link,.card-link { color:var(--blue); font-weight:700; font-size:14px; }
.microcopy { color:#94a3b8; font-size:12px; margin-top:18px; }
.hero-dashboard { background:#f5f7fa; border:1px solid #d8e0ea; border-radius:0; box-shadow:0 12px 25px #17203318; overflow:hidden; }
.window-chrome { height:43px; display:flex; align-items:center; justify-content:space-between; padding:0 15px; color:#94a3b8; font-size:10px; background:#fafbfd; border-bottom:1px solid #e8edf3; }
.window-title { display:flex; align-items:center; gap:8px; color:#526176; font-weight:600; }.tiny-mark { width:18px; height:18px; font-size:10px; border-radius:4px; }.window-controls { letter-spacing:6px; }
.dashboard-body { min-height:360px; display:grid; grid-template-columns:190px 1fr; }.dashboard-rail { background:var(--navy); padding:24px 16px; color:#fff; display:flex; flex-direction:column; gap:6px; }.dashboard-rail strong { font:700 15px 'Segoe UI'; padding:0 8px 26px; }.rail-item { color:#cbd5e1; padding:10px 14px; border-radius:1px; font-size:13px; }.rail-item.active { color:#fff; background:var(--blue); }.dashboard-main { padding:30px; background:#f5f7fa; }.scan-status { text-align:center; display:flex; flex-direction:column; align-items:center; }.scan-power { width:112px; height:112px; display:grid; place-items:center; border:0; border-radius:50%; color:#fff; background:var(--blue); font-size:48px; line-height:1; margin-bottom:14px; }.scan-status strong { font-size:18px; font-weight:600; }.scan-status small { display:block; color:#94a3b8; font-size:12px; margin-top:4px; }.scan-hint { color:var(--blue) !important; }.scan-line { background:#dbeafe; height:3px; width:180px; margin-top:18px; }.dashboard-meta { color:#64748b; font-size:13px; margin:30px 0 10px; }.results-table { min-height:145px; background:#fff; border:1px solid #d9e0ea; }.table-heading { display:grid; grid-template-columns:.8fr 1.1fr 1.8fr 1.5fr; gap:10px; color:#64748b; font-size:10px; font-weight:600; padding:13px 12px; border-bottom:1px solid #e8edf3; }.empty-results { color:#94a3b8; font-size:12px; text-align:center; padding:45px 10px; }
.trust-strip { background:#f5f7fa; border-block:1px solid #e7ebf0; }.trust-inner { min-height:70px; display:flex; align-items:center; justify-content:space-between; color:#526176; font-size:13px; }.trust-detail { color:#94a3b8; font-size:12px; }
.comparison-section { padding:98px 0 35px; }.comparison-heading { max-width:590px; }.comparison-heading h2 { font-size:clamp(34px,3.8vw,47px); letter-spacing:-.035em; }.comparison-heading p:last-child { color:var(--muted); max-width:520px; margin:18px 0 0; }.comparison-wrap { position:relative; margin-top:42px; }.comparison-stage { --split:50%; height:420px; position:relative; overflow:hidden; border:1px solid #cbd5e1; background:#dbe3ec; }.pc-scene { position:absolute; inset:0; padding:48px 9% 0; }.before-scene { background:#cbd5e1; clip-path:inset(0 calc(100% - var(--split)) 0 0); }.after-scene { background:#e8edf3; }.pc-monitor { height:296px; border:10px solid #172033; border-bottom-width:14px; border-radius:4px; overflow:hidden; background:#f5f7fa; box-shadow:0 15px 20px #1720333d; }.monitor-bar { height:28px; display:flex; align-items:center; justify-content:space-between; padding:0 10px; background:#fff; color:#64748b; border-bottom:1px solid #d9e0ea; font-size:10px; }.after-app { height:100%; display:grid; grid-template-columns:130px 1fr; }.after-app aside { background:#172033; padding:18px 10px; color:#cbd5e1; display:flex; flex-direction:column; gap:5px; font-size:10px; }.after-app aside b { color:#fff; margin:0 5px 16px; font-size:12px; }.after-app aside span { padding:7px 8px; }.after-app aside .active { color:#fff; background:#2563eb; }.after-app main { display:flex; align-items:center; flex-direction:column; padding:28px 20px; color:#172033; }.clean-circle { width:78px; height:78px; display:grid; place-items:center; border:6px solid #bfdbfe; border-right-color:#2563eb; border-radius:50%; color:#2563eb; font-size:30px; margin-bottom:10px; }.after-app main small { color:#64748b; font-size:10px; margin-top:5px; }.clean-table { align-self:stretch; display:grid; grid-template-columns:.7fr 1fr 1.4fr 1.2fr; margin-top:34px; padding:10px; background:#fff; border:1px solid #d9e0ea; color:#64748b; font-size:8px; }.before-desktop { height:100%; position:relative; background:linear-gradient(135deg,#475569,#1e293b); padding:40px 8%; }.warning-popup { width:min(390px,84%); display:flex; gap:15px; padding:20px; position:absolute; top:58px; left:50%; transform:translateX(-50%); background:#fff; color:#172033; border:1px solid #cbd5e1; box-shadow:0 15px 30px #0005; }.warning-icon { flex:0 0 30px; height:30px; display:grid; place-items:center; color:#fff; background:#dc2626; border-radius:50%; font-weight:700; }.warning-popup b { font-size:14px; }.warning-popup p { color:#64748b; font-size:11px; margin:7px 0 12px; }.warning-button { display:inline-block; padding:6px 9px; color:#fff; background:#b91c1c; font-size:10px; }.desktop-file { position:absolute; color:#cbd5e1; border:1px solid #94a3b8; padding:7px; font-size:9px; opacity:.75; }.file-one { left:15%; top:20px; }.file-two { right:16%; bottom:28px; }.file-three { left:23%; bottom:24px; }.monitor-stand { width:80px; height:28px; margin:0 auto; border-top:14px solid #334155; border-left:12px solid transparent; border-right:12px solid transparent; }.comparison-label { position:absolute; z-index:2; top:16px; padding:5px 9px; background:#172033; color:#fff; font-size:10px; font-weight:700; letter-spacing:.08em; }.comparison-label span { color:#cbd5e1; margin-left:5px; font-weight:400; }.label-before { left:16px; }.label-after { right:16px; background:#2563eb; }.comparison-divider { position:absolute; top:0; bottom:0; left:var(--split); width:2px; z-index:3; background:#fff; box-shadow:0 0 0 1px #17203333; pointer-events:none; }.comparison-divider span { display:grid; place-items:center; width:34px; height:34px; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); border-radius:50%; background:#fff; color:#2563eb; box-shadow:0 2px 8px #17203333; font-size:18px; }.comparison-range { appearance:none; -webkit-appearance:none; position:absolute; inset:0; z-index:4; width:100%; height:100%; opacity:0; cursor:ew-resize; }.comparison-note { color:#94a3b8; font-size:11px; margin:12px 0 0; }
.threat-section { padding:92px 0 30px; }.threat-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:42px; }.threat-grid article { border-left:3px solid var(--blue); background:#f5f7fa; padding:22px 24px 24px; min-height:190px; }.threat-index { color:var(--blue); font-size:11px; font-weight:700; }.threat-grid h3 { font-size:18px; margin-top:16px; }.threat-grid p { color:var(--muted); font-size:13px; margin:10px 0 0; }
.section { padding:105px 0 112px; }.section-heading { max-width:585px; }.section-heading h2,.process-layout h2 { font-size:clamp(34px,3.8vw,47px); letter-spacing:-.035em; }.section-heading > p:last-child { color:var(--muted); max-width:510px; margin:18px 0 0; }.feature-grid { margin-top:45px; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.feature-card { border:1px solid #d9e0ea; border-radius:1px; padding:22px; min-height:275px; background:#fff; transition:box-shadow .2s; }.feature-card:hover { box-shadow:0 7px 18px #17203312; }.feature-large { grid-column:span 2; min-height:320px; background:#fff; border-color:#cbd5e1; }.feature-icon { width:34px; height:34px; border-radius:2px; display:grid; place-items:center; font-weight:700; margin-bottom:24px; }.blue { color:#2563eb; background:#dbeafe; }.violet { color:#7c3aed; background:#ede9fe; }.orange { color:#ea580c; background:#ffedd5; }.green { color:#16a34a; background:#dcfce7; }.slate { color:#475569; background:#e2e8f0; }.card-number { color:#94a3b8; font:700 10px 'Segoe UI'; letter-spacing:.13em; text-transform:uppercase; margin:0 0 8px; }.feature-card h3 { font-size:20px; letter-spacing:-.02em; }.feature-card > p:not(.card-number) { color:var(--muted); font-size:14px; margin:12px 0 17px; max-width:490px; }.mini-list { float:right; width:240px; padding:12px 14px; background:#fff; border:1px solid #d9e0ea; margin-top:-47px; font-size:10px; color:#64748b; }.mini-list span { display:block; padding:7px 0; border-bottom:1px solid #edf2f7; }.mini-list span:last-child { border:0; }.mini-list b { font-size:8px; margin-right:6px; }.status-safe { color:#16a34a; }.status-warning { color:#d97706; }
.process-section { background:var(--navy); color:#fff; padding:110px 0; }.process-layout { display:grid; grid-template-columns:.9fr 1.1fr; gap:100px; }.process-layout .eyebrow { color:#93c5fd; }.process-layout h2 em { color:#93c5fd; }.process-layout .section-heading > p:last-child { color:#9eabc0; }.steps { border-top:1px solid #ffffff26; }.step { display:grid; grid-template-columns:55px 1fr; gap:18px; padding:27px 0; border-bottom:1px solid #ffffff26; }.step > span { color:#60a5fa; font:700 13px 'Segoe UI'; }.step h3 { font-size:19px; }.step p { color:#9eabc0; font-size:14px; margin:9px 0 0; max-width:465px; }
.download-section { padding:105px 0; }.download-card { min-height:300px; background:var(--blue); color:#fff; border-radius:1px; padding:54px 62px; position:relative; overflow:hidden; display:flex; align-items:center; justify-content:space-between; gap:30px; }.download-card .eyebrow { color:#bfdbfe; }.download-card h2 { font-size:44px; letter-spacing:-.035em; }.download-card p:not(.eyebrow) { color:#dbeafe; max-width:460px; margin:19px 0 0; }.download-cta { display:flex; align-items:center; flex-direction:column; position:relative; z-index:1; }.download-cta small { color:#bfdbfe; font-size:11px; margin-top:12px; }.download-mark { position:absolute; right:29%; top:-65px; color:#ffffff12; font:700 330px 'Segoe UI'; line-height:1; }
.site-footer { border-top:1px solid #e7ebf0; }.footer-inner { min-height:92px; display:flex; align-items:center; justify-content:space-between; color:#94a3b8; font-size:12px; }.footer-inner .brand { color:var(--ink); }
.thank-you-page { background:var(--pale); min-height:100vh; }.thank-you-main { min-height:calc(100vh - 78px); display:grid; place-items:center; padding:50px 24px; }.thank-you-card { width:min(590px,100%); padding:57px 60px; text-align:center; background:#fff; border:1px solid var(--line); box-shadow:0 18px 50px #1720330d; border-radius:7px; }.success-mark { width:65px; height:65px; display:grid; place-items:center; margin:0 auto 25px; border-radius:50%; color:#16a34a; background:#dcfce7; font-size:30px; }.thank-you-card h1 { font-size:43px; }.thank-you-card > p:not(.eyebrow):not(.microcopy) { color:var(--muted); margin:22px auto 28px; max-width:440px; }.thank-you-card .text-link { display:inline-block; margin-top:25px; }
@media (max-width:850px) { .site-header { gap:18px; }.header-download { margin-left:auto; }.site-nav { order:4; display:none; position:absolute; left:0; right:0; top:77px; background:#fff; padding:20px 24px; box-shadow:0 10px 20px #17203310; flex-direction:column; gap:17px; }.site-nav.open { display:flex; }.menu-toggle { display:block; order:3; }.hero { grid-template-columns:1fr; padding:75px 0 80px; }.hero-dashboard { max-width:650px; width:100%; margin:auto; }.threat-grid { grid-template-columns:1fr; }.feature-grid { grid-template-columns:1fr 1fr; }.feature-large { grid-column:span 2; }.process-layout { grid-template-columns:1fr; gap:60px; }.download-card { padding:45px; }.download-mark { right:5%; }.trust-detail { display:none; } }
@media (max-width:560px) { .shell { width:min(100% - 32px,1160px); }.site-header { padding:0 16px; height:68px; }.site-header .brand { font-size:13px; }.header-download { display:none; }.site-nav { top:67px; }.hero { padding-top:58px; }.hero-text { font-size:16px; }.hero-actions { align-items:flex-start; flex-direction:column; gap:18px; }.dashboard-body { grid-template-columns:88px 1fr; }.dashboard-rail { padding:20px 8px; }.dashboard-rail strong { padding-inline:5px; }.rail-item { font-size:10px; padding-inline:5px; }.dashboard-main { padding:25px 14px; }.comparison-section { padding-top:75px; }.comparison-stage { height:315px; }.pc-scene { padding:47px 3% 0; }.pc-monitor { height:220px; border-width:7px; }.after-app { grid-template-columns:84px 1fr; }.after-app aside { padding:12px 6px; font-size:8px; }.after-app aside b { font-size:10px; margin-bottom:12px; }.after-app main { padding:18px 10px; }.clean-circle { width:54px; height:54px; font-size:20px; border-width:4px; }.clean-table { margin-top:20px; font-size:6px; padding:7px; }.warning-popup { top:34px; padding:12px; gap:8px; }.warning-popup b { font-size:10px; }.warning-popup p { font-size:8px; margin:5px 0 8px; }.warning-icon { flex-basis:22px; height:22px; font-size:12px; }.warning-button { font-size:7px; padding:4px 5px; }.section { padding:85px 0; }.feature-grid { grid-template-columns:1fr; margin-top:40px; }.feature-large { grid-column:span 1; }.mini-list { float:none; width:auto; margin:23px 0 0; }.trust-inner { min-height:60px; font-size:11px; }.process-section { padding:80px 0; }.download-card { padding:35px 27px; display:block; }.download-card h2 { font-size:40px; }.download-cta { align-items:flex-start; margin-top:28px; }.footer-inner { padding:25px 0; align-items:flex-start; flex-direction:column; gap:13px; }.thank-you-card { padding:42px 25px; }.thank-you-card h1 { font-size:36px; } }
