:root{--bg:#0b0820;--ink:#ece9f7;--mut:#a9a3c4;--card:#15112e;--line:#2a2450;--grad:linear-gradient(90deg,#ff6ec7,#ffb86b,#7ee8fa,#a78bfa)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font:17px/1.6 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--bg);
background-image:radial-gradient(1px 1px at 20% 30%,#fff8,transparent),radial-gradient(1px 1px at 70% 20%,#fff6,transparent),radial-gradient(1px 1px at 40% 80%,#fff5,transparent),radial-gradient(1px 1px at 85% 60%,#fff7,transparent),radial-gradient(1.5px 1.5px at 10% 70%,#fff6,transparent),radial-gradient(ellipse at top,#2a1a5e 0,transparent 60%);background-size:400px 400px,500px 500px,350px 350px,450px 450px,600px 600px,100% 100%;background-attachment:fixed}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:#fff;color:#000;padding:.5rem}
.nav{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;padding:1.2rem 5vw;border-bottom:1px solid var(--line)}
.brand{font-weight:700;letter-spacing:.04em;color:var(--ink);text-decoration:none}
nav a{color:var(--mut);margin-left:1.2rem;text-decoration:none}nav a:hover,nav a:focus{color:var(--ink)}
main{max-width:1040px;margin:auto;padding:0 5vw}section{padding:4.5rem 0;border-bottom:1px solid var(--line)}
.hero{padding:7rem 0 5rem}.eyebrow{color:var(--mut);text-transform:uppercase;letter-spacing:.15em;font-size:.8rem}
h1{font-size:clamp(2.3rem,6vw,4.2rem);line-height:1.1;margin:.4rem 0 1rem}h2{font-size:1.8rem}
.grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.lede{font-size:1.2rem;color:var(--mut);max-width:42rem}.muted{color:var(--mut)}
.btn{display:inline-block;padding:.75rem 1.3rem;border-radius:999px;background:var(--ink);color:var(--bg);font-weight:600;text-decoration:none;border:0;cursor:pointer;font-size:1rem;margin:.3rem .4rem 0 0}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.cards,.grid{display:grid;gap:1.2rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:1.4rem;position:relative}
.card:before{content:"";position:absolute;inset:0 0 auto;height:2px;background:var(--grad);border-radius:14px 14px 0 0;opacity:.7}
.card h3{margin:.3rem 0}.card p{color:var(--mut);margin:.4rem 0}.card a{color:#7ee8fa}
.tag{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;border:1px solid var(--line);border-radius:999px;padding:.15rem .6rem;color:var(--mut)}
.form{display:grid;gap:.4rem;max-width:520px}.form input,.form textarea{background:var(--card);border:1px solid var(--line);color:var(--ink);border-radius:10px;padding:.7rem;font:inherit}
:focus-visible{outline:2px solid #7ee8fa;outline-offset:2px}.hp{position:absolute;left:-9999px}
footer{display:flex;justify-content:space-between;padding:2rem 5vw;color:var(--mut);font-size:.85rem}.tag-build{opacity:.5;font-family:monospace}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}