@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root { --ink:#17251e; --muted:#707b73; --paper:#f2f4ed; --white:#fbfcf9; --acid:#ccf35f; --coral:#ff7358; --line:#d7ddd3; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:'Manrope', sans-serif; }
a { color:inherit; text-decoration:none; }
.site-shell { max-width:1440px; margin:auto; padding:0 5.5vw; overflow:hidden; }
.nav { display:flex; align-items:center; justify-content:space-between; padding:27px 0; border-bottom:1px solid var(--line); }
.logo { display:inline-flex; align-items:center; gap:10px; font-size:16px; font-weight:800; letter-spacing:-.05em; }
.logo-mark { display:grid; width:29px; height:29px; place-items:center; transform:rotate(-8deg); background:var(--ink); color:var(--acid); font-size:12px; }
.nav-links { display:flex; align-items:center; gap:31px; color:var(--muted); font-size:12px; font-weight:600; }
.nav-links a:hover, .footer a:hover { color:var(--coral); }
.nav-cta { padding:11px 14px; background:var(--ink); color:white; }
.nav-cta span, .button span { margin-left:9px; font-size:16px; }
.hero { position:relative; display:grid; grid-template-columns:43% 57%; min-height:720px; padding:91px 0 106px; }
.hero-copy { position:relative; z-index:1; padding-top:39px; }
.kicker { display:flex; align-items:center; gap:11px; margin:0; color:var(--muted); font-family:'DM Mono', monospace; font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.kicker-line { display:inline-block; width:28px; height:1px; background:var(--coral); }
h1,h2 { margin:23px 0; font-family:'Space Grotesk', sans-serif; font-weight:500; letter-spacing:-.075em; line-height:.91; }
h1 { font-size:clamp(62px,7.2vw,105px); }
h2 { font-size:clamp(51px,5.7vw,82px); }
h1 em,h2 em { color:var(--coral); font-style:normal; }
.lede { max-width:365px; margin:29px 0 0; color:var(--muted); font-size:15px; line-height:1.7; }
.hero-actions { display:flex; align-items:center; gap:27px; margin-top:35px; }
.button { display:inline-block; padding:16px 20px; font-size:13px; font-weight:800; }
.button-primary { background:var(--coral); color:white; }
.button-primary:hover { background:var(--ink); }
.text-link { display:inline-flex; align-items:center; gap:10px; border-bottom:1px solid var(--ink); padding-bottom:5px; font-size:12px; font-weight:800; }
.text-link span { font-size:16px; }
.tiny-proof { display:flex; align-items:center; gap:9px; margin-top:60px; color:var(--muted); font-family:'DM Mono', monospace; font-size:10px; }
.proof-dot { width:7px; height:7px; border-radius:50%; background:#62b976; }.proof-divider { width:1px; height:12px; margin:0 4px; background:var(--line); }
.hero-visual { position:relative; padding:0 0 0 2vw; }
.visual-note { position:absolute; top:-23px; left:4px; color:var(--coral); font-family:'DM Mono', monospace; font-size:11px; line-height:1.45; text-transform:uppercase; }
.browser-window { position:relative; width:min(700px,100%); margin:0 auto; transform:rotate(2.7deg); box-shadow:18px 22px 0 rgba(23,37,30,.1); }
.browser-bar { display:flex; align-items:center; justify-content:space-between; height:39px; padding:0 15px; background:#26372e; color:#a1b1a5; font-family:'DM Mono', monospace; font-size:9px; }
.traffic-lights { display:flex; gap:5px; }.traffic-lights i { width:7px; height:7px; border-radius:50%; background:#f77b61; }.traffic-lights i:nth-child(2){background:#d4ed65}.traffic-lights i:nth-child(3){background:#76bd86}
.extension-card { min-height:505px; padding:28px 31px 31px; background:var(--white); }.mock-top { display:flex; align-items:center; justify-content:space-between; font-size:12px; font-weight:800; }.mock-brand { display:flex; align-items:center; gap:7px; }.mock-brand b { display:grid; width:22px; height:22px; place-items:center; background:var(--ink); color:var(--acid); font-size:9px; }.mock-status { color:var(--muted); font-family:'DM Mono',monospace; font-size:8px; font-weight:400; text-transform:uppercase; }.mock-status i { display:inline-block; width:5px; height:5px; margin-right:4px; border-radius:50%; background:#62b976; }
.mock-hero { padding:65px 0 33px; }.mock-kicker { display:block; color:var(--muted); font-family:'DM Mono',monospace; font-size:8px; letter-spacing:.08em; }.mock-hero strong { display:block; margin-top:14px; font-family:Georgia,serif; font-size:42px; font-weight:400; letter-spacing:-2px; line-height:.93; }.mock-hero em { color:var(--coral); font-style:normal; }.mock-hero small { display:block; max-width:245px; margin-top:15px; color:var(--muted); font-size:10px; line-height:1.5; }
.mock-search { padding:17px; background:var(--ink); color:#bbc9bd; font-size:9px; }.mock-search>span { display:block; margin-bottom:11px; color:#d5ded5; }.mock-search>span:first-letter { color:var(--acid); font-size:18px; }.mock-search div { display:flex; align-items:center; gap:7px; }.mock-search div span { flex:1; padding:11px; border:1px solid #526358; color:#94a198; }.mock-search b { padding:11px 13px; background:var(--acid); color:var(--ink); font-size:10px; white-space:nowrap; }.mock-benefits { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding-top:27px; }.mock-benefits span { display:flex; flex-direction:column; gap:4px; color:var(--muted); font-size:9px; line-height:1.3; }.mock-benefits b { color:var(--coral); font-family:'DM Mono',monospace; font-size:8px; }.mock-benefits strong { color:var(--ink); font-size:10px; }
.marquee { display:flex; align-items:center; justify-content:space-around; gap:20px; margin:0 -10vw; padding:19px 0; transform:rotate(-1.5deg); background:var(--acid); color:var(--ink); font-family:'DM Mono',monospace; font-size:10px; font-weight:500; letter-spacing:.08em; }.marquee i { color:var(--coral); font-style:normal; font-size:16px; }
.feature-section { display:grid; grid-template-columns:39% 61%; gap:6%; padding:165px 0 154px; }.section-intro>p:last-child { max-width:260px; margin-top:30px; color:var(--muted); font-size:14px; line-height:1.7; }.feature-list { padding-top:16px; }.feature { display:grid; grid-template-columns:39px 1fr 20px; gap:17px; align-items:start; padding:28px 0; border-top:1px solid var(--line); }.feature:last-child { border-bottom:1px solid var(--line); }.feature-no { color:var(--coral); font-family:'DM Mono',monospace; font-size:11px; }.feature h3 { margin:0 0 9px; font-family:'Space Grotesk',sans-serif; font-size:22px; font-weight:600; letter-spacing:-.04em; }.feature p { max-width:390px; margin:0; color:var(--muted); font-size:13px; line-height:1.6; }.feature-arrow { color:var(--coral); font-size:22px; }
.privacy-section { display:grid; grid-template-columns:39% 61%; gap:6%; align-items:center; margin:0 -5.5vw; padding:100px 11vw; background:var(--ink); color:white; }.privacy-stamp { display:grid; width:180px; height:180px; place-items:center; border:1px solid #728177; border-radius:50%; color:var(--acid); font-family:'DM Mono',monospace; font-size:12px; letter-spacing:.11em; line-height:1.5; text-align:center; transform:rotate(-11deg); }.privacy-section .kicker { color:#afbbb1; }.privacy-section h2 { margin:22px 0; }.privacy-section>div:last-child>p:not(.kicker) { max-width:410px; color:#aab7ac; font-size:14px; line-height:1.7; }.dark-link { margin-top:22px; border-color:var(--acid); color:var(--acid); }
.footer { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:31px 0; color:var(--muted); font-family:'DM Mono',monospace; font-size:10px; }.footer .logo { color:var(--ink); font-family:'Manrope',sans-serif; font-size:14px; }.footer>a:last-child { color:var(--ink); }
@media (max-width:900px) { .hero { grid-template-columns:1fr; padding:70px 0 90px; }.hero-copy { padding:0; }.hero-visual { margin:82px 0 0 7vw; padding:0; }.feature-section,.privacy-section { grid-template-columns:1fr; gap:60px; }.privacy-section { margin-inline:-5.5vw; padding-inline:11vw; }.privacy-stamp { width:130px; height:130px; font-size:10px; }.footer { flex-wrap:wrap; } }
@media (max-width:620px) { .site-shell { padding:0 21px; }.nav { padding:20px 0; }.nav-links>a:not(.nav-cta) { display:none; }.nav-links { gap:0; }.hero { min-height:0; padding:65px 0 83px; }.hero-copy h1 { font-size:61px; }.hero-actions { flex-wrap:wrap; gap:20px; }.tiny-proof { margin-top:44px; }.hero-visual { margin:73px -14px 0 22px; }.browser-window { transform:rotate(2deg); }.extension-card { min-height:400px; padding:22px 18px; }.mock-hero { padding:43px 0 24px; }.mock-hero strong { font-size:31px; }.mock-search { padding:12px; }.mock-search div span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.mock-benefits { padding-top:20px; }.marquee { margin:0 -30px; justify-content:flex-start; width:calc(100% + 60px); overflow:hidden; white-space:nowrap; }.marquee span:nth-of-type(n+3),.marquee i:nth-of-type(n+2) { display:none; }.feature-section { padding:110px 0; }.privacy-section { margin-inline:-21px; padding:80px 21px; }.footer { align-items:flex-start; flex-direction:column; }.footer>span { order:3; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none!important; animation:none!important; } }
