:root{--bg:#F5F6FB;--surface:#fff;--text:#14152B;--muted:#6B6F8A;--border:#E7E8F2;--primary:#6366F1;--violet:#8B5CF6;--mint:#10B981}
@media (prefers-color-scheme:dark){:root{--bg:#0B0D1A;--surface:#161A2E;--text:#F3F4FF;--muted:#9A9DBA;--border:#252A45}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.65 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Inter,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}
.wrap{max-width:760px;margin:0 auto;padding:0 20px}
header{padding:22px 0}header .wrap{display:flex;align-items:center;gap:12px}
header img{width:40px;height:40px;border-radius:11px}header b{font-size:20px;letter-spacing:-.3px}
header nav{margin-left:auto;display:flex;gap:18px;font-weight:600;font-size:15px}
.hero{background:linear-gradient(135deg,#6366F1,#7C3AED 55%,#4C1D95);color:#fff;border-radius:28px;padding:56px 32px;text-align:center;margin:12px 0 36px;position:relative;overflow:hidden}
.hero img{width:96px;height:96px;border-radius:26px;box-shadow:0 20px 40px rgba(0,0,0,.25);animation:float 3s ease-in-out infinite}
.hero h1{font-size:clamp(30px,6vw,46px);line-height:1.1;letter-spacing:-1.2px;margin:22px 0 10px}
.hero p{opacity:.85;font-size:18px;max-width:520px;margin:0 auto}
@keyframes float{50%{transform:translateY(-8px)}}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin-bottom:40px}
.card{background:var(--surface);border:1px solid var(--border);border-radius:22px;padding:22px}
.card h3{margin:10px 0 4px;font-size:17px}.card p{margin:0;color:var(--muted);font-size:14.5px}
.dot{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;font-size:20px}
.doc{background:var(--surface);border:1px solid var(--border);border-radius:24px;padding:36px clamp(20px,5vw,44px);margin-bottom:40px}
.doc h1{letter-spacing:-.8px;line-height:1.2;margin-top:0}.doc h2{font-size:19px;margin-top:32px}
.doc p,.doc li{color:var(--text)}.muted{color:var(--muted)}
footer{padding:10px 0 40px;color:var(--muted);font-size:14px;text-align:center}
footer a{margin:0 8px}