:root{--bg:#0f172a;--bg-alt:#111827;--card:#0b1220;--text:#e5e7eb;--muted:#9ca3af;--primary:#22c55e;--primary-dark:#16a34a;--outline:#38bdf8;--border:#1f2937}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;background:var(--bg);color:var(--text);line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:var(--text);text-decoration:none}
.container{max-width:1120px;margin:0 auto;padding:0 16px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:10px;border:1px solid transparent;font-weight:600;transition:.2s ease;cursor:pointer}
.btn--primary{background:var(--primary);color:#04140a}
.btn--primary:hover{background:var(--primary-dark)}
.btn--outline{border-color:var(--outline)}
.btn--ghost{background:transparent;border:1px solid var(--border)}
.btn--lg{padding:14px 22px;font-size:18px}
.header{position:sticky;top:0;background:rgba(15,23,42,.9);backdrop-filter:saturate(200%) blur(8px);border-bottom:1px solid var(--border);z-index:50}
.header__inner{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.logo{font-weight:800;font-size:20px;letter-spacing:.6px}
.nav__toggle{display:none;background:transparent;border:1px solid var(--border);color:var(--text);padding:8px 12px;border-radius:8px}
.nav__menu{display:flex;gap:18px;list-style:none;margin:0;padding:0}
.nav__menu a{padding:8px;border-radius:8px}
.nav__menu a:hover{background:#0c1324}
.header__cta{display:flex;gap:10px}
.hero{padding:48px 0;background:linear-gradient(180deg,#0f172a,#0e1627 60%,#0b1220)}
.hero__inner{display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:center}
.hero__badges{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:16px 0 0;padding:0}
.hero__badges li{border:1px solid var(--border);padding:8px 12px;border-radius:999px;font-size:14px;color:var(--muted)}
.section{padding:48px 0}
.section--alt{background:var(--bg-alt)}
.section__header{margin-bottom:24px}
.section__header h2{margin:0 0 8px;font-size:28px}
.section__cta{margin-top:20px}
.grid{display:grid;gap:18px}
.grid--3{grid-template-columns:repeat(3,1fr)}
.grid--4{grid-template-columns:repeat(4,1fr)}
.card,.feature,.promo,.game{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:18px}
.card h3,.feature h3,.promo h3,.game h3{margin:8px 0 10px;font-size:20px}
.feature__icon{font-size:22px}
.game img{border-radius:10px;margin-bottom:10px}
.steps{counter-reset:step;list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.steps li{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:12px;text-align:center}
.faq{display:grid;gap:12px}
.faq__item{border:1px solid var(--border);border-radius:12px;background:var(--card)}
.faq__question{width:100%;text-align:left;background:transparent;color:var(--text);padding:14px 16px;border:none;border-bottom:1px solid var(--border);border-radius:12px 12px 0 0;font-weight:600;cursor:pointer}
.faq__answer{padding:14px 16px;display:none;color:var(--muted)}
.faq__item.active .faq__answer{display:block}
.cta-final{padding:48px 0;background:linear-gradient(180deg,#0b1220,#0f172a)}
.cta-final__inner{text-align:center}
.footer{border-top:1px solid var(--border);background:#0b1220}
.footer__grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:18px;padding:28px 0}
.footer__links{list-style:none;padding:0;margin:0}
.footer__links li{margin-bottom:8px}
.payments{list-style:none;padding:0;margin:0;display:flex;gap:12px;flex-wrap:wrap}
.footer__bottom{border-top:1px solid var(--border);text-align:center;padding:16px 0;color:var(--muted)}
@media (max-width:992px){
  .hero__inner{grid-template-columns:1fr}
  .steps{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:640px){
  .nav__toggle{display:inline-block}
  .nav__menu{display:none;position:absolute;right:16px;top:56px;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:12px;flex-direction:column;gap:8px}
  .nav__menu.show{display:flex}
  .header__cta{display:none}
  .steps{grid-template-columns:1fr}
  .grid--3{grid-template-columns:1fr}
  .grid--4{grid-template-columns:1fr 1fr}
}