:root { --gold:#d4af37; --gold2:#f0cf6a; --bg:#0a0a0c; --panel:#141419;
        --panel2:#1c1c24; --txt:#e8e4da; --dim:#9a958a; --cyan:#19c9ff; --line:#26262e;
        --mx:50%; --my:22%; }
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:radial-gradient(1200px 600px at 50% -200px,#15151d,#0a0a0c 60%); color:var(--txt); font-family:'Segoe UI',Arial,sans-serif;
       line-height:1.6; position:relative; }
a { color:var(--gold); text-decoration:none; }
.wrap { max-width:1180px; margin:0 auto; padding:0 24px; }
header { padding:20px 0; border-bottom:1px solid var(--line);
         background:linear-gradient(180deg,rgba(17,17,22,.92),rgba(10,10,12,.85)); position:sticky; top:0; z-index:20;
         backdrop-filter:blur(6px); }
.brand-row { display:flex; align-items:center; justify-content:space-between; gap:18px; }
.brand { display:flex; align-items:center; gap:16px; }
.brand img { height:56px; }
.brand h1 { font-size:24px; letter-spacing:2px; font-weight:700; }
.brand h1 b { color:var(--gold); }
.brand p { color:var(--dim); font-size:13px; }
.head-right { display:flex; align-items:center; gap:16px; }
.lang-selector { display:flex; gap:4px; background:var(--panel2); border:1px solid var(--line);
        border-radius:8px; padding:3px; }
.lang-btn { background:none; border:none; color:var(--dim); font-weight:700; font-size:13px;
        letter-spacing:1px; padding:5px 11px; border-radius:6px; cursor:pointer; }
.lang-btn.active { background:var(--gold); color:#1a1408; }
.btn { display:inline-block; background:linear-gradient(180deg,#e8c964,#b8912a);
       color:#1a1408; font-weight:700; padding:10px 22px; border-radius:8px;
       letter-spacing:1px; font-size:14px; border:none; cursor:pointer;
       transition:filter .15s, transform .15s; }
.btn:hover { filter:brightness(1.1); transform:translateY(-1px); }
.btn.big { font-size:16px; padding:14px 30px; }
.btn.ghost { background:none; border:1px solid var(--line); color:var(--txt); }
.btn.ghost:hover { border-color:var(--gold); color:var(--gold); filter:none; }
.hero { padding:56px 0 20px; text-align:center; }
.hero h2 { font-size:46px; letter-spacing:1px; line-height:1.15; }
.hero h2 .hl { color:var(--gold); }
.hero p { color:var(--dim); max-width:780px; margin:16px auto 0; font-size:16px; }

.cover { padding:40px 0 20px; }
.cf-stage { position:relative; height:430px; perspective:1400px; }
.cf-track { position:absolute; inset:0; transform-style:preserve-3d; }
.cf-item { position:absolute; top:20px; left:50%; width:440px; height:248px; margin-left:-220px;
           transition:transform .5s cubic-bezier(.22,.61,.36,1), opacity .5s;
           -webkit-box-reflect:below 6px linear-gradient(transparent 55%, rgba(0,0,0,.35)); cursor:pointer; }
.cf-item img { width:100%; height:100%; object-fit:cover; border-radius:12px;
               border:1px solid var(--line); box-shadow:0 20px 50px rgba(0,0,0,.6); display:block; }
.cf-item figcaption { position:absolute; left:0; right:0; bottom:-6px; text-align:center;
           color:var(--gold2); letter-spacing:2px; font-size:14px; opacity:0;
           transition:opacity .4s; text-transform:uppercase; }
.cf-item.active figcaption { opacity:1; }
.cf-item.active img { border-color:var(--gold); }
.cf-nav { position:absolute; top:50%; transform:translateY(-50%); z-index:10; width:46px; height:46px;
          border-radius:50%; border:1px solid var(--line); background:rgba(20,20,25,.8);
          color:var(--gold); font-size:18px; cursor:pointer; }
.cf-nav:hover { border-color:var(--gold); }
.cf-prev { left:6px; } .cf-next { right:6px; }
.cf-dots { display:flex; gap:8px; justify-content:center; margin-top:26px; flex-wrap:wrap; }
.cf-dots button { width:9px; height:9px; border-radius:50%; border:none; padding:0;
          background:#3a3a44; cursor:pointer; transition:background .2s, transform .2s; }
.cf-dots button.on { background:var(--gold); transform:scale(1.3); }

.buy { padding:44px 0; }
.buy-card { background:linear-gradient(135deg,rgba(24,24,32,.92),rgba(16,16,20,.92)); border:1px solid var(--gold);
   border-radius:18px; padding:30px; display:flex; gap:34px; align-items:center; flex-wrap:wrap;
   box-shadow:0 30px 80px rgba(0,0,0,.5); }
.buy-img { width:440px; max-width:100%; border-radius:12px; border:1px solid var(--line); }
.buy-body { flex:1; min-width:300px; }
.buy-body h3 { font-size:34px; color:var(--gold); letter-spacing:1px; }
.buy-body h3 span { color:var(--cyan); }
.buy-sub { color:var(--dim); margin:6px 0 16px; font-size:16px; }
.buy-cta { display:flex; align-items:center; gap:22px; flex-wrap:wrap; margin-top:4px; }
.price { font-size:34px; font-weight:700; color:var(--gold2); letter-spacing:1px; }
.price .cur { font-size:20px; margin-left:2px; }
.buy-note { color:var(--dim); font-size:13px; margin-top:12px; }

ul.feat { list-style:none; margin:0 0 20px; }
ul.feat li { padding-left:24px; position:relative; margin-bottom:7px; color:var(--txt); font-size:15px; }
ul.feat li:before { content:"\2726"; color:var(--gold); position:absolute; left:0; }

.games-wrap { padding:20px 0 40px; }
h4.sect { color:var(--gold); letter-spacing:3px; margin:20px 0 14px; text-transform:uppercase;
          font-size:15px; text-align:center; }
.quicknav { text-align:center; margin-bottom:30px; line-height:2.2; }
.quicknav a { color:var(--dim); font-size:13px; margin:0 10px; letter-spacing:1px; }
.quicknav a:hover { color:var(--gold); }
.game { background:var(--panel); border:1px solid var(--line); border-radius:16px;
        padding:26px 28px; margin-bottom:26px; scroll-margin-top:100px; }
.g-head { display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; }
.g-head h3 { color:var(--gold2); letter-spacing:2px; font-size:26px; }
.g-tag { color:var(--cyan); font-size:16px; }
.g-desc { margin:10px 0 14px; font-size:16px; max-width:820px; }
.g-ctrl { background:var(--panel2); border-radius:10px; padding:11px 18px; color:var(--dim);
          font-size:14px; margin-bottom:22px; }
.g-ctrl b { color:var(--txt); }
.g-shots { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.g-shots img { width:100%; border-radius:10px; border:1px solid var(--line); display:block; }
.g-shots figcaption { color:var(--dim); font-size:13px; text-align:center; padding-top:6px; }

footer { border-top:1px solid var(--line); margin-top:40px; padding:26px 0 46px; color:var(--dim);
         font-size:13px; text-align:center; }
footer b { color:var(--gold); }

@media (max-width:820px){
  .hero h2{font-size:34px;} .cf-item{width:320px;height:180px;margin-left:-160px;}
  .cf-stage{height:330px;} .g-shots{grid-template-columns:1fr;}
  .brand img{height:44px;} .brand h1{font-size:20px;} .brand p{display:none;}
}