:root{
    --orange:#1f4e79;
    --orange-dark:#153a5c;
    --orange-light:#3f7fb0;
    --cream:#faf7f0;
    --text-dark:#213627;
    --text-muted:#5c6b60;
    --border:#cfe8d2;
    --green:#7cb518;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  body{
    font-family:'Segoe UI',Arial,sans-serif;
    color:var(--text-dark);
    background:#F7FDF8;
  }
  a{text-decoration:none;color:inherit;}
  ul{list-style:none;}
  img{max-width:100%;display:block;}
  .container{
    max-width:1300px;
    margin:0 auto;
    padding:0 20px;
  }

  /* ===== HEADER ===== */
  header{
    border-bottom:1px solid var(--border);
    background:#fff;
  }
  .header-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    padding:16px 20px;
    max-width:1300px;
    margin:0 auto;
    flex-wrap:wrap;
  }
  .logo{
    display:flex;
    align-items:center;
    gap:8px;
    font-weight:700;
    font-size:20px;
    color:var(--orange);
    white-space:nowrap;}

    .logo-img{
  height:38px;
  width:38px;
  object-fit:contain;
  display:block;
}
  
  .search-bar{
    flex:1;
    max-width:520px;
    display:flex;
    border:1px solid var(--border);
    border-radius:6px;
    overflow:hidden;
  }
  .search-bar input{
    flex:1;
    border:none;
    outline:none;
    padding:10px 14px;
    background:#f3f3f3;
    font-size:14px;
  }
  .search-bar button{
    border:none;
    background:#f3f3f3;
    padding:0 16px;
    cursor:pointer;
    color:var(--text-muted);
  }
  .header-icons{
    display:flex;
    align-items:center;
    gap:26px;
    font-size:13px;
    color:var(--text-dark);
  }
  .header-icons a{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:4px;
    position:relative;
  }
  .icon-badge{
    position:relative;
  }
  .icon-badge .badge{
    position:absolute;
    top:-6px;right:-10px;
    background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
    color:#fff;
    font-size:10px;
    width:16px;height:16px;
    border-radius:50%;
    display:flex;align-items:center;justify-content:center;
  }
  .icon-symbol{font-size:18px;}

  /* ===== Hero section ===== */

  .hero-wrapper{
  display:flex;
  gap:16px;
  width:100%;
  max-width:1366px;
  margin:0 auto;
  padding:16px;
  box-sizing:border-box;
}
.hero-carousel{
  position:relative;
  flex:2;
  overflow:hidden;
  border-radius:10px;
  aspect-ratio:16/7;
}
.carousel-track{
  display:flex;
  width:100%;
  height:100%;
  transition:transform .6s ease-in-out;
}
.carousel-slide{
  min-width:100%;
  height:100%;
}
.carousel-slide img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.carousel-dots{
  position:absolute;
  bottom:14px;
  left:24px;
  display:flex;
  gap:6px;
}
.carousel-dots span{
  width:9px;
  height:9px;
  border-radius:50%;
  background:rgba(255,255,255,0.6);
  cursor:pointer;
  transition:background .3s;
}
.carousel-dots span.active{
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
  width:22px;
  border-radius:5px;
}
.hero-offer{
  flex:1;
  border-radius:10px;
  overflow:hidden;
  aspect-ratio:16/7;
}
.hero-offer img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
@media(max-width:768px){
  .hero-wrapper{
    flex-direction:column;
  }
  .hero-carousel, .hero-offer{
    aspect-ratio:16/9;
  }
}

  /* ===== FEATURED CATEGORIES ===== */
  .section-title{
  text-align:center;
  font-size:30px;
  font-weight:700;
  letter-spacing:0.5px;
  margin:40px 0 35px;
  color:#1e3324;
  position:relative;
}
.section-title::after{
  content:"";
  display:block;
  width:60px;
  height:3px;
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
  margin:12px auto 0;
  border-radius:2px;
}
.categories-section{
  background:var(--cream);
  padding:40px 0;
  position:relative;
}
.categories-row{
  display:flex;
  justify-content:center;
  gap:30px;
  flex-wrap:nowrap;
  overflow-x:auto;
  scroll-behavior:smooth;
  padding:10px 5px;
  scrollbar-width:none;
}
.categories-row::-webkit-scrollbar{
  display:none;
}
.category-card{
  text-align:center;
  width:150px;
  flex-shrink:0;
}
.category-card .thumb{
  background:#fff;
  border-radius:12px;
  width:150px;height:150px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:10px;
  box-shadow:0 2px 6px rgba(0,0,0,0.05);
}
.category-card .thumb img{
  width:100%;
  height:100%;
  object-fit:contain;
}
.category-card p{
  margin-top:14px;
  font-size:17px;
  font-weight:700;
  color:#1e3324;
  text-align:center;
}
.slider-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:34px;height:34px;
  border-radius:50%;
  background:#fff;
  border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  color:var(--text-muted);
  z-index:2;
}
.slider-arrow.right{
  right:20px;
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
  color:#fff;
  border:none;
}
.slider-arrow.left{left:20px;}
.mini-cart{
  position:absolute;
  top:0;right:0;
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
  color:#fff;
  text-align:center;
  padding:10px 20px;
  border-radius:0 0 0 10px;
  font-size:13px;
}
.mini-cart .amount{
  background:#fff;
  color:var(--orange);
  font-weight:700;
  padding:4px 10px;
  margin-top:4px;
  border-radius:4px;
}

  /* ===== TOP SELLING PRODUCTS ===== */

  .product-card-link{
  text-decoration:none;
  color:inherit;
  display:block;
}
  .products-section{
    padding:40px 0;
  }
  .products-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
  }
  .product-card{
    display:flex;
    align-items:center;
    gap:20px;
    border:1px solid var(--border);
    border-radius:10px;
    padding:20px;
    position:relative;
    overflow:hidden;
    background:#fff;
  }
  .product-card img{
    width:250px;
    height:250px;
    object-fit:contain;
    background:#fff;
    border-radius:8px;
    flex-shrink:0;
    transition:transform .35s ease;
  }
  .product-card:hover img{
    transform:scale(1.08);
  }
  .product-card .badge-tag{
    position:absolute;
    top:0;right:0;
    background:#e63946;
    color:#fff;
    font-size:11px;
    padding:5px 10px;
    border-radius:0 10px 0 10px;
  }
  .product-info{
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
  .product-info h3{
    font-size:17px;
    color:#24402f;
    margin-bottom:10px;
  }
  .price{
    color:var(--orange);
    font-weight:700;
    font-size:18px;
  }
  .old-price{
    color:#aaa;
    text-decoration:line-through;
    font-weight:400;
    margin-left:8px;
    font-size:14px;
  }
  .save-tag{
    display:inline-block;
    background:#eef7de;
    color:var(--green);
    font-size:12px;
    padding:2px 8px;
    border-radius:4px;
    margin:8px 0;
  }
  .product-actions{
    display:flex;
    gap:10px;
    margin-top:14px;
    flex-wrap:wrap;
  }
  .btn{
    padding:10px 20px;
    border-radius:6px;
    font-size:14px;
    font-weight:600;
    cursor:pointer;
    display:flex;
    align-items:center;
    gap:6px;
    border:1px solid var(--orange);
    background:#fff;
    color:var(--orange);
  }
  .btn.filled{
    background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
    color:#fff;
  }

  .brands-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-top:40px;
    border-top:1px solid var(--border);
    padding-top:16px;
  }
  .brands-row h4{font-size:16px;}
  .see-all{color:var(--orange);font-size:13px;font-weight:600;}

  /* ===== PREMIUM DATES (Ajwa / Medjool / Sukkari card) ===== */
  .dates-section{
    padding:30px 0 50px;
  }
  .dates-header{
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
    border-bottom:1px solid var(--border);
    padding-bottom:12px;
    margin-bottom:24px;
  }
  .dates-header h2{
    font-size:26px;
    font-weight:800;
    color:#000;
    position:relative;
    padding-bottom:12px;
    text-align:center;
  }
  .dates-header h2::after{
    content:"";
    position:absolute;
    bottom:-13px;left:50%;
    transform:translateX(-50%);
    width:50px;height:3px;
    background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
  }
  .dates-header .see-all{
    position:absolute;
    right:0;
    top:50%;
    transform:translateY(-50%);
  }
  @media(max-width:768px){
    .dates-header .see-all{
      position:static;
      right:auto;
      top:auto;
      transform:none;
      display:inline-block;
      margin-top:8px;
    }
  }
  .dates-grid{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:18px;
  }
  .date-card{
    border:1px solid var(--border);
    border-radius:8px;
    padding:16px;
    text-align:left;
    position:relative;
    overflow:hidden;
  }
  .date-card .save-badge{
    position:absolute;
    top:10px;right:10px;
    background:var(--green);
    color:#fff;
    font-size:11px;
    padding:3px 8px;
    border-radius:4px;
  }
  .date-card img{
    width:100%;
    height:130px;
    object-fit:contain;
    margin-bottom:12px;
    transition:transform .35s ease;
  }
  .date-card:hover img{
    transform:scale(1.12);
  }
  .date-card h4{
    font-size:14px;
    font-weight:500;
    margin-bottom:8px;
    min-height:38px;
  }
  .dots{
    display:flex;
    justify-content:center;
    gap:6px;
    margin-top:24px;
  }
  .dots span{
    width:8px;height:8px;
    border-radius:50%;
    background:#ddd;
  }
  .dots span.active{background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);}

  /* ===== FASHION / SHOP CARD (T-shirt, Polo, Jeans ইত্যাদি) ===== */

.shop-link{
  text-decoration:none;
  color:inherit;
}

.shop-card{
  width:240px;
  height:auto;
  min-height:360px;
  background:#fff;
  border:1px solid #eee;
  border-radius:12px;
  padding:14px;
  padding-bottom:16px;
  text-align:center;
  box-shadow:0 2px 8px rgba(0,0,0,0.06);
  transition:box-shadow .25s, transform .25s;
  overflow:hidden;
  position:relative;
  display:flex;
  flex-direction:column;
}

.shop-card:hover{
  box-shadow:0 8px 22px rgba(0,0,0,0.12);
  transform:translateY(-3px);
}

/* ---- Badge (New Arrival / Save %) ---- */
.shop-card .badge-tag{
  position:absolute;
  top:10px;
  left:10px;
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
  color:#fff;
  font-size:11px;
  font-weight:700;
  padding:4px 10px;
  border-radius:5px;
  z-index:2;
}
.shop-card .badge-tag.save{
  background:var(--green);
  left:auto;
  right:10px;
}
.shop-card .badge-tag.off{
  background:linear-gradient(180deg,#ff5a5a,#d6224c);
  left:auto;
  right:10px;
}

/* ---- Image area: bigger + zoom on hover ---- */
.shop-card .img-wrap{
  width:100%;
  height:190px;
  border-radius:10px;
  overflow:hidden;
  background:#fafafa;
  margin-bottom:14px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.shop-card img{
  width:100%;
  height:100%;
  object-fit:contain;
  transition:transform .4s ease;
}
.shop-card:hover img{
  transform:scale(1.18);
}

/* ---- Title: force 2 lines, no cut-off look ---- */
.shop-card h4{
  font-size:15.5px;
  font-weight:700;
  color:#1e3324;
  margin:4px 0 8px;
  line-height:1.35;
  min-height:42px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* ---- Price ---- */
.shop-card .price{
  color:var(--orange);
  font-weight:800;
  font-size:18px;
  margin-bottom:10px;
}
.shop-card .price .old-price{
  color:#aaa;
  text-decoration:line-through;
  font-weight:400;
  font-size:13px;
  margin-left:6px;
}

/* ---- Two buttons: Cart (outline) + Buy (filled) ---- */
.shop-card-actions{
  display:flex;
  gap:8px;
  margin-top:auto;
}
.shop-card .btn{
  flex:1;
  padding:11px 6px;
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
  color:#fff;
  border:none;
  border-radius:8px;
  font-weight:700;
  font-size:13px;
  line-height:1;
  cursor:pointer;
  white-space:nowrap;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  transition:background .2s, transform .15s;
}
.shop-card .btn:hover{
  background:var(--orange-dark);
  transform:scale(1.03);
}
.shop-card .btn.outline{
  background:#fff;
  color:var(--orange);
  border:1.5px solid var(--orange);
}
.shop-card .btn.outline:hover{
  background:#fff7f0;
}

.fashion-carousel-wrapper{
  position:relative;
}
.fashion-carousel-row{
  display:flex;
  gap:22px;
  overflow-x:auto;
  scroll-behavior:smooth;
  scrollbar-width:none;
  padding:14px 44px;
}
.fashion-carousel-row::-webkit-scrollbar{
  display:none;
}
.fashion-carousel-row .shop-link{
  flex-shrink:0;
}

@media(max-width:600px){
  .shop-card{
    width:170px;
    min-height:310px;
    padding:10px;
  }
  .shop-card .img-wrap{
    height:140px;
  }
  .shop-card h4{
    font-size:13.5px;
    min-height:36px;
  }
  .shop-card .price{
    font-size:15px;
  }
  .shop-card .btn{
    font-size:11.5px;
    padding:9px 4px;
  }
}

/* ===== COMBO OFFERS — home page-r onno shob section theke intentionally
   different design (dark+gold theme), jate sobar chokhe age pore ===== */
.combo-section{
  padding:34px 0 46px;
  margin:8px 0 6px;
  background:linear-gradient(135deg,#241b3d 0%,#3b1f5c 45%,#5c1f45 100%);
  position:relative;
  overflow:hidden;
}
.combo-section::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 15% 20%, rgba(255,196,0,.18) 0%, transparent 45%),
    radial-gradient(circle at 85% 80%, rgba(255,90,120,.18) 0%, transparent 45%);
  pointer-events:none;
}
.combo-header{
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
  padding-bottom:2px;
}
.combo-header h2{
  font-size:26px;
  font-weight:800;
  color:#fff;
  position:relative;
  padding-bottom:12px;
  text-align:center;
  letter-spacing:.3px;
}
.combo-header h2 .spark{
  display:inline-block;
  animation:comboSpark 1.6s ease-in-out infinite;
}
@keyframes comboSpark{
  0%,100%{ transform:rotate(0deg) scale(1); }
  50%{ transform:rotate(-10deg) scale(1.18); }
}
.combo-header h2::after{
  content:"";
  position:absolute;
  bottom:0;left:50%;
  transform:translateX(-50%);
  width:60px;height:3px;
  background:linear-gradient(90deg,#ffd25a,#ff5a78);
  border-radius:3px;
}
.combo-header .see-all{
  position:absolute;
  right:20px;
  top:2px;
  color:#ffd25a;
  font-weight:700;
}
.combo-header .see-all:hover{
  color:#fff;
}
.combo-subtitle{
  display:block;
  text-align:center;
  color:rgba(255,255,255,.75);
  font-size:13px;
  margin:2px 0 22px;
  position:relative;
}

.combo-carousel-wrapper{
  position:relative;
}
.combo-row{
  display:flex;
  gap:22px;
  overflow-x:auto;
  scroll-behavior:smooth;
  scrollbar-width:none;
  padding:6px 44px 10px;
  position:relative;
}
.combo-row::-webkit-scrollbar{ display:none; }
.combo-row .shop-link{
  text-decoration:none;
  color:inherit;
  flex-shrink:0;
}

.combo-card{
  width:240px;
  flex-shrink:0;
  background:#fff;
  border-radius:14px;
  padding:14px;
  padding-bottom:16px;
  text-align:center;
  position:relative;
  overflow:hidden;
  box-shadow:0 10px 26px rgba(0,0,0,.28);
  border:2px solid #ffd25a;
  display:flex;
  flex-direction:column;
  transition:transform .25s, box-shadow .25s;
}
.combo-card:hover{
  transform:translateY(-5px) scale(1.015);
  box-shadow:0 16px 34px rgba(0,0,0,.35);
}
.combo-card .combo-ribbon{
  position:absolute;
  top:14px;
  left:-36px;
  transform:rotate(-45deg);
  background:linear-gradient(90deg,#ff5a78,#ff2f55);
  color:#fff;
  font-size:11px;
  font-weight:800;
  padding:4px 42px;
  letter-spacing:.5px;
  box-shadow:0 2px 6px rgba(0,0,0,.25);
  z-index:2;
}
.combo-card .badge-tag.save{
  position:absolute;
  top:10px;
  right:10px;
  background:linear-gradient(180deg,#2fbf71,#1e9c58);
  color:#fff;
  font-size:11px;
  font-weight:700;
  padding:4px 9px;
  border-radius:6px;
  z-index:2;
}
.combo-card .img-wrap{
  width:100%;
  height:180px;
  border-radius:10px;
  overflow:hidden;
  background:linear-gradient(180deg,#fff7e6,#fff);
  margin:10px 0 14px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.combo-card img{
  width:100%;
  height:100%;
  object-fit:contain;
  transition:transform .4s ease;
}
.combo-card:hover img{ transform:scale(1.15); }
.combo-card h4{
  font-size:15px;
  font-weight:700;
  color:#241b3d;
  margin:2px 0 8px;
  line-height:1.35;
  min-height:40px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.combo-card .price{
  color:#d6224c;
  font-weight:800;
  font-size:18px;
  margin-bottom:10px;
}
.combo-card .price .old-price{
  color:#aaa;
  text-decoration:line-through;
  font-weight:400;
  font-size:13px;
  margin-left:6px;
}
.combo-card-actions{
  display:flex;
  gap:8px;
  margin-top:auto;
}
.combo-card .btn{
  flex:1;
  padding:11px 6px;
  background:linear-gradient(90deg,#ffb347,#ff5a78);
  color:#fff;
  border:none;
  border-radius:8px;
  font-weight:700;
  font-size:13px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  transition:filter .2s, transform .15s;
}
.combo-card .btn:hover{ filter:brightness(1.06); transform:scale(1.03); }
.combo-card .btn.outline{
  background:#fff;
  color:#d6224c;
  border:1.5px solid #d6224c;
}
.combo-card .btn.outline:hover{ background:#fff5f7; }

/* combosall.html-er grid-e combo-card gula full-width e boshbe */
.category-grid .combo-card{ width:100%; height:auto; }

.combo-page-header{
  background:linear-gradient(135deg,#241b3d 0%,#3b1f5c 45%,#5c1f45 100%);
  padding:34px 20px 40px;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.combo-page-header::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 15% 20%, rgba(255,196,0,.18) 0%, transparent 45%),
    radial-gradient(circle at 85% 80%, rgba(255,90,120,.18) 0%, transparent 45%);
  pointer-events:none;
}
.combo-page-header .breadcrumb{
  position:relative;
  color:rgba(255,255,255,.8);
}
.combo-page-header .breadcrumb a{ color:#ffd25a; }
.combo-page-header h1{
  position:relative;
  color:#fff;
  font-size:30px;
  font-weight:800;
  margin-top:10px;
  padding-bottom:14px;
}
.combo-page-header h1::after{
  content:"";
  position:absolute;
  bottom:0;left:50%;
  transform:translateX(-50%);
  width:60px;height:3px;
  background:linear-gradient(90deg,#ffd25a,#ff5a78);
  border-radius:3px;
}
.combo-page-header p.tag{
  position:relative;
  color:rgba(255,255,255,.85);
  font-size:14px;
  margin-top:6px;
}

@media(max-width:600px){
  .combo-card{ width:172px; padding:10px; }
  .combo-card .img-wrap{ height:140px; }
  .combo-card h4{ font-size:13px; min-height:36px; }
  .combo-card .price{ font-size:15px; }
  .combo-card .btn{ font-size:11px; padding:9px 4px; }
  .combo-header h2{ font-size:21px; }
  .combo-header .see-all{ right:12px; font-size:12px; }
  .combo-page-header h1{ font-size:22px; }
}
  /* ===== BANNERS ===== */
  .banner-hero{
    padding:20px 0 0;
    text-align:center;
    position:relative;
  }
  .banner-hero img{
    width:100%;
    border-radius:6px;
  }
  .banner-dots{
    display:flex;
    justify-content:center;
    gap:6px;
    margin-bottom:10px;
  }
  .banner-dots span{
    width:7px;height:7px;
    border-radius:50%;
    background:#ddd;
  }
  .banner-dots span.active{background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);}

  .offer-row{
    display:grid;
    grid-template-columns:2fr 1fr;
    gap:20px;
    padding:30px 0;
  }
  .offer-card{
    border-radius:10px;
    overflow:hidden;
  }
  .offer-card img{width:100%;}

  /* ===== REVIEWS ===== */
  .reviews-section{
    background:var(--cream);
    padding:40px 0 50px;
    text-align:center;
  }
  .load-more-btn{
    border:1px solid var(--orange);
    color:var(--orange);
    background:#fff;
    padding:8px 26px;
    border-radius:20px;
    font-size:13px;
    cursor:pointer;
    margin-bottom:30px;
  }
  .review-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
  }
  .review-card{
    background:#fff;
    border-radius:10px;
    padding:22px;
    text-align:left;
    font-size:14px;
    color:#444;
  }
  .review-card p{
    margin-bottom:16px;
    line-height:1.5;
  }
  .stars{
    color:#f5b301;
    margin-bottom:14px;
    letter-spacing:2px;
  }
  .reviewer{
    display:flex;
    align-items:center;
    gap:12px;
  }
  .reviewer .avatar{
    width:40px;height:40px;
    border-radius:50%;
    background:#ddd;
    background-size:cover;
    background-position:center;
  }
  .reviewer .name{
    font-weight:600;
    font-size:14px;
    color:#24402f;
  }
  .reviewer .role{
    font-size:12px;
    color:var(--text-muted);
  }

  /* ===== FOOTER ===== */
  footer{
    padding:50px 0 0;
    border-top:1px solid var(--border);
  }
  .footer-grid{
    display:grid;
    grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;
    gap:30px;
    padding-bottom:30px;
  }
  .footer-brand .logo{margin-bottom:14px;}
  .footer-brand p{
    font-size:14px;
    color:var(--text-muted);
    line-height:1.6;
    margin-bottom:16px;
  }
  .footer-brand .contact-line{
    display:flex;
    gap:8px;
    align-items:center;
    font-size:14px;
    margin-bottom:10px;
    color:#444;
  }
  .social-icons{
    display:flex;
    gap:10px;
    margin-top:16px;
  }
  .social-icons a{
    width:32px;height:32px;
    border-radius:50%;
    background:#fbe4d2;
    color:var(--orange);
    display:flex;align-items:center;justify-content:center;
    font-size:14px;
  }
  .footer-col h4{
    font-size:15px;
    margin-bottom:16px;
    color:#24402f;
  }
  .footer-col ul li{
    margin-bottom:10px;
  }
  .footer-col ul li a{
    font-size:14px;
    color:var(--text-muted);
  }
  .footer-col ul li a:hover{color:var(--orange);}

  .app-download{
    margin-top:20px;
  }
  .app-download p{
    font-size:14px;
    margin-bottom:10px;
    font-weight:600;
  }
  .app-badges{
    display:flex;
    gap:10px;
  }
  .app-badges img{
    height:38px;
    border-radius:6px;
  }

  .footer-bottom{
    border-top:1px solid var(--border);
    padding:18px 0;
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:13px;
    color:var(--text-muted);
    flex-wrap:wrap;
    gap:14px;
  }
  .pay-icons{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
  }
  .pay-icons span{
    border:1px solid var(--border);
    border-radius:4px;
    padding:4px 8px;
    font-size:11px;
    color:#555;
  }

  @media(max-width:1000px){
    .products-grid{grid-template-columns:1fr;}
    .dates-grid{grid-template-columns:repeat(2,1fr);}
    .footer-grid{grid-template-columns:1fr 1fr;}
    .offer-row{grid-template-columns:1fr;}
    .review-grid{grid-template-columns:1fr;}
    .header-top{justify-content:center;}
  }
  @media(max-width:600px){
    .product-card{
      flex-direction:column;
      align-items:center;
      text-align:center;
    }
    .product-card img{
      width:150px;
      height:150px;
    }
  }
  /* ===== SINGLE PRODUCT DETAILS PAGE (tshirt.html, polo.html ইত্যাদি) ===== */
.product-page-wrapper{
  max-width:1100px;
  margin:20px auto;
  padding:0 20px;
  font-family:'Segoe UI',Arial,sans-serif;
}
.breadcrumb{
  font-size:13px;
  margin-bottom:10px;
}
.breadcrumb a{
  color:var(--orange);
  text-decoration:none;
}
.breadcrumb span{
  color:#999;
  margin:0 4px;
}

.product-details-card{
  display:flex;
  gap:40px;
  background:#fff;
  border-radius:10px;
  box-shadow:0 2px 10px rgba(0,0,0,0.06);
  padding:30px;
}

.product-gallery{
  display:flex;
  gap:12px;
  flex:1;
  position:relative;
}
.thumb-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.thumb-list .thumb{
  width:60px;height:60px;
  object-fit:cover;
  border:2px solid #ddd;
  border-radius:6px;
  cursor:pointer;
}
.thumb-list .thumb.active{
  border-color:var(--orange);
}
.main-image{
  flex:1;
  border:1px solid #eee;
  border-radius:8px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:380px;
  position:relative;
  cursor:zoom-in;
}
.main-image img{
  width:100%;
  height:100%;
  object-fit:contain;
  transition:transform .05s ease-out;
  will-change:transform;
}

.product-info{
  flex:1;
}
.product-info h1{
  font-size:20px;
  font-weight:600;
  color:#1e3324;
  margin-bottom:10px;
}
.price-row{
  margin-bottom:16px;
  padding-bottom:16px;
  border-bottom:1px solid #eee;
}
.current-price{
  font-size:24px;
  font-weight:700;
  color:var(--orange);
}

.quantity-row{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:20px;
}
.qty-control{
  display:flex;
  align-items:center;
  border:1px solid #ddd;
  border-radius:6px;
  overflow:hidden;
}
.qty-control button{
  width:32px;height:32px;
  border:none;
  background:#f5f5f5;
  cursor:pointer;
  font-size:16px;
}
.qty-control input{
  width:40px;
  text-align:center;
  border:none;
  border-left:1px solid #ddd;
  border-right:1px solid #ddd;
  height:32px;
}

.action-buttons{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:15px 0;
}
.action-buttons button,
.action-buttons a{
  flex:1 1 45%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 16px;
  border:none;
  border-radius:6px;
  font-size:15px;
  font-weight:bold;
  cursor:pointer;
  text-decoration:none;
  text-align:center;
}
.btn-add-cart{ background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%); color:#fff; }
.btn-buy-now{ background:#111827; color:#fff; }
.btn-whatsapp{ background:#22c55e; color:#fff; }
.btn-call{ background:#2563eb; color:#fff; }
.action-buttons button:hover,
.action-buttons a:hover{ opacity:.9; }

.brand-box{
  display:inline-block;
  border:1px solid #ddd;
  border-radius:6px;
  padding:8px 14px;
  font-size:13px;
  color:#555;
}

/* ---------- সাইজ সিলেক্টর (S / M / L / XL / XXL) — Fashion প্রোডাক্ট পেজ ---------- */
.size-row{
  margin-bottom:20px;
}
.size-row label{
  display:block;
  font-size:14px;
  font-weight:600;
  color:#333;
  margin-bottom:8px;
}
.size-options{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.size-btn{
  min-width:48px;
  height:40px;
  padding:0 14px;
  border:1.5px solid #ddd;
  border-radius:6px;
  background:#fff;
  color:#333;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  transition:all .15s ease;
}
.size-btn:hover{
  border-color:var(--orange);
}
.size-btn.active{
  background:var(--orange);
  border-color:var(--orange);
  color:#fff;
}
.size-error{
  display:none;
  margin-top:8px;
  font-size:13px;
  color:#c0392b;
}
.size-error.show{
  display:block;
}

/* ---------- সাইজ চিপ — Category listing পেজের প্রোডাক্ট কার্ডে (fashionall.html ইত্যাদি) ---------- */
.card-size-row{
  margin:8px 0 10px;
}
.card-size-label{
  display:block;
  font-size:12px;
  font-weight:600;
  color:#555;
  margin-bottom:5px;
}
.card-size-options{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
}
.size-chip{
  min-width:32px;
  height:28px;
  padding:0 8px;
  border:1.3px solid #ddd;
  border-radius:5px;
  background:#fff;
  color:#333;
  font-size:12px;
  font-weight:600;
  cursor:pointer;
  transition:all .15s ease;
}
.size-chip:hover{
  border-color:var(--orange);
}
.size-chip.active{
  background:var(--orange);
  border-color:var(--orange);
  color:#fff;
}
.card-size-error{
  display:none;
  margin-top:5px;
  font-size:11.5px;
  color:#c0392b;
}
.card-size-error.show{
  display:block;
}

@media(max-width:768px){
  .product-details-card{
    flex-direction:column;
  }
  .product-gallery{
    flex-direction:column-reverse;
  }
  .thumb-list{
    flex-direction:row;
  }
}

.product-description{
  background:#fff;
  max-width:100%;
  margin-top:25px;
  padding:25px 30px;
  border-radius:6px;
  box-shadow:0 1px 4px rgba(0,0,0,0.1);
}

.product-description h2{
  font-size:18px;
  color:#222;
  border-bottom:3px solid var(--orange);
  display:inline-block;
  padding-bottom:6px;
  margin-bottom:18px;
}

.product-description p{
  color:#444;
  line-height:1.7;
  font-size:15px;
  margin-bottom:20px;
}

.product-description h3{
  font-size:16px;
  color:#111;
  margin-bottom:12px;
}

.product-description ul{
  padding-left:20px;
  margin:0;
}

.product-description ul li{
  color:#444;
  font-size:15px;
  line-height:1.8;
  margin-bottom:6px;
}

.product-description ul li strong{
  color:#111;
}

/* ===== CATEGORY LANDING PAGE (fashion.html, honey.html ইত্যাদি) ===== */
.category-page-header{
  max-width:1300px;
  margin:24px auto 4px;
  padding:0 20px;
}
.category-page-header h1{
  font-size:28px;
  font-weight:800;
  color:#000;
  position:relative;
  padding-bottom:12px;
  text-align:center;
}
.category-page-header h1::after{
  content:"";
  position:absolute;
  bottom:0;left:50%;
  transform:translateX(-50%);
  width:50px;height:3px;
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
}
.category-grid{
  max-width:1300px;
  margin:20px auto 60px;
  padding:0 20px;
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));
  gap:22px;
}
.category-grid .shop-card{
  width:100%;
  height:auto;
}
@media(max-width:600px){
  .category-grid{grid-template-columns:repeat(2,1fr);gap:14px;}
}
/* ===== CHECKOUT / BUY NOW PAGE (buynow.html) ===== */
.checkout-body{
  background:#f4f6f8;
  min-height:100vh;
}
.checkout-header{
  background:#fff;
  border-bottom:1px solid var(--border);
  padding:18px 0 14px;
  text-align:center;
}
.checkout-header h1{
  font-size:22px;
  font-weight:700;
  color:#1e2a22;
  margin-bottom:6px;
}
.checkout-header .breadcrumb{
  font-size:13px;
  color:#999;
}
.checkout-header .breadcrumb a{
  color:var(--orange);
  font-weight:600;
}
.checkout-header .breadcrumb .sep{
  margin:0 6px;
  color:#bbb;
}
.checkout-header .breadcrumb .current{
  color:var(--orange);
  font-weight:600;
}

.checkout-wrapper{
  max-width:1200px;
  margin:22px auto 60px;
  padding:0 20px;
}
.checkout-topbar{
  background:#fff;
  border:1px solid var(--border);
  border-radius:8px;
  padding:14px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px;
  font-size:14px;
  margin-bottom:20px;
}
.checkout-topbar a{
  color:var(--orange);
  font-weight:600;
}
.checkout-auth-btns{
  display:flex;
  gap:10px;
}
.checkout-auth-btns button{
  padding:8px 22px;
  border-radius:6px;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
}
.checkout-auth-btns .btn-outline{
  background:#fff;
  border:1px solid var(--orange);
  color:var(--orange);
}
.checkout-auth-btns .btn-filled{
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
  border:1px solid var(--orange);
  color:#fff;
}

.checkout-grid{
  display:grid;
  grid-template-columns:1.6fr 1fr;
  gap:20px;
  align-items:start;
}
.checkout-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:8px;
  padding:20px 22px;
  margin-bottom:20px;
}
.checkout-card .card-title{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:15px;
  font-weight:700;
  color:#1e2a22;
  margin-bottom:16px;
}
.checkout-card .card-title .bar{
  width:3px;
  height:16px;
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
  border-radius:2px;
  display:inline-block;
}

/* ---- Order review ---- */
.order-item{
  display:flex;
  align-items:center;
  gap:14px;
  position:relative;
  padding-right:30px;
}
.order-item img{
  width:56px;
  height:56px;
  object-fit:contain;
  border:1px solid var(--border);
  border-radius:6px;
  background:#fafafa;
}
.order-item .order-item-info{
  flex:1;
  min-width:0;
}
.order-item .order-item-name{
  font-size:14px;
  font-weight:600;
  color:#2563eb;
  margin-bottom:6px;
}
.order-item .order-item-size{
  display:inline-block;
  font-size:11.5px;
  font-weight:600;
  color:#8a5a00;
  background:#fff4e0;
  border-radius:4px;
  padding:1px 7px;
  margin-bottom:6px;
}
.order-item .order-qty-row{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  color:#555;
}
.order-item .qty-control{
  display:flex;
  align-items:center;
  border:1px solid #ddd;
  border-radius:5px;
  overflow:hidden;
}
.order-item .qty-control button{
  width:24px;height:24px;
  border:none;
  background:#f5f5f5;
  cursor:pointer;
  font-size:13px;
}
.order-item .qty-control span{
  width:30px;
  text-align:center;
  font-size:13px;
  display:inline-block;
}
.order-item .order-item-price{
  font-weight:700;
  color:#1e2a22;
  font-size:14px;
  white-space:nowrap;
}
.order-item .remove-item{
  position:absolute;
  top:0;right:0;
  background:#e63946;
  color:#fff;
  width:22px;height:22px;
  border-radius:4px;
  border:none;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-size:12px;
}
.checkout-empty{
  font-size:14px;
  color:var(--text-muted);
  text-align:center;
  padding:14px 0;
}
.checkout-empty a{
  color:var(--orange);
  font-weight:600;
}

/* ---- Shipping / Billing form ---- */
.shipping-form{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.shipping-form input,
.shipping-form select{
  width:100%;
  border:1px solid #ddd;
  border-radius:6px;
  padding:11px 14px;
  font-size:13.5px;
  color:#333;
  outline:none;
  background:#fff;
}
.shipping-form input::placeholder{
  color:#c98a4a;
}
.shipping-form .phone-input{
  display:flex;
  border:1px solid #ddd;
  border-radius:6px;
  overflow:hidden;
}
.shipping-form .phone-input .country-code{
  display:flex;
  align-items:center;
  gap:4px;
  padding:0 12px;
  background:#f5f5f5;
  font-size:13px;
  border-right:1px solid #ddd;
}
.shipping-form .phone-input input{
  border:none;
  border-radius:0;
  min-width:0;
}
.shipping-form .two-col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.billing-card .card-title{
  cursor:pointer;
  justify-content:space-between;
  margin-bottom:0;
}
.billing-card .card-title .chevron{
  margin-left:auto;
  width:16px;height:16px;
  border:2px solid var(--orange);
  border-radius:50%;
  display:inline-block;
  transition:background .2s;
}
.billing-card .card-title .chevron.open{
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
}
.billing-body{
  margin-top:16px;
  font-size:13.5px;
  color:#555;
}
.billing-body label{
  display:flex;
  align-items:center;
  gap:8px;
}

/* ---- Payment method ---- */
.payment-options{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.pay-option{
  display:flex;
  align-items:center;
  gap:10px;
  border:1.5px solid #e2e2e2;
  border-radius:8px;
  padding:12px 14px;
  font-size:13.5px;
  font-weight:600;
  color:#333;
  cursor:pointer;
  position:relative;
  transition:border-color .2s, background .2s;
}
.pay-option input{
  display:none;
}
.pay-option .pay-icon{
  font-size:17px;
  display:flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  flex-shrink:0;
  background:#fff;
  border:1px solid #eee;
  border-radius:5px;
  padding:3px;
}
.pay-option .pay-icon img{
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:2px;
}
.pay-option.active{
  border-color:var(--orange);
  background:#fff7f0;
  color:var(--orange);
}
.pay-option .check-circle{
  margin-left:auto;
  width:16px;height:16px;
  border-radius:50%;
  border:2px solid #ddd;
}
.pay-option.active .check-circle{
  border-color:var(--orange);
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
}
.pay-option.active .check-circle::after{
  content:"✓";
  color:#fff;
  font-size:10px;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* ---- Coupon ---- */
.coupon-toggle{
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:13.5px;
  font-weight:600;
  color:var(--orange);
  cursor:pointer;
  padding:6px 0;
}
.coupon-body{
  display:flex;
  gap:10px;
  margin-top:12px;
}
.coupon-body input{
  flex:1;
  border:1px solid #ddd;
  border-radius:6px;
  padding:10px 12px;
  font-size:13px;
}
.coupon-body button{
  padding:10px 18px;
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
  color:#fff;
  border:none;
  border-radius:6px;
  font-weight:600;
  font-size:13px;
  cursor:pointer;
}

/* ---- Price summary ---- */
.price-summary{
  padding-top:0;
}
.price-summary .price-row{
  display:flex;
  justify-content:space-between;
  font-size:13.5px;
  color:#444;
  margin-bottom:10px;
}
.price-summary .price-row.total{
  font-weight:700;
  font-size:15px;
  color:#2563eb;
  border-top:1px solid var(--border);
  padding-top:10px;
  margin-top:4px;
}

/* ---- Special notes ---- */
.special-notes{
  margin-top:18px;
}
.special-notes label{
  font-size:13.5px;
  font-weight:600;
  color:#1e2a22;
  display:block;
  margin-bottom:8px;
}
.special-notes .optional{
  font-weight:400;
  color:#999;
}
.special-notes textarea{
  width:100%;
  border:1px solid #ddd;
  border-radius:6px;
  padding:10px 12px;
  font-size:13px;
  resize:vertical;
  min-height:60px;
  outline:none;
}
.special-notes .char-count{
  font-size:11px;
  color:#999;
  margin-top:4px;
  text-align:right;
}

/* ---- Terms + place order ---- */
.terms-check{
  display:flex;
  align-items:flex-start;
  gap:8px;
  font-size:12.5px;
  color:#555;
  margin:18px 0;
  line-height:1.5;
}
.terms-check input{
  margin-top:3px;
}
.terms-check a{
  color:var(--orange);
  font-weight:600;
}
.place-order-btn{
  width:100%;
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
  color:#fff;
  border:none;
  border-radius:6px;
  padding:14px;
  font-size:14px;
  font-weight:700;
  letter-spacing:0.5px;
  cursor:pointer;
  transition:background .2s;
}
.place-order-btn:hover{
  background:var(--orange-dark);
}

/* ---- Floating mini cart ---- */
.mini-cart-float{
  position:fixed;
  top:50%;
  right:0;
  transform:translateY(-50%);
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
  color:#fff;
  text-align:center;
  padding:12px 16px;
  border-radius:8px 0 0 8px;
  font-size:12px;
  font-weight:600;
  line-height:1.6;
  box-shadow:-2px 2px 8px rgba(0,0,0,0.15);
  z-index:50;
}

@media(max-width:900px){
  .checkout-grid{grid-template-columns:1fr;}
  .payment-options{grid-template-columns:1fr;}
  .shipping-form .two-col{grid-template-columns:1fr;}
  .mini-cart-float{
    position:static;
    transform:none;
    border-radius:8px;
    margin:0 20px 20px;
    display:inline-block;
  }
}

/* ---- Floating WhatsApp button (buynow.html) ---- */
.floating-whatsapp{
  position:fixed;
  bottom:38px;
  right:36px;
  width:62px;
  height:62px;
  background:#25D366;
  color:#fff;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:24px;
  box-shadow:0 6px 18px rgba(0,0,0,0.28);
  z-index:60;
  text-decoration:none;
  transition:transform .25s ease, box-shadow .25s ease;
}

.floating-whatsapp img{
  width:32px;
  height:32px;
  position:relative;
  z-index:2;
}

.floating-whatsapp::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  background:#25D366;
  z-index:1;
  animation:whatsappPulse 2.2s ease-out infinite;
}

@keyframes whatsappPulse{
  0%{ transform:scale(1); opacity:.55; }
  70%{ transform:scale(1.9); opacity:0; }
  100%{ transform:scale(1.9); opacity:0; }
}

.floating-whatsapp:hover{
  transform:translateY(-4px) scale(1.06);
  box-shadow:0 10px 24px rgba(0,0,0,0.35);
}

/* Messenger widget (Facebook-e generate kora) WhatsApp icon-er upore boshe
   jate overlap na hoy — Facebook nijei iframe control kore, tai eta
   best-effort push, sob browser-e nao kaj korte pare */
.fb_dialog.fb_dialog_advanced{
  bottom:108px !important;
}

/* ============================================================
   HEADER / LOGO / NAV / FOOTER UPGRADE
============================================================ */
  /* ---------- STICKY / FIXED HEADER ---------- */
  header{
    position: sticky;
    top: 0;
    z-index: 1000;
    background: #fff;
    transition: box-shadow .25s ease;
  }
  header.is-scrolled{
    box-shadow: 0 4px 14px rgba(0,0,0,.08);
  }

  /* ---------- LOGO (boro, glossy shine + animation) ---------- */
  .logo-link{
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    cursor: pointer;
  }
  .logo-img-wrap{
    position: relative;
    width: 62px;
    height: 62px;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.4);
    flex-shrink: 0;
  }
  .logo-img-wrap .logo-img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .35s ease;
  }
  .logo-link:hover .logo-img-wrap .logo-img{
    transform: scale(1.08);
  }
  .logo-img-wrap::after{
    content: '';
    position: absolute;
    top: 0;
    left: -150%;
    width: 55%;
    height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,.9), transparent);
    transform: skewX(-20deg);
    animation: logoShine 3.2s ease-in-out infinite;
  }
  @keyframes logoShine{
    0%   { left: -150%; }
    45%  { left: 150%; }
    100% { left: 150%; }
  }

  .logo-text{
    font-size: 34px;
    font-weight: 900;
    letter-spacing: .4px;
    white-space: nowrap;
    color: var(--orange);
  }
  @supports ((-webkit-background-clip: text) or (background-clip: text)){
    .logo-text{
      background: linear-gradient(90deg, #153a5c 0%, #3f7fb0 25%, #153a5c 50%, #3f7fb0 75%, #153a5c 100%);
      background-size: 250% auto;
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      color: transparent;
      animation: textShine 4.5s linear infinite;
    }
  }
  @keyframes textShine{
    to{ background-position: -250% center; }
  }

  .header-top{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 26px;
  }
  .header-top .header-icons{
    margin-left: auto;
  }

  @media (max-width: 640px){
    .logo-img-wrap{ width: 46px; height: 46px; border-radius: 10px; }
    .logo-text{ font-size: 25px; }
    .header-top{ gap: 14px; }
  }


  /* ============================================================
     MAIN NAV — single source of truth (আগে ৩ জায়গায় ছড়ানো ছিল,
     এখন সব একসাথে, যাতে desktop/mobile দুই জায়গায়ই consistent
     ও ভালো দেখায়। Item বেশি হলে horizontally scroll করে, আর
     ডান পাশে হালকা fade + arrow দেখায় যাতে বোঝা যায় আরও item আছে।
     ============================================================ */
  .main-nav{
    background: #1e3b26;
    border-top: 1px solid #14291a;
    border-bottom: 1px solid #14291a;
    position: relative;
  }
  .main-nav .nav-list{
    display: flex;
    align-items: center;
    gap: 2px;
    flex-wrap: nowrap;
    padding: 0 12px;
    margin: 0 auto;
    max-width: 1300px;
    justify-content: center;
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
  }
  .main-nav .nav-list::-webkit-scrollbar{ display:none; }
  .main-nav .nav-list li{ flex-shrink: 0; }
  .main-nav .nav-list li a{
    display: inline-block;
    color: #eef6ee;
    font-weight: 600;
    font-size: 13.5px;
    letter-spacing: .2px;
    padding: 12px 13px;
    border-radius: 8px;
    white-space: nowrap;
    transition: background .2s ease, color .2s ease, transform .15s ease;
  }
  .main-nav .nav-list li a:hover{
    background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
    color: #ffffff;
    transform: translateY(-1px);
  }
  .main-nav .nav-list li a.active{
    background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
    color: #ffffff;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(244,124,32,.35);
  }
  /* scroll করার আছে বোঝানোর জন্য ডানপাশে fade + arrow (JS দিয়ে
     .is-scrollable / .at-end টগল হয়, নিচে site-header.js এ) */
  .main-nav::after{
    content:"›";
    position:absolute; top:0; right:0; bottom:0;
    width:26px;
    display:flex; align-items:center; justify-content:center;
    color:#eef6ee; font-size:18px; font-weight:700;
    background:linear-gradient(to right, rgba(30,59,38,0), rgba(30,59,38,.95) 55%);
    pointer-events:none;
    opacity:0;
    transition:opacity .2s ease;
  }
  .main-nav.is-scrollable::after{ opacity:1; }
  .main-nav.at-end::after{ opacity:0; }

  @media (max-width: 768px){
    .main-nav .nav-list li a{ font-size:12.5px; padding:10px 11px; }
  }

  /* ---------- PROFESSIONAL FOOTER ---------- */
  footer{
    background: #14231b;
    color: #cfd8d2;
    padding: 60px 0 0;
    margin-top: 60px;
    font-family: inherit;
  }
  footer a{
    color: #cfd8d2;
    text-decoration: none;
    transition: color .2s ease, padding-left .2s ease;
  }
  footer a:hover{
    color: #ffffff;
    padding-left: 3px;
  }
  footer .container{
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
  }
  footer .footer-grid{
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 1fr 1.2fr;
    gap: 32px;
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(255,255,255,.08);
  }
  footer .footer-brand .logo{
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: .5px;
    color: #ffffff;
    margin-bottom: 14px;
  }
  footer .footer-brand .logo-icon{ font-size: 22px; }
  footer .footer-brand p{
    font-size: 14px;
    line-height: 1.7;
    color: #a9b5ae;
    margin-bottom: 16px;
  }
  footer .contact-line{
    font-size: 14px;
    color: #cfd8d2;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  footer .social-icons{
    display: flex;
    gap: 10px;
    margin-top: 18px;
  }
  footer .social-icons a{
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.18);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    transition: background .2s ease, border-color .2s ease, transform .2s ease;
  }
  footer .social-icons a:hover{
    background: #1f4e79;
    border-color: #1f4e79;
    color: #fff;
    padding-left: 0;
    transform: translateY(-2px);
  }
  footer .footer-col h4{
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .3px;
    margin-bottom: 18px;
    text-transform: uppercase;
  }
  footer .footer-col ul{
    list-style: none;
    margin: 0;
    padding: 0;
  }
  footer .footer-col ul li{
    margin-bottom: 12px;
    font-size: 14px;
  }
  footer .app-download{
    margin-top: 24px;
  }
  footer .app-download p{
    font-size: 13px;
    color: #a9b5ae;
    margin-bottom: 10px;
  }
  footer .app-badges{
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  footer .app-badges img{
    border-radius: 6px;
    width: 130px;
    display: block;
  }
  footer .footer-bottom{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 20px 0;
    font-size: 13px;
    color: #8f9c96;
  }
  footer .pay-icons{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
  }
  footer .pay-icons span{
    font-size: 12px;
    color: #14231b;
    background: #e9ede9;
    padding: 4px 10px;
    border-radius: 4px;
    font-weight: 600;
  }
  footer .pay-icons span:first-child{
    background: transparent;
    color: #a9b5ae;
    padding-left: 0;
    font-weight: 400;
  }

  @media (max-width: 900px){
    footer .footer-grid{
      grid-template-columns: 1fr 1fr;
    }
  }
  @media (max-width: 560px){
    footer .footer-grid{
      grid-template-columns: 1fr;
    }
    footer .footer-bottom{
      flex-direction: column;
      align-items: flex-start;
    }
  }

/* ============================================================
   HERO OFFER IMAGE
============================================================ */
.hero-offer{
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(0,0,0,.14);
  animation: heroOfferGlow 3.2s ease-in-out infinite;
}
.hero-offer img{
  transition: transform .6s ease;
}
.hero-offer:hover img{
  transform: scale(1.09);
}

.hero-offer::after{
  content: '';
  position: absolute;
  top: 0;
  left: -160%;
  width: 55%;
  height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,.55), transparent);
  transform: skewX(-20deg);
  animation: heroOfferShine 4.5s ease-in-out infinite;
  pointer-events: none;
  z-index: 2;
}
@keyframes heroOfferShine{
  0%   { left: -160%; }
  55%  { left: 160%; }
  100% { left: 160%; }
}

@keyframes heroOfferGlow{
  0%, 100% { box-shadow: 0 8px 22px rgba(0,0,0,.14); }
  50%      { box-shadow: 0 10px 30px rgba(244,124,32,.30); }
}

@media (max-width: 768px){
  .hero-offer{ border-radius: 10px; }
}

/* ============================================================
   AUDIO TRIGGER BANNER
============================================================ */
#audioTriggerBanner {
  position: fixed;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%) translateY(0);
  z-index: 99999;

  display: flex;
  align-items: center;
  gap: 10px;

  background: #1c1f1c;
  color: #eef1ec;
  border: 1px solid #333;
  border-radius: 999px;
  padding: 10px 18px;
  font-family: 'Segoe UI', 'Noto Sans Bengali', system-ui, sans-serif;
  font-size: 13px;

  box-shadow: 0 6px 20px rgba(0,0,0,.25);
  transition: opacity .35s ease, transform .35s ease;
  pointer-events: none;
}

#audioTriggerBanner.hidden {
  opacity: 0;
  transform: translateX(-50%) translateY(20px);
}

#audioTriggerBanner .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--orange);
  flex: none;
  animation: audioTriggerPulse 1.4s infinite;
}

#audioTriggerBanner.playing .dot {
  background: #3bae5b;
}

@keyframes audioTriggerPulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: .3; }
}

@media (max-width: 480px) {
  #audioTriggerBanner {
    font-size: 12px;
    padding: 8px 14px;
    bottom: 12px;
  }
}
.search-results{
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  right:0;
  background:#fff;
  border:1px solid var(--border);
  border-radius:8px;
  box-shadow:0 8px 24px rgba(0,0,0,0.12);
  max-height:420px;
  overflow-y:auto;
  z-index:2000;
  display:none;
}
.search-results.active{ display:block; }
.search-result-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 14px;
  border-bottom:1px solid #f2f2f2;
  text-decoration:none;
  color:inherit;
}
.search-result-item:last-child{ border-bottom:none; }
.search-result-item:hover{ background:#fff7f0; }
.search-result-item img{
  width:44px;height:44px;
  object-fit:contain;
  border-radius:6px;
  background:#fafafa;
  flex-shrink:0;
}
.search-result-item .sr-info{ flex:1; min-width:0; }
.search-result-item .sr-name{
  font-size:14px;
  font-weight:600;
  color:#1e3324;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.search-result-item .sr-price{
  font-size:13px;
  color:var(--orange);
  font-weight:700;
  margin-top:2px;
}
.search-no-result{
  padding:16px;
  text-align:center;
  color:var(--text-muted);
  font-size:14px;
}
.section-subtitle{
  display:block;
  text-align:center;
  font-size:14px;
  font-weight:500;
  color:var(--text-muted);
  margin-top:-24px;
  margin-bottom:30px;
}
.dates-header .section-subtitle{
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%);
  margin-top:2px;
  white-space:nowrap;
}

/* ============================================================
   HEADER DROPDOWNS FIX — Track Order / More
   (age eita CSS-e chilo na bole panel duita shorbokhon
   khola thakto — ekhon default hidden, click korle khulbe)
============================================================ */
.header-dropdown{
  position:relative;
}
.header-icon-trigger{
  cursor:pointer;
  user-select:none;
}
.header-dropdown-panel{
  position:absolute;
  top:calc(100% + 14px);
  right:0;
  background:#fff;
  border:1px solid var(--border);
  border-radius:8px;
  box-shadow:0 8px 24px rgba(0,0,0,0.12);
  padding:16px;
  width:240px;
  z-index:2000;
  display:none;
}
.header-dropdown-panel.active{
  display:block;
}
.header-dropdown-panel .dropdown-title{
  font-size:13px;
  font-weight:700;
  color:#1e3324;
  margin-bottom:10px;
}
.header-dropdown-panel input{
  width:100%;
  padding:9px 12px;
  border:1px solid #ddd;
  border-radius:6px;
  font-size:13px;
  margin-bottom:10px;
  outline:none;
  box-sizing:border-box;
}
.header-dropdown-panel button{
  width:100%;
  padding:9px;
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
  color:#fff;
  border:none;
  border-radius:6px;
  font-weight:600;
  font-size:13px;
  cursor:pointer;
}
.header-dropdown-panel button:hover{
  background:var(--orange-dark);
}
.header-dropdown-panel.menu-panel{
  padding:8px;
  width:200px;
}
.header-dropdown-panel.menu-panel a{
  display:block;
  padding:10px 12px;
  font-size:14px;
  color:#333;
  border-radius:6px;
}
.header-dropdown-panel.menu-panel a:hover{
  background:#fff7f0;
  color:var(--orange);
}
@media(max-width:640px){
  .header-dropdown-panel{
    right:-40px;
  }
}

/* ===== FINAL MOBILE RESPONSIVE (দেশেরহাট) ===== */

@media (max-width:768px){

  .checkout-wrapper,
  .container{
    width:95%;
    margin:auto;
    padding:15px;
  }

  .checkout-grid{
    display:flex;
    flex-direction:column;
    gap:18px;
  }

  .checkout-left,
  .checkout-right{
    width:100%;
  }

  .checkout-card{
    padding:15px;
    border-radius:12px;
  }

  .checkout-header{
    padding:18px 15px;
    text-align:center;
  }

  .checkout-header h1{
    font-size:26px;
  }

  .breadcrumb{
    font-size:13px;
    justify-content:center;
    flex-wrap:wrap;
  }

  .checkout-topbar{
    flex-direction:column;
    gap:12px;
    text-align:center;
  }

  .checkout-auth-btns{
    width:100%;
    display:flex;
    gap:10px;
  }

  .checkout-auth-btns button{
    flex:1;
  }

  .two-col{
    display:flex;
    flex-direction:column;
    gap:12px;
  }

  .shipping-form input,
  .shipping-form select,
  .shipping-form textarea{
    width:100%;
  }

  .phone-input{
    display:flex;
  }

  .country-code{
    min-width:72px;
  }

  .order-item{
    display:flex;
    align-items:center;
    gap:8px;
    position:relative;
    flex-wrap:wrap;
  }

  .order-item img{
    width:60px;
    height:60px;
    object-fit:cover;
    border-radius:8px;
    flex-shrink:0;
  }

  .order-item-info{
    flex:1;
    min-width:0;
  }

  .order-qty-row{
    flex-wrap:wrap;
    row-gap:6px;
  }

  .order-item-price{
    font-weight:bold;
    white-space:nowrap;
  }

  .qty-control button{
    width:30px;
    height:30px;
  }

  .remove-item{
    position:absolute;
    right:0;
    top:0;
  }

  .price-summary .price-row{
    display:flex;
    justify-content:space-between;
    padding:8px 0;
  }

  .place-order-btn{
    width:100%;
    padding:15px;
    font-size:16px;
  }

  .coupon-body{
    flex-direction:column;
    gap:10px;
  }

  .coupon-body input,
  .coupon-body button{
    width:100%;
  }

  .floating-whatsapp{
    width:56px;
    height:56px;
    font-size:22px;
    right:20px;
    bottom:26px;
  }
  .floating-whatsapp img{
    width:28px;
    height:28px;
  }

  table{
    display:block;
    overflow-x:auto;
    white-space:nowrap;
  }

}

/* ============================================================
   MOBILE — SITE-WIDE (একটাই clean block, আগের সব সাংঘর্ষিক
   mobile media query মুছে এখানে একসাথে করা হলো)
============================================================ */
@media (max-width:768px){

  /* সব পেজে horizontal overflow/scroll আটকানোর safety-net —
     কোনো element ভুলবশত viewport-এর চেয়ে চওড়া হয়ে গেলেও
     পুরো পেজ ডানে skew/cut হয়ে যাবে না */
  html, body{
    overflow-x:hidden;
    max-width:100%;
  }

  /* ---- Header ---- */
  .header-top{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:10px 12px;
  }
  .logo-link{ gap:8px; }
  .logo-img-wrap{
    width:46px;
    height:46px;
    border-radius:10px;
  }
  .logo-text{ font-size:24px; }

  .search-bar{
    /* মোবাইলে সার্চ বক্স লুকানো — লোগো ও মেনু আইকনগুলো এক লাইনে বেশি
       জায়গা পাবে, header টা বেশি clean/professional দেখাবে।
       ডেস্কটপে (768px এর উপরে) এটা স্বাভাবিকভাবেই দেখা যাবে। */
    display:none;
  }

  .header-icons{
    gap:18px;
    font-size:12px;
  }
  .header-icons a{ gap:2px; }
  .header-dropdown-panel{
    right:-30px;
    width:220px;
  }

  /* ---- Hero ---- */
  .hero-wrapper{ padding:10px; gap:10px; }

  /* ---- Featured Categories ---- */
  .categories-row{
    justify-content:flex-start;
    gap:14px;
    padding:8px;
  }
  .category-card{ width:110px; }
  .category-card .thumb{ width:110px; height:110px; }
  .category-card p{ font-size:13px; }

  /* ---- Top Selling Products (2 columns) ---- */
  .products-grid{
    grid-template-columns:repeat(2,1fr);
    gap:12px;
  }
  .product-card{
    flex-direction:column;
    text-align:center;
    padding:12px;
    gap:10px;
  }
  .product-card img{
    width:100%;
    height:130px;
  }
  .product-info h3{ font-size:13px; }
  .price{ font-size:15px; }
  .product-actions{
    flex-direction:column;
    width:100%;
    gap:6px;
  }
  .product-actions .btn{
    width:100%;
    justify-content:center;
    padding:9px;
    font-size:12.5px;
  }

  /* ---- Category rows / shop cards use their own 600px block above, untouched ---- */

  /* ---- Page paddings ---- */
  .product-page-wrapper,
  .category-page-header{
    padding-left:12px;
    padding-right:12px;
  }
}

@media (max-width:480px){
  .logo-img-wrap{ width:40px; height:40px; }
  .logo-text{ font-size:19px; }
  .search-bar{ height:36px; }
  .header-icons{ gap:12px; font-size:11px; }
  .category-card{ width:92px; }
  .category-card .thumb{ width:92px; height:92px; }
}

/* ---- Featured Categories auto-scroll: laptop+mobile উভয়েই কাজ করবে,
   overflow-x visible/scrollable থাকা নিশ্চিত করা হলো ---- */
.categories-row{
  overflow-x:auto !important;
  scroll-behavior:smooth;
}
/* AI Try On Button Fix */
.shop-card-actions{
    display:flex;
    align-items:center;
    gap:6px;
    flex-wrap:nowrap;
}

.shop-card-actions .btn{
    white-space:nowrap;
}

.ai-try-btn{
    width:auto !important;
    padding:8px 12px !important;
    margin-top:8px;
    display:inline-flex !important;
    justify-content:center;
    align-items:center;
}

/* Mobile fix */
@media(max-width:768px){
    .shop-card-actions{
        flex-wrap:wrap;
    }
}
.shop-card-actions{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:5px;
    flex-wrap:wrap;
}

.shop-card-actions .btn,
.dh-ai-btn{
    font-size:12px !important;
    padding:7px 8px !important;
    height:auto !important;
    min-width:auto !important;
    white-space:nowrap;
}

.dh-ai-btn{
    background:#008f4c;
    color:white;
    border:none;
    border-radius:6px;
    cursor:pointer;
}
/* ===== Cart drawer + Try-On button styles — ekhon shob product page-e shared (product-render.js use kore) ===== */

/* ============================================================
   SHOPPING CART DRAWER — desherhat.html-er sathe milie
   (jate cart consistent dekhay shob page e)
============================================================ */
.icon-badge{ cursor:pointer; }

.cart-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  opacity:0;
  visibility:hidden;
  transition:opacity .25s ease;
  z-index:9998;
}
.cart-overlay.active{
  opacity:1;
  visibility:visible;
}

.cart-drawer{
  position:fixed;
  top:0;
  right:0;
  height:100%;
  width:400px;
  max-width:92vw;
  background:#fff;
  box-shadow:-4px 0 24px rgba(0,0,0,.15);
  transform:translateX(100%);
  transition:transform .3s ease;
  z-index:9999;
  display:flex;
  flex-direction:column;
}
.cart-drawer.active{
  transform:translateX(0);
}

.cart-drawer-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 18px;
  border-bottom:1px solid #eee;
  flex-shrink:0;
}
.cart-drawer-header span:first-child{
  font-weight:700;
  font-size:14px;
  letter-spacing:.5px;
}
.cart-drawer-header button{
  background:none;
  border:none;
  font-size:13px;
  color:#333;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:4px;
}

.cart-items{
  flex:1;
  overflow-y:auto;
  padding:8px 16px;
}
.cart-empty{
  text-align:center;
  color:#888;
  font-size:13px;
  padding:40px 10px;
}
.cart-item-row{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:14px 0;
  border-bottom:1px solid #f0f0f0;
  position:relative;
}
.cart-item-row img{
  width:56px;
  height:56px;
  object-fit:cover;
  border-radius:8px;
  border:1px solid #eee;
  flex-shrink:0;
}
.cart-item-info{
  flex:1;
  min-width:0;
}
.cart-item-name{
  font-size:13.5px;
  font-weight:600;
  color:#222;
  margin-bottom:4px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.cart-item-size{
  display:inline-block;
  font-size:11.5px;
  font-weight:600;
  color:#8a5a00;
  background:#fff4e0;
  border-radius:4px;
  padding:1px 7px;
  margin-bottom:8px;
}
.cart-item-qty-row{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.qty-control{
  display:flex;
  align-items:center;
  border:1px solid #e2e2e2;
  border-radius:20px;
  overflow:hidden;
}
.qty-control button{
  border:none;
  background:#fafafa;
  width:26px;
  height:26px;
  font-size:14px;
  cursor:pointer;
  color:#333;
}
.qty-control span{
  width:26px;
  text-align:center;
  font-size:13px;
}
.cart-item-calc{
  font-size:12px;
  color:#777;
}
.cart-item-remove{
  background:none;
  border:none;
  font-size:16px;
  color:#999;
  cursor:pointer;
  padding:0 2px;
}
.cart-item-remove:hover{
  color:#d81f1f;
}

.cart-footer{
  padding:14px 16px 18px;
  border-top:1px solid #eee;
  flex-shrink:0;
}
.cart-total-row{
  display:flex;
  justify-content:space-between;
  font-size:14px;
  font-weight:700;
  color:#222;
  margin-bottom:12px;
}
.cart-checkout-btn{
  width:100%;
  border:none;
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
  color:#fff;
  font-size:14px;
  font-weight:700;
  letter-spacing:.5px;
  padding:13px 0;
  border-radius:8px;
  cursor:pointer;
}
.cart-checkout-btn:hover{
  filter:brightness(0.95);
}
/* ===== TRY-ON Button ===== */
.btn-tryon{
  display:block;
  width:100%;
  background:linear-gradient(90deg,#7c3aed,#6d28d9);
  color:#fff;
  text-decoration:none;
  text-align:center;
  padding:14px 16px;
  border-radius:10px;
  font-weight:700;
  font-size:15px;
  margin-top:12px;
  transition:.25s;
  box-sizing:border-box;
}

.btn-tryon:hover{
  background:linear-gradient(90deg,#6d28d9,#5b21b6);
  transform:translateY(-1px);
}
  

/* ===== STATIC INFO / POLICY PAGES ===== */
.static-page-content{
  max-width:900px;
  margin:0 auto;
  padding:10px 20px 60px;
  line-height:1.9;
  color:var(--text-dark);
}
.static-page-content h2{
  color:var(--orange);
  margin:28px 0 12px;
  font-size:20px;
}
.static-page-content h2:first-child{
  margin-top:0;
}
.static-page-content p{
  margin:0 0 14px;
  color:#3a473e;
}
.static-page-content ul, .static-page-content ol{
  margin:0 0 14px;
  padding-left:22px;
  color:#3a473e;
}
.static-page-content ul{ list-style:disc; }
.static-page-content ol{ list-style:decimal; }
.static-page-content li{ margin-bottom:6px; }
.static-page-content .info-box{
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  padding:18px 20px;
  margin:0 0 18px;
}
.static-page-content a.inline-link{
  color:var(--orange);
  font-weight:600;
  text-decoration:underline;
}
.static-page-content .contact-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:16px;
  margin:0 0 20px;
}
.static-page-content .contact-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  padding:18px;
  text-align:center;
}
.static-page-content .contact-card .ico{
  font-size:26px;
  margin-bottom:8px;
}
.faq-item{
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  margin-bottom:12px;
  overflow:hidden;
}
.faq-q{
  padding:16px 18px;
  font-weight:700;
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:var(--text-dark);
}
.faq-q::after{
  content:"+";
  font-size:20px;
  color:var(--orange);
  flex-shrink:0;
  margin-left:12px;
}
.faq-item.open .faq-q::after{ content:"−"; }
.faq-a{
  max-height:0;
  overflow:hidden;
  transition:max-height .25s ease;
  padding:0 18px;
  color:#3a473e;
}
.faq-item.open .faq-a{
  max-height:400px;
  padding:0 18px 16px;
}

/* ============================================================
   STOCK OUT FREEZE — admin panel (স্টক ম্যানেজার) theke kono
   product "Stock Out" mark korle, ei style-ta apply hoy (see
   site-header.js o product-render.js). Lal border diye clearly
   bujha jay j product-ta ekhon kena jabe na. Buttons nijeder
   disabled/opacity JS diye set hoy — এখানে শুধু border/cursor.
============================================================ */
.dh-stock-out{
  border:2px solid #dc3545 !important;
  border-radius:10px;
  position:relative;
}
.dh-stock-out button{
  cursor:not-allowed !important;
}

/* ============================================================
   RELATED PRODUCTS + REVIEWS SECTION — product-render.js
   সাইটের এক্সিস্টিং ডিজাইন টোকেন (var(--orange), var(--cream) etc.)
   ব্যবহার করা হয়েছে, যাতে বাকি সাইটের সাথে রংমিল থাকে।
============================================================ */

.dh-related-section, .dh-reviews-section{
  max-width:1300px;
  margin:26px auto 0;
  padding:0 20px 30px;
}
.dh-related-section h2, .dh-reviews-section h2{
  font-size:20px;
  color:var(--text-dark);
  margin-bottom:16px;
  border-bottom:2px solid var(--border);
  padding-bottom:10px;
}

/* --- Related products grid --- */
.dh-related-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(160px, 1fr));
  gap:16px;
}
.dh-related-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:12px;
  overflow:hidden;
  display:block;
  transition:box-shadow .2s ease, transform .2s ease;
}
.dh-related-card:hover{
  box-shadow:0 8px 20px rgba(0,0,0,.08);
  transform:translateY(-2px);
}
.dh-related-card img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
}
.dh-related-name{
  font-size:13.5px;
  color:var(--text-dark);
  padding:8px 10px 0;
  min-height:36px;
}
.dh-related-price{
  font-size:14px;
  font-weight:bold;
  color:var(--orange);
  padding:4px 10px 10px;
}

/* --- Reviews summary + list --- */
.dh-reviews-summary{
  font-size:15px;
  color:var(--text-dark);
  margin-bottom:16px;
}
.dh-avg-stars{
  color:#f39c12;
  font-size:18px;
  letter-spacing:1px;
  margin-right:4px;
}
.dh-reviews-list{
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-bottom:24px;
}
.dh-review-item{
  background:var(--cream);
  border:1px solid var(--border);
  border-radius:10px;
  padding:14px 16px;
}
.dh-review-item-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
}
.dh-review-item-top strong{
  color:var(--text-dark);
  font-size:14.5px;
}
.dh-review-item-stars{
  color:#f39c12;
  font-size:14px;
  letter-spacing:1px;
}
.dh-review-item p{
  margin-top:6px;
  color:var(--text-muted);
  font-size:14px;
  line-height:1.6;
}
.dh-review-item-date{
  display:block;
  margin-top:6px;
  font-size:12px;
  color:#999;
}

/* --- Review submission form --- */
.dh-review-form-box{
  background:#fff;
  border:1px solid var(--border);
  border-radius:12px;
  padding:20px;
  max-width:520px;
}
.dh-review-form-box h3{
  font-size:16px;
  color:var(--text-dark);
  margin-bottom:12px;
}
.dh-star-input{
  font-size:26px;
  color:#f39c12;
  cursor:pointer;
  margin-bottom:14px;
  letter-spacing:4px;
}
.dh-star-input span{
  transition:transform .1s ease;
}
.dh-star-input span:hover{
  transform:scale(1.15);
  display:inline-block;
}
#dhReviewForm input[type="text"],
#dhReviewForm textarea{
  width:100%;
  padding:11px 14px;
  border:1px solid var(--border);
  border-radius:8px;
  font-family:inherit;
  font-size:14px;
  margin-bottom:12px;
  resize:vertical;
}
#dhReviewForm textarea{
  min-height:90px;
}
.dh-review-submit-btn{
  background:var(--orange);
  color:#fff;
  border:none;
  padding:12px 22px;
  border-radius:8px;
  font-weight:bold;
  font-size:14px;
  cursor:pointer;
}
.dh-review-submit-btn:hover{
  background:var(--orange-dark);
}
.dh-review-msg{
  margin-top:10px;
  font-size:13.5px;
  font-weight:bold;
}

@media (max-width:600px){
  .dh-related-grid{ grid-template-columns:repeat(2, 1fr); }
}

/* ============================================================
   COUPON BOX — buynow.html checkout card-এর ভেতরে
============================================================ */
.coupon-box{
  display:flex;
  gap:8px;
  margin-bottom:6px;
}
.coupon-box input{
  flex:1;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:8px;
  font-family:inherit;
  font-size:13.5px;
  text-transform:uppercase;
}
.coupon-box button{
  background:var(--green);
  color:#fff;
  border:none;
  padding:0 18px;
  border-radius:8px;
  font-weight:bold;
  font-size:13.5px;
  cursor:pointer;
}
.coupon-box button:hover{
  opacity:.9;
}
.coupon-msg{
  font-size:12.5px;
  font-weight:bold;
  margin-bottom:14px;
  min-height:14px;
}

/* ============================================================
   নিচের ব্লকটা আগে ৯টা category page-র <head>-এ আলাদা আলাদা
   ভাবে বসানো ছিল (duplicate) — এখন এখানে একবারই আছে, তাই
   browser cache করতে পারবে আর প্রতি page ছোট হবে।
============================================================ */

/* ============================================================
   SHOPPING CART DRAWER — desherhat.html-er sathe milie
   (jate cart consistent dekhay shob page e)
============================================================ */
.icon-badge{ cursor:pointer; }

.cart-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  opacity:0;
  visibility:hidden;
  transition:opacity .25s ease;
  z-index:9998;
}
.cart-overlay.active{
  opacity:1;
  visibility:visible;
}

.cart-drawer{
  position:fixed;
  top:0;
  right:0;
  height:100%;
  width:400px;
  max-width:92vw;
  background:#fff;
  box-shadow:-4px 0 24px rgba(0,0,0,.15);
  transform:translateX(100%);
  transition:transform .3s ease;
  z-index:9999;
  display:flex;
  flex-direction:column;
}
.cart-drawer.active{
  transform:translateX(0);
}

.cart-drawer-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 18px;
  border-bottom:1px solid #eee;
  flex-shrink:0;
}
.cart-drawer-header span:first-child{
  font-weight:700;
  font-size:14px;
  letter-spacing:.5px;
}
.cart-drawer-header button{
  background:none;
  border:none;
  font-size:13px;
  color:#333;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:4px;
}

.cart-items{
  flex:1;
  overflow-y:auto;
  padding:8px 16px;
}
.cart-empty{
  text-align:center;
  color:#888;
  font-size:13px;
  padding:40px 10px;
}
.cart-item-row{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:14px 0;
  border-bottom:1px solid #f0f0f0;
  position:relative;
}
.cart-item-row img{
  width:56px;
  height:56px;
  object-fit:cover;
  border-radius:8px;
  border:1px solid #eee;
  flex-shrink:0;
}
.cart-item-info{
  flex:1;
  min-width:0;
}
.cart-item-name{
  font-size:13.5px;
  font-weight:600;
  color:#222;
  margin-bottom:8px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.cart-item-qty-row{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.qty-control{
  display:flex;
  align-items:center;
  border:1px solid #e2e2e2;
  border-radius:20px;
  overflow:hidden;
}
.qty-control button{
  border:none;
  background:#fafafa;
  width:26px;
  height:26px;
  font-size:14px;
  cursor:pointer;
  color:#333;
}
.qty-control span{
  width:26px;
  text-align:center;
  font-size:13px;
}
.cart-item-calc{
  font-size:12px;
  color:#777;
}
.cart-item-remove{
  background:none;
  border:none;
  font-size:16px;
  color:#999;
  cursor:pointer;
  padding:0 2px;
}
.cart-item-remove:hover{
  color:#d81f1f;
}

.cart-footer{
  padding:14px 16px 18px;
  border-top:1px solid #eee;
  flex-shrink:0;
}
.cart-total-row{
  display:flex;
  justify-content:space-between;
  font-size:14px;
  font-weight:700;
  color:#222;
  margin-bottom:12px;
}
.cart-checkout-btn{
  width:100%;
  border:none;
  background:linear-gradient(180deg,var(--orange-light) 0%,var(--orange) 55%,var(--orange-dark) 100%);
  color:#fff;
  font-size:14px;
  font-weight:700;
  letter-spacing:.5px;
  padding:13px 0;
  border-radius:8px;
  cursor:pointer;
}
.cart-checkout-btn:hover{
  filter:brightness(0.95);
}


/* ============================================================
   MOBILE CATEGORY NAV — auto one-by-one scrolling
   Desktop layout remains unchanged; only mobile gets the
   automatic category movement requested for the header.
============================================================ */
@media (max-width:768px){
  .main-nav .nav-list{
    justify-content:flex-start;
    max-width:none;
    width:100%;
    gap:6px;
    padding:0 10px;
    overflow-x:auto;
    scroll-snap-type:x proximity;
  }

  .main-nav .nav-list li a{
    scroll-snap-align:start;
    border-radius:0;
  }

  /* On phones, hide the desktop-style right fade/arrow because
     the categories move automatically one after another. */
  .main-nav::after{
    display:none !important;
  }

  .main-nav.mobile-auto-nav .nav-list{
    overflow-x:auto;
  }

  .main-nav.mobile-auto-nav .nav-list li a:hover{
    transform:none;
  }
}

/* ============================================================
   HOME — TOP SELLING MOBILE POLISH
   Keeps the 2-column layout but gives the area below each image
   a clean, balanced and readable layout on small screens.
============================================================ */
@media (max-width:768px){
  .products-section .products-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    align-items:stretch;
  }

  .products-section .product-card{
    width:100%;
    min-width:0;
    box-sizing:border-box;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    gap:7px;
    padding:8px;
    border-radius:8px;
  }

  .products-section .product-card img{
    display:block;
    width:100%;
    height:112px;
    object-fit:contain;
    border-radius:6px;
    flex:0 0 112px;
  }

  .products-section .product-info{
    width:100%;
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:4px;
    flex:1;
  }

  .products-section .product-info h3{
    margin:0;
    min-height:30px;
    font-size:11.5px;
    line-height:1.25;
    font-weight:600;
    text-align:center;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
  }

  .products-section .price{
    margin:0;
    min-height:19px;
    font-size:13px;
    line-height:1.3;
    font-weight:700;
    text-align:center;
  }

  .products-section .product-actions{
    display:flex;
    flex-direction:column;
    width:100%;
    gap:4px;
    margin-top:auto;
  }

  .products-section .product-actions .btn{
    width:100%;
    min-height:26px;
    box-sizing:border-box;
    justify-content:center;
    padding:5px 3px;
    font-size:9px;
    line-height:1.1;
    white-space:nowrap;
    border-radius:4px;
  }
}

@media (max-width:380px){
  .products-section .products-grid{gap:8px;}
  .products-section .product-card{padding:7px;}
  .products-section .product-card img{height:100px;flex-basis:100px;}
  .products-section .product-info h3{font-size:10.5px;}
  .products-section .price{font-size:12px;}
  .products-section .product-actions .btn{font-size:8.5px;padding:4px 2px;}
}