:root { --bg:#ffffff; --surface:#f6f8fa; --fg:#16202a; --muted:#5f6f7f; --line:#e3e8ee; --navy:#1d2b3a; --navy-2:#27394d; --signal:#e11d48; --ok:#15803d; --max:1120px; }
@media (prefers-color-scheme: dark) { :root { --bg:#0f1419; --surface:#161d25; --fg:#e8edf2; --muted:#93a2b2; --line:#26303c; --navy:#e8edf2; --navy-2:#1c2530; } }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--fg); font:16px/1.6 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; -webkit-font-smoothing:antialiased; }
h1,h2,h3 { font-family:Manrope,Inter,sans-serif; letter-spacing:-0.015em; line-height:1.15; margin:0 0 .5rem; }
h1 { font-size:clamp(2.2rem,5.5vw,3.6rem); font-weight:800; }
h2 { font-size:clamp(1.6rem,3.2vw,2.2rem); font-weight:800; }
h3 { font-size:1.1rem; font-weight:700; }
p { margin:0 0 1rem; }
a { color:inherit; }
.wrap { max-width:var(--max); margin:0 auto; padding:0 20px; }
.muted { color:var(--muted); }
.btn { display:inline-flex; align-items:center; gap:.5rem; padding:.8rem 1.25rem; border-radius:12px; font-weight:600; text-decoration:none; border:1px solid var(--line); background:var(--bg); color:var(--fg); }
.btn-primary { background:#1d2b3a; color:#fff; border-color:#1d2b3a; }
.btn-primary:hover { background:#27394d; }
.btn-lg { padding:1rem 1.5rem; font-size:1.05rem; }
header.nav { position:sticky; top:0; z-index:10; background:color-mix(in srgb,var(--bg) 88%,transparent); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
header.nav .wrap { display:flex; align-items:center; justify-content:space-between; height:64px; }
.logo { display:inline-flex; align-items:center; gap:10px; text-decoration:none; font-family:Manrope,sans-serif; font-weight:800; font-size:1.15rem; }
.logo span { font-weight:500; } .logo .dot { color:var(--signal); font-weight:800; }
nav.links { display:flex; gap:22px; align-items:center; font-size:.95rem; }
nav.links a { text-decoration:none; color:var(--muted); } nav.links a:hover { color:var(--fg); }
@media (max-width:720px) { nav.links a:not(.btn) { display:none; } }
.hero { padding:88px 0 56px; }
.hero .wrap { display:grid; gap:40px; grid-template-columns:1.1fr .9fr; align-items:center; }
@media (max-width:860px) { .hero .wrap { grid-template-columns:1fr; } .hero { padding:56px 0 32px; } }
.eyebrow { display:inline-flex; gap:8px; align-items:center; font-size:.8rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--signal); margin-bottom:14px; }
.lede { font-size:1.2rem; color:var(--muted); max-width:36rem; }
.cta { display:flex; gap:12px; flex-wrap:wrap; margin:22px 0 10px; }
.fine { font-size:.85rem; color:var(--muted); }
.mock { background:var(--surface); border:1px solid var(--line); border-radius:18px; padding:18px; box-shadow:0 20px 50px rgb(16 24 40 / .10); }
.mock .row { display:flex; align-items:center; gap:14px; padding:12px 10px; border-bottom:1px solid var(--line); }
.mock .row:last-child { border-bottom:0; }
.score { font-family:Manrope; font-weight:800; font-size:1.5rem; width:44px; }
.score.ok { color:var(--ok); } .score.warn { color:#b45309; }
.mock .t { font-weight:600; font-size:.95rem; } .mock .s { font-size:.8rem; color:var(--muted); }
.mock .tag { margin-left:auto; font-size:.72rem; padding:2px 8px; border-radius:999px; background:var(--bg); border:1px solid var(--line); color:var(--muted); white-space:nowrap; }
section { padding:64px 0; }
section.alt { background:var(--surface); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.sec-head { max-width:40rem; margin-bottom:34px; }
.grid3 { display:grid; gap:20px; grid-template-columns:repeat(3,1fr); }
.grid2 { display:grid; gap:20px; grid-template-columns:repeat(2,1fr); }
@media (max-width:860px) { .grid3,.grid2 { grid-template-columns:1fr; } }
.card { background:var(--bg); border:1px solid var(--line); border-radius:16px; padding:24px; }
.alt .card { background:var(--bg); }
.step { display:flex; gap:16px; }
.step .n { flex:none; width:36px; height:36px; border-radius:50%; background:#1d2b3a; color:#fff; display:flex; align-items:center; justify-content:center; font-weight:800; font-family:Manrope; }
ul.checks { list-style:none; padding:0; margin:0; } ul.checks li { padding:6px 0 6px 28px; position:relative; } ul.checks li::before { content:"✓"; position:absolute; left:4px; color:var(--ok); font-weight:800; }
.plans { display:grid; gap:20px; grid-template-columns:repeat(3,1fr); align-items:stretch; }
@media (max-width:860px) { .plans { grid-template-columns:1fr; } }
.plan { position:relative; display:flex; flex-direction:column; }
.plan.featured { border-color:#1d2b3a; box-shadow:0 12px 32px rgb(16 24 40 / .10); }
.plan .price { font-family:Manrope; font-size:2.4rem; font-weight:800; margin:6px 0; } .plan .price small { font-size:1rem; font-weight:500; color:var(--muted); }
.plan .btn { margin-top:auto; justify-content:center; }
.badge { position:absolute; top:-12px; left:24px; background:var(--signal); color:#fff; font-size:.72rem; font-weight:700; padding:3px 10px; border-radius:999px; letter-spacing:.04em; }
details { border-top:1px solid var(--line); padding:14px 0; } details:last-of-type { border-bottom:1px solid var(--line); }
summary { cursor:pointer; font-weight:600; list-style:none; display:flex; justify-content:space-between; } summary::-webkit-details-marker { display:none; } summary::after { content:"+"; color:var(--muted); } details[open] summary::after { content:"–"; }
details p { margin:10px 0 0; color:var(--muted); }
.promise { display:flex; gap:18px; align-items:flex-start; padding:26px; border:1px solid var(--line); border-radius:16px; background:var(--bg); }
.promise .dot { flex:none; width:12px; height:12px; border-radius:50%; background:var(--signal); margin-top:8px; }
footer { padding:40px 0; border-top:1px solid var(--line); font-size:.9rem; color:var(--muted); }
footer .wrap { display:flex; flex-wrap:wrap; gap:14px 28px; justify-content:space-between; align-items:center; }
footer nav { display:flex; flex-wrap:wrap; gap:18px; } footer a { color:var(--muted); text-decoration:none; } footer a:hover { color:var(--fg); }
.legal { max-width:46rem; padding:56px 20px; margin:0 auto; } .legal h1 { font-size:2rem; } .legal h2 { font-size:1.25rem; margin-top:2rem; } .legal p, .legal li { color:var(--fg); } .legal .updated { color:var(--muted); font-size:.9rem; }