/* =========================================================
 * bw777.homes - Core theme stylesheet
 * Every custom class uses the "v108-" prefix.
 * Palette: #BAFFC9 | #FF5722 | #FAFAD2 | #2C3E50 | #FFF8DC
 * Mobile-first: design target max-width 430px.
 * ========================================================= */
:root{
  --v108-primary:#FF5722; --v108-primary-dark:#C13C0F;
  --v108-bg:#2C3E50; --v108-bg-alt:#22323f; --v108-bg-deep:#1a2632;
  --v108-text:#FFF8DC; --v108-text-soft:#FAFAD2;
  --v108-mint:#BAFFC9; --v108-mint-dark:#6fd08a;
  --v108-gold:#FFD24a;
  --v108-border:rgba(250,250,210,.14);
  --v108-shadow:0 6px 22px rgba(0,0,0,.35);
  --v108-radius:14px;
}
*{box-sizing:border-box}
html{font-size:62.5%;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;padding:0;font-family:"Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;background:var(--v108-bg);color:var(--v108-text);line-height:1.5rem;font-size:1.4rem;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:var(--v108-mint);text-decoration:none}
.v108-skip{position:absolute;left:-9999px;top:0;background:var(--v108-primary);color:#fff;padding:8px 12px;z-index:9999}
.v108-skip:focus{left:8px;top:8px}

/* Layout containers */
.v108-container{width:100%;max-width:430px;margin:0 auto;padding:0 1.2rem}
.v108-wrapper{width:100%}

/* Header */
.v108-header{position:fixed;top:0;left:0;right:0;z-index:1000;background:linear-gradient(90deg,var(--v108-bg-deep) 0%,var(--v108-bg-alt) 100%);border-bottom:2px solid var(--v108-primary);box-shadow:var(--v108-shadow)}
.v108-header-inner{max-width:430px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:.6rem 1rem;gap:.8rem}
.v108-brand{display:flex;align-items:center;gap:.6rem;min-width:0}
.v108-logo{width:3.2rem;height:3.2rem;border-radius:8px;object-fit:cover;border:2px solid var(--v108-mint)}
.v108-brand-name{font-size:1.8rem;font-weight:800;color:var(--v108-mint);letter-spacing:.5px;white-space:nowrap}
.v108-brand-name span{color:var(--v108-primary)}
.v108-header-actions{display:flex;align-items:center;gap:.5rem}
.v108-btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;border:none;border-radius:9px;padding:.7rem 1.1rem;font-size:1.25rem;font-weight:700;cursor:pointer;min-height:38px;transition:transform .18s ease,box-shadow .18s ease,background .18s ease;font-family:inherit}
.v108-btn-login{background:var(--v108-mint);color:var(--v108-bg-deep)}
.v108-btn-register{background:linear-gradient(135deg,var(--v108-primary) 0%,var(--v108-primary-dark) 100%);color:#fff;box-shadow:0 3px 10px rgba(255,87,34,.45)}
.v108-btn:hover{transform:translateY(-1px)}
.v108-btn:active{transform:translateY(1px) scale(.98)}
.v108-menu-btn{background:transparent;border:none;color:var(--v108-text);font-size:2rem;width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border-radius:8px}
.v108-menu-btn:hover{background:rgba(255,255,255,.08)}

/* Expandable nav menu */
.v108-nav-menu{position:fixed;top:56px;left:0;right:0;background:var(--v108-bg-alt);border-bottom:2px solid var(--v108-primary);max-height:0;overflow:hidden;transition:max-height .28s ease;z-index:999}
.v108-nav-menu.v108-nav-open{max-height:420px}
.v108-nav-list{list-style:none;margin:0 auto;padding:.6rem 0;max-width:430px}
.v108-nav-list li a{display:flex;align-items:center;gap:.8rem;padding:.9rem 1.4rem;color:var(--v108-text);font-size:1.3rem;border-left:3px solid transparent}
.v108-nav-list li a:hover{background:rgba(186,255,201,.08);border-left-color:var(--v108-primary);color:var(--v108-mint)}
.v108-nav-list .v108-nav-icon{width:24px;text-align:center;color:var(--v108-mint)}

/* Hero / Carousel */
.v108-main{padding-top:64px}
.v108-hero{margin-top:.8rem}
.v108-carousel{position:relative;border-radius:var(--v108-radius);overflow:hidden;box-shadow:var(--v108-shadow)}
.v108-slide{display:none;position:relative;cursor:pointer}
.v108-slide.v108-slide-active{display:block}
.v108-slide img{width:100%;height:180px;object-fit:cover}
.v108-slide-overlay{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(180deg,transparent 0%,rgba(26,38,50,.92) 100%);padding:1rem 1.2rem 1.2rem}
.v108-slide-title{font-size:1.6rem;font-weight:800;color:var(--v108-mint);margin:0 0 .3rem}
.v108-slide-desc{font-size:1.2rem;color:var(--v108-text-soft);margin:0 0 .6rem}
.v108-slide-cta{display:inline-block;background:var(--v108-primary);color:#fff;padding:.45rem .9rem;border-radius:6px;font-weight:700;font-size:1.15rem}
.v108-dots{display:flex;justify-content:center;gap:.5rem;padding:.6rem 0}
.v108-dot{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.3);border:none;cursor:pointer}
.v108-dot.v108-dot-active{background:var(--v108-primary);width:22px;border-radius:5px}

/* Section titles */
.v108-section{padding:1.6rem 0 .4rem}
.v108-section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.8rem}
.v108-section-title{font-size:1.55rem;font-weight:800;color:var(--v108-mint);margin:0;display:flex;align-items:center;gap:.5rem}
.v108-section-title i{color:var(--v108-primary)}
.v108-more{font-size:1.15rem;color:var(--v108-mint);font-weight:600}

/* H1 page title */
.v108-page-title{font-size:1.9rem;font-weight:800;line-height:1.35;color:var(--v108-text);margin:1.2rem 0 .6rem;padding:.6rem 0;border-left:4px solid var(--v108-primary);padding-left:1rem}
.v108-page-title span{color:var(--v108-mint)}
.v108-intro{font-size:1.3rem;color:var(--v108-text-soft);margin:0 0 1rem}

/* Category banner */
.v108-cat-head{display:flex;align-items:center;gap:.6rem;margin:1.4rem 0 .8rem;padding:.6rem .9rem;background:linear-gradient(90deg,var(--v108-bg-alt) 0%,transparent 100%);border-radius:8px}
.v108-cat-head i{font-size:1.7rem;color:var(--v108-gold)}
.v108-cat-head h2{margin:0;font-size:1.45rem;font-weight:700;color:var(--v108-text)}

/* Game grid */
.v108-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem}
.v108-game{background:var(--v108-bg-alt);border:1px solid var(--v108-border);border-radius:12px;overflow:hidden;cursor:pointer;transition:transform .2s ease,border-color .2s ease;display:block;color:var(--v108-text)}
.v108-game:hover{transform:translateY(-3px);border-color:var(--v108-primary)}
.v108-game:active{transform:scale(.97)}
.v108-game-img{width:100%;aspect-ratio:1/1;object-fit:cover;background:#0e1620}
.v108-game-name{font-size:1.1rem;padding:.4rem .5rem;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--v108-text-soft);font-weight:600}

/* Cards */
.v108-card{background:var(--v108-bg-alt);border:1px solid var(--v108-border);border-radius:var(--v108-radius);padding:1.2rem;margin-bottom:1rem;box-shadow:var(--v108-shadow)}
.v108-card h3{margin:0 0 .5rem;font-size:1.4rem;color:var(--v108-mint);display:flex;align-items:center;gap:.5rem}
.v108-card p{margin:0 0 .6rem;font-size:1.25rem;color:var(--v108-text-soft)}
.v108-card .v108-tag{display:inline-block;background:rgba(186,255,201,.12);color:var(--v108-mint);font-size:1.1rem;padding:.2rem .6rem;border-radius:5px;margin-right:.4rem;font-weight:600}

/* Text promo link */
.v108-promo-link{color:var(--v108-primary);font-weight:800;border-bottom:2px dashed var(--v108-primary);cursor:pointer;display:inline-block;padding:.1rem 0}
.v108-promo-link:hover{color:var(--v108-gold);border-bottom-color:var(--v108-gold)}

/* Feature list */
.v108-feature-list{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem;list-style:none;padding:0;margin:0}
.v108-feature-list li{background:var(--v108-bg-deep);border-radius:10px;padding:.8rem;text-align:center;font-size:1.15rem;color:var(--v108-text);border:1px solid var(--v108-border)}
.v108-feature-list i{font-size:1.8rem;color:var(--v108-mint);display:block;margin-bottom:.3rem}

/* RTP rows */
.v108-rtp-row{display:flex;justify-content:space-between;align-items:center;padding:.6rem .4rem;border-bottom:1px dashed var(--v108-border);font-size:1.2rem}
.v108-rtp-row:last-child{border-bottom:none}
.v108-rtp-bar{flex:1;height:6px;border-radius:4px;background:rgba(255,255,255,.1);margin:0 .8rem;overflow:hidden}
.v108-rtp-fill{height:100%;background:linear-gradient(90deg,var(--v108-mint),var(--v108-primary))}
.v108-rtp-val{color:var(--v108-gold);font-weight:700}

/* Testimonials */
.v108-testi{background:var(--v108-bg-deep);border-radius:10px;padding:.9rem;margin-bottom:.7rem;border-left:3px solid var(--v108-mint)}
.v108-testi-head{display:flex;align-items:center;gap:.6rem;margin-bottom:.4rem}
.v108-testi-avatar{width:30px;height:30px;border-radius:50%;background:var(--v108-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2rem}
.v108-testi-name{font-weight:700;color:var(--v108-mint);font-size:1.2rem}
.v108-testi-stars{color:var(--v108-gold);font-size:1rem;margin-left:auto}
.v108-testi p{margin:0;font-size:1.15rem;color:var(--v108-text-soft)}

/* Payment grid */
.v108-pay-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}
.v108-pay{background:var(--v108-bg-deep);border:1px solid var(--v108-border);border-radius:8px;padding:.8rem .4rem;text-align:center;font-size:1.05rem;color:var(--v108-text)}
.v108-pay i{font-size:1.6rem;color:var(--v108-mint);display:block;margin-bottom:.3rem}

/* App download CTA */
.v108-app-cta{background:radial-gradient(circle at top right,rgba(255,87,34,.25),transparent 60%),var(--v108-bg-alt);border-radius:var(--v108-radius);padding:1.2rem;text-align:center;border:1px solid var(--v108-primary);margin-bottom:1rem}
.v108-app-cta h3{margin:0 0 .4rem;color:var(--v108-mint);font-size:1.5rem}
.v108-app-cta p{margin:0 0 .8rem;font-size:1.2rem;color:var(--v108-text-soft)}
.v108-app-btns{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap}
.v108-app-btn{display:inline-flex;align-items:center;gap:.4rem;background:var(--v108-bg-deep);color:var(--v108-text);border:1px solid var(--v108-mint);border-radius:8px;padding:.5rem .9rem;font-size:1.15rem;font-weight:600;cursor:pointer}

/* FAQ */
.v108-faq-item{border-bottom:1px solid var(--v108-border);padding:.6rem 0}
.v108-faq-item h3{margin:0 0 .3rem;font-size:1.25rem;color:var(--v108-mint)}
.v108-faq-item p{margin:0;font-size:1.2rem;color:var(--v108-text-soft)}

/* Winners */
.v108-winner{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0;border-bottom:1px dashed var(--v108-border);font-size:1.15rem}
.v108-winner:last-child{border-bottom:none}
.v108-winner-name{color:var(--v108-mint);font-weight:600}
.v108-winner-amt{color:var(--v108-gold);font-weight:800}

/* Big CTA banner */
.v108-cta-banner{background:linear-gradient(135deg,var(--v108-primary) 0%,var(--v108-primary-dark) 100%);border-radius:var(--v108-radius);padding:1.4rem;text-align:center;margin:1rem 0;box-shadow:0 6px 20px rgba(255,87,34,.45)}
.v108-cta-banner h3{margin:0 0 .4rem;color:#fff;font-size:1.6rem}
.v108-cta-banner p{margin:0 0 .9rem;color:#fff;font-size:1.2rem}
.v108-cta-banner .v108-btn{background:#fff;color:var(--v108-primary);font-size:1.3rem;padding:.8rem 1.6rem}

/* Footer */
.v108-footer{background:var(--v108-bg-deep);border-top:2px solid var(--v108-primary);margin-top:1.6rem;padding:1.4rem 1.2rem 100px}
.v108-footer-brand{font-size:1.25rem;color:var(--v108-text-soft);margin-bottom:1rem;line-height:1.6}
.v108-footer-promos{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}
.v108-footer-promos .v108-btn{font-size:1.1rem;padding:.5rem .8rem}
.v108-footer-links{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem .8rem;margin-bottom:1rem}
.v108-footer-links a{font-size:1.15rem;color:var(--v108-text-soft)}
.v108-footer-links a:hover{color:var(--v108-mint)}
.v108-footer-copy{font-size:1.1rem;color:rgba(255,248,220,.6);text-align:center;border-top:1px solid var(--v108-border);padding-top:.8rem}

/* Mobile bottom nav */
.v108-bnav{position:fixed;bottom:0;left:0;right:0;height:62px;background:linear-gradient(180deg,var(--v108-bg-alt) 0%,var(--v108-bg-deep) 100%);border-top:2px solid var(--v108-primary);display:flex;justify-content:space-around;align-items:stretch;z-index:1000;box-shadow:0 -4px 18px rgba(0,0,0,.35)}
.v108-bnav-link{position:relative;flex:1;min-width:60px;min-height:60px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--v108-text-soft);font-size:1rem;font-weight:600;background:transparent;border:none;cursor:pointer;transition:color .2s ease,transform .18s ease;text-decoration:none;padding:0}
.v108-bnav-link i,.v108-bnav-link .material-icons,.v108-bnav-link ion-icon{font-size:24px}
.v108-bnav-link:active{transform:scale(.92)}
.v108-bnav-link.v108-bnav-active{color:var(--v108-primary)}
.v108-bnav-link:hover{color:var(--v108-mint)}
.v108-bnav-badge{position:absolute;top:6px;right:50%;margin-right:-22px;background:var(--v108-primary);color:#fff;font-size:.9rem;min-width:15px;height:15px;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:0 4px}

/* Reveal animation */
.v108-reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.v108-reveal.v108-revealed{opacity:1;transform:translateY(0)}

/* Responsive: tablet / desktop */
@media (min-width:768px){
  .v108-bnav{display:none}
  .v108-container,.v108-header-inner,.v108-nav-list{max-width:720px}
  .v108-grid{grid-template-columns:repeat(5,1fr)}
  .v108-footer{padding-bottom:1.6rem}
  body{font-size:1.5rem}
  .v108-slide img{height:280px}
}
@media (min-width:1024px){
  .v108-container,.v108-header-inner,.v108-nav-list{max-width:960px}
  .v108-grid{grid-template-columns:repeat(6,1fr)}
}
@media (max-width:767px){
  .v108-main{padding-bottom:80px}
  .v108-footer{padding-bottom:90px}
}
