/* ================================================================
   VALSKUY TOPUP — Silver Editorial Theme
   Selaras dengan valskuy.com
   Palette:
     --void:    #080808
     --base:    #0e0e0e
     --surface: #141414
     --card:    #1a1a1a
     --border:  #242424
     --br2:     #2e2e2e
     --silver:  #c0bdb8
     --silver2: #9a9690
     --ivory:   #ede9e1
     --cream:   #d4cfc6
     --chalk:   #f5f2ed
     --muted:   #5a5855
     --gold:    #c8a878
     --green:   #4a9e6e
     --red:     #b84040
   Fonts: Bebas Neue (display) + DM Sans (body)
================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html,body{max-width:100%;overflow-x:hidden}
body{
  font-family:'DM Sans',sans-serif;
  background:#080808;
  color:#d4cfc6;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  font-size:15px;
}
ul{list-style:none}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
button{cursor:pointer;font-family:'DM Sans',sans-serif}

:root{
  --void:#080808;
  --base:#0e0e0e;
  --surface:#141414;
  --card:#1a1a1a;
  --border:#242424;
  --br2:#2e2e2e;
  --silver:#c0bdb8;
  --silver2:#9a9690;
  --ivory:#ede9e1;
  --cream:#d4cfc6;
  --chalk:#f5f2ed;
  --muted:#5a5855;
  --gold:#c8a878;
  --green:#4a9e6e;
  --red:#b84040;
  --nav-h:56px;
}

/* ================================================================
   NAV
================================================================ */
#nav{
  position:fixed;top:0;left:0;right:0;z-index:9000;
  height:var(--nav-h);
  background:rgba(8,8,8,.5);
  border-bottom:1px solid transparent;
  transition:background .3s,border-color .3s;
}
#nav.nav-scrolled{
  background:rgba(8,8,8,.96);
  border-color:var(--border);
}
.nav-wrap{
  max-width:1200px;margin:0 auto;padding:0 24px;height:var(--nav-h);
  display:flex;align-items:center;justify-content:space-between;
}
.nav-brand{
  font-family:'Bebas Neue',sans-serif;
  font-size:20px;letter-spacing:5px;color:var(--ivory);
  display:flex;align-items:center;gap:10px;
}
.nav-brand-sub{font-size:11px;letter-spacing:3px;color:var(--muted);font-family:'DM Sans',sans-serif;font-weight:600}

.nav-center{display:flex;align-items:center}
.nav-center li a{
  font-size:11px;font-weight:600;letter-spacing:1.5px;
  color:var(--muted);padding:0 14px;height:var(--nav-h);
  display:flex;align-items:center;
  transition:color .2s;text-transform:uppercase;
}
.nav-center li a:hover{color:var(--cream)}

.nav-right{display:flex;align-items:center;gap:8px}
.nav-ghost{
  font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--muted);padding:7px 13px;border:1px solid var(--border);
  transition:all .2s;background:none;
}
.nav-ghost:hover{color:var(--cream);border-color:var(--br2)}
.nav-fill{
  font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;
  background:var(--ivory);color:var(--void);padding:7px 14px;border:none;
  transition:background .2s;
}
.nav-fill:hover{background:var(--chalk)}

.nav-ham{
  display:none;flex-direction:column;gap:5px;
  background:none;border:none;padding:4px;
}
.nav-ham span{
  display:block;width:20px;height:1px;background:var(--cream);
  transition:all .3s;transform-origin:center;
}
.nav-ham.open span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-ham.open span:nth-child(2){opacity:0}
.nav-ham.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.nav-mobile{
  display:none;flex-direction:column;
  background:var(--base);border-top:1px solid var(--border);
  max-height:0;overflow:hidden;transition:max-height .3s ease;
}
.nav-mobile.open{max-height:360px}
.nav-mobile a{
  font-size:12px;font-weight:600;letter-spacing:1px;
  color:var(--muted);padding:13px 24px;
  border-bottom:1px solid var(--border);
  text-transform:uppercase;transition:color .2s;display:block;
}
.nav-mobile a:hover{color:var(--cream)}

/* ================================================================
   PAGE
================================================================ */
.page{padding-top:var(--nav-h);min-height:100vh}

/* ================================================================
   TICKER
================================================================ */
.site-ticker{
  background:var(--surface);border-bottom:1px solid var(--border);
  overflow:hidden;padding:10px 0;
}
.ticker-inner{
  display:flex;white-space:nowrap;
  animation:ticker-move 32s linear infinite;
}
@keyframes ticker-move{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.ticker-item{
  font-size:10px;font-weight:600;letter-spacing:3px;text-transform:uppercase;
  color:var(--muted);padding:0 32px;flex-shrink:0;
}
.ticker-sep{color:var(--border);padding:0 8px}

/* ================================================================
   HERO (index)
================================================================ */
.hero{
  background:var(--base);
  border-bottom:1px solid var(--border);
  padding:72px 24px 64px;
}
.hero-inner{max-width:1200px;margin:0 auto}
.hero-label{
  font-size:10px;font-weight:600;letter-spacing:3px;text-transform:uppercase;
  color:var(--muted);margin-bottom:16px;display:block;
}
.hero-h1{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(52px,9vw,120px);
  line-height:.92;letter-spacing:2px;
  color:var(--ivory);margin-bottom:20px;
}
.hero-h1 em{font-style:normal;color:var(--silver)}
.hero-sub{
  font-size:14px;color:var(--muted);
  max-width:400px;line-height:1.8;font-weight:300;
  margin-bottom:40px;
}
.hero-stats{
  display:flex;align-items:flex-start;
  border-top:1px solid var(--border);
  padding-top:24px;gap:0;
}
.hs{display:flex;flex-direction:column;gap:3px;padding-right:32px}
.hs-n{
  font-family:'Bebas Neue',sans-serif;
  font-size:24px;letter-spacing:1px;color:var(--ivory);line-height:1;
}
.hs-l{font-size:9px;color:var(--muted);letter-spacing:2px;text-transform:uppercase}
.hs-sep{width:1px;height:30px;background:var(--border);margin:0 32px 0 0;flex-shrink:0;margin-top:2px}

/* ================================================================
   SECTION COMMONS
================================================================ */
.sec-wrap{max-width:1200px;margin:0 auto;padding:0 24px}
@media(min-width:640px){.sec-wrap{padding:0 48px}}

.sec-label{
  font-size:10px;font-weight:600;letter-spacing:3px;text-transform:uppercase;
  color:var(--muted);margin-bottom:10px;display:block;
}
.sec-h2{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(28px,4vw,52px);letter-spacing:2px;
  color:var(--ivory);line-height:1;margin-bottom:8px;
}
.sec-p{font-size:13px;color:var(--muted);font-weight:300;max-width:420px;line-height:1.7}

/* ================================================================
   GAME GRID (index)
================================================================ */
.games-section{
  background:var(--base);
  padding:64px 0 80px;
  border-bottom:1px solid var(--border);
}
.game-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
  gap:2px;
}
.game-card{
  position:relative;background:var(--card);overflow:hidden;
  cursor:pointer;display:flex;flex-direction:column;
  border:none;text-decoration:none;
  transition:background .2s;
}
.game-card:hover{background:#1e1e1e}
.game-card-img{
  width:100%;aspect-ratio:3/4;object-fit:cover;
  filter:brightness(.72) saturate(.8);
  transition:transform .5s ease,filter .3s;
}
.game-card:hover .game-card-img{transform:scale(1.04);filter:brightness(.88) saturate(.85)}
.game-card-placeholder{
  width:100%;aspect-ratio:3/4;background:var(--surface);
  display:flex;align-items:center;justify-content:center;
  font-family:'Bebas Neue',sans-serif;font-size:32px;letter-spacing:4px;
  color:var(--muted);
}
.game-card-info{
  padding:12px 14px;border-top:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;
}
.game-card-name{
  font-size:12px;font-weight:600;letter-spacing:.5px;color:var(--ivory);
}
.game-card-arrow{color:var(--muted);font-size:14px;transition:transform .2s}
.game-card:hover .game-card-arrow{transform:translateX(3px);color:var(--silver)}

/* ================================================================
   WHY SECTION (index)
================================================================ */
.why-section{
  background:var(--void);
  padding:64px 0 72px;
  border-bottom:1px solid var(--border);
}
.why-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:2px;
}
.why-item{
  padding:28px 24px;
  border-left:1px solid var(--border);
}
.why-item:first-child{border-left:none}
.why-num{
  font-family:'Bebas Neue',sans-serif;
  font-size:48px;letter-spacing:2px;color:var(--border);
  line-height:1;margin-bottom:12px;
}
.why-title{
  font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--ivory);margin-bottom:6px;
}
.why-desc{font-size:12px;color:var(--muted);line-height:1.7;font-weight:300}

/* ================================================================
   BREADCRUMB
================================================================ */
.breadcrumb{
  display:flex;align-items:center;gap:8px;
  font-size:11px;color:var(--muted);
  padding:20px 24px 0;max-width:1200px;margin:0 auto;
  letter-spacing:.5px;
}
.breadcrumb a:hover{color:var(--cream)}
.breadcrumb-sep{color:var(--border)}

/* ================================================================
   TOPUP LAYOUT
================================================================ */
.topup-wrap{
  max-width:1200px;margin:0 auto;
  padding:32px 24px 80px;
  display:grid;
  grid-template-columns:1fr 320px;
  gap:40px;
  align-items:start;
}
@media(max-width:900px){.topup-wrap{grid-template-columns:1fr}}

/* Game header */
.game-header{
  display:flex;align-items:center;gap:16px;
  margin-bottom:40px;
  padding-bottom:28px;
  border-bottom:1px solid var(--border);
}
.game-header-img{
  width:56px;height:72px;object-fit:cover;
  filter:brightness(.8) saturate(.8);
  flex-shrink:0;
}
.game-header-placeholder{
  width:56px;height:72px;background:var(--surface);
  display:flex;align-items:center;justify-content:center;
  font-family:'Bebas Neue',sans-serif;font-size:20px;letter-spacing:2px;
  color:var(--muted);flex-shrink:0;border:1px solid var(--border);
}
.game-header-label{
  font-size:9px;font-weight:600;letter-spacing:3px;text-transform:uppercase;
  color:var(--muted);margin-bottom:6px;display:block;
}
.game-header-name{
  font-family:'Bebas Neue',sans-serif;
  font-size:32px;letter-spacing:2px;color:var(--ivory);line-height:1;
}

/* Step label */
.step-label{
  font-size:10px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;
  color:var(--muted);margin-bottom:14px;display:block;
  border-left:2px solid var(--border);padding-left:10px;
}

/* Form sections */
.form-section{margin-bottom:32px}

/* Inputs */
.input-field{
  width:100%;
  background:var(--surface);
  border:1px solid var(--border);
  color:var(--ivory);
  font-size:14px;
  font-family:'DM Sans',sans-serif;
  padding:12px 14px;
  outline:none;
  transition:border-color .15s;
  display:block;
  border-radius:0;
}
.input-field:focus{border-color:var(--br2)}
.input-field::placeholder{color:var(--muted)}
.input-row{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.input-with-btn{position:relative}
.input-with-btn .input-field{padding-right:90px}
.input-inline-btn{
  position:absolute;right:0;top:0;bottom:0;
  background:var(--card);border:none;border-left:1px solid var(--border);
  color:var(--cream);
  font-size:10px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;
  padding:0 14px;
  transition:background .15s,color .15s;
  border-radius:0;
}
.input-inline-btn:hover{background:var(--br2);color:var(--ivory)}

/* Referral feedback */
.ref-msg{
  font-size:11px;font-weight:600;letter-spacing:.3px;
  margin-top:8px;padding:8px 12px;display:none;
}
.ref-msg.ok{
  background:rgba(74,158,110,.08);
  border:1px solid rgba(74,158,110,.2);
  color:var(--green);display:block;
}
.ref-msg.err{
  background:rgba(184,64,64,.08);
  border:1px solid rgba(184,64,64,.2);
  color:var(--red);display:block;
}

/* ================================================================
   NOMINAL GRID
================================================================ */
.nominal-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(120px,1fr));
  gap:2px;
  margin-bottom:32px;
}
.nominal-btn{
  position:relative;
  background:var(--card);
  border:1px solid transparent;
  padding:14px 10px;
  text-align:center;
  cursor:pointer;
  transition:background .15s,border-color .15s;
  border-radius:0;
}
.nominal-btn:hover{background:#1e1e1e}
.nominal-btn.selected{
  border-color:var(--silver2);
  background:rgba(192,189,184,.05);
}
.nominal-btn .nom-name{
  font-size:12px;font-weight:600;color:var(--ivory);
  line-height:1.3;margin-bottom:5px;
}
.nominal-btn .nom-price{
  font-family:'Bebas Neue',sans-serif;
  font-size:15px;letter-spacing:1px;color:var(--silver2);
}
.nominal-btn.selected .nom-price{color:var(--ivory)}
.nom-popular{
  position:absolute;top:0;right:0;
  font-size:8px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;
  background:var(--gold);color:var(--void);
  padding:2px 6px;
}

/* ================================================================
   PAYMENT METHODS
================================================================ */
.pm-grid{display:flex;flex-wrap:wrap;gap:2px}
.pm-btn{
  background:var(--card);
  border:1px solid transparent;
  color:var(--muted);
  font-size:11px;font-weight:600;letter-spacing:1px;text-transform:uppercase;
  padding:9px 14px;
  transition:all .15s;
  border-radius:0;
}
.pm-btn:hover{color:var(--cream);background:#1e1e1e}
.pm-btn.selected{border-color:var(--silver2);color:var(--ivory);background:rgba(192,189,184,.05)}

/* ================================================================
   ORDER SUMMARY
================================================================ */
.order-summary{
  background:var(--surface);
  border:1px solid var(--border);
  padding:24px;
  position:sticky;top:calc(var(--nav-h) + 20px);
}
.summary-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:18px;letter-spacing:3px;color:var(--ivory);
  margin-bottom:20px;
  padding-bottom:14px;
  border-bottom:1px solid var(--border);
}
.summary-row{
  display:flex;justify-content:space-between;align-items:baseline;
  font-size:12px;padding:9px 0;
  border-bottom:1px solid var(--border);
}
.summary-row:last-of-type{border-bottom:none}
.summary-label{color:var(--muted);letter-spacing:.3px}
.summary-val{color:var(--cream);font-weight:600}
.summary-total .summary-val{
  font-family:'Bebas Neue',sans-serif;
  font-size:22px;letter-spacing:1px;color:var(--ivory);
}
.summary-discount .summary-val{color:var(--green)}

/* ================================================================
   BUTTONS
================================================================ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:'DM Sans',sans-serif;
  font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;
  padding:13px 24px;border:none;
  transition:opacity .15s,background .15s;
  border-radius:0;
}
.btn:active{opacity:.85}
.btn-primary{
  background:var(--ivory);color:var(--void);
  width:100%;margin-top:20px;
}
.btn-primary:hover{background:var(--chalk)}
.btn-primary:disabled{opacity:.3;cursor:not-allowed}
.btn-outline{
  background:transparent;color:var(--cream);
  border:1px solid var(--border);
}
.btn-outline:hover{border-color:var(--br2);color:var(--ivory)}
.btn-wa{
  background:#25d366;color:#fff;width:100%;margin-top:8px;
}
.btn-wa:hover{opacity:.9}

/* ================================================================
   ALERTS
================================================================ */
.alert{
  padding:11px 14px;
  font-size:12px;font-weight:500;letter-spacing:.3px;
  margin-bottom:16px;
}
.alert-error{
  background:rgba(184,64,64,.08);
  border:1px solid rgba(184,64,64,.2);
  color:var(--red);
}
.alert-ok{
  background:rgba(74,158,110,.08);
  border:1px solid rgba(74,158,110,.2);
  color:var(--green);
}

/* ================================================================
   SPINNER
================================================================ */
.spinner{
  width:16px;height:16px;
  border:1.5px solid rgba(0,0,0,.2);
  border-top-color:var(--void);
  border-radius:50%;
  animation:spin .65s linear infinite;
  display:inline-block;flex-shrink:0;
}
@keyframes spin{to{transform:rotate(360deg)}}

/* ================================================================
   STATUS PAGE
================================================================ */
.status-wrap{
  max-width:480px;margin:72px auto;
  padding:0 24px 80px;
  text-align:center;
}
.status-mark{
  width:64px;height:64px;
  border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 28px;
}
.status-mark.pending{border-color:rgba(74,144,209,.3);background:rgba(74,144,209,.05)}
.status-mark.processing{border-color:rgba(200,168,120,.3);background:rgba(200,168,120,.05)}
.status-mark.success{border-color:rgba(74,158,110,.3);background:rgba(74,158,110,.05)}
.status-mark.failed{border-color:rgba(184,64,64,.3);background:rgba(184,64,64,.05)}
.status-mark.expired{border-color:var(--border)}

.status-eyebrow{
  font-size:10px;font-weight:600;letter-spacing:3px;text-transform:uppercase;
  color:var(--muted);margin-bottom:10px;display:block;
}
.status-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:36px;letter-spacing:3px;color:var(--ivory);
  margin-bottom:8px;
}
.status-desc{
  font-size:13px;color:var(--muted);
  margin-bottom:32px;font-weight:300;line-height:1.7;
}
.status-detail{
  background:var(--surface);border:1px solid var(--border);
  padding:20px;text-align:left;margin-bottom:28px;
}
.status-row{
  display:flex;justify-content:space-between;
  font-size:12px;padding:9px 0;
  border-bottom:1px solid var(--border);
}
.status-row:last-child{border-bottom:none}
.status-row .k{color:var(--muted)}
.status-row .v{color:var(--ivory);font-weight:500;text-align:right;max-width:60%}
.status-row.total .v{
  font-family:'Bebas Neue',sans-serif;
  font-size:18px;letter-spacing:1px;color:var(--ivory);
}
.poll-hint{
  margin-top:24px;
  display:flex;align-items:center;justify-content:center;gap:8px;
  font-size:11px;color:var(--muted);letter-spacing:1px;text-transform:uppercase;
}

/* ================================================================
   RECEIPT
================================================================ */
.receipt-wrap{
  max-width:480px;margin:60px auto;padding:0 24px 80px;
}
.receipt-header{
  text-align:center;padding:48px 0 32px;
  border-bottom:1px solid var(--border);margin-bottom:32px;
}
.receipt-ref{
  font-size:9px;font-weight:700;letter-spacing:3px;text-transform:uppercase;
  color:var(--muted);margin-bottom:10px;display:block;
}
.receipt-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:36px;letter-spacing:4px;color:var(--ivory);margin-bottom:4px;
}
.receipt-sub{font-size:13px;color:var(--muted);font-weight:300}
.receipt-table{width:100%;border-collapse:collapse}
.receipt-table td{
  padding:12px 0;border-bottom:1px solid var(--border);font-size:13px;
}
.receipt-table tr:last-child td{border-bottom:none}
.receipt-table .k{color:var(--muted)}
.receipt-table .v{text-align:right;color:var(--ivory);font-weight:500}
.receipt-table .v-total{
  font-family:'Bebas Neue',sans-serif;font-size:20px;letter-spacing:1px;color:var(--ivory);
}
.receipt-table .v-green{color:var(--green)}
.receipt-actions{margin-top:32px;display:flex;flex-direction:column;gap:2px}

/* ================================================================
   FAQ
================================================================ */
.faq-wrap{max-width:680px;margin:0 auto;padding:64px 24px 80px}
.faq-h1{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(40px,7vw,72px);letter-spacing:3px;
  color:var(--ivory);line-height:.95;margin-bottom:8px;
}
.faq-sub{font-size:13px;color:var(--muted);margin-bottom:48px;font-weight:300}
.faq-item{border-bottom:1px solid var(--border);padding:20px 0}
.faq-q{
  font-size:14px;font-weight:600;color:var(--ivory);
  cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;
  letter-spacing:.2px;
}
.faq-icon{
  color:var(--muted);font-size:20px;flex-shrink:0;
  transition:transform .2s;font-weight:300;line-height:1;
}
.faq-item.open .faq-icon{transform:rotate(45deg)}
.faq-a{
  font-size:13px;color:var(--muted);line-height:1.75;font-weight:300;
  max-height:0;overflow:hidden;
  transition:max-height .3s ease,margin-top .3s;
}
.faq-item.open .faq-a{max-height:300px;margin-top:12px}

/* ================================================================
   FLOAT WA
================================================================ */
.float-wa{
  position:fixed;bottom:24px;right:20px;z-index:9001;
  display:flex;align-items:center;gap:10px;
  background:var(--surface);border:1px solid var(--border);
  padding:10px 16px 10px 10px;
  text-decoration:none;
  transition:border-color .2s,background .2s;
}
.float-wa:hover{border-color:var(--br2);background:var(--card)}
.float-wa-icon{
  width:32px;height:32px;background:#25d366;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.float-wa-icon svg{width:18px;height:18px;fill:#fff}
.float-wa-label{
  font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--cream);
}
@media(max-width:480px){
  .float-wa-label{display:none}
  .float-wa{padding:0;border:none;background:transparent}
  .float-wa-icon{width:44px;height:44px}
}

/* ================================================================
   FOOTER
================================================================ */
.site-footer{
  background:var(--base);border-top:1px solid var(--border);padding:0;
}
.footer-wrap{max-width:1200px;margin:0 auto;padding:0 24px}
@media(min-width:640px){.footer-wrap{padding:0 48px}}
.footer-top{
  display:grid;grid-template-columns:1fr 1fr;gap:48px;
  padding:48px 0 40px;
}
@media(max-width:600px){.footer-top{grid-template-columns:1fr;gap:32px}}
.footer-brand-name{
  font-family:'Bebas Neue',sans-serif;font-size:20px;letter-spacing:5px;
  color:var(--ivory);margin-bottom:10px;
}
.footer-brand-desc{
  font-size:12px;color:var(--muted);line-height:1.8;
  max-width:240px;font-weight:300;margin-bottom:16px;
}
.footer-wa-link{
  display:inline-flex;align-items:center;gap:7px;
  font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--cream);border:1px solid var(--border);
  padding:8px 13px;transition:all .2s;
}
.footer-wa-link:hover{border-color:var(--br2);color:var(--ivory)}
.footer-links-col h4{
  font-size:10px;font-weight:700;letter-spacing:3px;text-transform:uppercase;
  color:var(--muted);margin-bottom:14px;
}
.footer-links-col a{
  display:block;font-size:12px;color:var(--muted);
  padding:4px 0;transition:color .2s;font-weight:300;
}
.footer-links-col a:hover{color:var(--cream)}
.footer-rule{height:1px;background:var(--border)}
.footer-bottom{
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:8px;padding:16px 0;
}
.footer-bottom p{font-size:10px;color:var(--muted);letter-spacing:.5px}

/* ================================================================
   RESPONSIVE
================================================================ */
@media(max-width:767px){
  .nav-center,.nav-right{display:none}
  .nav-ham{display:flex}
  .nav-mobile{display:flex}
  .hero-stats{flex-wrap:wrap;gap:16px}
  .hs-sep{display:none}
  .hs{padding-right:0;width:calc(50% - 8px)}
  .why-grid{grid-template-columns:1fr 1fr}
  .why-item{border-left:1px solid var(--border)}
  .why-item:nth-child(odd){border-left:none}
  .game-grid{grid-template-columns:repeat(3,1fr)}
  .input-row{grid-template-columns:1fr}
}
@media(max-width:480px){
  .game-grid{grid-template-columns:repeat(2,1fr)}
  .nominal-grid{grid-template-columns:repeat(2,1fr)}
  .why-grid{grid-template-columns:1fr}
  .why-item{border-left:none;border-top:1px solid var(--border)}
  .why-item:first-child{border-top:none}
}