/* ===========================================================
   Football Gold bet - design stylesheet
   Class prefix: pg72- | CSS vars: --pg72-*
   Palette: #00CED1 | #808080 | #DEB887 | #F4A460 | #262626 | #8B7355
   Mobile-first, max-width 430px
   =========================================================== */

:root{
  --pg72-primary:#00CED1;
  --pg72-gold:#DEB887;
  --pg72-gold-2:#F4A460;
  --pg72-brown:#8B7355;
  --pg72-grey:#808080;
  --pg72-bg:#262626;
  --pg72-bg-deep:#1a1a1a;
  --pg72-bg-soft:#303030;
  --pg72-text:#f3ece0;
  --pg72-text-dim:#cfc4b2;
  --pg72-line:#3a342c;
  --pg72-radius:14px;
  --pg72-shadow:0 6px 22px rgba(0,0,0,.45);
  --pg72-header-h:60px;
  --pg72-bottom-h:64px;
}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html{font-size:62.5%;}
body{
  margin:0;
  font-family:"Noto Sans Bengali","Hind Siliguri",system-ui,Segoe UI,Roboto,Arial,sans-serif;
  background:radial-gradient(circle at top,#303030 0%,var(--pg72-bg) 45%,var(--pg72-bg-deep) 100%);
  color:var(--pg72-text);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

a{color:var(--pg72-gold);text-decoration:none;}
a:hover{color:var(--pg72-primary);}
img{max-width:100%;display:block;}

.pg72-wrapper{
  width:100%;
  max-width:430px;
  margin:0 auto;
  position:relative;
  background:transparent;
}

/* ===== Header ===== */
.pg72-header{
  position:fixed;
  top:0;left:0;right:0;
  z-index:1000;
  height:var(--pg72-header-h);
  background:linear-gradient(90deg,#1f1f1f 0%,#2c2620 60%,#1f1f1f 100%);
  border-bottom:1px solid var(--pg72-line);
  box-shadow:0 2px 12px rgba(0,0,0,.5);
}
.pg72-header-inner{
  max-width:430px;margin:0 auto;
  height:100%;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 12px;
}
.pg72-brand{display:flex;align-items:center;gap:8px;}
.pg72-brand img{width:30px;height:30px;border-radius:8px;object-fit:cover;}
.pg72-brand b{font-size:14px;color:var(--pg72-gold);font-weight:700;letter-spacing:.2px;}
.pg72-brand small{display:block;font-size:9px;color:var(--pg72-primary);letter-spacing:.5px;}

.pg72-head-actions{display:flex;align-items:center;gap:8px;}
.pg72-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  min-height:34px;padding:0 14px;
  border:none;border-radius:20px;
  font-size:12px;font-weight:700;
  cursor:pointer;transition:.25s;
  text-decoration:none;
}
.pg72-btn-login{
  background:transparent;color:var(--pg72-gold);
  border:1px solid var(--pg72-gold);
}
.pg72-btn-login:hover{background:var(--pg72-gold);color:#1a1a1a;}
.pg72-btn-register{
  background:linear-gradient(90deg,var(--pg72-gold-2),var(--pg72-gold));
  color:#1a1a1a;box-shadow:0 3px 10px rgba(244,164,96,.35);
}
.pg72-btn-register:hover{transform:translateY(-1px);filter:brightness(1.08);}
.pg72-menu-btn{
  width:34px;height:34px;border-radius:50%;
  background:var(--pg72-bg-soft);color:var(--pg72-primary);
  border:1px solid var(--pg72-line);font-size:16px;
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer;
}

/* ===== Mobile dropdown menu ===== */
.pg72-mobile-menu{
  position:fixed;top:calc(var(--pg72-header-h));left:0;right:0;
  background:#1f1a14;border-bottom:1px solid var(--pg72-line);
  max-height:0;overflow:hidden;transition:max-height .35s ease;z-index:9999;
  box-shadow:var(--pg72-shadow);
}
.pg72-mobile-menu.pg72-open{max-height:520px;}
.pg72-mobile-menu-inner{
  max-width:430px;margin:0 auto;padding:8px 14px 14px;
  display:grid;grid-template-columns:1fr 1fr;gap:8px;
}
.pg72-mobile-menu a{
  display:flex;align-items:center;gap:8px;
  padding:11px 12px;border-radius:10px;
  background:var(--pg72-bg-soft);color:var(--pg72-text);
  font-size:12px;border:1px solid var(--pg72-line);
}
.pg72-mobile-menu a:hover{background:#3a3026;color:var(--pg72-gold);}
.pg72-mobile-menu a i{color:var(--pg72-primary);font-size:14px;}

/* ===== Main / Sections ===== */
.pg72-main{padding-top:calc(var(--pg72-header-h) + 10px);padding-bottom:30px;}
.pg72-section{padding:14px 12px;}
.pg72-section-title{
  display:flex;align-items:center;gap:8px;
  font-size:16px;font-weight:700;color:var(--pg72-gold);
  margin:6px 0 12px;letter-spacing:.3px;
}
.pg72-section-title i{color:var(--pg72-primary);}
.pg72-section-title em{margin-left:auto;font-size:11px;color:var(--pg72-primary);font-style:normal;font-weight:600;}

/* ===== Hero / Carousel ===== */
.pg72-hero{padding:14px 12px 6px;}
.pg72-carousel{
  position:relative;border-radius:16px;overflow:hidden;
  box-shadow:var(--pg72-shadow);border:1px solid var(--pg72-line);
}
.pg72-slides{display:flex;overflow:hidden;scroll-behavior:smooth;}
.pg72-slide{
  flex:0 0 100%;position:relative;cursor:pointer;
}
.pg72-slide img{width:100%;height:190px;object-fit:cover;}
.pg72-slide-cap{
  position:absolute;left:0;right:0;bottom:0;
  padding:24px 14px 12px;
  background:linear-gradient(transparent,rgba(0,0,0,.78));
  color:#fff;font-size:13px;font-weight:600;
}
.pg72-slide-cap span{color:var(--pg72-gold-2);}
.pg72-dots{
  position:absolute;bottom:8px;left:0;right:0;
  display:flex;justify-content:center;gap:6px;z-index:3;
}
.pg72-dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.4);}
.pg72-dot.pg72-active{background:var(--pg72-primary);width:18px;border-radius:5px;}

/* ===== H1 / intro ===== */
.pg72-h1{
  font-size:20px;line-height:1.35;color:#fff;
  margin:18px 12px 6px;font-weight:800;
}
.pg72-h1 span{color:var(--pg72-gold-2);}
.pg72-intro{
  font-size:13px;color:var(--pg72-text-dim);
  margin:0 12px 10px;line-height:1.6;
}

/* ===== Game grid ===== */
.pg72-cat-title{
  display:flex;align-items:center;gap:8px;
  margin:18px 12px 10px;
  font-size:15px;font-weight:700;color:var(--pg72-gold);
  border-left:4px solid var(--pg72-primary);padding-left:10px;
}
.pg72-cat-title i{color:var(--pg72-primary);}
.pg72-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
  padding:0 12px;
}
.pg72-game{
  background:var(--pg72-bg-soft);border:1px solid var(--pg72-line);
  border-radius:12px;overflow:hidden;cursor:pointer;
  transition:.25s;display:flex;flex-direction:column;
}
.pg72-game:hover{transform:translateY(-2px);border-color:var(--pg72-gold);box-shadow:var(--pg72-shadow);}
.pg72-game img{width:100%;aspect-ratio:1/1;object-fit:cover;background:#000;}
.pg72-game-name{
  font-size:11px;color:var(--pg72-text);text-align:center;
  padding:6px 4px;font-weight:600;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.pg72-game-cta{
  margin:0 4px 6px;padding:4px;border-radius:6px;
  background:linear-gradient(90deg,var(--pg72-gold-2),var(--pg72-gold));
  color:#1a1a1a;font-size:10px;font-weight:700;text-align:center;
}

/* ===== Promo CTA banner ===== */
.pg72-promo{
  margin:18px 12px;padding:16px;border-radius:16px;
  background:linear-gradient(120deg,#3a2c1c,#262626 70%);
  border:1px solid var(--pg72-gold);
  display:flex;align-items:center;gap:12px;box-shadow:var(--pg72-shadow);
}
.pg72-promo-icon{font-size:30px;color:var(--pg72-gold-2);}
.pg72-promo-txt{flex:1;}
.pg72-promo-txt b{display:block;font-size:14px;color:#fff;margin-bottom:2px;}
.pg72-promo-txt small{font-size:11px;color:var(--pg72-text-dim);}
.pg72-promo .pg72-btn{flex:0 0 auto;}

/* ===== SEO text + inner links ===== */
.pg72-seo{
  margin:14px 12px;padding:14px;border-radius:14px;
  background:var(--pg72-bg-soft);border:1px solid var(--pg72-line);
}
.pg72-seo h2{
  font-size:15px;color:var(--pg72-gold);margin:0 0 8px;font-weight:700;
}
.pg72-seo h3{font-size:13px;color:var(--pg72-primary);margin:12px 0 6px;}
.pg72-seo p{font-size:12.5px;color:var(--pg72-text-dim);margin:0 0 8px;line-height:1.65;}
.pg72-seo a{color:var(--pg72-gold-2);border-bottom:1px dashed var(--pg72-gold);}

/* ===== Footer ===== */
.pg72-footer{
  margin-top:18px;padding:20px 14px 30px;
  background:#1a1410;border-top:1px solid var(--pg72-line);
  color:var(--pg72-text-dim);
}
.pg72-footer-brand{
  display:flex;align-items:center;gap:8px;margin-bottom:8px;
}
.pg72-footer-brand img{width:26px;height:26px;border-radius:6px;}
.pg72-footer-brand b{color:var(--pg72-gold);font-size:13px;}
.pg72-footer p{font-size:11.5px;line-height:1.6;margin:0 0 12px;}
.pg72-footer-links{
  display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px;
}
.pg72-footer-links a{
  padding:9px 10px;border-radius:8px;font-size:11px;
  background:var(--pg72-bg-soft);border:1px solid var(--pg72-line);
  color:var(--pg72-text);text-align:center;
}
.pg72-footer-links a:hover{color:var(--pg72-gold);border-color:var(--pg72-gold);}
.pg72-footer-promos{
  display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px;
}
.pg72-footer-promos .pg72-btn{
  flex:1 1 45%;font-size:11px;min-height:36px;
}
.pg72-footer-copy{
  font-size:10.5px;text-align:center;color:var(--pg72-grey);
  border-top:1px solid var(--pg72-line);padding-top:10px;
}

/* ===== Bottom nav (mobile only) ===== */
.pg72-bottom-nav{
  position:fixed;bottom:0;left:0;right:0;z-index:1000;
  height:var(--pg72-bottom-h);
  background:linear-gradient(180deg,#2c2620,#1a1410);
  border-top:1px solid var(--pg72-gold);
  display:flex;justify-content:space-around;align-items:center;
  box-shadow:0 -4px 14px rgba(0,0,0,.55);
}
.pg72-bottom-nav a{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:2px;height:100%;color:var(--pg72-text-dim);
  font-size:10px;cursor:pointer;transition:.2s;position:relative;
  text-decoration:none;
}
.pg72-bottom-nav a.pg72-active{color:var(--pg72-primary);}
.pg72-bottom-nav a.pg72-promo-mark{color:var(--pg72-gold-2);}
.pg72-bottom-nav a i{font-size:22px;}
.pg72-bottom-nav a .material-icons,
.pg72-bottom-nav a .ion{font-size:22px;}
.pg72-bottom-nav a:active{transform:scale(.92);}
.pg72-bottom-nav a.pg72-promo-mark::after{
  content:"";position:absolute;top:6px;right:28%;
  width:7px;height:7px;border-radius:50%;background:#ff5a5a;
  box-shadow:0 0 6px #ff5a5a;
}

/* desktop: hide bottom nav, show desktop nav */
@media (min-width:769px){
  .pg72-bottom-nav{display:none;}
  .pg72-wrapper{max-width:768px;}
}
@media (max-width:768px){
  .pg72-main{padding-bottom:90px;}
  .pg72-footer{padding-bottom:84px;}
}