:root { --bg:#07070c; --panel:#0e0f1c; --panel2:#12142a; --border:#1d1f38; --text:#f2f3fa; --muted:#8b8fae; --accent:#5446e8; --accent2:#7c6cff; --green:#34d399; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--text); font:16px/1.6 Inter, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; -webkit-font-smoothing:antialiased; }
a { color:#a5a3ff; }
.wrap { max-width:1080px; margin:0 auto; padding:0 20px; }
header.top { position:sticky; top:0; z-index:5; background:rgba(7,7,12,.82); backdrop-filter:blur(12px); border-bottom:1px solid var(--border); }
header.top .wrap { display:flex; align-items:center; gap:12px; height:64px; }
.brand { display:flex; align-items:center; gap:10px; color:var(--text); text-decoration:none; font-weight:700; font-size:18px; }
.brand img { width:32px; height:32px; }
nav { margin-left:auto; display:flex; gap:22px; }
nav a { color:var(--muted); text-decoration:none; font-size:14px; }
nav a:hover { color:var(--text); }
.hero { padding:96px 0 72px; text-align:center; background:radial-gradient(900px 420px at 50% -10%, rgba(84,70,232,.35), transparent 70%); }
.pill { display:inline-block; padding:5px 12px; border-radius:999px; border:1px solid #3a37a0; background:#23215a; color:#c3c1ff; font-size:13px; }
.hero h1 { font-size:clamp(34px, 6vw, 58px); line-height:1.08; margin:18px auto 16px; max-width:820px; letter-spacing:-.02em; }
.hero h1 span { background:linear-gradient(90deg,#a5a3ff,#7c6cff 50%,#34d399); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero p { color:var(--muted); font-size:clamp(16px,2.2vw,19px); max-width:640px; margin:0 auto 30px; }
.cta { display:inline-flex; gap:12px; flex-wrap:wrap; justify-content:center; }
.btn { display:inline-block; padding:13px 22px; border-radius:12px; font-weight:600; text-decoration:none; border:1px solid var(--border); color:var(--text); background:var(--panel); }
.btn.primary { background:var(--accent); border-color:var(--accent); color:#fff; }
.note { margin-top:14px; color:var(--muted); font-size:13px; }
section { padding:56px 0; }
h2 { font-size:clamp(26px,4vw,36px); margin:0 0 10px; letter-spacing:-.01em; }
.lead { color:var(--muted); margin:0 0 32px; max-width:640px; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:16px; }
.card { background:var(--panel); border:1px solid var(--border); border-radius:18px; padding:22px; }
.card .ic { width:40px; height:40px; border-radius:11px; display:grid; place-items:center; background:var(--panel2); border:1px solid var(--border); font-size:20px; margin-bottom:12px; }
.card h3 { margin:0 0 6px; font-size:17px; }
.card p { margin:0; color:var(--muted); font-size:14.5px; }
.strip { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; text-align:center; }
.strip div { padding:20px; border-radius:16px; background:var(--panel); border:1px solid var(--border); }
.strip b { display:block; font-size:22px; } .strip span { color:var(--muted); font-size:14px; }
footer { border-top:1px solid var(--border); padding:28px 0 40px; color:var(--muted); font-size:14px; }
footer .wrap { display:flex; flex-wrap:wrap; gap:14px 24px; align-items:center; }
footer a { color:var(--muted); text-decoration:none; } footer a:hover { color:var(--text); }
footer .sp { flex:1; }
/* legal pages */
.doc { max-width:780px; padding:56px 20px 72px; }
.doc h1 { font-size:clamp(30px,5vw,42px); margin:0 0 6px; }
.doc .updated { color:var(--muted); margin:0 0 30px; }
.doc h2 { font-size:21px; margin:34px 0 8px; }
.doc p, .doc li { color:#d6d7e6; }
.doc ul { padding-left:22px; }
.doc .box { background:var(--panel); border:1px solid var(--border); border-radius:14px; padding:16px 18px; }
@media (max-width:640px) { nav { gap:14px; } nav a.hide-sm { display:none; } .hero { padding:64px 0 48px; } }
