:root{--bg:#0B0B0F;--card:#14161C;--line:#262A35;--text:#FAFAFA;--muted:#A0A6B2;--me:#4F8BFF;--them:#FF4FA3;--action:#3B76F6}
*{box-sizing:border-box;margin:0}
html{background:var(--bg);color:var(--text);font:17px/1.55 ui-rounded,"SF Pro Rounded",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-text-size-adjust:100%}
body{min-height:100vh;overflow-x:hidden}
a{color:var(--me)}
.wrap{max-width:1040px;margin:0 auto;padding:0 22px}
header{display:flex;align-items:center;justify-content:space-between;padding:22px 0}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;color:var(--text);text-decoration:none;letter-spacing:-.015em}
.brand b{color:var(--me)}
.brand img{width:40px;height:40px}
nav a{color:var(--muted);text-decoration:none;font-size:15px;margin-left:20px}
nav a:hover{color:var(--text)}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center;padding:32px 0 56px;position:relative}
.hero:before,.hero:after{content:"";position:absolute;width:520px;height:520px;border-radius:50%;filter:blur(130px);opacity:.35;z-index:-1}
.hero:before{background:var(--me);left:-220px;top:-120px}.hero:after{background:var(--them);right:-240px;bottom:-160px}
.hey-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;background:rgba(79,139,255,.14);border:1px solid rgba(79,139,255,.32);color:var(--me);font-weight:700;font-size:14px;margin-bottom:16px}
.hey-pill i{width:8px;height:8px;border-radius:50%;background:var(--them);display:inline-block}
h1{font-size:clamp(44px,8vw,84px);line-height:1;font-weight:900;letter-spacing:-.035em}
h1 span{color:var(--them)}
.lead{color:var(--muted);font-size:clamp(18px,2.4vw,22px);margin:20px 0 28px;max-width:30em}
.cta-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.cta{display:inline-flex;align-items:center;min-height:56px;padding:0 30px;border-radius:999px;background:var(--action);color:#fff;font-weight:700;text-decoration:none;font-size:18px}
.cta[aria-disabled=true]{background:var(--card);border:1px solid var(--line);color:var(--text);cursor:default}
.sub-note{color:var(--muted);font-size:14px}
.hero img{width:100%;height:auto;animation:float 4s ease-in-out infinite alternate}
@keyframes float{to{transform:translateY(-12px)}}
@media (prefers-reduced-motion:reduce){.hero img{animation:none}}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding-bottom:56px}
.grid img{width:100%;height:auto;border-radius:22px;display:block;border:1px solid var(--line)}
.feats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding-bottom:64px}
.feat{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:24px}
.feat h2{font-size:21px;margin-bottom:6px;letter-spacing:-.01em}
.feat p{color:var(--muted);font-size:16px}
.feat b{color:var(--me)}.feat i{color:var(--them);font-style:normal;font-weight:700}
footer{border-top:1px solid var(--line);padding:26px 0 40px;color:var(--muted);font-size:14px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
footer a{color:var(--muted);text-decoration:none;margin-left:16px}
footer a:hover{color:var(--text)}
.doc{max-width:720px;padding:20px 0 64px}
.doc h1{font-size:clamp(36px,6vw,54px);margin-bottom:8px}
.doc h2{font-size:22px;margin:34px 0 8px}
.doc p,.doc li{color:#D5D9E0}.doc ul{padding-left:22px}.doc li{margin:6px 0}
.note{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px 18px;color:var(--muted);margin:18px 0}
@media (max-width:820px){.hero{grid-template-columns:1fr;padding-top:12px}.hero .art{order:-1;max-width:420px;margin:0 auto}.grid{grid-template-columns:repeat(2,1fr)}.feats{grid-template-columns:1fr}}
