:root{--accent:#ff004f;--bg:#0b0b0f;--panel:#111;--text:#f2f2f2}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Segoe UI',system-ui,sans-serif;background:radial-gradient(circle at top,#151520,var(--bg));color:var(--text)}
.header{text-align:center;padding:60px 20px;background:linear-gradient(180deg,#111,#0a0a0a)}
.logo{width:130px;filter:drop-shadow(0 0 15px rgba(255,0,79,.4))}
.tagline{color:#bbb;margin-top:6px}
nav{margin-top:25px}
nav a{margin:0 14px;color:var(--accent);text-decoration:none;font-weight:600}
.hero{min-height:60vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:40px 20px}
.hero p{max-width:600px;color:#ccc;margin-top:12px}
.btn{margin-top:30px;padding:14px 32px;background:var(--accent);color:white;text-decoration:none;border-radius:30px;font-weight:600}
footer{text-align:center;padding:25px;background:#0a0a0a;color:#777}
.reveal{opacity:0;transform:translateY(30px);transition:.8s ease}
.reveal.show{opacity:1;transform:none}
.games-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px;padding:60px 20px;max-width:1200px;margin:auto}
.game-card{background:linear-gradient(160deg,#141414,#0c0c0c);border-radius:16px;overflow:hidden;text-decoration:none;color:white;box-shadow:0 25px 60px rgba(0,0,0,.6);transition:.4s}
.game-card:hover{transform:translateY(-10px) scale(1.02);box-shadow:0 40px 90px rgba(255,0,79,.25)}
.game-card img{width:100%;height:200px;object-fit:cover}
.game-info{padding:20px}
.game-info h3{color:var(--accent)}
.play{display:inline-block;margin-top:14px;color:var(--accent);font-weight:600}
.contact-section{display:flex;justify-content:center;padding:40px}
.contact-form{display:flex;flex-direction:column;width:320px}
.contact-form input,.contact-form textarea{margin-bottom:15px;padding:12px;background:#111;border:1px solid #222;color:white;border-radius:6px}
@media(max-width:600px){nav a{display:inline-block;margin:10px}}