*{box-sizing:border-box;margin:0;padding:0}
  :root{
    --gold:#c8a84b;
    --gold2:#e5c96a;
    --dark:#0a0e1a;
    --dark2:#111827;
    --dark3:#1a2235;
    --dark4:#212d42;
    --text:#e2e8f0;
    --text2:#94a3b8;
    --red:#e53e3e;
    --green:#38a169;
  }
  html{scroll-behavior:smooth}
  body{font-family:'Segoe UI',Arial,sans-serif;background:var(--dark);color:var(--text);line-height:1.6;font-size:15px}
  a{color:inherit;text-decoration:none}
  img{display:block;max-width:100%}

  /* ===== HEADER / NAV ===== */
  header{background:var(--dark2);border-bottom:2px solid var(--gold);position:sticky;top:0;z-index:1000;box-shadow:0 2px 20px rgba(0,0,0,.6)}
  .header-inner{max-width:1280px;margin:0 auto;padding:0 16px;display:flex;align-items:center;justify-content:space-between;height:64px}
  .logo{font-size:28px;font-weight:900;color:var(--gold);letter-spacing:2px;text-transform:uppercase;background:linear-gradient(135deg,#c8a84b,#e5c96a,#c8a84b);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
  nav{display:flex;align-items:center;gap:4px}
  nav a{padding:8px 14px;border-radius:6px;font-size:14px;font-weight:600;color:var(--text2);transition:all .25s}
  nav a:hover{color:var(--gold);background:rgba(200,168,75,.12)}
  nav a.active{color:var(--gold);background:rgba(200,168,75,.18);border-bottom:2px solid var(--gold)}
  .nav-btns{display:flex;gap:8px;margin-left:12px}
  .btn-login{padding:8px 18px;border:1.5px solid var(--gold);border-radius:6px;color:var(--gold);font-weight:700;font-size:13px;transition:all .25s}
  .btn-login:hover{background:var(--gold);color:#111}
  .btn-register{padding:8px 18px;background:linear-gradient(135deg,var(--gold),var(--gold2));border-radius:6px;color:#111;font-weight:700;font-size:13px;transition:all .25s}
  .btn-register:hover{opacity:.88}
  .hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:6px}
  .hamburger span{width:24px;height:2px;background:var(--gold);border-radius:2px;transition:.3s}
  .mobile-nav{display:none;background:var(--dark2);border-top:1px solid rgba(200,168,75,.3);padding:12px 16px}
  .mobile-nav.open{display:block}
  .mobile-nav a{display:block;padding:10px 12px;border-radius:6px;color:var(--text2);font-weight:600;margin-bottom:4px}
  .mobile-nav a.active,.mobile-nav a:hover{color:var(--gold);background:rgba(200,168,75,.12)}
  .mobile-nav-btns{display:flex;gap:8px;margin-top:10px}
  .mobile-nav-btns a{flex:1;text-align:center;padding:10px;border-radius:6px;font-weight:700;font-size:13px}

  /* ===== HERO ===== */
  .hero{position:relative;overflow:hidden;background:var(--dark2)}
  .hero-img{width:100%;height:520px;object-fit:cover;object-position:center top}
  .hero-overlay{position:absolute;inset:0;background:linear-gradient(to right,rgba(10,14,26,.85) 40%,rgba(10,14,26,.3))}
  .hero-content{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:40px 5%}
  .hero-badge{display:inline-block;background:var(--gold);color:#111;font-size:11px;font-weight:800;padding:4px 12px;border-radius:4px;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:14px}
  .hero h1{font-size:clamp(32px,5vw,62px);font-weight:900;line-height:1.1;color:#fff;max-width:600px;text-shadow:0 2px 20px rgba(0,0,0,.8)}
  .hero h1 span{color:var(--gold)}
  .hero-desc{margin-top:16px;max-width:480px;color:var(--text2);font-size:16px;line-height:1.7}
  .hero-actions{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}
  .btn-primary{padding:14px 32px;background:linear-gradient(135deg,var(--gold),var(--gold2));color:#111;font-weight:800;font-size:15px;border-radius:8px;transition:.25s;border:none;cursor:pointer}
  .btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(200,168,75,.4)}
  .btn-secondary{padding:14px 32px;border:2px solid var(--gold);color:var(--gold);font-weight:800;font-size:15px;border-radius:8px;transition:.25s}
  .btn-secondary:hover{background:rgba(200,168,75,.15)}
  .hero-stats{display:flex;gap:32px;margin-top:36px;flex-wrap:wrap}
  .hero-stat{text-align:center}
  .hero-stat strong{display:block;font-size:24px;font-weight:900;color:var(--gold)}
  .hero-stat span{font-size:12px;color:var(--text2);text-transform:uppercase;letter-spacing:1px}

  /* ===== SECTION COMMONS ===== */
  section{padding:60px 0}
  .container{max-width:1280px;margin:0 auto;padding:0 20px}
  .section-label{display:inline-block;color:var(--gold);font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-bottom:8px}
  .section-title{font-size:clamp(24px,3vw,38px);font-weight:900;line-height:1.2;color:#fff}
  .section-title span{color:var(--gold)}
  .section-sub{color:var(--text2);margin-top:10px;max-width:600px;font-size:15px}
  .divider{width:60px;height:3px;background:linear-gradient(90deg,var(--gold),transparent);margin:14px 0 32px}

  /* ===== TICKER ===== */
  .ticker{background:var(--gold);padding:10px 0;overflow:hidden}
  .ticker-inner{display:flex;gap:40px;animation:ticker 25s linear infinite;white-space:nowrap}
  .ticker-inner span{color:#111;font-weight:700;font-size:13px;flex-shrink:0}
  .ticker-inner span::before{content:"★ ";color:#111}
  @keyframes ticker{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

  /* ===== CHOOSE COUNTRY ===== */
  .country-section{background:var(--dark3)}
  .country-grid{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;margin-top:28px}
  .country-card{background:var(--dark4);border:1.5px solid rgba(200,168,75,.25);border-radius:10px;padding:16px 24px;text-align:center;min-width:100px;transition:.25s;cursor:pointer}
  .country-card:hover{border-color:var(--gold);background:rgba(200,168,75,.1);transform:translateY(-3px)}
  .country-flag{font-size:32px;margin-bottom:6px}
  .country-name{font-size:13px;color:var(--text2);font-weight:600}

  /* ===== GAMES GRID ===== */
  .games-section{background:var(--dark2)}
  .games-tabs{display:flex;gap:8px;margin-bottom:28px;flex-wrap:wrap}
  .tab-btn{padding:8px 20px;border-radius:20px;border:1.5px solid rgba(200,168,75,.3);background:transparent;color:var(--text2);font-size:13px;font-weight:600;cursor:pointer;transition:.25s}
  .tab-btn.active,.tab-btn:hover{background:var(--gold);color:#111;border-color:var(--gold)}
  .games-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px}
  .game-card{background:var(--dark4);border-radius:10px;overflow:hidden;border:1.5px solid rgba(200,168,75,.15);transition:.25s;cursor:pointer;position:relative}
  .game-card:hover{border-color:var(--gold);transform:translateY(-4px);box-shadow:0 10px 30px rgba(0,0,0,.5)}
  .game-card img{width:100%;aspect-ratio:1;object-fit:cover}
  .game-card-info{padding:10px 12px}
  .game-card-title{font-size:13px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .game-card-cat{font-size:11px;color:var(--gold);margin-top:2px}
  .game-card-badge{position:absolute;top:8px;left:8px;background:var(--red);color:#fff;font-size:10px;font-weight:700;padding:2px 7px;border-radius:4px;letter-spacing:.5px}
  .game-wide{grid-column:span 2}
  .game-wide img{aspect-ratio:3/2}

  /* ===== WHY SV66 ===== */
  .why-section{background:var(--dark3)}
  .why-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;margin-top:8px}
  .why-card{background:var(--dark4);border:1.5px solid rgba(200,168,75,.18);border-radius:12px;padding:28px 24px;transition:.25s}
  .why-card:hover{border-color:var(--gold);box-shadow:0 6px 24px rgba(200,168,75,.15)}
  .why-icon{width:52px;height:52px;background:linear-gradient(135deg,rgba(200,168,75,.2),rgba(200,168,75,.05));border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:26px;margin-bottom:16px;border:1.5px solid rgba(200,168,75,.3)}
  .why-card h3{font-size:17px;font-weight:800;color:#fff;margin-bottom:8px}
  .why-card p{font-size:14px;color:var(--text2);line-height:1.65}

  /* ===== BANNER WIDE ===== */
  .banner-wide{position:relative;overflow:hidden}
  .banner-wide img{width:100%;max-height:420px;object-fit:cover;object-position:center}
  .banner-wide-overlay{position:absolute;inset:0;background:linear-gradient(to left,rgba(10,14,26,.9) 45%,rgba(10,14,26,.2))}
  .banner-wide-content{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-end;padding:40px 6%}
  .banner-wide-content h2{font-size:clamp(22px,3vw,40px);font-weight:900;color:#fff;text-align:right;max-width:480px}
  .banner-wide-content h2 span{color:var(--gold)}
  .banner-wide-content p{color:var(--text2);margin-top:12px;max-width:420px;text-align:right;font-size:15px}
  .banner-wide-content .btn-primary{margin-top:20px}

  /* ===== STATS ===== */
  .stats-section{background:var(--dark2)}
  .stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:2px;background:rgba(200,168,75,.15);border-radius:12px;overflow:hidden;margin-top:8px}
  .stat-item{background:var(--dark3);padding:36px 24px;text-align:center}
  .stat-icon{font-size:36px;margin-bottom:10px}
  .stat-num{font-size:clamp(28px,4vw,44px);font-weight:900;color:var(--gold);line-height:1}
  .stat-label{font-size:13px;color:var(--text2);margin-top:6px;text-transform:uppercase;letter-spacing:.8px}

  /* ===== NEWS ===== */
  .news-section{background:var(--dark3)}
  .news-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;margin-top:8px}
  article.news-card{background:var(--dark4);border-radius:12px;overflow:hidden;border:1.5px solid rgba(200,168,75,.15);transition:.25s}
  article.news-card:hover{border-color:var(--gold);transform:translateY(-4px)}
  .news-img img{width:100%;height:200px;object-fit:cover}
  .news-body{padding:20px}
  .news-meta{display:flex;gap:10px;align-items:center;margin-bottom:10px}
  .news-meta time{font-size:12px;color:var(--text2)}
  .news-meta .cat{font-size:11px;background:rgba(200,168,75,.2);color:var(--gold);padding:2px 8px;border-radius:4px;font-weight:700}
  .news-body h3{font-size:16px;font-weight:800;color:#fff;line-height:1.4;margin-bottom:8px}
  .news-body p{font-size:13px;color:var(--text2);line-height:1.6}
  .news-body .read-more{display:inline-block;margin-top:12px;color:var(--gold);font-size:13px;font-weight:700}
  .news-body .read-more:hover{text-decoration:underline}

  /* ===== TESTIMONIAL ===== */
  .testimonial-section{background:var(--dark2);position:relative;overflow:hidden}
  .testimonial-section::before{content:'';position:absolute;inset:0;background:url("picture/xuupts7.jpg") center/cover;opacity:.06}
  .testimonial-inner{position:relative;z-index:1}
  .testimonial-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-top:8px}
  .testimonial-card{background:rgba(26,34,53,.9);border:1.5px solid rgba(200,168,75,.2);border-radius:12px;padding:24px}
  .stars{color:var(--gold);font-size:16px;margin-bottom:10px}
  .testimonial-card blockquote{font-size:14px;color:var(--text);line-height:1.7;font-style:italic;margin-bottom:14px}
  .testimonial-card cite{font-size:13px;color:var(--gold);font-style:normal;font-weight:700}

  /* ===== FAQ ===== */
  .faq-section{background:var(--dark3)}
  .faq-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(480px,1fr));gap:16px;margin-top:8px}
  @media(max-width:600px){.faq-grid{grid-template-columns:1fr}}
  .faq-item{background:var(--dark4);border:1.5px solid rgba(200,168,75,.18);border-radius:10px;padding:22px 24px;transition:.25s}
  .faq-item:hover{border-color:var(--gold)}
  .faq-item h4{font-size:15px;font-weight:800;color:var(--gold);margin-bottom:10px;display:flex;align-items:flex-start;gap:8px}
  .faq-item h4::before{content:"Q";background:var(--gold);color:#111;font-size:11px;font-weight:900;padding:2px 6px;border-radius:4px;flex-shrink:0;margin-top:2px}
  .faq-item p{font-size:14px;color:var(--text2);line-height:1.7}
  .faq-item ul{margin-top:8px;padding-left:18px;color:var(--text2);font-size:14px;line-height:1.8}

  /* ===== ARTICLE BRAND ===== */
  .brand-article{background:var(--dark2)}
  .brand-article-inner{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
  @media(max-width:768px){.brand-article-inner{grid-template-columns:1fr}}
  .brand-article-text h2{font-size:clamp(22px,3vw,34px);font-weight:900;color:#fff;margin-bottom:14px}
  .brand-article-text h2 span{color:var(--gold)}
  .brand-article-text p{color:var(--text2);font-size:15px;line-height:1.75;margin-bottom:14px}
  .brand-article-text p strong{color:#fff}
  .brand-article-img img{border-radius:14px;border:2px solid rgba(200,168,75,.3);width:100%;height:auto}

  /* ===== FOOTER ===== */
  footer{background:#070b14;border-top:2px solid rgba(200,168,75,.3)}
  .footer-top{max-width:1280px;margin:0 auto;padding:48px 20px 32px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px}
  @media(max-width:900px){.footer-top{grid-template-columns:1fr 1fr}}
  @media(max-width:540px){.footer-top{grid-template-columns:1fr}}
  .footer-brand .logo{font-size:32px;margin-bottom:14px;display:inline-block}
  .footer-brand p{color:var(--text2);font-size:14px;line-height:1.7;max-width:300px}
  .footer-col h4{font-size:14px;font-weight:800;color:var(--gold);text-transform:uppercase;letter-spacing:1px;margin-bottom:16px}
  .footer-col a{display:block;color:var(--text2);font-size:14px;margin-bottom:9px;transition:.2s}
  .footer-col a:hover{color:var(--gold)}
  .footer-bottom{border-top:1px solid rgba(200,168,75,.15);max-width:1280px;margin:0 auto;padding:20px;display:flex;justify-content:space-between;align-items:center;flex-wrap:gap;font-size:13px;color:var(--text2)}
  .footer-bottom-links{display:flex;gap:16px;flex-wrap:wrap}
  .footer-bottom-links a:hover{color:var(--gold)}
  .responsible-text{margin-top:16px;font-size:12px;color:#4a5568;line-height:1.6;max-width:1280px;margin-left:auto;margin-right:auto;padding:0 20px 20px}

  /* ===== RESPONSIVE ===== */
  @media(max-width:768px){
    nav,nav+.nav-btns{display:none}
    .hamburger{display:flex}
    .hero-img{height:340px}
    .hero h1{font-size:28px}
    .hero-stats{gap:16px}
    .game-wide{grid-column:span 1}
    .banner-wide-content{align-items:flex-start;padding:24px 5%}
    .banner-wide-content h2,.banner-wide-content p{text-align:left}
    .footer-bottom{flex-direction:column;gap:12px;text-align:center}
  }
  @media(max-width:480px){
    .games-grid{grid-template-columns:repeat(2,1fr)}
    .hero-actions{flex-direction:column}
    .btn-primary,.btn-secondary{text-align:center}
  }