:root { --bg:#0b0f0c; --green:#00e676; --green-dim:#00b35c; --ink:#f0f5f2; --muted:#9aa5a1; --card:#111712; --line:#1e2b20; }
* { margin:0; padding:0; box-sizing:border-box; }
body { background:var(--bg); color:var(--ink); font-family:"Segoe UI",system-ui,-apple-system,sans-serif; line-height:1.6; }
.wrap { max-width:1080px; margin:0 auto; padding:0 24px; }
header { border-bottom:1px solid var(--line); padding:20px 0; position:sticky; top:0; background:rgba(11,15,12,.92); backdrop-filter:blur(8px); z-index:10; }
header .wrap { display:flex; justify-content:space-between; align-items:center; }
.logo { font-weight:800; font-size:22px; letter-spacing:1px; color:var(--green); text-decoration:none; }
.logo span { color:var(--ink); }
nav.main { display:flex; gap:28px; align-items:center; }
nav.main a.nl { color:var(--muted); text-decoration:none; font-size:15px; }
nav.main a.nl:hover, nav.main a.nl.active { color:var(--green); }
.btn { display:inline-block; background:var(--green); color:#06120a; font-weight:700; padding:14px 32px; border-radius:10px; text-decoration:none; border:0; cursor:pointer; font-size:16px; transition:transform .15s, box-shadow .15s; }
.btn:hover { transform:translateY(-2px); box-shadow:0 8px 28px rgba(0,230,118,.35); }
.btn.ghost { background:transparent; color:var(--green); border:2px solid var(--green); }
.btn.sm { padding:10px 22px; font-size:14px; }
.hero { text-align:center; padding:100px 0 70px; }
.hero .kick { color:var(--green); font-weight:700; letter-spacing:3px; font-size:14px; text-transform:uppercase; margin-bottom:24px; }
.hero h1 { font-size:clamp(40px,7vw,80px); line-height:1.05; font-weight:800; margin-bottom:24px; }
.hero h1 em { font-style:normal; color:var(--green); }
.hero p { color:var(--muted); font-size:20px; max-width:660px; margin:0 auto 40px; }
.hero .cta-row { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
.section { padding:64px 0; }
.section h2 { font-size:clamp(28px,4vw,44px); font-weight:800; margin-bottom:16px; text-align:center; }
.section h2 em { font-style:normal; color:var(--green); }
.section .sub { color:var(--muted); text-align:center; max-width:660px; margin:0 auto 48px; font-size:18px; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:20px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:32px 28px; transition:border-color .2s, transform .2s; }
.card:hover { border-color:var(--green-dim); transform:translateY(-4px); }
.card .icon { font-size:34px; margin-bottom:16px; }
.card h3 { font-size:20px; margin-bottom:10px; }
.card p { color:var(--muted); font-size:15px; }
.card .go { display:inline-block; margin-top:16px; color:var(--green); font-weight:700; text-decoration:none; }
.step { display:flex; gap:24px; align-items:flex-start; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:28px; margin-bottom:16px; }
.step .num { flex:0 0 52px; height:52px; border-radius:50%; background:var(--green); color:#06120a; font-weight:800; font-size:22px; display:flex; align-items:center; justify-content:center; }
.step h3 { font-size:19px; margin-bottom:6px; }
.step p { color:var(--muted); font-size:15px; }
.step .tag { display:inline-block; font-size:12px; font-weight:700; letter-spacing:1px; color:var(--green); text-transform:uppercase; margin-bottom:4px; }
.check { display:flex; gap:14px; align-items:flex-start; margin-bottom:18px; }
.check .x { color:var(--green); font-weight:800; font-size:20px; flex:0 0 28px; }
.check p { color:var(--muted); font-size:16px; }
.check p strong { color:var(--ink); }
.faq { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:28px; margin-bottom:14px; }
.faq h3 { font-size:18px; margin-bottom:8px; color:var(--green); }
.faq p { color:var(--muted); font-size:15px; }
.notify { background:linear-gradient(135deg,#0e1a10,#0b0f0c); border:1px solid var(--green-dim); border-radius:20px; padding:56px 32px; text-align:center; }
.notify h2 { margin-bottom:12px; }
.notify p { color:var(--muted); margin-bottom:28px; }
.notify form { display:flex; gap:12px; max-width:480px; margin:0 auto; flex-wrap:wrap; justify-content:center; }
.notify input { flex:1 1 260px; padding:14px 18px; border-radius:10px; border:1px solid var(--line); background:#0b0f0c; color:var(--ink); font-size:16px; }
.notify input:focus { outline:none; border-color:var(--green); }
.ok { display:none; color:var(--green); font-weight:700; margin-top:16px; }
footer { border-top:1px solid var(--line); padding:32px 0; text-align:center; color:var(--muted); font-size:14px; }
footer a { color:var(--green); text-decoration:none; }
.split { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
@media (max-width:720px){ .split{grid-template-columns:1fr;} nav.main a.nl{display:none;} }
.badge-demo { display:inline-flex; align-items:center; gap:10px; background:var(--card); border:1px solid var(--green-dim); border-radius:999px; padding:10px 22px; font-weight:700; margin-bottom:28px; }
.badge-demo .dot { width:12px; height:12px; border-radius:50%; background:var(--green); box-shadow:0 0 12px var(--green); }