@font-face{
  font-family:'PkNum';
  src:url('../fonts/pk-num.woff2') format('woff2');
  font-weight:400 800;
  font-display:swap;
  unicode-range:U+09E6-09EF,U+09F3,U+002C,U+002E,U+002D,U+0020,U+0025;
}

/* ══════════════════════════════════════════════════════════
   Paikariz — style.css
   অনুমোদিত ডেমো ডিজাইন অনুযায়ী
   ══════════════════════════════════════════════════════════ */

:root {
  --green:#0F6E56; --green-dark:#0B5443; --green-deep:#062E26; --green-mid:#0B4438;
  --tint:#E1F5EE; --tint-soft:#9FE1CB; --tint-dim:#7FB3A2;
  --amber:#EF9F27; --amber-hover:#E59520; --amber-dark:#412402; --amber-mid:#7A4A0A;
  --red:#E24B4A; --red-dark:#A32D2D; --red-soft:#FCEBEB;
  --text:#1E1E1C; --muted:#5F5E5A; --light:#8A8880; --faint:#ABA9A0;
  --bg:#F5F6F3; --line:#E7E5DF; --white:#fff; --img:#F0F0EC;
  --wrap:1360px;
  --r-sm:10px; --r-md:13px; --r-lg:16px; --r-xl:20px;
  --sh:0 1px 2px rgba(30,30,28,.04), 0 4px 14px rgba(30,30,28,.05);
  --sh-lift:0 4px 10px rgba(30,30,28,.06), 0 12px 28px rgba(30,30,28,.08);
}

* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body {
  font-family:'Hind Siliguri', system-ui, -apple-system, sans-serif;
  font-size:15px; line-height:1.7; color:var(--text); background:var(--bg);
  overflow-x:hidden; padding-bottom:calc(70px + env(safe-area-inset-bottom,0px));
}
h1,h2,h3,h4 { font-family:'Anek Bangla','Hind Siliguri',sans-serif; font-weight:600; line-height:1.35; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
button, input, select, textarea { font-family:inherit; font-size:inherit; }
button { border:0; cursor:pointer; background:none; }

.wrap { max-width:var(--wrap); margin:0 auto; padding:0 16px; }
.pad  { max-width:var(--wrap); margin:0 auto; padding:0 16px; }
.sec  { max-width:var(--wrap); margin:0 auto; padding:30px 16px 0; }
.center { text-align:center; }
.row { display:flex; align-items:center; }
.between { justify-content:space-between; }
.gap-12 { gap:12px; }
.scroll-x { display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; }
.scroll-x::-webkit-scrollbar { display:none; }

/* ───────── হেডার ───────── */
.header {
  position:sticky; top:0; z-index:80;
  background:rgba(255,255,255,.94); backdrop-filter:saturate(160%) blur(10px);
  border-bottom:1px solid var(--line);
}
.header-in { max-width:var(--wrap); margin:0 auto; padding:0 16px; height:58px; display:flex; align-items:center; gap:16px; }
.logo { display:flex; align-items:center; gap:9px; flex:0 0 auto; }
.logo-mark { width:30px; height:30px; border-radius:10px; background:var(--green); color:#fff; display:grid; place-items:center; font-size:16px; }
.logo-text { font-family:'Anek Bangla'; font-size:19px; font-weight:600; color:var(--green-dark); letter-spacing:.2px; }
.logo img { height:48px; width:auto; }
.head-search { flex:1; position:relative; display:none; }
.head-search i { position:absolute; left:15px; top:50%; transform:translateY(-50%); font-size:18px; color:var(--faint); }
.head-search input { width:100%; height:42px; padding:0 16px 0 42px; border:1px solid var(--line); border-radius:21px; background:var(--bg); font-size:14px; outline:none; }
.head-search input:focus { border-color:var(--green); background:#fff; }
.desk-nav { display:none; gap:24px; font-size:14.5px; color:var(--muted); }
.desk-nav a.on { color:var(--green-dark); font-weight:600; }
.header-icons { margin-left:auto; display:flex; align-items:center; gap:14px; font-size:21px; color:var(--muted); }
.cart-ico { position:relative; }
.cart-badge {
  position:absolute; top:-5px; right:-7px; min-width:17px; height:17px; padding:0 4px;
  background:var(--red); color:#fff; border-radius:9px; font-size:10px; font-weight:600;
  display:none; place-items:center;
}
.cart-badge.on { display:grid; }

/* ───────── হিরো ───────── */
.hero { background:var(--green-deep); border-radius:var(--r-xl); padding:26px 22px; position:relative; overflow:hidden; margin-top:14px; }
.hero-title { font-size:26px; color:#fff; margin-top:14px; }
.hero-title span { color:var(--amber); }
.hero-sub { font-size:13px; color:var(--tint-soft); margin:9px 0 18px; line-height:1.8; }
.hero-art { display:none; }

/* ───────── পিল / ব্যাজ ───────── */
.pill { display:inline-block; font-size:11px; font-weight:600; padding:5px 13px; border-radius:20px; }
.pill-amber { background:var(--amber); color:var(--amber-dark); }
.pill-tint  { background:var(--tint); color:var(--green-dark); }
.pill-red   { background:var(--red); color:#fff; }

/* ───────── বাটন ───────── */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:13px 22px; border-radius:var(--r-md); font-size:14px; font-weight:600;
  transition:transform .13s ease, background .18s ease;
}
.btn:active { transform:scale(.97); }
.btn-amber { background:var(--amber); color:var(--amber-dark); }
.btn-amber:hover { background:var(--amber-hover); }
.btn-green { background:var(--green); color:#fff; }
.btn-green:hover { background:var(--green-dark); }
.btn-soft  { background:var(--tint); color:var(--green-dark); }
.btn-line  { background:#fff; border:1px solid var(--line); color:var(--muted); }
.btn-block { display:flex; width:100%; }
.btn-sm { padding:9px 15px; font-size:12.5px; border-radius:var(--r-sm); }
.btn:disabled { opacity:.6; cursor:not-allowed; }

.btn-stack {
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  background:var(--amber); border-radius:var(--r-md); padding:9px 16px; text-align:left;
  transition:transform .13s ease, background .18s ease;
}
.btn-stack:hover { background:var(--amber-hover); }
.btn-stack:active { transform:scale(.98); }
.btn-stack .t { font-size:14.5px; font-weight:700; color:var(--amber-dark); line-height:1.35; }
.btn-stack .s { font-size:10.5px; color:var(--amber-mid); }
.btn-stack .arrow { width:32px; height:32px; flex:0 0 32px; border-radius:11px; background:var(--amber-dark); color:var(--amber); display:grid; place-items:center; font-size:16px; }

/* ───────── ক্যাটাগরি ───────── */
.cat-row { display:flex; gap:8px; overflow-x:auto; padding:22px 0 6px; scrollbar-width:none; }
.cat-row::-webkit-scrollbar { display:none; }
.cat-item { flex:0 0 auto; width:74px; text-align:center; }
.cat-ico { width:52px; height:52px; margin:0 auto; border-radius:18px; background:#fff; box-shadow:var(--sh); color:var(--green); font-size:22px; display:grid; place-items:center; transition:transform .16s ease; }
.cat-item:active .cat-ico { transform:scale(.93); }
.cat-name { display:block; margin-top:8px; font-size:11px; color:var(--muted); line-height:1.4; }

/* ───────── ট্রাস্ট ───────── */
.trust-row { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-top:16px; }
.trust-item { background:#fff; border-radius:14px; padding:13px 6px; text-align:center; box-shadow:var(--sh); }
.trust-item i { font-size:20px; color:var(--green); }
.trust-item span { display:block; margin-top:6px; font-size:11px; line-height:1.5; color:var(--muted); }

/* ───────── সেকশন হেড ───────── */
.sec-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:14px; }
.sec-title { font-family:'Anek Bangla'; font-size:19px; font-weight:600; }
.sec-sub { font-size:12.5px; color:var(--muted); }
.sec-link { font-size:12.5px; color:var(--green); font-weight:600; }

/* ───────── প্রোডাক্ট কার্ড ───────── */
.grid-2 { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
.p-card { display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:12px; overflow:hidden; transition:border-color .18s ease, box-shadow .2s ease; }
.p-card:hover { border-color:var(--faint); box-shadow:var(--sh); }
.p-thumb { position:relative; display:block; aspect-ratio:1/1; background:#fff; overflow:hidden; }
.p-thumb img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:6%; }
.p-img2 { opacity:0; transition:opacity .28s ease; }
.p-card:hover .p-img2 { opacity:1; }
.p-noimg { position:absolute; inset:0; display:grid; place-items:center; color:var(--faint); font-size:28px; }
.p-badge { position:absolute; top:8px; left:8px; z-index:2; font-size:10px; font-weight:600; padding:3px 8px; border-radius:7px; background:var(--red); color:#fff; letter-spacing:.2px; }
.p-badge.new { background:var(--tint); color:var(--green-dark); }
.p-out { position:absolute; inset:0; z-index:3; background:rgba(255,255,255,.22); display:grid; place-items:center; pointer-events:none; }
.p-out-in { display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,.96); color:var(--red-dark); border:1px solid rgba(0,0,0,.07); border-radius:999px; padding:7px 14px; font-size:12.5px; font-weight:700; box-shadow:0 3px 12px rgba(0,0,0,.12); white-space:nowrap; }
.p-out-in i { font-size:15px; vertical-align:-2px; }
.p-body { display:flex; flex-direction:column; padding:9px 10px 11px; flex:1; }
.p-name { font-size:11.5px; line-height:1.5; color:var(--text); height:35px; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.p-price { display:flex; align-items:baseline; gap:6px; margin-top:7px; flex-wrap:wrap; }
.p-now { font-size:16px; font-weight:700; color:var(--green-dark); letter-spacing:.2px; }
.p-old { font-size:11px; color:var(--faint); text-decoration:line-through; }
.p-save { display:block; font-size:10px; color:var(--red-dark); margin-top:3px; min-height:15px; }

/* ───────── সার্চ ও চিপ ───────── */
.search-bar { position:relative; display:flex; align-items:center; }
.search-bar > i { position:absolute; left:15px; font-size:18px; color:var(--faint); }
.search-bar input { width:100%; height:46px; padding:0 42px; background:#fff; border:1px solid var(--line); border-radius:23px; font-size:14px; outline:none; }
.search-bar input:focus { border-color:var(--green); }
.search-clear { position:absolute; right:15px; color:var(--faint); font-size:17px; }
.chip { flex:0 0 auto; font-size:12.5px; padding:9px 16px; border-radius:20px; background:#fff; color:var(--muted); border:1px solid var(--line); white-space:nowrap; }
.chip.active { background:var(--green); color:#fff; border-color:var(--green); font-weight:600; }
.sort-select { border:1px solid var(--line); background:#fff; border-radius:var(--r-sm); padding:8px 11px; font-size:12.5px; color:var(--muted); outline:none; }

/* ───────── শপ সাইডবার ───────── */
.shop-wrap { display:block; }
.shop-side { display:none; }

/* ───────── প্রোডাক্ট পেজ ───────── */
.pdp { display:grid; gap:18px; max-width:var(--wrap); margin:0 auto; padding:16px 16px 0; }
.pdp-media { margin:0 -16px; }
.slider { position:relative; aspect-ratio:1/1; background:var(--img); overflow:hidden; touch-action:pan-y; cursor:grab; user-select:none; }
.slider.grabbing { cursor:grabbing; }
.track { display:flex; height:100%; will-change:transform; transition:transform .34s cubic-bezier(.22,.61,.36,1); }
.track.nodrag { transition:none; }
.slide { flex:0 0 100%; height:100%; display:grid; place-items:center; pointer-events:none; }
.slide img { width:100%; height:100%; object-fit:contain; padding:6%; }
.sl-nav { position:absolute; top:50%; transform:translateY(-50%); width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.55); color:var(--text); display:grid; place-items:center; font-size:19px; transition:background .18s ease, transform .14s ease; }
.sl-nav:hover { background:rgba(255,255,255,.9); }
.sl-nav:active { transform:translateY(-50%) scale(.92); }
.sl-nav.prev { left:10px; }
.sl-nav.next { right:10px; }
.sl-count { position:absolute; bottom:12px; right:12px; background:rgba(30,30,28,.55); color:#fff; font-size:11px; padding:3px 11px; border-radius:20px; }
.sl-back { position:absolute; top:12px; left:12px; width:34px; height:34px; border-radius:12px; background:rgba(255,255,255,.92); color:var(--text); display:grid; place-items:center; font-size:17px; }
.sl-dots { position:absolute; bottom:14px; left:50%; transform:translateX(-50%); display:flex; gap:5px; }
.sl-dots span { width:6px; height:3px; border-radius:2px; background:#CFCDC6; transition:width .22s ease, background .22s ease; }
.sl-dots span.on { width:18px; background:var(--green); }
.pd-thumbs { display:flex; gap:8px; margin:11px 16px 0; overflow-x:auto; scrollbar-width:none; }
.pd-thumbs::-webkit-scrollbar { display:none; }
.pd-thumbs button { flex:0 0 auto; width:58px; height:58px; border-radius:12px; background:#fff; border:2px solid transparent; box-shadow:var(--sh); overflow:hidden; padding:5px; transition:border-color .18s ease; }
.pd-thumbs button.on { border-color:var(--green); }
.pd-thumbs img { width:100%; height:100%; object-fit:contain; }
.hint-swipe { margin:10px 16px 0; font-size:11px; color:var(--light); text-align:center; }
.hint-swipe i { font-size:14px; vertical-align:-2px; }

.pd-title { font-size:22px; margin-top:12px; line-height:1.45; }
.pd-short { font-size:13.5px; color:var(--muted); margin-top:7px; line-height:1.8; }
.pd-price { display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin-top:14px; }
.pd-price .now { font-size:28px; font-weight:700; color:var(--green-dark); letter-spacing:.2px; }
.pd-price .old { font-size:14px; color:var(--faint); text-decoration:line-through; }
.pd-stock-warn { margin-top:9px; font-size:12px; color:var(--red-dark); background:var(--red-soft); display:inline-block; padding:6px 12px; border-radius:9px; }
.pd-hr { height:1px; background:var(--line); margin:16px 0; }
.pd-desc { font-size:13.5px; line-height:2; color:var(--muted); }

.buyline { display:flex; gap:9px; align-items:stretch; }
.qty-box { display:flex; align-items:center; border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden; flex:0 0 auto; background:#fff; }
.qty-btn { width:36px; height:50px; background:#fff; font-size:18px; color:var(--green-dark); transition:background .16s ease; }
.qty-btn:active { background:var(--tint); }
.qty-input { width:40px; height:50px; border:0; border-left:1px solid var(--line); border-right:1px solid var(--line); text-align:center; font-size:15px; font-weight:600; outline:none; -moz-appearance:textfield; background:#fff; }
.qty-input::-webkit-outer-spin-button, .qty-input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.addcart { flex:1; height:50px; background:var(--green); color:#fff; border-radius:var(--r-md); display:flex; align-items:center; justify-content:center; gap:8px; font-size:13.5px; font-weight:600; transition:transform .12s ease, background .18s ease; }
.addcart:hover { background:var(--green-dark); }
.addcart:active { transform:scale(.98); }
.addcart i { font-size:18px; }
.addcart:disabled { background:var(--line); color:var(--light); }

@keyframes codShake { 0%,84%,100%{transform:translateX(0)} 86%{transform:translateX(-2.5px)} 88%{transform:translateX(2.5px)} 90%{transform:translateX(-1.5px)} 92%{transform:translateX(1.5px)} 94%{transform:translateX(0)} }
@keyframes codGlow { 0%,100%{background:#EF9F27} 50%{background:#F5AE45} }
.cod-btn {
  width:100%; margin-top:10px; border-radius:var(--r-md); padding:12px 16px;
  display:flex; align-items:center; justify-content:space-between; gap:10px; text-align:left;
  animation:codShake 3.6s ease-in-out infinite, codGlow 2.8s ease-in-out infinite;
}
.cod-btn .t { display:block; font-size:14.5px; font-weight:700; color:var(--amber-dark); line-height:1.4; }
.cod-btn .s { display:block; font-size:10.5px; color:var(--amber-mid); }
.cod-btn .ar { width:32px; height:32px; flex:0 0 32px; border-radius:11px; background:var(--amber-dark); color:var(--amber); display:grid; place-items:center; font-size:16px; }
.cod-btn:active { transform:scale(.99); }
@media (prefers-reduced-motion:reduce) { .cod-btn { animation:none; } }

.step-row { display:flex; gap:11px; align-items:flex-start; margin-bottom:11px; }
.step-row:last-child { margin-bottom:0; }
.step-no { flex:0 0 24px; width:24px; height:24px; border-radius:50%; background:var(--green); color:#fff; font-size:11px; font-weight:600; display:grid; place-items:center; }
.step-no.amber { background:var(--amber); color:var(--amber-dark); }
.step-row p { font-size:12.5px; line-height:1.7; color:var(--muted); }

/* ───────── কার্ড ও ফর্ম ───────── */
.card { background:#fff; border-radius:var(--r-lg); box-shadow:var(--sh); overflow:hidden; }
.card-pad { padding:16px; }
.field { margin-bottom:14px; }
.label { display:block; font-size:12.5px; font-weight:600; color:var(--muted); margin-bottom:6px; }
.input, .textarea, .select { width:100%; padding:12px 14px; background:#fff; border:1px solid var(--line); border-radius:var(--r-md); font-size:14px; color:var(--text); outline:none; transition:border-color .16s ease; }
.input:focus, .textarea:focus { border-color:var(--green); }
.textarea { min-height:88px; resize:vertical; line-height:1.8; }
.radio-row { display:grid; gap:8px; }
.radio-box { display:flex; align-items:center; gap:9px; border:1px solid var(--line); border-radius:var(--r-md); padding:12px 14px; font-size:13px; color:var(--muted); background:#fff; cursor:pointer; }
.radio-box.on { border-color:var(--green); background:var(--tint); color:var(--green-dark); font-weight:600; }
.radio-box input { accent-color:var(--green); width:17px; height:17px; }

.alert { padding:12px 15px; border-radius:var(--r-md); font-size:13px; margin-bottom:14px; line-height:1.8; }
.alert-ok  { background:var(--tint); color:var(--green-dark); }
.alert-err { background:var(--red-soft); color:var(--red-dark); }

/* ───────── কার্ট ও চেকআউট ───────── */
.tintpage { background:#fff; min-height:60vh; padding-bottom:20px; }
.cartwrap, .cowrap { max-width:var(--wrap); margin:0 auto; padding:10px 14px 4px; }

.ci-card { background:#fff; border:1px solid #EDF2EF; border-radius:var(--r-lg); padding:12px; display:flex; gap:12px; margin-bottom:11px; }
.ci-thumb { flex:0 0 68px; width:68px; height:68px; border-radius:12px; background:#F2F7F4; display:grid; place-items:center; overflow:hidden; }
.ci-thumb img { width:100%; height:100%; object-fit:contain; padding:6%; }
.ci-noimg { color:#A9C7BB; font-size:21px; }
.ci-main { flex:1; min-width:0; display:flex; flex-direction:column; }
.ci-top { display:flex; align-items:flex-start; gap:8px; }
.ci-name { flex:1; font-size:12px; line-height:1.45; color:var(--text); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.ci-del { flex:0 0 auto; color:#C8CFCB; font-size:16px; padding:0 0 0 4px; transition:color .16s ease; }
.ci-del:hover { color:var(--red); }
.ci-bottom { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:9px; }
.ci-price { font-size:15px; font-weight:700; color:var(--green-dark); }

.qpill { display:inline-flex; align-items:center; background:#F2F7F4; border-radius:100px; padding:3px; flex:0 0 auto; }
.qp-btn { width:30px; height:30px; border-radius:50%; display:grid; place-items:center; font-size:16px; line-height:1; transition:transform .12s ease; }
.qp-btn[hidden] { display:none; }
.qp-btn:active { transform:scale(.9); }
.qp-minus { background:#fff; color:var(--green-dark); }
.qp-trash { background:#fff; color:var(--red); font-size:14px; }
.qp-plus { background:var(--green); color:#fff; }
.qp-num { width:32px; height:30px; border:0; background:transparent; text-align:center; font-size:13px; font-weight:700; color:#0B3D31; outline:none; -moz-appearance:textfield; }
.qp-num::-webkit-outer-spin-button, .qp-num::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }

.sumcard { background:#fff; border-radius:var(--r-lg); padding:15px 16px; margin-bottom:14px; }
.sum-line { display:flex; justify-content:space-between; align-items:baseline; gap:10px; font-size:13.5px; color:#4A5652; margin-bottom:10px; }
.sum-line span:last-child { font-size:15.5px; font-weight:500; color:#4A5652; font-variant-numeric:tabular-nums; }
.sum-line:last-of-type { margin-bottom:0; }
.sum-off { color:var(--red-dark); }
.sum-div { height:1px; background:#F1F5F3; margin:13px 0; }
.sum-note { margin-top:9px; font-size:11.5px; color:#6B7873; text-align:right; }
.sum-grand { display:flex; justify-content:space-between; align-items:baseline; gap:10px; border-top:1px solid #E4EAE7; border-bottom:3px double #E4EAE7; padding:13px 0; }
.sum-grand span:first-child { font-size:15px; font-weight:700; color:#0B3D31; }
.sum-grand span:last-child { font-size:27px; font-weight:700; color:#0B3D31; letter-spacing:-.6px; font-variant-numeric:tabular-nums; }

.btn-round { display:flex; width:100%; align-items:center; justify-content:center; gap:9px; border-radius:100px; padding:16px; font-size:13.5px; font-weight:700; transition:transform .13s ease, background .18s ease; }
.btn-round:active { transform:scale(.985); }
.btn-round-amber { background:var(--amber); color:var(--amber-dark); }
.btn-round-amber:hover { background:var(--amber-hover); }
@keyframes coPulse { 0%,88%,100% { transform:scale(1); } 92% { transform:scale(1.02); } 96% { transform:scale(.995); } }
.btn-round-black { background:var(--green-dark); color:#fff; font-size:15.5px; padding:16px 22px; animation:coPulse 3.2s ease-in-out infinite; }
.btn-round-black:hover { background:var(--green-deep); }
@media (prefers-reduced-motion:reduce) { .btn-round-black { animation:none; } .cta-arrow { animation:none; } }
.cobtn-amt { font-weight:700; }
.cta-arrow { display:inline-block; animation:ctaNudge 1.4s ease-in-out infinite; }
@keyframes ctaNudge { 0%,100% { transform:translateX(0); } 50% { transform:translateX(6px); } }

.safe-line { margin-top:11px; font-size:11px; color:#6E7A74; text-align:center; }
.safe-line i { color:var(--green); vertical-align:-2px; }
.keepshop { display:flex; align-items:center; justify-content:center; gap:7px; margin-top:16px; font-size:12.5px; color:var(--green-dark); font-weight:600; padding-bottom:6px; }

.co-card { background:#fff; border:1px solid #EDF2EF; border-radius:var(--r-lg); padding:15px; margin-bottom:10px; }
.co-head { display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.co-head i { font-size:20px; color:var(--green); }
.co-head span { font-size:16px; font-weight:700; color:#0B3D31; letter-spacing:-.2px; }

.ffield { margin-bottom:8px; }
.flabel { display:block; font-size:13.5px; font-weight:600; color:#26332E; margin-bottom:5px; }
.req { color:var(--red); }
.opt { color:#7E8A85; font-weight:400; font-size:12px; }
.finput { width:100%; border:1.5px solid #D8E3DD; border-radius:10px; padding:10px 13px; font-size:15px; color:#141A17; background:#fff; outline:none; transition:border-color .16s ease, box-shadow .16s ease; }
.finput:focus { border-color:var(--green); box-shadow:0 0 0 3px rgba(15,110,86,.10); }
.finput::placeholder { color:#98A39E; font-size:14px; }
.finput.err { border-color:var(--red); background:#FEF7F7; }
.ftext { min-height:56px; resize:vertical; line-height:1.6; }
.ftext-sm { min-height:48px; }
.fhint { margin-top:4px; font-size:12px; color:#6B7873; }

.area-row { display:flex; gap:8px; }
.area-box { flex:1; min-width:0; display:flex; align-items:center; gap:7px; border:1.5px solid #D8E3DD; border-radius:10px; padding:10px 11px; cursor:pointer; background:#fff; transition:border-color .16s ease, background .16s ease; }
.area-box input { display:none; }
.area-box .a-dot { width:15px; height:15px; flex:0 0 15px; border-radius:50%; border:1.5px solid #C3CFC9; background:#fff; transition:border .16s ease; }
.area-box .a-name { flex:1; min-width:0; font-size:13px; color:#4A5652; white-space:nowrap; }
.area-box .a-price { flex:0 0 auto; font-size:14.5px; font-weight:700; color:#4A5652; letter-spacing:-.2px; white-space:nowrap; }
.area-box.on { border-color:var(--green); background:var(--tint); }
.area-box.on .a-dot { border:4.5px solid var(--green); }
.area-box.on .a-name { color:#0B3D31; font-weight:600; }
.area-box.on .a-price { color:var(--green-dark); }
.area-row { display:flex; gap:8px; max-width:430px; }

.pay-pick { display:flex; align-items:center; gap:11px; border:1.5px solid var(--green); background:#F4FBF8; border-radius:12px; padding:12px 13px; }
.pay-ico { width:34px; height:34px; flex:0 0 34px; border-radius:10px; background:var(--tint); display:grid; place-items:center; color:var(--green); font-size:17px; }
.pay-txt { flex:1; }
.pay-txt .pt { display:block; font-size:14.5px; font-weight:700; color:var(--green-dark); }
.pay-txt .ps { display:block; font-size:12.5px; color:#5C6A64; margin-top:2px; }
.pay-ok { font-size:19px; color:var(--green); }

.co-line { display:flex; align-items:center; gap:11px; margin-bottom:11px; }
.co-line:last-of-type { margin-bottom:0; }
.co-thumb { flex:0 0 56px; width:56px; height:56px; border-radius:11px; background:#F2F7F4; display:grid; place-items:center; overflow:hidden; color:#A9C7BB; font-size:19px; }
.co-thumb img { width:100%; height:100%; object-fit:contain; padding:6%; }
.co-info { flex:1; min-width:0; }
.co-nm { display:block; font-size:13.5px; line-height:1.45; color:#1A221E; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.co-qty { display:block; margin-top:3px; font-size:12px; color:#6B7873; }
.co-amt { flex:0 0 auto; font-size:15.5px; font-weight:700; color:var(--green-dark); }

@keyframes coMarquee { 0% { transform:translateX(0); } 100% { transform:translateX(-50%); } }
.alertbar { background:#FDF6E7; border:1px solid #EEDCB4; border-radius:12px; padding:12px 0; overflow:hidden; margin-bottom:14px; }
.alertbar-in { display:inline-flex; white-space:nowrap; animation:coMarquee 22s linear infinite; }
.alertbar-txt { font-size:13px; color:#7A5A11; padding-right:48px; line-height:1.6; }
.alertbar-txt i { vertical-align:-1px; }
@media (prefers-reduced-motion:reduce) { .alertbar-in { animation:none; } }

.cofixed { position:fixed; left:0; right:0; bottom:0; z-index:95; background:rgba(255,255,255,.97); backdrop-filter:blur(10px); border-top:1px solid #E3EBE7; padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px)); }
.cofixed[hidden] { display:none; }

/* ───────── স্টিকি বার ───────── */
.sticky-bar {
  position:fixed; left:0; right:0; bottom:calc(66px + env(safe-area-inset-bottom,0px)); z-index:70;
  background:rgba(255,255,255,.97); backdrop-filter:blur(10px); border-top:1px solid var(--line);
  padding:10px 16px; display:flex; align-items:center; gap:11px;
}
.sb-price { flex:0 0 auto; }
.sb-price .n { display:block; font-size:15px; font-weight:700; color:var(--green-dark); line-height:1.3; }
.sb-price .o { display:block; font-size:10.5px; color:var(--faint); text-decoration:line-through; }

/* ───────── ধন্যবাদ ও ট্র্যাক ───────── */
.ty-check { width:62px; height:62px; border-radius:50%; background:var(--tint); color:var(--green); font-size:32px; display:grid; place-items:center; margin:0 auto; }
.ty-no { margin-top:16px; background:var(--tint); color:var(--green-dark); border-radius:var(--r-md); padding:11px 16px; font-size:14px; display:inline-block; }
.track-step { display:flex; gap:12px; align-items:flex-start; padding-bottom:16px; position:relative; }
.track-step:not(:last-child)::before { content:''; position:absolute; left:12px; top:26px; bottom:2px; width:2px; background:var(--line); }
.track-step.done:not(:last-child)::before { background:var(--green); }
.ts-dot { position:relative; z-index:1; flex:0 0 26px; width:26px; height:26px; border-radius:50%; background:var(--line); color:#fff; font-size:14px; display:grid; place-items:center; }
.track-step.done .ts-dot { background:var(--green); }
.ts-title { font-size:13.5px; font-weight:600; }
.track-step:not(.done) .ts-title { color:var(--faint); }
.ts-sub { font-size:11.5px; color:var(--light); line-height:1.6; }

/* ───────── খালি ও পেজিনেশন ───────── */
.empty { text-align:center; padding:50px 20px; }
.empty i { font-size:44px; color:var(--faint); }
.empty p { font-size:13.5px; color:var(--muted); margin-top:10px; }
.pager { display:flex; gap:6px; justify-content:center; padding:24px 0 4px; flex-wrap:wrap; }
.pager a, .pager span { min-width:38px; height:38px; padding:0 11px; border-radius:var(--r-sm); display:grid; place-items:center; font-size:13px; background:#fff; border:1px solid var(--line); color:var(--muted); }
.pager .on { background:var(--green); border-color:var(--green); color:#fff; font-weight:600; }

/* ───────── ফুটার ───────── */
.footer { background:var(--green-deep); color:var(--tint-soft); margin-top:40px; padding:34px 0 28px; }
.footer-in { max-width:var(--wrap); margin:0 auto; padding:0 16px; display:grid; gap:22px; }
.footer h4 { color:#fff; font-size:15px; margin-bottom:9px; }
.footer a, .footer p { font-size:13px; line-height:2; color:var(--tint-soft); }
.footer-bottom { border-top:1px solid var(--green-mid); margin-top:22px; padding-top:16px; text-align:center; font-size:11.5px; }

/* ───────── বটম নেভ ───────── */
.bottom-nav {
  position:fixed; left:0; right:0; bottom:0; z-index:90;
  background:rgba(255,255,255,.96); backdrop-filter:blur(10px); border-top:1px solid var(--line);
  display:flex; padding:8px 0 calc(8px + env(safe-area-inset-bottom,0px));
}
.nav-item { flex:1; display:flex; flex-direction:column; align-items:center; gap:3px; color:var(--faint); font-size:21px; position:relative; }
.nav-item span { font-size:10px; font-weight:500; }
.nav-item.on { color:var(--green); }
.nav-badge { position:absolute; top:-3px; right:50%; margin-right:-20px; min-width:16px; height:16px; padding:0 4px; background:var(--red); color:#fff; border-radius:8px; font-size:9.5px; font-weight:600; display:none; place-items:center; }
.nav-badge.on { display:grid; }

/* ───────── টোস্ট ───────── */
.toast {
  position:fixed; left:50%; transform:translateX(-50%) translateY(20px);
  bottom:calc(96px + env(safe-area-inset-bottom,0px)); z-index:120;
  background:var(--green-deep); color:#fff; font-size:13px;
  padding:11px 20px; border-radius:22px; opacity:0; pointer-events:none;
  transition:opacity .22s ease, transform .22s ease;
}
.toast.on { opacity:1; transform:translateX(-50%) translateY(0); }

/* ══════════════ ট্যাবলেট ══════════════ */
@media (min-width:600px) {
  .grid-2 { grid-template-columns:repeat(3,1fr); gap:10px; }
  .hero-title { font-size:32px; }
  .cat-item { width:88px; }
  .cat-ico { width:58px; height:58px; font-size:25px; }
  .radio-row { grid-template-columns:1fr 1fr; }
}

/* ══════════════ ডেস্কটপ ══════════════ */
@media (min-width:1000px) {
  body { padding-bottom:0; }
  .wrap, .pad { padding:0 32px; }
  .sec { padding:46px 32px 0; }
  .header-in { height:70px; padding:0 32px; gap:26px; }
  .head-search { display:block; max-width:440px; }
  .desk-nav { display:flex; }
  .bottom-nav { display:none; }
  .toast { bottom:32px; }

  .hero { display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:30px; padding:48px 46px; border-radius:24px; margin-top:22px; }
  .hero-title { font-size:44px; line-height:1.25; }
  .hero-sub { font-size:15px; margin:14px 0 24px; }
  .hero-art { display:grid; place-items:center; background:var(--green-mid); border-radius:var(--r-xl); aspect-ratio:4/3; overflow:hidden; color:var(--tint-soft); font-size:13px; }
  .hero-art img { width:100%; height:100%; object-fit:cover; }

  .cat-row { gap:14px; padding:30px 0 8px; }
  .trust-row { gap:16px; margin-top:22px; }
  .trust-item { padding:20px 10px; display:flex; align-items:center; justify-content:center; gap:12px; text-align:left; }
  .trust-item i { font-size:26px; }
  .trust-item span { margin-top:0; font-size:13px; }

  .sec-title { font-size:24px; }
  .grid-2 { grid-template-columns:repeat(5,1fr); gap:12px; }
  .p-name { font-size:13px; height:40px; }
  .p-now { font-size:17px; }
  .p-body { padding:10px 12px 13px; }

  .shop-wrap { display:grid; grid-template-columns:236px minmax(0,1fr); gap:32px; align-items:start; }
  .shop-side { display:block; background:#fff; border-radius:var(--r-lg); padding:20px; box-shadow:var(--sh); position:sticky; top:92px; }
  .shop-side h4 { font-size:14px; margin-bottom:12px; }
  .shop-side a { display:flex; align-items:center; gap:9px; font-size:13.5px; color:var(--muted); padding:7px 0; }
  .shop-side a.on { color:var(--green-dark); font-weight:600; }
  .shop-side .divider { height:1px; background:var(--line); margin:16px 0; }
  .shop-chips { display:none; }

  .pdp { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:44px; align-items:start; padding:28px 32px 0; }
  .pdp-media { position:sticky; top:92px; margin:0; }
  .slider { border-radius:18px; }
  .pd-thumbs, .hint-swipe { margin-left:0; margin-right:0; }
  .pd-title { font-size:30px; }
  .pd-short { font-size:15px; }
  .pd-desc { font-size:15px; }
  .pd-price .now { font-size:34px; }
  .sl-nav { width:42px; height:42px; font-size:21px; }
  .sticky-bar { display:none; }

  .cartwrap { max-width:720px; padding:26px 32px 10px; }
  .cowrap { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:22px; align-items:start; padding:26px 32px 30px; }
  /* ভুল বার্তা গ্রিডের একটা ঘর দখল করে নিলে লেআউট ভেঙে যেত — এখন পুরো চওড়া জুড়ে বসে */
  .cowrap > .alert { grid-column:1 / -1; margin-bottom:0; }
  .ci-card { padding:14px; }
  .ci-thumb { flex:0 0 84px; width:84px; height:84px; }
  .ci-name { font-size:13.5px; }
  .co-card { padding:20px; }
  .flabel { font-size:14px; }
  .finput { font-size:15.5px; padding:14px 16px; }
  .sum-grand span:last-child { font-size:28px; }
  .alertbar-txt { font-size:13.5px; }
  .cofixed { display:none; }

  .footer { padding:48px 0 32px; }
  .footer-in { grid-template-columns:1.6fr 1fr 1fr 1fr; gap:36px; padding:0 32px; }
}

@media (min-width:1280px) {
  .hero { padding:60px 56px; }
  .hero-title { font-size:50px; }
  .grid-2 { gap:14px; }
}

@media (max-width:360px) {
  .cat-item { width:64px; }
  .cat-ico { width:44px; height:44px; font-size:19px; }
  .trust-item span { font-size:10px; }
}

/* ═══════════ নতুন হেডার, ব্যানার, ফ্ল্যাশ সেল ═══════════ */
body { background:#fff; }
.page { background:#fff; }
.wide { max-width:var(--wrap); margin:0 auto; padding:0 14px; }

.topbar { display:none; background:var(--green-deep); color:#CFE7DE; font-size:12px; }
.topbar-in { max-width:var(--wrap); margin:0 auto; padding:0 14px; height:38px; display:flex; align-items:center; gap:20px; }
.tb-cod { display:inline-flex; align-items:center; gap:7px; font-weight:600; color:#fff; }
.tb-cod i { font-size:15px; color:var(--amber); }
.tb-right { margin-left:auto; display:flex; align-items:center; gap:18px; }
.topbar a { color:#CFE7DE; transition:color .16s ease; }
.topbar a:hover { color:#fff; }
.tb-pipe { width:1px; height:13px; background:#1C4A3D; }

.header-in { display:flex; align-items:center; gap:16px; }
.head-search { display:none; flex:1; align-items:center; background:#F6F7F8; border:1px solid var(--line); border-radius:10px; height:44px; padding:4px 4px 4px 0; max-width:660px; margin:0 auto; }
.hs-all { display:flex; align-items:center; gap:6px; padding:0 14px; font-size:13px; color:var(--muted); border-right:1px solid var(--line); height:100%; white-space:nowrap; }
.head-search input { flex:1; border:0; background:transparent; outline:none; padding:0 14px; font-size:13.5px; font-family:inherit; }
.hs-go { display:flex; align-items:center; gap:7px; background:var(--green); color:#fff; border-radius:8px; padding:0 20px; height:36px; font-size:13.5px; font-weight:600; }

.header-icons { display:flex; align-items:center; gap:18px; margin-left:auto; }
.hi-item { display:flex; flex-direction:column; align-items:center; gap:2px; font-size:20px; color:var(--text); position:relative; }
.hi-item span:last-child { font-size:11px; color:var(--muted); }
.hi-signin { display:none; }

.catbar { display:none; background:#fff; border-bottom:1px solid var(--line); }
.catbar-in { max-width:var(--wrap); margin:0 auto; padding:0 14px; height:52px; display:flex; align-items:center; gap:8px; }
.allcat { display:flex; align-items:center; gap:9px; background:var(--green-deep); color:#fff; border-radius:9px; padding:9px 16px; font-size:13.5px; font-weight:600; flex:0 0 auto; }
.catlinks { display:flex; align-items:center; gap:4px; overflow:hidden; flex:1; }
.catlinks a { padding:8px 13px; font-size:13.5px; color:var(--text); border-radius:8px; white-space:nowrap; transition:background .16s ease, color .16s ease; }
.catlinks a:hover { background:var(--tint); color:var(--green-dark); }

.msearch { padding:10px 14px 2px; }
.msearch-box { display:flex; align-items:center; gap:10px; background:#F6F7F8; border:1px solid var(--line); border-radius:10px; height:42px; padding:0 14px; }
.msearch-box i { font-size:18px; color:#B3BAC0; }
.msearch-box input { flex:1; border:0; background:transparent; outline:none; font-size:13.5px; font-family:inherit; }

/* সার্চের পাশের All ড্রপডাউন রিমুভ */
.hs-all { display:none !important; }

/* মোবাইল হেডার — Pariza-স্টাইল: লোগো + সার্চ + কার্ট এক লাইনে */
.head-search { display:flex; }
.hs-go { display:none; }
.msearch { display:none; }
.head-search input { padding:0 14px; }
.header-in { gap:12px; padding:0 14px; }
.header-icons .hi-item span:last-child { display:none; }
.header-icons { gap:12px; font-size:23px; }

.hero2 { background:var(--green-deep); border-radius:16px; padding:30px 22px; margin-top:12px; position:relative; overflow:hidden; }
.hero2::after { content:''; position:absolute; right:-90px; top:-90px; width:320px; height:320px; border-radius:50%; background:#0A3B31; }
.hero2-in { position:relative; z-index:1; max-width:640px; }
.hero2 h1 { font-family:'Anek Bangla',sans-serif; font-size:31px; font-weight:600; color:#fff; line-height:1.28; letter-spacing:-.3px; }
.hero2 h1 em { font-style:normal; color:var(--amber); }
.hero2-sub { font-size:13.5px; color:#9FBBB1; margin-top:10px; }
.hero2-stats { display:flex; margin-top:20px; }
.h2s { padding-right:20px; margin-right:20px; border-right:1px solid #14493C; }
.h2s:last-child { border-right:0; padding-right:0; margin-right:0; }
.h2s b { display:block; font-size:18px; font-weight:700; color:#fff; letter-spacing:-.3px; line-height:1.3; }
.h2s span { display:block; font-size:9.5px; color:#7FA396; letter-spacing:.7px; font-weight:500; margin-top:2px; }
.hero2-cta { display:inline-flex; align-items:center; gap:10px; background:#fff; color:var(--ink); border-radius:100px; padding:12px 10px 12px 22px; font-size:13.5px; font-weight:600; margin-top:24px; }
.hero2-cta i { width:30px; height:30px; border-radius:50%; background:var(--amber); color:var(--amber-dark); display:grid; place-items:center; font-size:16px; }

.flash { margin-top:12px; background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; }
.flash-strip { background:var(--green-deep); padding:13px 16px; display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.flash-bolt { width:38px; height:38px; flex:0 0 38px; border-radius:12px; background:var(--amber); color:var(--amber-dark); display:grid; place-items:center; font-size:20px; }
.flash-eyebrow { display:block; font-size:9.5px; font-weight:700; color:var(--amber); letter-spacing:1px; }
.flash-h2 { display:block; font-size:19px; font-weight:700; color:#fff; letter-spacing:-.4px; line-height:1.2; }
.flash-clock { display:flex; align-items:center; gap:6px; margin-left:auto; }
.ends { font-size:9.5px; font-weight:700; color:#7FA396; letter-spacing:.9px; margin-right:2px; }
.cbox { background:#0A3B31; border:1px solid #14493C; border-radius:8px; padding:5px 0; width:42px; text-align:center; }
.cbox b { font-size:14px; font-weight:700; color:#fff; }
.colon { color:#2A5F51; font-weight:700; }
.flash-view { display:inline-flex; align-items:center; gap:7px; background:#fff; color:var(--ink); border-radius:100px; padding:8px 16px; font-size:12.5px; font-weight:600; }
.flash-body { padding:12px; overflow:hidden; }
.flash-rail { display:flex; gap:10px; overflow-x:auto; scroll-behavior:smooth; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.flash-rail::-webkit-scrollbar { display:none; }
.f-card { flex:0 0 44%; border:1px solid var(--line); border-radius:11px; overflow:hidden; background:#fff; }
.f-thumb { display:block; position:relative; aspect-ratio:1/1; background:#F6F7F8; display:grid; place-items:center; overflow:hidden; }
.f-thumb img { width:100%; height:100%; object-fit:contain; padding:6%; }
.f-off { position:absolute; top:6px; left:6px; background:var(--red); color:#fff; font-size:9.5px; font-weight:700; padding:2px 6px; border-radius:5px; }
.f-body { display:block; padding:8px 9px 9px; }
.f-name { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:11px; line-height:1.4; color:var(--text); height:31px; }
.f-price { display:block; margin-top:3px; font-size:14px; font-weight:700; color:var(--green-dark); }
.f-price s { font-size:10px; color:#B3BAC0; font-weight:400; }
.f-cod { display:block; margin-top:5px; font-size:9.5px; color:var(--green); }
.f-cod i { font-size:11px; vertical-align:-1px; }

.sec2 { padding-top:34px; }
.sec2-top { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:16px; }
.eyebrow { font-size:10.5px; font-weight:700; color:var(--amber); letter-spacing:1.3px; text-transform:uppercase; }
.sec2-top h2 { font-size:24px; font-weight:700; color:var(--ink); letter-spacing:-.6px; line-height:1.2; margin-top:6px; }
.sec2-top p { font-size:12.5px; color:var(--muted); margin-top:5px; }
.viewall { display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:600; color:var(--ink); white-space:nowrap; flex:0 0 auto; }

.p-name { margin-bottom:0 !important; }
.p-price { margin-top:5px !important; }
.p-save { margin-top:3px !important; }
.p-hovercart { display:none; position:absolute; left:8px; right:8px; bottom:8px; z-index:3; background:var(--amber); color:var(--amber-dark); border-radius:9px; padding:9px; font-size:12px; font-weight:700; text-align:center; }
.p-hovercart i { font-size:14px; vertical-align:-2px; margin-right:4px; }

@media (min-width:640px) {
  .f-card { flex:0 0 30%; }
  .hero2 h1 { font-size:36px; }
}

@media (min-width:1000px) {
  .topbar { display:block; }
  .catbar { display:block; }
  .head-search { display:flex; }
  .hi-signin { display:flex; }
  .msearch { display:none; }
  .wide { padding:0 20px; }
  .hero2 { padding:46px 40px; min-height:320px; display:flex; align-items:center; margin-top:18px; }
  .hero2 h1 { font-size:42px; }
  .flash-body { padding:16px; }
  .f-card { flex:0 0 calc(20% - 10px); }
  .f-name { font-size:11.5px; }
  .sec2 { padding-top:48px; }
  .sec2-top h2 { font-size:29px; }
  .p-card:hover .p-hovercart { display:block; }
  .cbox { width:48px; }
  .cbox b { font-size:16px; }
}

/* ═══════════ ধন্যবাদ ও ট্র্যাক ═══════════ */
.tywrap { max-width:620px; margin:0 auto; padding:14px 14px 30px; }

.ty-hero { background:var(--green-deep); border-radius:18px; padding:26px 18px 22px; position:relative; overflow:hidden; }
.ty-hero::after { content:''; position:absolute; right:-70px; top:-70px; width:220px; height:220px; border-radius:50%; background:#0A3B31; }
.ty-hero-in { position:relative; z-index:1; }
.ty-tick { width:52px; height:52px; border-radius:50%; background:var(--amber); color:var(--amber-dark); display:grid; place-items:center; font-size:28px; }
.ty-h1 { font-size:21px; font-weight:700; color:#fff; letter-spacing:-.3px; margin-top:14px; }
.ty-sub { font-size:12.5px; color:#9FBBB1; margin-top:5px; }
.ty-chip { display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.13); border-radius:100px; padding:8px 8px 8px 15px; margin-top:16px; }
.ty-chip .l { font-size:11px; color:#7FA396; }
.ty-chip .n { font-size:14px; font-weight:700; color:#fff; letter-spacing:.4px; }
.ty-chip .c { width:26px; height:26px; border-radius:50%; background:rgba(255,255,255,.12); color:#fff; display:grid; place-items:center; font-size:13px; }

.ty-eta { background:var(--tint); border-radius:16px; padding:13px 16px; display:flex; align-items:center; gap:12px; margin-top:11px; }
.ty-eta-ic { width:40px; height:40px; flex:0 0 40px; border-radius:12px; background:#fff; color:var(--green); display:grid; place-items:center; font-size:20px; }
.ty-eta .l { display:block; font-size:10.5px; color:#4E7A6C; }
.ty-eta .d { display:block; font-size:15px; font-weight:700; color:#0B3D31; letter-spacing:-.2px; }
.ty-eta-btn { margin-left:auto; background:var(--green); color:#fff; border-radius:100px; padding:7px 15px; font-size:11.5px; font-weight:700; }

.ty-body { padding-top:14px; }
.ty-card { background:#fff; border:1px solid #EDF2EF; border-radius:16px; padding:15px; margin-bottom:11px; }
.ty-h3 { font-size:13.5px; font-weight:700; color:#0B3D31; }

.ty-steps { display:flex; align-items:flex-start; margin-bottom:16px; }
.ty-step { flex:1; text-align:center; }
.ty-step-line { display:flex; align-items:center; }
.ty-step-line .ln { flex:1; height:3px; background:#DCE8E2; }
.ty-step-line .ln.fill { background:var(--green); }
.ty-step-line .ln.hide { background:transparent; }
.ty-step-line .dot { width:24px; height:24px; flex:0 0 24px; border-radius:50%; border:2px solid #DCE8E2; background:#fff; color:#A9B2AE; display:grid; place-items:center; font-size:11px; }
.ty-step.on .dot { background:var(--green); border-color:var(--green); color:#fff; font-size:13px; }
.ty-step p { margin-top:6px; font-size:9.5px; color:#8A9591; line-height:1.4; }
.ty-step.on p { color:#0B3D31; font-weight:600; }

.ty-call { display:flex; gap:10px; align-items:flex-start; background:#FDF6E7; border:1px solid #F2E3C2; border-radius:12px; padding:12px 14px; margin-bottom:11px; }
.ty-call i { font-size:17px; color:#C08A1E; flex:0 0 auto; margin-top:1px; }
.ty-call p { font-size:11.5px; color:#8A6516; line-height:1.65; }

.ty-line { display:flex; align-items:center; gap:11px; margin-bottom:11px; }
.ty-line:last-of-type { margin-bottom:0; }
.ty-thumb { flex:0 0 44px; width:44px; height:44px; border-radius:10px; background:#F6F7F8; display:grid; place-items:center; overflow:hidden; color:#B3BAC0; font-size:16px; }
.ty-thumb img { width:100%; height:100%; object-fit:contain; padding:6%; }
.ty-info { flex:1; min-width:0; }
.ty-info .nm { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:11.5px; line-height:1.4; color:var(--text); }
.ty-info .qt { display:block; font-size:10px; color:#8A9591; margin-top:2px; }
.ty-line .am { flex:0 0 auto; font-size:13px; font-weight:700; color:var(--green-dark); }

.ty-total { display:flex; align-items:center; justify-content:space-between; background:#F2F7F4; border-radius:10px; padding:11px 13px; margin-top:11px; }
.ty-total .l { display:block; font-size:10px; color:#6E7A74; }
.ty-total .v { display:block; font-family:'PkNum','Hind Siliguri',sans-serif; font-size:21px; font-weight:800;
  color:var(--green-dark); line-height:1.25; letter-spacing:-.3px; }
/* ধন্যবাদ পাতার বাকি টাকার অঙ্কগুলোও একই ফন্টে */
.ty-line .am, .sum-line span:last-child, .ty-total .l { font-family:'PkNum','Hind Siliguri',sans-serif; }
.ty-line .am { font-weight:700; }
.ty-total i { font-size:24px; color:var(--green); }

.ty-addr { font-size:12px; color:#4A5652; line-height:1.75; margin-top:9px; }

.ty-actions { display:flex; gap:9px; margin-bottom:18px; }
.ty-wa, .ty-callbtn { flex:1; display:flex; align-items:center; justify-content:center; gap:7px; border-radius:100px; padding:12px; font-size:12px; font-weight:700; }
.ty-wa { background:#25D366; color:#fff; }
.ty-wa i { font-size:16px; }
.ty-callbtn { border:1px solid #DCE8E2; color:var(--green-dark); background:#fff; font-weight:600; }
.ty-callbtn i { font-size:15px; }

.ty-sug { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:16px; }
.ty-sug-card { border:1px solid var(--line); border-radius:10px; overflow:hidden; background:#fff; }
.ty-sug-card .ph { display:grid; place-items:center; aspect-ratio:1/1; background:#F6F7F8; color:#B3BAC0; font-size:18px; overflow:hidden; }
.ty-sug-card .ph img { width:100%; height:100%; object-fit:contain; padding:7%; }
.ty-sug-card .bd { display:block; padding:7px 8px 8px; }
.ty-sug-card .nm { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:9.5px; line-height:1.35; color:var(--text); height:26px; }
.ty-sug-card .pr { display:block; margin-top:2px; font-size:12px; font-weight:700; color:var(--green-dark); }

.ty-more { display:flex; align-items:center; justify-content:center; gap:7px; border:1px solid #DCE8E2; color:var(--green-dark); background:#fff; border-radius:100px; padding:13px; font-size:12.5px; font-weight:600; }

.tr-h1 { font-size:17px; font-weight:700; color:#0B3D31; }
.tr-sub { font-size:12px; color:#6E7A74; margin:4px 0 13px; line-height:1.65; }
.tr-form { display:flex; gap:8px; }
.tr-form .finput { flex:1; }
.tr-go { background:var(--green); color:#fff; border-radius:10px; padding:11px 18px; font-size:12.5px; font-weight:600; flex:0 0 auto; }

.tr-none { background:#fff; border-radius:16px; padding:28px 20px; text-align:center; margin-bottom:11px; }
.tr-none i { font-size:34px; color:#C8CFCB; }
.tr-none .t { font-size:14px; font-weight:700; color:#0B3D31; margin-top:10px; }
.tr-none .d { font-size:12px; color:#6E7A74; margin-top:5px; line-height:1.7; }

.tr-top { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.tr-top .l { display:block; font-size:10.5px; color:#8A9591; }
.tr-top .n { display:block; font-size:17px; font-weight:700; color:var(--green-dark); }
.tr-top .d { display:block; font-size:10.5px; color:#8A9591; margin-top:3px; }
.tr-pill { background:var(--tint); color:var(--green-dark); border-radius:100px; padding:6px 14px; font-size:11.5px; font-weight:700; flex:0 0 auto; }
.tr-pill.off { background:#FDECEC; color:#A32D2D; }

.tr-step { display:flex; gap:12px; }
.tr-rail { flex:0 0 auto; display:flex; flex-direction:column; align-items:center; }
.tr-dot { width:28px; height:28px; border-radius:50%; border:2px solid #DCE8E2; background:#fff; color:#A9B2AE; display:grid; place-items:center; font-size:13px; }
.tr-step.done .tr-dot { background:var(--green); border-color:var(--green); color:#fff; }
.tr-step.now .tr-dot { background:var(--green); border-color:var(--green); color:#fff; box-shadow:0 0 0 4px var(--tint); }
.tr-ln { width:2px; flex:1; background:#DCE8E2; margin:4px 0; }
.tr-ln.fill { background:var(--green); }
.tr-txt { padding-bottom:18px; }
.tr-step:last-child .tr-txt { padding-bottom:0; }
.tr-txt .t { font-size:12.5px; font-weight:600; color:#4A5652; }
.tr-step.done .tr-txt .t, .tr-step.now .tr-txt .t { color:#0B3D31; }
.tr-step.now .tr-txt .t { font-weight:700; color:var(--green-dark); }
.tr-txt .d { font-size:11px; color:#8A9591; margin-top:2px; }
.tr-cn { display:inline-block; font-size:11px; color:var(--green-dark); background:#F2F7F4; border-radius:7px; padding:6px 10px; margin-top:6px; }

.tr-cancel { display:flex; gap:12px; align-items:flex-start; }
.tr-cancel i { width:28px; height:28px; flex:0 0 28px; border-radius:50%; background:#FDECEC; color:#A32D2D; display:grid; place-items:center; font-size:15px; }
.tr-cancel .t { font-size:12.5px; font-weight:700; color:#A32D2D; }
.tr-cancel .d { font-size:11px; color:#8A9591; margin-top:2px; }

.tr-help { font-size:11px; color:#6E7A74; text-align:center; line-height:1.8; margin-top:4px; }
.tr-help a { font-size:14px; font-weight:700; color:var(--green-dark); }

@media (min-width:1000px) {
  .tywrap { padding:26px 20px 40px; }
  .ty-hero { padding:34px 30px 28px; }
  .ty-h1 { font-size:25px; }
  .ty-sug { gap:12px; }
}

/* ───────── স্লিম চেকআউট হেডার ───────── */
.header-slim { border-bottom:1px solid var(--line); }
.header-slim .header-in { justify-content:space-between; }
.slim-secure { display:inline-flex; align-items:center; gap:7px; font-size:12.5px; font-weight:600; color:var(--green-dark); }
.slim-secure i { font-size:16px; color:var(--green); }

/* ───────── About / Refund / Terms / Privacy ───────── */
.pg-hero { background:var(--green-deep); position:relative; overflow:hidden; }
.pg-hero::after { content:''; position:absolute; right:-80px; top:-80px; width:260px; height:260px; border-radius:50%; background:#0A3B31; }
.pg-hero-in { position:relative; z-index:1; max-width:var(--wrap); margin:0 auto; padding:30px 14px 28px; }
.pg-eyebrow { font-size:10px; font-weight:700; color:var(--amber); letter-spacing:1.4px; }
.pg-hero h1 { font-size:26px; font-weight:700; color:#fff; letter-spacing:-.5px; line-height:1.28; margin-top:8px; }
.pg-hero p { font-size:13.5px; color:#9FBBB1; margin-top:9px; max-width:600px; line-height:1.8; }

.pg-wrap { max-width:var(--wrap); margin:0 auto; padding:24px 14px 40px; }
.pg-split { display:flex; gap:26px; flex-wrap:wrap; }
.pg-body { flex:1; min-width:260px; }
.pg-body-wide { max-width:820px; }
.pg-body h2 { font-size:18px; font-weight:700; color:var(--ink); letter-spacing:-.3px; margin:24px 0 10px; }
.pg-body h2:first-child { margin-top:0; }
.pg-body p { font-size:14px; color:#3F4B46; line-height:1.95; margin-bottom:12px; }
.pg-body ul { margin:0 0 12px; padding-left:20px; }
.pg-body li { font-size:14px; color:#3F4B46; line-height:1.9; margin-bottom:7px; }
.pg-body strong { color:var(--ink); font-weight:600; }
.pg-updated { font-size:12px; color:#8A9591; margin-top:26px; padding-top:16px; border-top:1px solid var(--line); }

.pg-contact { flex:0 0 300px; min-width:260px; background:var(--tint); border-radius:14px; padding:20px; align-self:flex-start; }
.pg-contact h3 { font-size:12.5px; font-weight:700; color:#0B3D31; letter-spacing:.4px; }
.pc-row { display:flex; gap:11px; margin-top:14px; }
.pc-ic { width:34px; height:34px; flex:0 0 34px; border-radius:10px; background:#fff; color:var(--green); display:grid; place-items:center; font-size:16px; }
.pc-row .l { display:block; font-size:10.5px; color:#6E7A74; }
.pc-row .v { display:block; font-size:13px; color:#1A221E; line-height:1.6; margin-top:1px; }
.pc-row .v.strong { font-size:14.5px; font-weight:600; color:var(--green-dark); }
.pc-row .v.link { color:var(--green-dark); }
.pc-wa { display:flex; align-items:center; justify-content:center; gap:8px; background:var(--green); color:#fff; border-radius:100px; padding:12px; font-size:13px; font-weight:600; margin-top:18px; }
.pc-wa i { font-size:16px; }

.pg-perks { margin-top:34px; padding-top:26px; border-top:1px solid var(--line); }
.pg-perks h2 { font-size:18px; font-weight:700; color:var(--ink); letter-spacing:-.3px; margin-bottom:15px; }
.pg-perk-grid { display:grid; grid-template-columns:1fr 1fr; gap:11px; }
.pg-perk { border:1px solid var(--line); border-radius:12px; padding:15px; }
.pg-perk .pi { width:36px; height:36px; border-radius:11px; background:var(--tint); color:var(--green); display:grid; place-items:center; font-size:18px; }
.pg-perk .t { font-size:13.5px; font-weight:700; color:var(--ink); margin-top:11px; }
.pg-perk .d { font-size:12px; color:var(--muted); line-height:1.7; margin-top:4px; }

@media (min-width:1000px) {
  .pg-hero-in { padding:44px 20px 40px; }
  .pg-hero h1 { font-size:34px; }
  .pg-wrap { padding:32px 20px 56px; }
  .pg-split { gap:34px; }
  .pg-body h2 { font-size:20px; }
  .pg-body p, .pg-body li { font-size:14.5px; }
  .pg-perk-grid { grid-template-columns:repeat(4,1fr); gap:14px; }
}

/* ══════════════════════════════════════════════════
   চেকআউটের ভুল দেখানো — ঘরের নিচে বার্তা + ভাসমান পপআপ
   ══════════════════════════════════════════════════ */

/* ভুল ঘরের চেহারা */
.finput.bad{ border-color:var(--red) !important; background:#FEF7F6; }
.finput.bad:focus{ box-shadow:0 0 0 3px rgba(216,69,63,.13) !important; }

/* ঘরের ঠিক নিচের বার্তা */
.fbad{ display:flex; align-items:flex-start; gap:6px; margin-top:6px;
  font-size:12.5px; line-height:1.6; color:var(--red-dark);
  animation:fbadIn .22s ease both; }
.fbad[hidden]{ display:none; }
.fbad i{ font-size:15px; flex:0 0 auto; padding-top:1px; color:var(--red); }
@keyframes fbadIn{ from{ opacity:0; transform:translateY(-3px);} to{ opacity:1; transform:none;} }

@media (prefers-reduced-motion:reduce){
  .fbad{ animation:none; }
}

/* ══════════════════════════════════════════════════
   কার্টে যোগ হওয়ার পপআপ কার্ড
   ══════════════════════════════════════════════════ */
.cadd{ position:fixed; inset:0; z-index:2000; display:none; }
.cadd.on{ display:block; }

.cadd-veil{ position:absolute; inset:0; background:rgba(6,14,11,.5);
  backdrop-filter:blur(3px); opacity:0; transition:opacity .28s ease; }
.cadd.on .cadd-veil{ opacity:1; }

.cadd-card{ position:absolute; left:50%; top:50%; width:min(400px, calc(100vw - 32px));
  transform:translate(-50%,-50%) scale(.9); opacity:0;
  background:#fff; border-radius:18px; padding:20px 18px 18px;
  box-shadow:0 24px 60px rgba(0,0,0,.28);
  transition:transform .34s cubic-bezier(.16,1,.3,1), opacity .24s ease; }
.cadd.on .cadd-card{ transform:translate(-50%,-50%) scale(1); opacity:1; }

.cadd-x{ position:absolute; right:12px; top:12px; width:32px; height:32px;
  display:grid; place-items:center; border:0; border-radius:50%;
  background:#F2F5F3; color:#5A625E; font-size:18px; cursor:pointer;
  transition:background .18s ease, color .18s ease, transform .18s ease; }
.cadd-x:hover{ background:#0A0C0B; color:#fff; transform:rotate(90deg); }

.cadd-top{ display:flex; flex-direction:column; align-items:center; gap:9px; padding:4px 0 14px; }
.cadd-tick{ width:46px; height:46px; border-radius:50%; background:var(--tint);
  color:var(--green); display:grid; place-items:center; font-size:24px;
  animation:caddPop .42s cubic-bezier(.2,1.5,.4,1) both; }
.cadd-top p{ font-family:'Anek Bangla','Hind Siliguri',sans-serif;
  font-size:18px; font-weight:700; color:var(--green-dark); }
@keyframes caddPop{ 0%{ transform:scale(0); } 70%{ transform:scale(1.12); } 100%{ transform:scale(1); } }

.cadd-item{ display:flex; align-items:center; gap:12px;
  border:1px solid var(--line,#E3E7E5); border-radius:14px; padding:11px;
  animation:caddSlide .4s cubic-bezier(.16,1,.3,1) .1s both; }
@keyframes caddSlide{ from{ opacity:0; transform:translateX(26px); } to{ opacity:1; transform:none; } }

.cadd-im{ width:58px; height:58px; flex:0 0 58px; border-radius:10px; overflow:hidden;
  background:#F6F8F7; display:grid; place-items:center; color:#C4CCC8; font-size:20px; }
.cadd-im img{ width:100%; height:100%; object-fit:cover; }
.cadd-info{ flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.cadd-info b{ font-size:13.5px; font-weight:700; line-height:1.45; color:var(--ink,#0A0C0B);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.cadd-meta{ font-size:12px; color:#6E7A74; }
.cadd-price{ flex:0 0 auto; font-size:15px; font-weight:800; color:var(--green-dark); }

.cadd-sum{ display:flex; align-items:center; justify-content:space-between; gap:12px;
  background:#F6F8F7; border-radius:12px; padding:11px 13px; margin-top:11px;
  font-size:13px; color:#4A534E; }
.cadd-sum b{ font-size:16px; font-weight:800; color:var(--green-dark); }

.cadd-btns{ display:flex; flex-direction:column; gap:9px; margin-top:14px; }
.cadd-go{ display:flex; align-items:center; justify-content:center; gap:8px;
  background:var(--green-deep,#052B23); color:#fff; border-radius:12px;
  padding:14px; font-size:15px; font-weight:700; transition:background .18s ease; }
.cadd-go:hover{ background:var(--green,#0F6E56); }
.cadd-go i{ font-size:18px; }
.cadd-more{ border:1.5px solid var(--line,#E3E7E5); background:#fff; border-radius:12px;
  padding:12px; font-family:inherit; font-size:14px; font-weight:700; color:#4A534E;
  cursor:pointer; transition:border-color .18s ease, color .18s ease; }
.cadd-more:hover{ border-color:#0A0C0B; color:#0A0C0B; }

@media (min-width:600px){
  .cadd-card{ padding:24px 22px 22px; }
  .cadd-btns{ flex-direction:row; }
  .cadd-go{ flex:1.4; }
  .cadd-more{ flex:1; }
}

@media (prefers-reduced-motion:reduce){
  .cadd-card, .cadd-veil{ transition:opacity .2s ease; }
  .cadd-tick, .cadd-item{ animation:none; }
}

/* ══════════════════════════════════════════════════
   হোমপেজের ব্যানার স্লাইডার (ফ্ল্যাশ সেলের উপরে)
   ══════════════════════════════════════════════════ */
.hban { max-width:var(--wrap); margin:0 auto; padding:14px 16px 0; }
.hban-frame { position:relative; border-radius:16px; overflow:hidden; background:#F2F3F1; }
.hban-track { display:flex; }
.hban-slide { flex:0 0 100%; display:block; line-height:0; }
.hban-slide img { width:100%; height:auto; display:block; }

/* দুইটা ছবি থাকলে নিজে নিজে স্লাইড */
.hban-2 .hban-track { width:200%; animation:hbanSlide 9s ease-in-out infinite; }
.hban-2 .hban-slide { flex:0 0 50%; }
@keyframes hbanSlide {
  0%, 45%   { transform:translateX(0); }
  55%, 95%  { transform:translateX(-50%); }
  100%      { transform:translateX(0); }
}

/* নিচের ছোট ডট */
.hban-dots { position:absolute; left:0; right:0; bottom:10px; display:flex; justify-content:center; gap:6px; }
.hbd { width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.5); box-shadow:0 1px 3px rgba(0,0,0,.25); }
@keyframes hbd1a { 0%,45%,100%{background:#fff} 55%,95%{background:rgba(255,255,255,.5)} }
@keyframes hbd2a { 0%,45%,100%{background:rgba(255,255,255,.5)} 55%,95%{background:#fff} }
.hbd1 { animation:hbd1a 9s ease-in-out infinite; }
.hbd2 { animation:hbd2a 9s ease-in-out infinite; }

@media (prefers-reduced-motion:reduce){
  .hban-2 .hban-track, .hbd1, .hbd2 { animation:none; }
}

/* ══════════════════════════════════════════════════
   ব্যানার — মোবাইলে একদম প্রান্ত থেকে প্রান্ত
   ══════════════════════════════════════════════════ */
@media (max-width:899px){
  .hban { padding:0; max-width:100%; }
  .hban-frame { border-radius:0; }
  .hban-dots { bottom:8px; }
}

/* ══════════════════════════════════════════════════
   টপ বার — এনিমেটেড কুরিয়ার ভ্যান + Cash On Delivery
   ══════════════════════════════════════════════════ */
.tb-cod { display:inline-flex; align-items:center; gap:7px; }

.tb-van { width:30px; height:17px; flex:0 0 auto; overflow:visible; }
.tb-van line, .tb-van rect, .tb-van path, .tb-van circle {
  fill:none; stroke:currentColor; stroke-width:1.6;
  stroke-linecap:round; stroke-linejoin:round;
}
.tb-van .van-ride { animation:vanBob 1.6s ease-in-out infinite; transform-origin:center; }
.tb-van .van-w { animation:vanSpin 1.1s linear infinite; transform-origin:center; transform-box:fill-box; }
.tb-van .van-speed line { stroke-width:1.4; opacity:.75; animation:vanDash 1.1s linear infinite; }
.tb-van .van-speed line:nth-child(2){ animation-delay:.15s; }
.tb-van .van-speed line:nth-child(3){ animation-delay:.3s; }

@keyframes vanBob  { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-1px)} }
@keyframes vanSpin { to{transform:rotate(360deg)} }
@keyframes vanDash { 0%{opacity:0; transform:translateX(4px)} 40%{opacity:.85} 100%{opacity:0; transform:translateX(-5px)} }

/* লেখায় হালকা আলোর ঝিলিক */
.tb-cod-t {
  background:linear-gradient(100deg, currentColor 0%, currentColor 38%, rgba(255,255,255,.95) 50%, currentColor 62%, currentColor 100%);
  background-size:220% 100%;
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
  animation:codShine 4.5s ease-in-out infinite;
}
@keyframes codShine { 0%,100%{background-position:120% 0} 55%{background-position:-40% 0} }

/* ══════════════════════════════════════════════════
   মোবাইল হ্যামবার্গার মেনু
   ══════════════════════════════════════════════════ */
.hburger {
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; flex:0 0 auto;
  border:0; background:transparent; color:var(--ink, #0A0C0B);
  font-size:23px; cursor:pointer; padding:0; margin-left:-6px;
  border-radius:10px;
}
.hburger:active { background:rgba(0,0,0,.05); }

.mdrawer { position:fixed; inset:0; z-index:1200; }
.mdrawer[hidden] { display:none; }
.mdrawer-bg { position:absolute; inset:0; background:rgba(10,12,11,.45); opacity:0; transition:opacity .22s ease; }
.mdrawer.on .mdrawer-bg { opacity:1; }

.mdrawer-panel {
  position:absolute; top:0; bottom:0; left:0; width:83%; max-width:320px;
  background:#fff; display:flex; flex-direction:column;
  transform:translateX(-100%); transition:transform .26s cubic-bezier(.22,.7,.3,1);
  box-shadow:0 0 40px rgba(0,0,0,.18);
}
.mdrawer.on .mdrawer-panel { transform:translateX(0); }

.mdrawer-head {
  display:flex; align-items:center; justify-content:space-between;
  padding:15px 16px; border-bottom:1px solid var(--line, #E4E2DC);
}
.mdrawer-title { font-weight:800; font-size:16px; letter-spacing:.2px; }
.mdrawer-x { border:0; background:transparent; font-size:21px; color:inherit; cursor:pointer; padding:4px; line-height:1; }

.mdrawer-nav { flex:1; overflow-y:auto; padding:8px 0 14px; -webkit-overflow-scrolling:touch; }

.md-main {
  display:flex; align-items:center; gap:11px;
  padding:12px 16px; font-size:14.5px; font-weight:700; color:inherit; text-decoration:none;
}
.md-main:active { background:#F5F6F4; }
.md-ic {
  width:32px; height:32px; flex:0 0 auto; border-radius:9px;
  display:grid; place-items:center; font-size:17px;
  background:var(--tint, #EDF5F1); color:var(--green, #0F6E56);
}
.md-ic-flash { background:#FDF0DC; color:#B45309; }

.md-sec {
  padding:14px 16px 7px; font-size:11.5px; font-weight:800;
  letter-spacing:.9px; text-transform:uppercase; color:var(--muted, #6B716D);
}
.md-cat {
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:11px 16px; font-size:14px; color:inherit; text-decoration:none;
  border-top:1px solid #F1F2F0;
}
.md-cat i { font-size:15px; opacity:.35; }
.md-cat:active { background:#F5F6F4; }
.md-all { font-weight:700; color:var(--green, #0F6E56); }

.mdrawer-foot {
  padding:13px 16px; border-top:1px solid var(--line, #E4E2DC);
  font-size:12.5px; color:var(--muted, #6B716D);
  display:flex; align-items:center; gap:7px;
}

/* ডেস্কটপে হ্যামবার্গার ও ড্রয়ার নেই */
@media (min-width:900px){
  .hburger { display:none; }
  .mdrawer { display:none !important; }
}

@media (prefers-reduced-motion:reduce){
  .tb-van .van-ride, .tb-van .van-w, .tb-van .van-speed line, .tb-cod-t { animation:none; }
  .tb-cod-t { -webkit-text-fill-color:currentColor; color:inherit; }
}

/* ══════════════════════════════════════════════════
   টপ বার — Cash On Delivery লেখা এখন সবসময় স্পষ্ট
   (আগে পুরো লেখাটাই transparent হয়ে যেত, শুধু ঝিলিকের
    সময় দেখা যেত — সেটাই ঠিক করা হলো)
   ══════════════════════════════════════════════════ */
.tb-cod-t {
  background:linear-gradient(100deg,#fff 0%,#fff 40%,#FFDFA6 50%,#fff 60%,#fff 100%);
  background-size:240% 100%;
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
  animation:codShine 5s ease-in-out infinite;
  letter-spacing:.2px;
}
@supports not ((-webkit-background-clip:text) or (background-clip:text)) {
  .tb-cod-t { color:#fff; -webkit-text-fill-color:#fff; background:none; animation:none; }
}

/* ══════════════════════════════════════════════════
   ফ্ল্যাশ সেল — প্রিমিয়াম এনিমেটেড বোল্ট
   ══════════════════════════════════════════════════ */
.flash-bolt { overflow:visible; position:relative; }
.fbolt { width:24px; height:24px; overflow:visible; display:block; }
.fbolt .fb-zap   { fill:var(--amber-dark); }
.fbolt .fb-shine { fill:#fff; opacity:.85; clip-path:inset(0 100% 0 0); animation:fbShine 3.4s ease-in-out infinite; }
.fbolt .fb-ring, .fbolt .fb-ring2 {
  fill:none; stroke:var(--amber-dark); stroke-width:1.5; opacity:0;
  transform-origin:center; transform-box:fill-box;
}
.fbolt .fb-ring  { animation:fbRing 2.6s ease-out infinite; }
.fbolt .fb-ring2 { animation:fbRing 2.6s ease-out infinite; animation-delay:1.3s; }

@keyframes fbRing  { 0%{opacity:.55; transform:scale(.62)} 70%{opacity:0; transform:scale(1.15)} 100%{opacity:0} }
@keyframes fbShine { 0%,12%{clip-path:inset(0 100% 0 0)} 38%{clip-path:inset(0 0 0 0)} 62%{clip-path:inset(0 0 0 100%)} 100%{clip-path:inset(0 0 0 100%)} }

/* ══════════════════════════════════════════════════
   ফ্ল্যাশ স্ট্রিপ — মোবাইলে এক লাইনে
   ══════════════════════════════════════════════════ */
@media (max-width:899px){
  .flash-strip { flex-wrap:nowrap; gap:9px; padding:11px 12px; }
  .flash-bolt  { width:32px; height:32px; flex:0 0 32px; border-radius:10px; }
  .fbolt       { width:20px; height:20px; }
  .flash-name  { flex:0 0 auto; min-width:0; }
  .flash-eyebrow { display:none; }
  .flash-h2    { font-size:16px; white-space:nowrap; }
  .flash-clock { margin-left:auto; flex:0 0 auto; gap:3px; }
  .flash-clock .ends { display:none; }
  .flash-clock .cbox { padding:3px 6px; min-width:24px; }
  .flash-view  { display:none; }
}

/* ══════════════════════════════════════════════════
   মোবাইল মেনু — নতুন ডিজাইন (লোগো + ইংরেজি)
   ══════════════════════════════════════════════════ */
.mdrawer-panel { width:85%; max-width:330px; }

.mdrawer-head {
  padding:14px 16px; border-bottom:1px solid #EDEEEB;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
}
.mdrawer-logo { display:flex; align-items:center; text-decoration:none; color:inherit; }
.mdrawer-logo img { height:34px; width:auto; display:block; }
.mdl-text {
  font-family:'Anek Bangla', system-ui, sans-serif;
  font-size:19px; font-weight:800; letter-spacing:-.3px; color:var(--green, #0F6E56);
}
.mdrawer-x {
  width:34px; height:34px; border-radius:10px; display:grid; place-items:center;
  border:0; background:#F4F5F3; color:#4A4F4C; font-size:18px; cursor:pointer; padding:0;
}

.mdrawer-nav { padding:10px 10px 16px; }

.md-main {
  display:flex; align-items:center; gap:12px;
  padding:11px 10px; border-radius:13px;
  text-decoration:none; color:inherit;
  font-family:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
.md-main + .md-main { margin-top:2px; }
.md-main:active { background:#F5F6F4; }
.md-ic { width:38px; height:38px; border-radius:12px; font-size:19px; }
.md-tx { display:flex; flex-direction:column; gap:1px; min-width:0; flex:1; }
.md-tx b  { font-size:14.5px; font-weight:650; letter-spacing:-.1px; line-height:1.25; }
.md-tx em {
  font-style:normal; font-size:11.5px; font-weight:400;
  color:var(--muted, #7A807C); letter-spacing:.1px; line-height:1.3;
}
.md-go { font-size:16px; opacity:.28; flex:0 0 auto; }

.md-sec {
  padding:16px 10px 8px; font-size:10.5px; font-weight:700;
  letter-spacing:1.3px; text-transform:uppercase; color:#9AA09C;
  font-family:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

.md-cat {
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:11px 10px; border-radius:11px; border-top:0;
  font-size:14px; color:#2C312E; text-decoration:none;
}
.md-cat + .md-cat { border-top:1px solid #F2F3F1; border-radius:0; }
.md-cat i { font-size:15px; opacity:.3; }
.md-cat:active { background:#F5F6F4; }
.md-all {
  margin-top:8px; border-top:0; border-radius:11px;
  background:var(--tint, #EDF5F1); color:var(--green, #0F6E56); font-weight:700;
  font-family:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
.md-all i { opacity:.75; }

.mdrawer-foot {
  font-family:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size:12px; letter-spacing:.2px;
}

@media (prefers-reduced-motion:reduce){
  .fbolt .fb-ring, .fbolt .fb-ring2, .fbolt .fb-shine { animation:none; }
  .fbolt .fb-shine { opacity:0; }
}

/* ══════════════════════════════════════════════════
   মোবাইলে ফ্ল্যাশ সেল — ২ কলামে ৪টা প্রোডাক্ট + View all
   ══════════════════════════════════════════════════ */
.flash-more { display:none; }

@media (max-width:899px){
  .flash-body { padding:12px; }

  /* পাশে-স্ক্রল রেল → দুই কলামের গ্রিড */
  .flash-rail {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    overflow:visible;
  }
  .flash-rail .f-card { flex:none; width:auto; }

  /* প্রথম ৪টা দেখাব, বাকিগুলো View all এ */
  .flash-rail .f-card:nth-child(n+5) { display:none; }

  /* নিচে View all বোতাম */
  .flash-more {
    display:flex; align-items:center; justify-content:center; gap:7px;
    margin-top:11px; padding:12px 14px;
    border-radius:12px; border:1px solid var(--line, #E4E2DC);
    background:#fff; color:var(--green, #0F6E56);
    font-family:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-size:13.5px; font-weight:650; letter-spacing:.1px;
    text-decoration:none;
  }
  .flash-more i { font-size:16px; transition:transform .2s ease; }
  .flash-more:active { background:var(--tint, #EDF5F1); }
  .flash-more:active i { transform:translateX(3px); }
}

/* ══════════════════════════════════════════════════
   ক্যাটাগরি — গোল ডাবল রিং (অ্যাম্বার রিং + সাদা ফাঁক)
   এক লাইনে পাশে-স্ক্রল
   ══════════════════════════════════════════════════ */
.cat-row { gap:10px; padding:20px 2px 8px; }
.cat-item { width:78px; }

.cat-ico {
  width:70px; height:70px; margin:0 auto;
  border-radius:50%;
  border:2px solid var(--amber);
  background:#fff;
  padding:3px;
  box-shadow:none;
  color:var(--green);
  font-size:24px;
  display:grid; place-items:center;
  overflow:hidden;
}
.cat-ico img {
  width:100%; height:100%;
  border-radius:50%;
  object-fit:cover;
  display:block;
}
.cat-item:active .cat-ico { transform:scale(.94); }

.cat-name {
  display:block; margin-top:8px;
  font-size:11.5px; font-weight:600;
  color:#2C312E; line-height:1.3;
}

@media (min-width:600px) {
  .cat-item { width:96px; }
  .cat-ico  { width:84px; height:84px; font-size:29px; padding:4px; }
  .cat-name { font-size:12.5px; margin-top:9px; }
}

@media (max-width:360px) {
  .cat-item { width:70px; }
  .cat-ico  { width:62px; height:62px; font-size:21px; }
  .cat-name { font-size:11px; }
}

/* ══════════════════════════════════════════════════
   প্রোডাক্ট পেজ — মূল বৈশিষ্ট্য (নম্বর দেওয়া বুলেট)
   ══════════════════════════════════════════════════ */
.pfeat { display:flex; flex-direction:column; gap:8px; }
.pfeat-row {
  display:flex; align-items:flex-start; gap:11px;
  background:#fff; border:1px solid var(--line);
  border-radius:12px; padding:11px 12px;
}
.pfeat-n {
  flex:0 0 26px; height:26px; border-radius:9px;
  background:var(--green-deep); color:var(--amber);
  display:grid; place-items:center;
  font-family:'PkNum','Hind Siliguri',sans-serif;
  font-size:11.5px; font-weight:800; letter-spacing:.3px;
}
.pfeat-t { font-size:13.5px; color:#2C312E; line-height:1.5; }

/* ══════════════════════════════════════════════════
   প্রোডাক্ট পেজ — বক্সে যা যা পাচ্ছেন (প্যাকিং লিস্ট)
   ══════════════════════════════════════════════════ */
.pbox {
  background:var(--tint);
  border:1px dashed #9FC3B4;
  border-radius:14px;
  padding:13px 14px;
}
.pbox-head {
  display:flex; align-items:center; gap:8px;
  margin-bottom:9px;
  font-size:14px; font-weight:800; color:#0A3B31;
}
.pbox-head i { font-size:18px; color:var(--green); }
.pbox-row {
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:8px 0;
  border-bottom:1px dashed #C3D9CF;
}
.pbox-row:last-child { border-bottom:0; padding-bottom:2px; }
.pbox-n { font-size:13.5px; color:#0A3B31; line-height:1.45; }
.pbox-q {
  flex:0 0 auto;
  font-family:'PkNum','Hind Siliguri',sans-serif;
  font-size:11.5px; font-weight:700; color:var(--green);
  white-space:nowrap;
}

@media (min-width:900px){
  .pfeat-t { font-size:14.5px; }
  .pfeat-n { flex:0 0 28px; height:28px; font-size:12.5px; }
  .pbox-n  { font-size:14.5px; }
  .pbox-head { font-size:15px; }
}

/* ══════════════════════════════════════════════════
   "কেন এটি নেবেন" — ডান কলামে (বোতাম ও ইনফো কার্ডের নিচে)
   ══════════════════════════════════════════════════ */
.pfeat-side { margin-top:16px; padding-top:16px; border-top:1px solid var(--line); }
.pfeat-h {
  margin:0 0 2px;
  font-size:14.5px; font-weight:800; color:var(--ink);
  letter-spacing:-.2px;
}
.pfeat-side .pfeat-row { padding:10px 11px; }
.pfeat-side .pfeat-t { font-size:13px; line-height:1.45; }
.pfeat-side .pfeat-n { flex:0 0 24px; height:24px; border-radius:8px; font-size:11px; }

@media (min-width:900px){
  .pfeat-side .pfeat-t { font-size:13.5px; }
  .pfeat-side .pfeat-n { flex:0 0 26px; height:26px; font-size:11.5px; }
  .pfeat-h { font-size:15px; }
}

/* প্রোডাক্টের ছবি — পুরো বক্স জুড়ে, চারপাশে খালি জায়গা নেই */
.slide img { padding:0; object-fit:cover; }

/* মোবাইলে ৫টার বেশি থাম্বনেইলে পেজ চওড়া হয়ে যেত —
   গ্রিডের ঘরকে ছোট হতে দিলাম, থাম্বনেইল নিজে স্ক্রল করবে */
.pdp-media, .pdp-info { min-width:0; }
.pd-thumbs { max-width:100%; min-width:0; }

/* ছবির উপরের পিছনে-যাওয়ার তীর — সরানো হলো (মোবাইল ও ডেস্কটপ দুটোতেই) */
.sl-back { display:none !important; }

/* ডেস্কটপে ছবির কলাম সামান্য সরু, ডান কলাম একটু চওড়া।
   max-width দিলে ছবি কলামের ভিতরে ছোট হয়ে বাঁয়ে সরে যেত আর
   ডানে ফাঁকা পড়ত — তাই কলামের অনুপাতই বদলালাম, ছবি কলাম
   পুরো ভরে থাকবে। */
@media (min-width:1000px){
  .pdp { grid-template-columns:minmax(0,0.92fr) minmax(0,1.08fr); }
  .pdp-media { max-width:none; }
}

/* ══════════════════════════════════════════════════
   গ্যালারিতে ভিডিও স্লাইড
   ══════════════════════════════════════════════════ */
.slide-vid { position:relative; cursor:pointer; }
.slide-vid img { object-fit:cover; }
.vid-play {
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:62px; height:62px; border-radius:50%;
  background:rgba(10,12,11,.62); color:#fff;
  display:grid; place-items:center; font-size:26px;
  box-shadow:0 6px 24px rgba(0,0,0,.3);
  animation:vidPulse 2.2s ease-in-out infinite;
}
@keyframes vidPulse {
  0%,100% { box-shadow:0 6px 24px rgba(0,0,0,.3), 0 0 0 0 rgba(255,255,255,.35); }
  60%     { box-shadow:0 6px 24px rgba(0,0,0,.3), 0 0 0 14px rgba(255,255,255,0); }
}
.slide-vid iframe { width:100%; height:100%; border:0; display:block; }
.pd-thumbs .th-vid { position:relative; }
.th-play {
  position:absolute; inset:0; display:grid; place-items:center;
  background:rgba(10,12,11,.35); color:#fff; font-size:16px; border-radius:inherit;
}

/* ══════════════════════════════════════════════════
   দামের পাশে সাশ্রয়ের ব্যাজ (ইংরেজি সংখ্যায়)
   ══════════════════════════════════════════════════ */
.save-pill {
  position:relative; overflow:hidden;
  display:inline-flex; align-items:center; gap:5px;
  background:var(--red); color:#fff;
  border-radius:20px; padding:5px 12px;
  font-size:12.5px; font-weight:800; letter-spacing:.2px;
  white-space:nowrap;
  animation:savePop 2.8s ease-in-out infinite;
}
.save-pill i { font-size:14px; }
.save-pill .sp-t { position:relative; z-index:1; }
.sp-shine {
  position:absolute; top:0; bottom:0; width:34px;
  background:rgba(255,255,255,.35);
  transform:skewX(-18deg) translateX(-60px);
  animation:saveShine 2.8s ease-in-out infinite;
}
@keyframes savePop   { 0%,100%{transform:scale(1)} 50%{transform:scale(1.045)} }
@keyframes saveShine { 0%,55%{transform:skewX(-18deg) translateX(-60px)} 85%,100%{transform:skewX(-18deg) translateX(190px)} }

/* ══════════════════════════════════════════════════
   "স্টকে আছে · দ্রুত ডেলিভারি" ব্যাজ
   ══════════════════════════════════════════════════ */
.instock {
  display:inline-flex; align-items:center; gap:8px;
  background:var(--tint); border:1px solid #D3E6DD;
  border-radius:30px; padding:7px 14px 7px 9px;
  margin-bottom:12px;
}
.is-dot { width:20px; height:20px; flex:0 0 20px; overflow:visible; }
.is-dot .isd-core { fill:var(--green); }
.is-dot .isd-wave { fill:none; stroke:var(--green); stroke-width:1.6; opacity:0; transform-origin:center; transform-box:fill-box; animation:isWave 2.1s ease-out infinite; }
.is-dot .isd-w2 { animation-delay:1.05s; }
@keyframes isWave { 0%{opacity:.5; transform:scale(.45)} 70%{opacity:0; transform:scale(1.15)} 100%{opacity:0} }

.is-t {
  font-size:12.5px; font-weight:700; color:#0A3B31; letter-spacing:.1px;
  background:linear-gradient(100deg,#0A3B31 0%,#0A3B31 42%,#1FA97F 50%,#0A3B31 58%,#0A3B31 100%);
  background-size:240% 100%;
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
  animation:isShine 4.5s ease-in-out infinite;
}
@keyframes isShine { 0%,100%{background-position:120% 0} 55%{background-position:-30% 0} }
@supports not ((-webkit-background-clip:text) or (background-clip:text)) {
  .is-t { color:#0A3B31; -webkit-text-fill-color:#0A3B31; background:none; animation:none; }
}

/* ══════════════════════════════════════════════════
   ট্রাস্ট কার্ড — কালো লেখা + এনিমেটেড SVG আইকন
   ══════════════════════════════════════════════════ */
.trust-item span { color:var(--ink); font-weight:600; }
.tr-ic { width:28px; height:22px; flex:0 0 auto; overflow:visible; }
.tr-ic line, .tr-ic rect, .tr-ic path, .tr-ic circle, .tr-ic polyline {
  fill:none; stroke:var(--green); stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round;
}
.tr-van .trv-body  { animation:trvBob 1.8s ease-in-out infinite; }
.tr-van .trv-w     { animation:trvSpin 1.3s linear infinite; transform-origin:center; transform-box:fill-box; }
.tr-van .trv-speed line { animation:trvDash 1.3s linear infinite; }
.tr-van .trv-speed line:nth-child(2){ animation-delay:.18s; }
@keyframes trvBob  { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-1px)} }
@keyframes trvSpin { to{transform:rotate(360deg)} }
@keyframes trvDash { 0%{opacity:0; transform:translateX(3px)} 45%{opacity:.8} 100%{opacity:0; transform:translateX(-4px)} }

.tr-cash .trc-coin { animation:trcCoin 2.4s ease-in-out infinite; transform-origin:center; transform-box:fill-box; }
.tr-cash .trc-hand { animation:trcHand 2.4s ease-in-out infinite; }
@keyframes trcCoin { 0%,100%{transform:translateY(0)} 45%{transform:translateY(-2px)} }
@keyframes trcHand { 0%,100%{transform:translateY(0); opacity:.75} 45%{transform:translateY(1px); opacity:1} }

.tr-ret .trr-arc { stroke-dasharray:46; stroke-dashoffset:46; animation:trrDraw 2.6s ease-in-out infinite; }
@keyframes trrDraw { 0%{stroke-dashoffset:46} 45%,70%{stroke-dashoffset:0} 100%{stroke-dashoffset:-46} }

/* ══════════════════════════════════════════════════
   COD বোতাম আড়ালে গেলে নিচে স্টিকি
   ══════════════════════════════════════════════════ */
.cod-stick {
  position:fixed; left:0; right:0; z-index:80;
  bottom:calc(60px + env(safe-area-inset-bottom,0px));
  padding:9px 14px;
  background:rgba(255,255,255,.97);
  backdrop-filter:blur(10px);
  border-top:1px solid var(--line);
  box-shadow:0 -6px 22px rgba(0,0,0,.09);
  transform:translateY(115%);
  transition:transform .26s cubic-bezier(.22,.7,.3,1);
}
.cod-stick[hidden] { display:none; }
.cod-stick.on { transform:translateY(0); }
.cod-stick .cod-btn { margin:0; width:100%; }

@media (min-width:1000px){
  .cod-stick { bottom:0; padding:12px 16px; }
  .cod-stick .cod-btn { max-width:520px; margin:0 auto; }
}

@media (prefers-reduced-motion:reduce){
  .vid-play, .save-pill, .sp-shine, .is-t, .is-dot .isd-wave,
  .tr-van .trv-body, .tr-van .trv-w, .tr-van .trv-speed line,
  .tr-cash .trc-coin, .tr-cash .trc-hand, .tr-ret .trr-arc { animation:none; }
  .tr-ret .trr-arc { stroke-dashoffset:0; }
  .is-t { -webkit-text-fill-color:#0A3B31; color:#0A3B31; }
}

/* ══════════════════════════════════════════════════
   মোবাইলে দামের লাইনটা একটু উপরে তোলা —
   না হলে নিচের স্টিকি বার দামটা ঢেকে দিত
   ══════════════════════════════════════════════════ */
@media (max-width:999px){
  .pdp { padding-top:10px; gap:12px; }

  /* সোয়াইপের ইঙ্গিত মোবাইলে দরকার নেই — আঙুল দিয়ে এমনিতেই বোঝা যায় */
  .hint-swipe { display:none; }

  .pd-thumbs { margin-top:8px; }
  .pd-thumbs button { width:50px; height:50px; border-radius:11px; padding:4px; }

  .pd-title { font-size:20px; margin-top:9px; line-height:1.35; }
  .pd-short { margin-top:5px; line-height:1.6; }
  .pd-price { margin-top:10px; }

  /* স্টিকি বারটাও একটু পাতলা */
  .cod-stick { padding:7px 12px; }
  .cod-stick .cod-btn { min-height:56px; }
}

/* COD বোতামের সোনালি রং শুধু এনিমেশনে ছিল, নিজের রং ছিল না।
   তাই স্টিকি বার দেখা যাওয়ার মুহূর্তে (আর Reduce Motion চালু
   থাকলে সবসময়) বোতামটা সাদা দেখাত। এখন রংটা স্থায়ীভাবে বসালাম। */
.cod-btn { background:#EF9F27; }