:root { --bg:#0a0b0e; --panel:#111319; --panel-2:#151820; --text:#f2f1ed; --muted:#9c9da6; --line:#282b34; --accent:#c8f563; --accent-dark:#1c2610; --warm:#f8b87a; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--text); font-family:Manrope,system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
body::before { position:fixed; inset:0; z-index:-1; pointer-events:none; content:""; opacity:.26; background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size:64px 64px; mask-image:linear-gradient(to bottom,black,transparent 75%); }
a { color:inherit; }
.page-shell { width:min(1140px,calc(100% - 40px)); margin:0 auto; }
.site-header { height:88px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:10px; font-size:14px; font-weight:800; letter-spacing:-.02em; text-decoration:none; }
.brand-mark { display:grid; place-items:center; width:27px; height:27px; border:1px solid var(--accent); color:var(--accent); font-size:15px; border-radius:8px; }
.header-note,.card-index,.eyebrow,.section-label,.topic-number { color:var(--accent); font:500 11px/1.4 'DM Mono',monospace; letter-spacing:.12em; text-transform:uppercase; }
.hero { display:grid; grid-template-columns:1.1fr .9fr; align-items:center; gap:clamp(42px,8vw,110px); min-height:690px; padding:80px 0 100px; }
.hero-copy { position:relative; }
.hero-copy::after { position:absolute; z-index:-1; top:-120px; left:-90px; width:380px; height:380px; content:""; background:radial-gradient(circle,rgba(200,245,99,.13),transparent 68%); filter:blur(4px); }
.eyebrow { display:flex; align-items:center; gap:10px; margin:0 0 28px; }
.live-dot { width:7px; height:7px; background:var(--accent); border-radius:50%; box-shadow:0 0 0 5px rgba(200,245,99,.09); }
h1,h2,h3,p { margin-top:0; }
h1 { max-width:650px; margin-bottom:28px; font-size:clamp(3.2rem,7vw,6.7rem); line-height:.98; letter-spacing:-.075em; font-weight:700; }
h1 em { color:var(--accent); font-style:normal; }
.intro { max-width:540px; color:#c5c5c8; font-size:clamp(1rem,1.6vw,1.17rem); line-height:1.7; }
.signup-card { padding:clamp(26px,4vw,42px); border:1px solid #30333d; border-radius:18px; background:linear-gradient(145deg,rgba(24,27,34,.97),rgba(14,16,21,.97)); box-shadow:0 26px 90px rgba(0,0,0,.3); }
.card-heading { border-bottom:1px solid var(--line); margin-bottom:28px; padding-bottom:23px; }
.card-index { margin-bottom:14px; display:block; color:var(--muted); }
.card-heading h2 { margin-bottom:8px; font-size:2rem; letter-spacing:-.06em; }
.card-heading p { margin:0; color:var(--muted); font-size:13px; line-height:1.6; }
.field-group { margin-bottom:21px; }
label { display:block; margin-bottom:9px; font-size:13px; font-weight:700; }
label span { color:var(--accent); }
.input-wrap { display:flex; align-items:center; border:1px solid #383b46; border-radius:9px; background:#0c0e12; transition:border-color .2s,box-shadow .2s; }
.input-wrap:focus-within,textarea:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(200,245,99,.1); outline:none; }
.input-prefix { padding-left:14px; color:var(--accent); font:500 15px 'DM Mono',monospace; }
input,textarea { width:100%; border:0; outline:0; background:transparent; color:var(--text); font:inherit; font-size:14px; }
input { padding:14px 13px; }
textarea { display:block; min-height:111px; resize:vertical; padding:14px; border:1px solid #383b46; border-radius:9px; line-height:1.5; }
input::placeholder,textarea::placeholder { color:#62646d; }
.field-hint { margin:7px 0 0; color:#737680; font-size:11px; }
.field-meta { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.field-meta .field-hint { margin-bottom:0; }
#char-count { color:#686b75; font:11px 'DM Mono',monospace; }
.field-error { min-height:0; margin:6px 0 0; color:#ff8f83; font-size:11px; }
button { display:flex; align-items:center; justify-content:space-between; width:100%; margin-top:27px; padding:15px 17px; border:1px solid var(--accent); border-radius:9px; background:var(--accent); color:#11140c; cursor:pointer; font:700 14px Manrope,sans-serif; transition:transform .2s,background .2s; }
button:hover { transform:translateY(-2px); background:#dcff8b; }
button:focus-visible { outline:3px solid rgba(200,245,99,.4); outline-offset:3px; }
button[disabled] { cursor:not-allowed; opacity:.45; transform:none; filter:grayscale(.25); }
.button-arrow { font-size:19px; line-height:1; }
.consent-row { display:flex; align-items:flex-start; gap:10px; margin-top:22px; }
.consent-row input[type="checkbox"] { flex:0 0 auto; width:18px; height:18px; margin:1px 0 0; accent-color:var(--accent); cursor:pointer; }
.consent-row label { display:block; margin:0; color:var(--muted); font-size:11px; line-height:1.55; font-weight:500; }
.consent-row a,.privacy-note a,.legal a { color:var(--accent); }
.privacy-note { display:flex; gap:8px; margin:17px 0 0; color:#70727c; font-size:10px; line-height:1.55; }
.privacy-note span { flex:0 0 auto; color:var(--accent); }
.form-message { display:none; margin-top:15px; padding:12px; border-radius:8px; font-size:12px; line-height:1.5; }
.form-message.success { display:block; color:#d8f7a4; background:rgba(200,245,99,.1); border:1px solid rgba(200,245,99,.26); }
.form-message.error { display:block; color:#ffb0a6; background:rgba(255,99,84,.09); border:1px solid rgba(255,99,84,.25); }
.form-message.info { display:block; color:#d8d9e0; background:rgba(255,255,255,.05); border:1px solid var(--line); }
.legal { max-width:820px; padding:74px 0 88px; }
.legal h1 { max-width:none; margin:16px 0 22px; font-size:clamp(2.8rem,7vw,5.6rem); }
.legal-lead { max-width:650px; color:#c5c5c8; font-size:1.05rem; line-height:1.7; }
.legal section { margin-top:44px; }
.legal h2 { margin-bottom:12px; color:var(--accent); font-size:1.2rem; letter-spacing:-.03em; }
.legal p,.legal li { color:#c5c5c8; font-size:14px; line-height:1.75; }
.legal ul { padding-left:22px; }
.legal-section-note { color:var(--muted)!important; font-size:12px!important; }
.optout-block { margin-top:54px!important; padding:28px; border:1px solid #30333d; border-radius:14px; background:rgba(17,19,25,.72); }
.optout-block h2 { margin-top:0; }
.optout-form { max-width:480px; margin-top:22px; }
.optout-form button { margin-top:16px; }
.topics { border-top:1px solid var(--line); padding:68px 0 82px; }
.section-label { display:flex; align-items:center; gap:16px; color:var(--muted); }
.line { display:block; width:70px; height:1px; background:var(--line); }
.topics h2 { margin:24px 0 48px; font-size:clamp(2rem,4.5vw,4rem); line-height:1.03; letter-spacing:-.07em; }
.topics h2 span { color:#6f717b; }
.topic-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.topic-grid article { min-height:190px; padding:24px 0; border-top:1px solid #393c45; }
.topic-number { color:var(--accent); }
.topic-grid h3 { margin:30px 0 10px; font-size:1.1rem; letter-spacing:-.03em; }
.topic-grid p { max-width:290px; margin:0; color:var(--muted); font-size:13px; line-height:1.65; }
.site-footer { display:flex; justify-content:space-between; gap:20px; padding:22px 0 30px; border-top:1px solid var(--line); color:#62646d; font:10px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.08em; }
@media (max-width:760px) { .page-shell { width:min(100% - 32px,560px); } .site-header { height:72px; } .header-note { font-size:9px; } .hero { display:block; min-height:0; padding:70px 0 75px; } h1 { font-size:clamp(3.15rem,15vw,5rem); } .intro { font-size:1rem; } .signup-card { margin-top:54px; } .topic-grid { grid-template-columns:1fr; gap:0; } .topic-grid article { min-height:0; padding:25px 0 27px; } .topic-grid h3 { margin-top:19px; } .topics { padding-top:56px; } .legal { padding:54px 0 68px; } .legal h1 { font-size:clamp(2.8rem,15vw,5rem); } .optout-block { padding:22px; } .site-footer { display:block; line-height:2; } .site-footer span { display:block; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*:before,*:after { transition:none!important; } }