/* ============================================================
   vip bet (vip-bet.homes) - Core stylesheet
   Prefix: pg13-  |  Bangla / BD mobile-first design
   ============================================================ */

:root{
  --pg13-primary:#FFB347;     /* warm amber */
  --pg13-accent:#BF360C;      /* burnt crimson */
  --pg13-soft:#FAFAD2;        /* light cream */
  --pg13-bg:#1C2833;          /* deep charcoal */
  --pg13-lilac:#C9C9FF;       /* lavender */
  --pg13-card:#243447;
  --pg13-card-2:#2b3e54;
  --pg13-text:#FAFAD2;
  --pg13-muted:#b9c4d0;
  --pg13-line:rgba(255,179,71,.22);
  --pg13-radius:14px;
  --pg13-shadow:0 6px 22px rgba(0,0,0,.32);
}

*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
html{font-size:62.5%;}
body{
  font-family:"Noto Sans Bengali","Hind Siliguri",Segoe UI,system-ui,Arial,sans-serif;
  background:linear-gradient(160deg,#1C2833 0%,#222e3e 60%,#1a2530 100%);
  color:var(--pg13-text);
  line-height:1.5rem;
  font-size:1.5rem;
  max-width:430px;
  margin:0 auto;
  min-height:100vh;
  overflow-x:hidden;
}
img{display:block;max-width:100%;}
a{color:var(--pg13-primary);text-decoration:none;}
h1,h2,h3,h4{line-height:2.2rem;font-weight:700;color:var(--pg13-soft);}

/* ---------- Layout helpers ---------- */
.pg13-container{width:100%;padding:0 14px;}
.pg13-wrapper{padding:18px 14px;}
.pg13-section{padding:22px 14px;}
.pg13-center{text-align:center;}

/* ---------- Header ---------- */
.pg13-header{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  max-width:430px;margin:0 auto;
  background:rgba(28,40,51,.96);
  backdrop-filter:blur(10px);
  border-bottom:2px solid var(--pg13-primary);
  box-shadow:0 2px 12px rgba(0,0,0,.35);
}
.pg13-header-inner{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 12px;gap:8px;
}
.pg13-brand{display:flex;align-items:center;gap:8px;color:var(--pg13-soft);}
.pg13-logo{
  width:30px;height:30px;border-radius:8px;
  background:linear-gradient(135deg,#FFB347,#BF360C);
  display:flex;align-items:center;justify-content:center;
  color:#1C2833;font-weight:800;font-size:1.4rem;
}
.pg13-brand-name{font-size:1.7rem;font-weight:800;letter-spacing:.3px;}
.pg13-brand-name span{color:var(--pg13-primary);}
.pg13-header-actions{display:flex;align-items:center;gap:6px;}
.pg13-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 14px;border-radius:30px;font-size:1.3rem;font-weight:700;
  border:none;cursor:pointer;transition:transform .18s, box-shadow .18s;
  min-height:36px;
}
.pg13-btn:active{transform:scale(.96);}
.pg13-btn-login{
  background:transparent;color:var(--pg13-soft);
  border:1.5px solid var(--pg13-primary);
}
.pg13-btn-register{
  background:linear-gradient(135deg,#FFB347,#BF360C);
  color:#1C2833;box-shadow:0 3px 10px rgba(255,179,71,.35);
}
.pg13-menu-btn{
  background:transparent;border:none;color:var(--pg13-soft);
  font-size:2rem;cursor:pointer;padding:4px 6px;border-radius:8px;
}
.pg13-menu-btn:active{background:rgba(255,179,71,.15);}

/* ---------- Dropdown menu ---------- */
.pg13-nav{
  position:fixed;top:54px;left:0;right:0;z-index:9999;
  max-width:430px;margin:0 auto;
  background:rgba(28,40,51,.99);
  border-bottom:2px solid var(--pg13-primary);
  max-height:0;overflow:hidden;transition:max-height .3s ease;
}
.pg13-nav.open{max-height:560px;overflow-y:auto;}
.pg13-nav-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:10px 12px 16px;}
.pg13-nav-item{
  display:flex;align-items:center;gap:8px;
  padding:10px 12px;border-radius:10px;
  background:rgba(255,179,71,.08);
  color:var(--pg13-soft);font-size:1.35rem;font-weight:600;
}
.pg13-nav-item:active{background:rgba(255,179,71,.2);}
.pg13-nav-item i{color:var(--pg13-primary);font-size:1.7rem;}

/* ---------- Spacer under fixed header ---------- */
.pg13-header-spacer{height:58px;}

/* ---------- Hero carousel ---------- */
.pg13-hero{padding:14px 14px 4px;}
.pg13-carousel{
  position:relative;border-radius:var(--pg13-radius);overflow:hidden;
  box-shadow:var(--pg13-shadow);border:1px solid var(--pg13-line);
}
.pg13-slides{display:flex;scroll-snap-type:x mandatory;overflow-x:auto;scroll-behavior:smooth;}
.pg13-slides::-webkit-scrollbar{display:none;}
.pg13-slide{
  flex:0 0 100%;scroll-snap-align:center;position:relative;
  cursor:pointer;
}
.pg13-slide img{width:100%;height:200px;object-fit:cover;}
.pg13-slide-cap{
  position:absolute;left:0;right:0;bottom:0;
  padding:14px 14px 16px;
  background:linear-gradient(transparent,rgba(28,40,51,.92));
  color:var(--pg13-soft);
}
.pg13-slide-cap b{display:block;font-size:1.7rem;color:var(--pg13-primary);}
.pg13-slide-cap span{font-size:1.25rem;color:var(--pg13-lilac);}
.pg13-dots{display:flex;gap:6px;justify-content:center;padding:10px 0;}
.pg13-dot{width:8px;height:8px;border-radius:50%;background:rgba(250,250,210,.3);}
.pg13-dot.active{background:var(--pg13-primary);width:22px;border-radius:6px;}

/* ---------- Headings ---------- */
.pg13-section-title{
  display:flex;align-items:center;gap:8px;
  margin:18px 0 12px;font-size:1.8rem;color:var(--pg13-soft);
}
.pg13-section-title i{color:var(--pg13-primary);}
.pg13-section-title .pg13-more{
  margin-left:auto;font-size:1.25rem;color:var(--pg13-lilac);font-weight:500;
}

/* ---------- Game grid ---------- */
.pg13-cat-block{margin-bottom:6px;}
.pg13-cat-label{
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 12px;border-radius:20px;
  background:linear-gradient(135deg,#FFB347,#BF360C);
  color:#1C2833;font-size:1.3rem;font-weight:700;margin-bottom:10px;
}
.pg13-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
}
.pg13-grid-4{grid-template-columns:repeat(4,1fr);}
.pg13-card{
  background:var(--pg13-card);border-radius:12px;overflow:hidden;
  border:1px solid var(--pg13-line);transition:transform .18s;
  cursor:pointer;
}
.pg13-card:active{transform:scale(.95);}
.pg13-card-img{width:100%;aspect-ratio:1/1;object-fit:cover;background:#0e1620;}
.pg13-card-name{
  padding:6px 6px 8px;font-size:1.15rem;color:var(--pg13-soft);
  text-align:center;line-height:1.3rem;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

/* ---------- Promo banner ---------- */
.pg13-promo{
  display:flex;align-items:center;gap:10px;
  background:linear-gradient(120deg,#BF360C 0%,#FFB347 100%);
  border-radius:var(--pg13-radius);padding:14px 16px;margin:18px 14px;
  color:#1C2833;cursor:pointer;box-shadow:var(--pg13-shadow);
}
.pg13-promo:active{transform:scale(.98);}
.pg13-promo-icon{
  width:42px;height:42px;border-radius:50%;background:rgba(28,40,51,.25);
  display:flex;align-items:center;justify-content:center;font-size:2rem;
}
.pg13-promo b{font-size:1.55rem;display:block;}
.pg13-promo small{font-size:1.15rem;opacity:.85;}
.pg13-promo-cta{
  margin-left:auto;background:#1C2833;color:var(--pg13-primary);
  padding:7px 14px;border-radius:20px;font-weight:700;font-size:1.2rem;
}

/* ---------- Info / features ---------- */
.pg13-feat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;}
.pg13-feat{
  background:var(--pg13-card);border:1px solid var(--pg13-line);
  border-radius:12px;padding:14px;
}
.pg13-feat i{font-size:2.4rem;color:var(--pg13-primary);}
.pg13-feat h3{font-size:1.45rem;margin:6px 0 4px;color:var(--pg13-soft);}
.pg13-feat p{font-size:1.2rem;color:var(--pg13-muted);line-height:1.6rem;}

.pg13-article{
  background:var(--pg13-card);border:1px solid var(--pg13-line);
  border-radius:12px;padding:16px;margin-bottom:12px;
}
.pg13-article h2{font-size:1.65rem;margin-bottom:8px;color:var(--pg13-primary);}
.pg13-article h3{font-size:1.4rem;margin:10px 0 5px;color:var(--pg13-soft);}
.pg13-article p{font-size:1.3rem;color:var(--pg13-muted);line-height:1.85rem;margin-bottom:8px;}
.pg13-article a.pg13-inline{color:var(--pg13-primary);font-weight:600;border-bottom:1px dashed var(--pg13-primary);}

/* ---------- Testimonial ---------- */
.pg13-testimonials{display:grid;grid-template-columns:1fr;gap:10px;}
.pg13-testi{
  background:var(--pg13-card);border-left:3px solid var(--pg13-primary);
  border-radius:10px;padding:12px 14px;
}
.pg13-testi b{color:var(--pg13-soft);font-size:1.3rem;}
.pg13-testi .pg13-stars{color:var(--pg13-primary);font-size:1.2rem;margin:2px 0;}
.pg13-testi p{font-size:1.2rem;color:var(--pg13-muted);line-height:1.6rem;}

/* ---------- Payment ---------- */
.pg13-pay{display:flex;flex-wrap:wrap;gap:8px;}
.pg13-pay span{
  padding:7px 12px;border-radius:8px;background:var(--pg13-card-2);
  border:1px solid var(--pg13-line);font-size:1.2rem;color:var(--pg13-soft);
  display:inline-flex;align-items:center;gap:6px;
}
.pg13-pay i{color:var(--pg13-lilac);}

/* ---------- Winners ticker ---------- */
.pg13-winners{
  background:var(--pg13-card);border:1px solid var(--pg13-line);
  border-radius:12px;padding:10px 14px;margin-bottom:14px;
}
.pg13-winner{display:flex;align-items:center;gap:10px;padding:6px 0;border-bottom:1px dashed rgba(255,179,71,.15);}
.pg13-winner:last-child{border-bottom:none;}
.pg13-winner .pg13-ava{
  width:30px;height:30px;border-radius:50%;
  background:linear-gradient(135deg,#C9C9FF,#BF360C);
  display:flex;align-items:center;justify-content:center;color:#1C2833;font-weight:800;font-size:1.2rem;
}
.pg13-winner b{color:var(--pg13-primary);font-size:1.3rem;}
.pg13-winner small{color:var(--pg13-muted);font-size:1.15rem;margin-left:auto;}

/* ---------- App CTA ---------- */
.pg13-app-cta{
  background:linear-gradient(135deg,#1C2833,#2b3e54);
  border:1px solid var(--pg13-line);border-radius:var(--pg13-radius);
  padding:18px 16px;margin:14px;text-align:center;
}
.pg13-app-cta h3{font-size:1.7rem;color:var(--pg13-primary);margin-bottom:6px;}
.pg13-app-cta p{font-size:1.25rem;color:var(--pg13-muted);margin-bottom:12px;}
.pg13-app-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;}
.pg13-app-btns .pg13-btn{font-size:1.3rem;}

/* ---------- Big promo CTA ---------- */
.pg13-cta-big{
  display:block;text-align:center;margin:18px 14px;padding:18px;
  background:linear-gradient(135deg,#FFB347,#BF360C);color:#1C2833;
  border-radius:var(--pg13-radius);font-size:1.7rem;font-weight:800;
  box-shadow:var(--pg13-shadow);
}
.pg13-cta-big small{display:block;font-size:1.2rem;font-weight:500;margin-top:4px;}

/* ---------- Footer ---------- */
.pg13-footer{
  background:#15202b;border-top:2px solid var(--pg13-primary);
  padding:24px 14px 30px;margin-top:14px;
}
.pg13-footer .pg13-brand{justify-content:center;margin-bottom:14px;}
.pg13-footer-desc{
  text-align:center;font-size:1.2rem;color:var(--pg13-muted);
  line-height:1.7rem;margin-bottom:16px;
}
.pg13-footer-promos{
  display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:18px;
}
.pg13-footer-promos .pg13-btn{
  background:rgba(255,179,71,.12);color:var(--pg13-soft);
  border:1px solid var(--pg13-line);justify-content:center;font-size:1.2rem;
}
.pg13-footer-links{
  display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:16px;
}
.pg13-footer-links a{
  color:var(--pg13-muted);font-size:1.2rem;padding:4px 0;
}
.pg13-footer-links a:hover{color:var(--pg13-primary);}
.pg13-footer-copy{
  text-align:center;font-size:1.1rem;color:var(--pg13-muted);
  border-top:1px solid rgba(255,179,71,.15);padding-top:12px;
}
.pg18{display:none;}

/* ---------- Mobile bottom nav ---------- */
.pg13-bottom-nav{
  position:fixed;bottom:0;left:0;right:0;z-index:1000;
  max-width:430px;margin:0 auto;
  background:rgba(21,32,43,.98);
  backdrop-filter:blur(10px);
  border-top:2px solid var(--pg13-primary);
  display:flex;justify-content:space-around;align-items:stretch;
  height:62px;
}
.pg13-nav-btn{
  flex:1;min-width:60px;min-height:60px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:2px;background:transparent;border:none;color:var(--pg13-muted);
  cursor:pointer;padding:4px;transition:color .2s,transform .2s;
}
.pg13-nav-btn:active{transform:scale(.92);}
.pg13-nav-btn i{font-size:22px;}
.pg13-nav-btn .material-icons,.pg13-nav-btn .bi{font-size:22px;}
.pg13-nav-btn span{font-size:1rem;font-weight:600;}
.pg13-nav-btn.is-active{color:var(--pg13-primary);}
.pg13-nav-btn.is-promo{color:var(--pg13-primary);}
.pg13-nav-btn.is-promo i{filter:drop-shadow(0 0 6px rgba(255,179,71,.5));}

/* ---------- Responsive ---------- */
@media (min-width:769px){
  .pg13-bottom-nav{display:none;}
  .pg13-menu-btn{display:none;}
  body{max-width:430px;}
  main{padding-bottom:30px !important;}
}
@media (max-width:768px){
  main{padding-bottom:80px;}
}

/* ---------- Utility ---------- */
.pg13-hidden{display:none !important;}
.pg13-text-amber{color:var(--pg13-primary);}
.pg13-text-lilac{color:var(--pg13-lilac);}
