:root{--bg:#0d0d14;--gradA:#667eea;--gradB:#764ba2;--gradC:#f093fb;--gradD:#f5576c;--accent:#4facfe;
--radius:1rem;--shadow:0 6px 18px rgba(0,0,0,.35);--t:.3s cubic-bezier(.4,0,.2,1)}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Inter,Arial,sans-serif;background:var(--bg);color:#fff;line-height:1.7;
     -webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:Poppins,Arial,sans-serif;font-weight:800}
a{text-decoration:none;color:inherit}
header{padding:4rem 1rem 5rem;text-align:center;background:radial-gradient(circle at 50% 15%,
rgba(102,126,234,.15),transparent 70%)}
header h1{font-size:clamp(2rem,5vw,3.5rem);background:linear-gradient(135deg,var(--gradA),var(--gradB));
-webkit-background-clip:text;-webkit-text-fill-color:transparent}
header p{max-width:700px;margin:1rem auto 2rem;color:#d1d1d1;font-size:clamp(1rem,2.5vw,1.25rem)}
.btn{display:inline-flex;gap:.5rem;align-items:center;padding:.9rem 2rem;border-radius:50px;
background:linear-gradient(135deg,var(--gradA),var(--gradB));font-weight:600;transition:var(--t);
box-shadow:var(--shadow)}.btn:hover{transform:translateY(-2px) scale(1.03)}
.container{max-width:1200px;margin:auto;padding:4rem 1rem}
.grid{display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);
padding:1.5rem;transition:var(--t);box-shadow:var(--shadow);position:relative;overflow:hidden}
.card:hover{transform:translateY(-6px)}
.card h3{font-size:1.4rem;margin:.5rem 0;background:linear-gradient(135deg,var(--gradC),var(--gradD));
-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.card p{color:#dcdcdc;font-size:.95rem;margin-bottom:1rem}
.logo{height:48px;border-radius:.7rem;background:rgba(255,255,255,.1);padding:.3rem;transition:var(--t)}
.card:hover .logo{transform:scale(1.08)}
.rating{display:flex;align-items:center;gap:.25rem;font-size:1rem;color:#ffda6b;margin-bottom:.8rem}
.badge{position:absolute;top:1rem;right:1rem;padding:.25rem .64rem;font-size:.65rem;font-weight:700;
border-radius:50px;background:var(--accent);color:#000;text-transform:uppercase}
@media(max-width:600px){header{padding:3rem 1rem 4rem}body{font-size:15px}}