:root{
  --bg:#0b0e14;
  --fg:#e9eef7;
  --muted:#9aa6b2;
  --card:#121828;
  --line:#1e2a3b;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: radial-gradient(1200px 600px at 20% 10%, #1a2440 0%, transparent 60%),
              radial-gradient(900px 600px at 80% 20%, #2b1a3d 0%, transparent 55%),
              var(--bg);
  color:var(--fg);
}
a{color:inherit; text-decoration:none}
.wrap{max-width:1050px; margin:0 auto; padding:28px 18px}
.nav{display:flex; align-items:center; justify-content:space-between; gap:12px}
.logo{font-weight:700; letter-spacing:.08em}
.links{display:flex; gap:14px; align-items:center; flex-wrap:wrap}
.pill{padding:8px 12px; border:1px solid var(--line); border-radius:999px; background: rgba(255,255,255,.04)}
.hero{padding:52px 0 34px}
.hero h1{font-size:clamp(32px, 5vw, 54px); line-height:1.02; margin:0 0 14px}
.hero p{max-width:720px; color:var(--muted); font-size:16px; line-height:1.5; margin:0 0 22px}
.cta{display:flex; gap:12px; flex-wrap:wrap}
.btn{padding:12px 16px; border-radius:12px; background:#ffffff; color:#111; font-weight:650}
.btn.ghost{background:transparent; color:var(--fg); border:1px solid var(--line)}
.proof{display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; color:var(--muted); font-size:13px}
.proof span{padding:6px 10px; border:1px solid var(--line); border-radius:999px; background: rgba(255,255,255,.03)}
.section{padding:26px 0}
h2{margin:0 0 10px; font-size:22px}
.muted{color:var(--muted); margin:0 0 14px}
.grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:12px}
.card{
  background: rgba(18,24,40,.72);
  border:1px solid var(--line);
  border-radius:18px;
  padding:16px;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}
.card h3{margin:0 0 8px; font-size:16px}
.card p, .card li{color:var(--muted); font-size:14px; line-height:1.5}
.card ul{margin:0; padding-left:18px}
.thumb{
  height:140px; border-radius:14px; border:1px dashed rgba(255,255,255,.18);
  display:flex; align-items:center; justify-content:center;
  color:rgba(255,255,255,.45); margin-bottom:12px;
}
.footer{display:flex; justify-content:space-between; color:var(--muted); border-top:1px solid var(--line); padding-top:18px; margin-top:18px}
@media (max-width: 860px){
  .grid{grid-template-columns:1fr}
}