:root{
  --night:#05070f;
  --night2:#0a0f24;
  --glass:rgba(148,130,255,.07);
  --glass-edge:rgba(167,139,250,.28);
  --violet:#7c3aed;
  --violet-hot:#a855f7;
  --violet-pale:#c4b5fd;
  --ink:#eceaff;
  --dim:#a3a4c4;
  --r:20px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{
  background:radial-gradient(1100px 540px at 50% -120px,#1d1442 0%,transparent 60%),
             radial-gradient(900px 600px at 110% 35%,#160f33 0%,transparent 55%),
             linear-gradient(180deg,var(--night2) 0%,var(--night) 45%);
  background-color:var(--night);
  color:var(--ink);
  font-family:"Trebuchet MS","Segoe UI",system-ui,sans-serif;
  line-height:1.7;
  font-size:16.5px;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--violet-pale);text-decoration:none}
.shell{max-width:1060px;margin:0 auto;padding:0 22px}
.glass{
  background:var(--glass);
  border:1px solid var(--glass-edge);
  border-radius:var(--r);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  box-shadow:0 18px 50px rgba(3,2,16,.5);
}
header{
  position:sticky;top:0;z-index:50;
  background:rgba(6,8,18,.72);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(167,139,250,.18);
}
.bar{display:flex;align-items:center;justify-content:space-between;height:68px}
.wordmark{
  font-size:1.45rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;
  background:linear-gradient(95deg,#fff 10%,var(--violet-hot) 60%,#6d28d9 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.wordmark em{font-style:normal;font-size:.62em;letter-spacing:.34em;display:block;color:var(--dim);-webkit-text-fill-color:var(--dim)}
nav ul{display:flex;gap:26px;list-style:none}
nav a{color:var(--dim);font-size:.92rem;font-weight:600;transition:color .2s}
nav a:hover{color:var(--violet-pale)}
.btn{
  display:inline-block;padding:14px 32px;border-radius:999px;font-weight:800;
  background:linear-gradient(120deg,var(--violet) 0%,var(--violet-hot) 100%);
  color:#fff;letter-spacing:.03em;
  box-shadow:0 10px 32px rgba(124,58,237,.45),inset 0 1px 0 rgba(255,255,255,.25);
  transition:transform .18s,box-shadow .18s;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 40px rgba(168,85,247,.55)}
.btn-mini{padding:10px 22px;font-size:.9rem}
.btn-ghost{
  display:inline-block;padding:13px 30px;border-radius:999px;font-weight:700;
  border:1px solid var(--glass-edge);color:var(--violet-pale);
  background:rgba(124,58,237,.08);
}
#menu-toggle{display:none}
.burger{display:none;cursor:pointer;width:34px;height:26px;position:relative}
.burger span{
  position:absolute;left:0;width:100%;height:3px;border-radius:3px;
  background:var(--violet-pale);transition:all .25s;
}
.burger span:nth-child(1){top:0}
.burger span:nth-child(2){top:11px}
.burger span:nth-child(3){top:22px}
.hero{padding:84px 0 64px;text-align:center}
.hero .kicker{
  display:inline-block;margin-bottom:18px;padding:7px 18px;border-radius:999px;
  font-size:.8rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--violet-pale);border:1px solid var(--glass-edge);background:rgba(124,58,237,.12);
}
h1{
  font-size:clamp(1.9rem,4.4vw,3.1rem);line-height:1.18;margin:0 auto 22px;max-width:840px;
  background:linear-gradient(180deg,#fff 30%,#cabdfd 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero .lead{max-width:720px;margin:0 auto 30px;color:var(--dim);font-size:1.08rem}
.cta-row{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-bottom:38px}
.hero-pic{margin:0 auto;max-width:920px;border-radius:var(--r);overflow:hidden;border:1px solid var(--glass-edge)}
.hero-pic img{width:100%}
.badges{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:30px}
.badges span{padding:10px 18px;font-size:.88rem;font-weight:600;color:var(--ink)}
section{padding:46px 0}
h2{
  font-size:clamp(1.35rem,2.6vw,1.85rem);line-height:1.3;margin-bottom:20px;
  color:#fff;
}
h2::after{content:"";display:block;width:64px;height:3px;margin-top:12px;border-radius:3px;
  background:linear-gradient(90deg,var(--violet-hot),transparent)}
section p{color:var(--dim);margin-bottom:16px}
section p strong{color:var(--ink)}
.facts{overflow:hidden}
.facts table{width:100%;border-collapse:collapse}
.facts th,.facts td{padding:15px 20px;text-align:left;font-size:.96rem}
.facts th{color:var(--violet-pale);font-weight:700;width:38%}
.facts tr{border-bottom:1px solid rgba(167,139,250,.13)}
.facts tr:last-child{border-bottom:none}
.facts td{color:var(--ink)}
.perks{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0}
.perks li{padding:16px 20px 16px 46px;position:relative;color:var(--ink);font-size:.95rem}
.perks li::before{
  content:"";position:absolute;left:18px;top:21px;width:12px;height:12px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,var(--violet-pale),var(--violet));
  box-shadow:0 0 12px rgba(168,85,247,.8);
}
.ladder{list-style:none;counter-reset:tier;display:grid;gap:12px;margin:26px 0}
.ladder li{
  counter-increment:tier;display:flex;align-items:center;gap:18px;padding:16px 22px;
}
.ladder li::before{
  content:counter(tier);flex:0 0 44px;height:44px;display:grid;place-items:center;
  border-radius:50%;font-weight:800;font-size:1.05rem;color:#fff;
  background:linear-gradient(135deg,var(--violet),var(--violet-hot));
  box-shadow:0 6px 18px rgba(124,58,237,.5);
}
.ladder b{color:#fff;display:block;font-size:1rem}
.ladder small{color:var(--dim);font-size:.88rem}
.games-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:26px}
.games-grid figure{overflow:hidden;text-align:center;padding:12px}
.games-grid img{width:100%;border-radius:12px}
.games-grid figcaption{padding:10px 4px 2px;font-size:.88rem;font-weight:700;color:var(--violet-pale)}
.bonus-flex{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center}
.bonus-flex .pic{overflow:hidden;padding:10px}
.bonus-flex .pic img{border-radius:14px;width:100%}
.steps{list-style:none;counter-reset:step;display:grid;gap:14px;margin-top:24px}
.steps li{position:relative;padding:18px 22px 18px 64px;color:var(--dim);font-size:.97rem}
.steps li::before{
  content:counter(step);counter-increment:step;position:absolute;left:18px;top:16px;
  width:32px;height:32px;display:grid;place-items:center;border-radius:10px;font-weight:800;
  color:#fff;background:linear-gradient(135deg,#6d28d9,var(--violet-hot));
}
.faq .qa{padding:22px 26px;margin-bottom:14px}
.faq h3{color:#fff;font-size:1.02rem;margin-bottom:10px}
.faq p{margin:0;font-size:.95rem}
.mid-cta{text-align:center;padding:30px 0 10px}
footer{
  margin-top:50px;padding:42px 0 110px;
  border-top:1px solid rgba(167,139,250,.16);
  background:rgba(5,6,14,.6);
}
footer .cols{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;margin-bottom:26px}
footer ul{list-style:none;display:flex;gap:20px;flex-wrap:wrap}
footer a{color:var(--dim);font-size:.9rem}
footer a:hover{color:var(--violet-pale)}
footer .legal{color:#6b6c8d;font-size:.84rem;max-width:880px}
.sticky-cta{display:none}
@media(max-width:900px){
  .perks{grid-template-columns:1fr}
  .games-grid{grid-template-columns:repeat(2,1fr)}
  .bonus-flex{grid-template-columns:1fr}
}
@media(max-width:820px){
  .burger{display:block}
  nav{
    position:absolute;top:68px;left:0;right:0;
    background:rgba(7,9,22,.96);
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
    border-bottom:1px solid var(--glass-edge);
    max-height:0;overflow:hidden;transition:max-height .3s ease;
  }
  nav ul{flex-direction:column;gap:0;padding:10px 22px 18px}
  nav li{border-bottom:1px solid rgba(167,139,250,.1)}
  nav a{display:block;padding:14px 4px;font-size:1rem}
  #menu-toggle:checked ~ nav{max-height:420px}
  #menu-toggle:checked ~ .burger span:nth-child(1){top:11px;transform:rotate(45deg)}
  #menu-toggle:checked ~ .burger span:nth-child(2){opacity:0}
  #menu-toggle:checked ~ .burger span:nth-child(3){top:11px;transform:rotate(-45deg)}
  .bar .btn-mini{display:none}
  .hero{padding:56px 0 44px}
  .sticky-cta{
    display:block;position:fixed;left:0;right:0;bottom:0;z-index:60;
    padding:12px 18px calc(12px + env(safe-area-inset-bottom));
    background:rgba(8,9,22,.9);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border-top:1px solid var(--glass-edge);
    text-align:center;
  }
  .sticky-cta .btn{display:block;width:100%;padding:15px 10px}
}
@media(max-width:520px){
  body{font-size:15.5px}
  .games-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .facts th,.facts td{padding:12px 14px;font-size:.88rem}
  .ladder li{padding:14px 16px;gap:14px}
}
