/* ============================================================
   nwrplay.homes - core stylesheet (layout-b655.css)
   Mobile-first casino landing page styling.
   All custom classes use the wb655- prefix.
   Palette: #FDF5E6 / #ADFF2F / #EEEEEE / #1A1A2E
   ============================================================ */

:root{
  --wb655-bg:#1A1A2E;
  --wb655-bg-soft:#232347;
  --wb655-bg-card:#26264a;
  --wb655-text:#FDF5E6;
  --wb655-accent:#ADFF2F;
  --wb655-accent-soft:#c5ff66;
  --wb655-muted:#EEEEEE;
  --wb655-border:rgba(173,255,47,.22);
  --wb655-shadow:0 8px 24px rgba(0,0,0,.35);
  --wb655-radius:14px;
  --wb655-radius-lg:22px;
  --wb655-header-h:60px;
  --wb655-nav-h:62px;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{font-size:62.5%;-webkit-text-size-adjust:100%;}
body{
  font-family:"Segoe UI","Helvetica Neue",Arial,sans-serif;
  background:radial-gradient(circle at 20% 0%,#232347 0%,#1A1A2E 55%);
  color:var(--wb655-text);
  line-height:1.5rem;
  font-size:1.5rem;
  min-height:100vh;
  overflow-x:hidden;
}
a{color:var(--wb655-accent);text-decoration:none;}
img{max-width:100%;display:block;}

/* ---------- Layout helpers ---------- */
.wb655-container{width:100%;max-width:430px;margin:0 auto;padding:0 12px;}
.wb655-wrapper{padding:14px 0;}
.wb655-section{margin:22px 0;}
.wb655-grid{display:grid;gap:10px;}

/* ---------- Top Header ---------- */
.wb655-header{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  height:var(--wb655-header-h);
  background:linear-gradient(90deg,#1A1A2E 0%,#232347 100%);
  border-bottom:1px solid var(--wb655-border);
  box-shadow:0 2px 12px rgba(0,0,0,.45);
}
.wb655-header-inner{
  max-width:430px;margin:0 auto;height:100%;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 12px;
}
.wb655-brand{display:flex;align-items:center;gap:8px;}
.wb655-brand .wb655-logo{
  width:30px;height:30px;border-radius:8px;
  background:var(--wb655-accent);
  display:flex;align-items:center;justify-content:center;
  color:#1A1A2E;font-weight:800;font-size:1.4rem;
}
.wb655-brand-name{font-weight:800;font-size:1.7rem;color:var(--wb655-text);letter-spacing:.3px;}
.wb655-brand-name span{color:var(--wb655-accent);}

.wb655-header-actions{display:flex;align-items:center;gap:8px;}
.wb655-btn{
  border:none;cursor:pointer;border-radius:24px;
  font-weight:700;font-size:1.3rem;padding:8px 16px;
  transition:transform .15s ease, filter .15s ease;
  min-height:36px;display:inline-flex;align-items:center;gap:6px;
}
.wb655-btn:hover{transform:translateY(-1px);filter:brightness(1.08);}
.wb655-btn-login{
  background:transparent;color:var(--wb655-text);
  border:1px solid var(--wb655-border);
}
.wb655-btn-register{
  background:linear-gradient(135deg,#ADFF2F 0%,#88dd1c 100%);
  color:#1A1A2E;font-weight:800;
  box-shadow:0 4px 12px rgba(173,255,47,.3);
}

.wb655-menu-toggle{
  background:transparent;border:none;color:var(--wb655-text);
  font-size:2rem;cursor:pointer;padding:0 4px;
}

/* ---------- Slide-down mobile menu ---------- */
.wb655-mobile-menu{
  position:fixed;top:var(--wb655-header-h);left:0;right:0;z-index:9999;
  background:#1a1a2eee;
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--wb655-border);
  max-height:0;overflow:hidden;transition:max-height .3s ease;
}
.wb655-mobile-menu.wb655-open{max-height:520px;}
.wb655-mobile-menu-inner{
  max-width:430px;margin:0 auto;padding:14px 16px;
  display:grid;grid-template-columns:1fr 1fr;gap:10px;
}
.wb655-mobile-menu a{
  display:flex;align-items:center;gap:8px;
  background:var(--wb655-bg-soft);color:var(--wb655-text);
  padding:12px 14px;border-radius:12px;font-size:1.4rem;
  border:1px solid rgba(255,255,255,.05);
}
.wb655-mobile-menu a:hover{background:#2c2c54;color:var(--wb655-accent);}
.wb655-mobile-menu a i{color:var(--wb655-accent);}

/* ---------- Page spacing for fixed chrome ---------- */
.wb655-main{padding-top:calc(var(--wb655-header-h) + 6px);}
@media (max-width:768px){
  .wb655-main{padding-bottom:calc(var(--wb655-nav-h) + 14px);}
}

/* ---------- Hero carousel ---------- */
.wb655-hero{margin-top:10px;}
.wb655-carousel{
  position:relative;border-radius:var(--wb655-radius-lg);
  overflow:hidden;box-shadow:var(--wb655-shadow);
  border:1px solid var(--wb655-border);
}
.wb655-carousel-track{display:flex;scroll-snap-type:x mandatory;overflow-x:auto;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;}
.wb655-carousel-track::-webkit-scrollbar{display:none;}
.wb655-slide{
  flex:0 0 100%;scroll-snap-align:center;position:relative;
}
.wb655-slide img{width:100%;height:200px;object-fit:cover;}
.wb655-slide-overlay{
  position:absolute;left:0;right:0;bottom:0;
  padding:14px 16px;
  background:linear-gradient(0deg,rgba(26,26,46,.92) 0%,rgba(26,26,46,0) 100%);
  color:var(--wb655-text);
}
.wb655-slide-overlay h2{font-size:1.8rem;color:var(--wb655-accent);font-weight:800;}
.wb655-slide-overlay p{font-size:1.3rem;color:var(--wb655-muted);margin-top:2px;}
.wb655-carousel-dots{
  position:absolute;bottom:8px;left:50%;transform:translateX(-50%);
  display:flex;gap:6px;
}
.wb655-carousel-dots span{
  width:7px;height:7px;border-radius:50%;
  background:rgba(253,245,230,.4);cursor:pointer;
}
.wb655-carousel-dots span.wb655-active{background:var(--wb655-accent);width:18px;border-radius:4px;}

/* ---------- Headings ---------- */
.wb655-h1{
  font-size:2.2rem;line-height:2.6rem;font-weight:800;
  margin:18px 0 6px;color:var(--wb655-text);
}
.wb655-h1 em{color:var(--wb655-accent);font-style:normal;}
.wb655-sec-title{
  font-size:1.9rem;font-weight:800;margin:22px 0 10px;
  display:flex;align-items:center;gap:8px;
}
.wb655-sec-title i{color:var(--wb655-accent);}
.wb655-sec-title small{
  margin-left:auto;font-size:1.2rem;font-weight:600;color:var(--wb655-muted);
}
.wb655-subtitle{color:var(--wb655-muted);font-size:1.35rem;margin-bottom:10px;}

/* ---------- CTA strip ---------- */
.wb655-cta{
  display:flex;gap:10px;align-items:center;
  background:linear-gradient(135deg,#26264a 0%,#1A1A2E 100%);
  border:1px solid var(--wb655-border);border-radius:var(--wb655-radius);
  padding:12px 14px;margin:12px 0;
}
.wb655-cta-text{flex:1;font-size:1.35rem;color:var(--wb655-muted);}
.wb655-cta-text b{color:var(--wb655-accent);display:block;font-size:1.55rem;}

/* ---------- Game grid ---------- */
.wb655-game-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
}
.wb655-game-card{
  background:var(--wb655-bg-card);border-radius:var(--wb655-radius);
  overflow:hidden;border:1px solid rgba(255,255,255,.05);
  cursor:pointer;transition:transform .15s ease, box-shadow .15s ease;
  text-align:center;
}
.wb655-game-card:hover{transform:translateY(-3px);box-shadow:0 8px 18px rgba(0,0,0,.4);}
.wb655-game-card img{
  width:100%;aspect-ratio:1/1;object-fit:cover;background:#0e0e1c;
}
.wb655-game-card-name{
  padding:6px 4px;font-size:1.15rem;color:var(--wb655-text);
  font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.wb655-game-card:hover .wb655-game-card-name{color:var(--wb655-accent);}

/* ---------- Featured row (large) ---------- */
.wb655-featured{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;
}
.wb655-feature-card{
  position:relative;border-radius:var(--wb655-radius);
  overflow:hidden;cursor:pointer;border:1px solid var(--wb655-border);
}
.wb655-feature-card img{width:100%;height:130px;object-fit:cover;}
.wb655-feature-card .wb655-feature-ov{
  position:absolute;left:0;right:0;bottom:0;
  padding:8px 10px;background:linear-gradient(0deg,rgba(26,26,46,.95),transparent);
  font-size:1.3rem;font-weight:700;color:var(--wb655-accent);
}

/* ---------- Info / paragraph blocks ---------- */
.wb655-prose p{
  margin:8px 0;color:var(--wb655-muted);font-size:1.4rem;line-height:2.1rem;
}
.wb655-prose h3{margin:14px 0 4px;font-size:1.55rem;color:var(--wb655-text);}
.wb655-prose a{color:var(--wb655-accent);border-bottom:1px dashed rgba(173,255,47,.5);}
.wb655-callout{
  background:var(--wb655-bg-soft);border-left:3px solid var(--wb655-accent);
  padding:10px 12px;border-radius:8px;color:var(--wb655-muted);
  margin:10px 0;font-size:1.35rem;
}

/* ---------- Feature list (icon+text) ---------- */
.wb655-feature-list{display:grid;gap:10px;}
.wb655-feature-item{
  display:flex;gap:10px;align-items:flex-start;
  background:var(--wb655-bg-card);padding:12px;border-radius:var(--wb655-radius);
  border:1px solid rgba(255,255,255,.05);
}
.wb655-feature-item .wb655-icon{
  width:34px;height:34px;border-radius:10px;flex-shrink:0;
  background:rgba(173,255,47,.15);color:var(--wb655-accent);
  display:flex;align-items:center;justify-content:center;font-size:1.8rem;
}
.wb655-feature-item h4{font-size:1.45rem;color:var(--wb655-text);margin-bottom:2px;}
.wb655-feature-item p{font-size:1.25rem;color:var(--wb655-muted);line-height:1.8rem;}

/* ---------- Testimonial ---------- */
.wb655-testimonials{display:grid;gap:10px;}
.wb655-testimonial{
  background:var(--wb655-bg-card);border-radius:var(--wb655-radius);
  padding:12px;border:1px solid rgba(255,255,255,.05);
}
.wb655-testimonial-head{display:flex;align-items:center;gap:8px;margin-bottom:6px;}
.wb655-avatar{
  width:34px;height:34px;border-radius:50%;
  background:linear-gradient(135deg,#ADFF2F,#5b8a13);
  color:#1A1A2E;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.3rem;
}
.wb655-stars{color:#ffce3a;font-size:1.2rem;margin-left:auto;}
.wb655-testimonial p{color:var(--wb655-muted);font-size:1.3rem;line-height:1.9rem;}

/* ---------- Payment chips ---------- */
.wb655-chips{display:flex;flex-wrap:wrap;gap:8px;}
.wb655-chip{
  background:var(--wb655-bg-card);border:1px solid rgba(255,255,255,.06);
  padding:8px 12px;border-radius:20px;font-size:1.25rem;color:var(--wb655-muted);
  display:inline-flex;align-items:center;gap:6px;
}

/* ---------- Winners ticker ---------- */
.wb655-winner-list{display:grid;gap:6px;}
.wb655-winner{
  display:flex;align-items:center;justify-content:space-between;
  background:var(--wb655-bg-card);padding:8px 12px;border-radius:10px;font-size:1.25rem;
}
.wb655-winner b{color:var(--wb655-accent);}

/* ---------- FAQ ---------- */
.wb655-faq{display:grid;gap:8px;}
.wb655-faq-item{
  background:var(--wb655-bg-card);border-radius:var(--wb655-radius);
  padding:12px;border:1px solid rgba(255,255,255,.05);
}
.wb655-faq-q{
  display:flex;align-items:center;gap:8px;
  cursor:pointer;font-weight:700;color:var(--wb655-text);font-size:1.4rem;
}
.wb655-faq-q i{color:var(--wb655-accent);transition:transform .2s;}
.wb655-faq-a{
  max-height:0;overflow:hidden;transition:max-height .3s ease;
  color:var(--wb655-muted);font-size:1.3rem;line-height:1.9rem;
}
.wb655-faq-item.wb655-open .wb655-faq-a{max-height:240px;margin-top:8px;}
.wb655-faq-item.wb655-open .wb655-faq-q i{transform:rotate(90deg);}

/* ---------- Promo banner block ---------- */
.wb655-promo-banner{
  position:relative;border-radius:var(--wb655-radius-lg);overflow:hidden;
  margin:14px 0;border:1px solid var(--wb655-border);
}
.wb655-promo-banner img{width:100%;height:160px;object-fit:cover;}
.wb655-promo-banner .wb655-promo-ov{
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(26,26,46,.92) 0%,rgba(26,26,46,.3) 100%);
  display:flex;flex-direction:column;justify-content:center;padding:0 16px;
}
.wb655-promo-banner h3{color:var(--wb655-accent);font-size:2rem;font-weight:800;}
.wb655-promo-banner p{color:var(--wb655-muted);font-size:1.3rem;margin-top:2px;}

/* ---------- Footer ---------- */
.wb655-footer{
  background:#15152a;border-top:1px solid var(--wb655-border);
  padding:18px 12px 16px;margin-top:18px;
}
.wb655-footer-inner{max-width:430px;margin:0 auto;}
.wb655-footer h4{color:var(--wb655-accent);font-size:1.5rem;margin:10px 0 6px;}
.wb655-footer p{color:var(--wb655-muted);font-size:1.3rem;line-height:1.9rem;}
.wb655-footer-links{
  display:flex;flex-wrap:wrap;gap:8px;margin:10px 0;
}
.wb655-footer-links a{
  background:var(--wb655-bg-card);color:var(--wb655-text);
  padding:6px 12px;border-radius:18px;font-size:1.2rem;
  border:1px solid rgba(255,255,255,.05);
}
.wb655-footer-links a:hover{color:var(--wb655-accent);}
.wb655-footer-promos{
  display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:10px 0;
}
.wb655-footer-promos button{
  background:linear-gradient(135deg,#ADFF2F 0%,#88dd1c 100%);
  color:#1A1A2E;border:none;border-radius:10px;padding:10px;
  font-weight:800;font-size:1.3rem;cursor:pointer;
}
.wb655-copyright{
  text-align:center;color:rgba(238,238,238,.6);font-size:1.15rem;margin-top:10px;
}

/* ---------- Mobile bottom nav ---------- */
.wb655-bottomnav{
  position:fixed;bottom:0;left:0;right:0;z-index:1000;
  height:var(--wb655-nav-h);
  background:rgba(21,21,42,.97);
  backdrop-filter:blur(8px);
  border-top:1px solid var(--wb655-border);
  display:flex;justify-content:space-around;align-items:stretch;
}
.wb655-bottomnav-btn{
  flex:1;min-width:60px;min-height:60px;
  background:transparent;border:none;color:var(--wb655-muted);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:2px;cursor:pointer;transition:color .15s ease,transform .15s ease;
}
.wb655-bottomnav-btn i{font-size:2rem;}
.wb655-bottomnav-btn .material-icons{font-size:2.2rem;}
.wb655-bottomnav-btn span{font-size:1.05rem;font-weight:600;}
.wb655-bottomnav-btn:hover{color:var(--wb655-accent);transform:translateY(-2px);}
.wb655-bottomnav-btn.wb655-active{color:var(--wb655-accent);}
.wb655-bottomnav-btn.wb655-active i{filter:drop-shadow(0 0 6px rgba(173,255,47,.5));}

/* Hide bottom nav on desktop, show inline nav */
@media (min-width:769px){
  .wb655-bottomnav{display:none;}
  .wb655-main{padding-bottom:24px;}
  .wb655-container{max-width:760px;}
  .wb655-mobile-menu-inner{max-width:760px;}
  .wb655-footer-inner{max-width:760px;}
}

/* ---------- Back-to-top / utilities ---------- */
.wb655-hide{display:none !important;}
.wb655-text-accent{color:var(--wb655-accent);}
.wb655-text-muted{color:var(--wb655-muted);}
.wb655-divider{
  height:1px;background:linear-gradient(90deg,transparent,var(--wb655-border),transparent);
  margin:18px 0;
}
