/* ===========================================================
   gbet login - core stylesheet (mobile-first, max 430px)
   Prefix: wb1a2-
   Palette: #BDB76B | #FFFACD | #3A3A3A | #FFB74D | #B8860B
   =========================================================== */

:root{
  --wb1a2-bg:#3A3A3A;
  --wb1a2-bg-soft:#2e2e2e;
  --wb1a2-bg-deep:#232323;
  --wb1a2-text:#FFFACD;
  --wb1a2-primary:#FFB74D;
  --wb1a2-primary-dark:#B8860B;
  --wb1a2-muted:#BDB76B;
  --wb1a2-white:#ffffff;
  --wb1a2-border:rgba(255,250,205,0.14);
  --wb1a2-shadow:0 4px 18px rgba(0,0,0,0.35);
  --wb1a2-radius:14px;
  --wb1a2-radius-sm:10px;
  --wb1a2-header-h:60px;
  --wb1a2-nav-h:62px;
  --wb1a2-max:430px;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{
  font-size:62.5%;
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
}
body{
  font-family:"Segoe UI",system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;
  background:var(--wb1a2-bg);
  color:var(--wb1a2-text);
  font-size:1.5rem;
  line-height:1.5rem;
  min-height:100vh;
  overflow-x:hidden;
}
a{color:var(--wb1a2-primary);text-decoration:none;}
img{max-width:100%;display:block;}
ul,ol{list-style:none;}

.wb1a2-wrapper{
  max-width:var(--wb1a2-max);
  margin:0 auto;
  position:relative;
}
.wb1a2-container{padding:0 14px;}

/* ===== Header ===== */
.wb1a2-header{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  height:var(--wb1a2-header-h);
  background:linear-gradient(180deg,#1f1f1f,#2e2e2e);
  border-bottom:2px solid var(--wb1a2-primary-dark);
  box-shadow:var(--wb1a2-shadow);
}
.wb1a2-header-inner{
  max-width:var(--wb1a2-max);margin:0 auto;height:100%;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 12px;
}
.wb1a2-brand{display:flex;align-items:center;gap:8px;min-width:0;}
.wb1a2-logo{
  width:30px;height:30px;border-radius:8px;
  background:linear-gradient(135deg,var(--wb1a2-primary),var(--wb1a2-primary-dark));
  display:flex;align-items:center;justify-content:center;
  color:#232323;font-weight:800;font-size:1.5rem;
}
.wb1a2-brand-name{
  font-size:1.7rem;font-weight:800;color:var(--wb1a2-text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.wb1a2-brand-name b{color:var(--wb1a2-primary);}
.wb1a2-header-actions{display:flex;align-items:center;gap:8px;}
.wb1a2-btn{
  display:inline-flex;align-items:center;justify-content:center;
  gap:5px;border:none;cursor:pointer;
  font-size:1.35rem;font-weight:700;
  padding:8px 14px;border-radius:30px;
  transition:transform .15s ease,filter .15s ease;
  min-height:38px;min-width:44px;
}
.wb1a2-btn:active{transform:scale(.95);}
.wb1a2-btn-primary{
  background:linear-gradient(135deg,var(--wb1a2-primary),var(--wb1a2-primary-dark));
  color:#232323;
}
.wb1a2-btn-ghost{
  background:transparent;color:var(--wb1a2-text);
  border:1.5px solid var(--wb1a2-muted);
}
.wb1a2-btn-gold{
  background:linear-gradient(135deg,#FFE082,#B8860B);
  color:#232323;
}
.wb1a2-menu-btn{
  background:transparent;border:none;color:var(--wb1a2-text);
  font-size:2rem;cursor:pointer;padding:4px 6px;
  display:flex;align-items:center;justify-content:center;
  min-width:38px;min-height:38px;border-radius:8px;
}
.wb1a2-menu-btn:active{background:rgba(255,255,255,.08);}

/* ===== Mobile slide-down menu ===== */
.wb1a2-mobile-menu{
  position:fixed;top:var(--wb1a2-header-h);left:0;right:0;z-index:9999;
  background:#262626;
  border-bottom:2px solid var(--wb1a2-primary-dark);
  max-height:0;overflow:hidden;
  transition:max-height .3s ease;
}
.wb1a2-mobile-menu.wb1a2-open{max-height:520px;}
.wb1a2-mobile-menu-inner{
  max-width:var(--wb1a2-max);margin:0 auto;padding:8px 14px;
  display:grid;grid-template-columns:1fr 1fr;gap:8px;
}
.wb1a2-menu-link{
  display:flex;align-items:center;gap:8px;
  padding:11px 12px;border-radius:10px;
  background:#333;color:var(--wb1a2-text);
  font-size:1.35rem;font-weight:600;
  border:1px solid var(--wb1a2-border);
}
.wb1a2-menu-link:active{background:#3d3d3d;}
.wb1a2-menu-link i{color:var(--wb1a2-primary);font-size:1.6rem;}

/* ===== Hero / Carousel ===== */
.wb1a2-main{padding-top:calc(var(--wb1a2-header-h) + 6px);}
.wb1a2-hero{
  margin:8px 0 14px;
}
.wb1a2-carousel{
  position:relative;border-radius:var(--wb1a2-radius);
  overflow:hidden;box-shadow:var(--wb1a2-shadow);
  border:1px solid var(--wb1a2-border);
}
.wb1a2-slides{display:flex;scroll-snap-type:x mandatory;overflow-x:auto;scroll-behavior:smooth;}
.wb1a2-slides::-webkit-scrollbar{display:none;}
.wb1a2-slide{
  flex:0 0 100%;scroll-snap-align:center;
  position:relative;cursor:pointer;
}
.wb1a2-slide img{width:100%;height:170px;object-fit:cover;}
.wb1a2-slide-overlay{
  position:absolute;left:0;right:0;bottom:0;
  padding:10px 12px;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.85));
  color:var(--wb1a2-text);
}
.wb1a2-slide-overlay strong{color:var(--wb1a2-primary);font-size:1.5rem;display:block;}
.wb1a2-slide-overlay span{font-size:1.2rem;color:var(--wb1a2-muted);}
.wb1a2-dots{
  display:flex;justify-content:center;gap:6px;padding:8px 0;
}
.wb1a2-dot{
  width:8px;height:8px;border-radius:50%;
  background:rgba(255,250,205,.35);cursor:pointer;border:none;
}
.wb1a2-dot.wb1a2-active{background:var(--wb1a2-primary);width:22px;border-radius:6px;}

/* ===== Section ===== */
.wb1a2-section{margin:18px 0;padding:0 14px;}
.wb1a2-section-head{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:10px;
}
.wb1a2-section-title{
  font-size:1.75rem;font-weight:800;color:var(--wb1a2-text);
  display:flex;align-items:center;gap:8px;
}
.wb1a2-section-title i{color:var(--wb1a2-primary);font-size:2rem;}
.wb1a2-section-title b{color:var(--wb1a2-primary);}
.wb1a2-more{font-size:1.25rem;color:var(--wb1a2-primary);font-weight:600;}

/* ===== Game grid ===== */
.wb1a2-game-list{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
}
.wb1a2-game{
  display:flex;flex-direction:column;align-items:center;
  background:#2e2e2e;border-radius:12px;padding:8px 6px;
  border:1px solid var(--wb1a2-border);cursor:pointer;
  transition:transform .15s ease,border-color .15s ease;
  text-align:center;
}
.wb1a2-game:active{transform:scale(.95);border-color:var(--wb1a2-primary);}
.wb1a2-game img{
  width:60px;height:60px;border-radius:10px;object-fit:cover;
  margin-bottom:5px;border:1px solid var(--wb1a2-border);
}
.wb1a2-game-name{
  font-size:1.15rem;color:var(--wb1a2-text);font-weight:600;
  line-height:1.3rem;max-height:2.6rem;overflow:hidden;
}
.wb1a2-game-tag{
  display:inline-block;font-size:1rem;color:var(--wb1a2-primary-dark);
  background:rgba(255,183,77,.15);padding:1px 6px;border-radius:6px;margin-top:3px;
}

/* ===== Cards / generic ===== */
.wb1a2-card{
  background:#2e2e2e;border:1px solid var(--wb1a2-border);
  border-radius:var(--wb1a2-radius);padding:14px;
  box-shadow:var(--wb1a2-shadow);
}
.wb1a2-card h3{font-size:1.6rem;color:var(--wb1a2-primary);margin-bottom:8px;}
.wb1a2-card p{font-size:1.3rem;line-height:2rem;color:var(--wb1a2-text);}
.wb1a2-card a{color:var(--wb1a2-primary);font-weight:700;}

.wb1a2-row{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;
}
.wb1a2-row-3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.wb1a2-pill{
  background:#333;border:1px solid var(--wb1a2-border);
  border-radius:10px;padding:10px;text-align:center;
  font-size:1.2rem;color:var(--wb1a2-text);
}
.wb1a2-pill b{color:var(--wb1a2-primary);display:block;font-size:1.6rem;}

.wb1a2-cta{
  display:block;text-align:center;
  background:linear-gradient(135deg,var(--wb1a2-primary),var(--wb1a2-primary-dark));
  color:#232323;font-weight:800;font-size:1.5rem;
  padding:14px;border-radius:30px;margin:10px 0;
  box-shadow:var(--wb1a2-shadow);cursor:pointer;border:none;
}
.wb1a2-cta:active{transform:scale(.97);}

/* Steps */
.wb1a2-steps{display:flex;flex-direction:column;gap:10px;}
.wb1a2-step{
  display:flex;gap:10px;align-items:flex-start;
  background:#2e2e2e;border:1px solid var(--wb1a2-border);
  border-radius:12px;padding:10px 12px;
}
.wb1a2-step-num{
  flex-shrink:0;width:26px;height:26px;border-radius:50%;
  background:linear-gradient(135deg,var(--wb1a2-primary),var(--wb1a2-primary-dark));
  color:#232323;font-weight:800;font-size:1.3rem;
  display:flex;align-items:center;justify-content:center;
}
.wb1a2-step-body h4{font-size:1.4rem;color:var(--wb1a2-primary);margin-bottom:3px;}
.wb1a2-step-body p{font-size:1.25rem;line-height:1.9rem;color:var(--wb1a2-text);}

/* RTP table */
.wb1a2-rtp-table{
  width:100%;border-collapse:collapse;font-size:1.25rem;
}
.wb1a2-rtp-table th,.wb1a2-rtp-table td{
  padding:8px 6px;text-align:left;border-bottom:1px solid var(--wb1a2-border);
}
.wb1a2-rtp-table th{color:var(--wb1a2-primary);font-size:1.2rem;}
.wb1a2-rtp-table td b{color:var(--wb1a2-primary);}

/* Testimonial */
.wb1a2-testi{
  background:#2e2e2e;border:1px solid var(--wb1a2-border);
  border-radius:12px;padding:12px;margin-bottom:8px;
}
.wb1a2-testi-stars{color:var(--wb1a2-primary);font-size:1.2rem;margin-bottom:4px;}
.wb1a2-testi p{font-size:1.25rem;line-height:1.9rem;color:var(--wb1a2-text);}
.wb1a2-testi b{color:var(--wb1a2-muted);font-size:1.15rem;}

/* Winner ticker */
.wb1a2-winner{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 10px;background:#2e2e2e;border-radius:8px;
  border:1px solid var(--wb1a2-border);margin-bottom:6px;font-size:1.2rem;
}
.wb1a2-winner b{color:var(--wb1a2-primary);}

/* Payment icons */
.wb1a2-pay{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
.wb1a2-pay span{
  background:#333;border:1px solid var(--wb1a2-border);
  border-radius:8px;padding:8px;text-align:center;font-size:1.1rem;color:var(--wb1a2-muted);font-weight:700;
}

/* FAQ */
.wb1a2-faq{margin-bottom:8px;}
.wb1a2-faq-q{
  width:100%;text-align:left;background:#2e2e2e;border:1px solid var(--wb1a2-border);
  border-radius:10px;padding:11px 12px;color:var(--wb1a2-text);font-size:1.3rem;font-weight:700;
  cursor:pointer;display:flex;justify-content:space-between;align-items:center;
}
.wb1a2-faq-q i{color:var(--wb1a2-primary);}
.wb1a2-faq-a{
  max-height:0;overflow:hidden;transition:max-height .3s ease;
  background:#262626;border-radius:0 0 10px 10px;padding:0 12px;
  font-size:1.25rem;line-height:1.9rem;color:var(--wb1a2-text);
}
.wb1a2-faq.wb1a2-open .wb1a2-faq-a{max-height:260px;padding:10px 12px;}

/* Achievements */
.wb1a2-ach{
  display:flex;align-items:center;gap:10px;
  background:#2e2e2e;border:1px solid var(--wb1a2-border);
  border-radius:10px;padding:10px;margin-bottom:6px;
}
.wb1a2-ach .material-icons{color:var(--wb1a2-primary);font-size:2.2rem;}
.wb1a2-ach b{color:var(--wb1a2-text);font-size:1.3rem;display:block;}
.wb1a2-ach span{color:var(--wb1a2-muted);font-size:1.15rem;}

/* SEO text */
.wb1a2-seo{font-size:1.3rem;line-height:2rem;color:var(--wb1a2-text);}
.wb1a2-seo h2{color:var(--wb1a2-primary);font-size:1.7rem;margin:14px 0 6px;}
.wb1a2-seo h3{color:var(--wb1a2-primary);font-size:1.45rem;margin:10px 0 4px;}
.wb1a2-seo p{margin-bottom:8px;}
.wb1a2-seo a{color:var(--wb1a2-primary);font-weight:700;}

/* ===== Footer ===== */
.wb1a2-footer{
  margin-top:18px;padding:18px 14px calc(var(--wb1a2-nav-h) + 18px);
  background:#1f1f1f;border-top:2px solid var(--wb1a2-primary-dark);
}
.wb1a2-footer p{font-size:1.2rem;line-height:1.9rem;color:var(--wb1a2-muted);margin-bottom:10px;}
.wb1a2-footer-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:10px 0;
}
.wb1a2-footer-grid a{
  display:block;font-size:1.2rem;color:var(--wb1a2-text);
  padding:6px 8px;background:#2e2e2e;border-radius:8px;border:1px solid var(--wb1a2-border);
}
.wb1a2-footer-cta{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0;}
.wb1a2-footer-copy{font-size:1.1rem;color:var(--wb1a2-muted);text-align:center;margin-top:10px;}

/* ===== Mobile bottom nav ===== */
.wb1a2-bottomnav{
  position:fixed;bottom:0;left:0;right:0;z-index:1000;
  height:var(--wb1a2-nav-h);
  background:linear-gradient(180deg,#2a2a2a,#1c1c1c);
  border-top:2px solid var(--wb1a2-primary-dark);
  display:flex;justify-content:space-around;align-items:stretch;
  box-shadow:0 -3px 14px rgba(0,0,0,.4);
}
.wb1a2-bottomnav-btn{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:2px;background:transparent;border:none;cursor:pointer;
  color:var(--wb1a2-muted);font-size:1rem;font-weight:600;
  padding:4px 2px;min-width:60px;min-height:60px;
  transition:color .15s ease,transform .15s ease;
}
.wb1a2-bottomnav-btn:active{transform:scale(.9);}
.wb1a2-bottomnav-btn i{font-size:2.2rem;}
.wb1a2-bottomnav-btn .material-icons{font-size:2.2rem;}
.wb1a2-bottomnav-btn.wb1a2-active{color:var(--wb1a2-primary);}
.wb1a2-bottomnav-btn.wb1a2-active i{color:var(--wb1a2-primary);}
.wb1a2-bottomnav-btn.wb1a2-promo i{color:var(--wb1a2-primary);}

@media (max-width:768px){
  .wb1a2-main{padding-bottom:80px;}
}

@media (min-width:769px){
  .wb1a2-bottomnav{display:none;}
  .wb1a2-footer{padding-bottom:24px;}
}

/* Desktop widen wrapper */
@media (min-width:481px){
  body{background:linear-gradient(180deg,#3A3A3A,#232323);}
}
