:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Inter,Helvetica,Arial}
body{margin:0;min-height:100vh;background:#070a14;color:rgba(255,255,255,.9)}
.wrap{max-width:980px;margin:0 auto;padding:34px 18px}
.top h1{margin:0;font-size:42px;letter-spacing:.2px}
.top p{margin:10px 0 0;color:rgba(210,220,255,.7)}
.grid{margin-top:22px;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.card{position:relative;display:block;padding:18px;border-radius:18px;text-decoration:none;color:inherit;
background:radial-gradient(800px 340px at 20% 0%, rgba(147,90,255,.22), transparent 65%),
radial-gradient(700px 340px at 80% 0%, rgba(80,255,190,.14), transparent 60%),
rgba(255,255,255,.04);
border:1px solid rgba(190,160,255,.14);box-shadow:0 18px 70px rgba(0,0,0,.45);
transition:transform .12s ease, filter .12s ease,border-color .12s ease}
.card:hover{transform:translateY(-2px);filter:brightness(1.05);border-color:rgba(80,255,190,.35)}
.badge{position:absolute;top:14px;right:14px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;
padding:5px 10px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(80,255,190,.22);
color:rgba(80,255,190,.92)}
.title{font-weight:850;font-size:20px;margin-top:4px}
.sub{margin-top:6px;color:rgba(190,210,255,.7);font-size:13px}
.cta{margin-top:14px;display:inline-block;padding:8px 12px;border-radius:12px;
background:linear-gradient(135deg, rgba(147,90,255,.35), rgba(80,255,190,.22));
border:1px solid rgba(190,160,255,.22)}
.foot{margin-top:26px;color:rgba(190,210,255,.55);font-size:12px}