/* रंग .shop वाली दुकान से नापकर लिए हैं — स्क्रीनशॉट के असली पिक्सल से,
   अंदाज़े से नहीं. गहरा बैंगनी हेडर, हल्का क्रीम पन्ना. */
:root{
  --lac:#3A1B3D;          /* header, patti — gehra baingani */
  --lac-deep:#2A1230;     /* usse gehra */
  --btn:#371931;          /* ADD TO CART / EXPRESS BUY */
  --marigold:#E8A33D;
  --gold:#B8912F;
  --ink:#1D1916;
  /* ⚠️ यह #7A6E72 था — क्रीम पन्ने पर अनुपात सिर्फ़ 4.45 आता था,
     नियम 4.5 माँगता है. बस इतना गहरा किया कि नियम पूरा हो और
     दिखने में फ़र्क़ भी न पड़े. */
  --muted:#6B6064;
  --paper:#FDF1E3;        /* panna — halka gehra kreem */
  --card:#FFF3E5;         /* card — usse halka ujla, isse card ubhar kar dikhta hai */
  --line:#EADFD2;
  --wrap:1080px;
}

*{box-sizing:border-box}
/* [hidden] hamesha jeete — warna display:flex/grid wale rule use hara dete hain.
   Ye galti do baar ho chuki hai, isliye upar hi pakka kar diya. */
[hidden]{display:none !important}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"Mukta",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:16px;
  line-height:1.55;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
s{color:var(--muted);font-weight:400}
:focus-visible{outline:3px solid var(--marigold);outline-offset:2px}

/* ---------- header ---------- */
.bar{
  position:sticky;top:0;z-index:40;
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;padding:10px 16px;
  background:var(--lac);color:#fff;
  box-shadow:0 1px 0 rgba(0,0,0,.15);
}
.brand{display:flex;align-items:center;gap:10px;min-width:0}
.brand-mark{
  flex:none;width:34px;height:34px;border-radius:50%;
  display:grid;place-items:center;
  background:var(--marigold);color:var(--lac-deep);
  font-family:"Tiro Devanagari Hindi",serif;font-size:19px;line-height:1;
}
.brand-name{
  font-family:"Tiro Devanagari Hindi",serif;
  font-size:19px;letter-spacing:.01em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.cart-btn{
  flex:none;display:flex;align-items:center;gap:7px;
  padding:7px 14px;border-radius:999px;
  border:1px solid rgba(255,255,255,.45);
  font-weight:600;font-size:14px;
}
.cart-count{
  min-width:21px;height:21px;padding:0 5px;border-radius:999px;
  display:grid;place-items:center;
  background:var(--marigold);color:var(--lac-deep);
  font-size:12px;font-weight:800;
}

/* ---------- hero ---------- */
.hero{
  padding:34px 20px 30px;text-align:center;
  background:linear-gradient(180deg,var(--lac) 0%,var(--lac-deep) 100%);
  color:#FFF3E4;
}
.hero .eyebrow{
  margin:0 0 10px;font-size:12px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--marigold);
}
.hero h1{
  margin:0;font-family:"Tiro Devanagari Hindi",serif;
  font-size:clamp(26px,7vw,42px);line-height:1.3;font-weight:400;color:#fff;
}
.hero-sub{margin:12px auto 0;max-width:36ch;font-size:15px;opacity:.9}

/* ---------- category strip ---------- */
.cats{
  display:flex;gap:20px;overflow-x:auto;
  padding:18px 16px;
  /* kam category hon to beech me, zyada hon to scroll —
     'safe' se bayan kinara kabhi katta nahi */
  justify-content:safe center;
  border-bottom:1px solid var(--line);
  scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.cats::-webkit-scrollbar{display:none}
.cat{flex:none;width:104px;text-align:center}
.cat-dot{
  display:grid;place-items:center;overflow:hidden;
  width:96px;height:96px;margin:0 auto 10px;border-radius:50%;
  background:#F6EDE3;border:2px solid var(--line);
  box-shadow:0 2px 10px rgba(0,0,0,.07);
}
.cat-dot img{width:100%;height:100%;object-fit:cover}
.cat.is-on .cat-dot{border-color:var(--lac)}
.cat-label{
  display:block;font-size:14px;line-height:1.3;color:var(--ink);
  font-weight:700;letter-spacing:.2px;
}
.cat.is-on .cat-label{color:var(--lac)}
@media(min-width:620px){
  .cats{gap:28px}
  .cat{width:128px}
  .cat-dot{width:118px;height:118px}
  .cat-label{font-size:15px}
}

/* ---------- layout ---------- */
.wrap{max-width:var(--wrap);margin:0 auto;padding:26px 16px 34px}
.wrap.narrow{max-width:560px}
.wrap.center{text-align:center}
.sec-title{
  margin:0 0 4px;font-family:"Tiro Devanagari Hindi",serif;
  font-size:23px;font-weight:400;
}
.sec-count{margin:0 0 16px;font-size:13.5px;color:var(--muted)}
.sec-title + .grid{margin-top:16px}
.empty{color:var(--muted);font-size:15px}

/* ---------- product grid ---------- */
.grid{
  display:grid;gap:14px;
  grid-template-columns:repeat(2,1fr);
}
@media(min-width:620px){.grid{grid-template-columns:repeat(3,1fr);gap:18px}}
@media(min-width:900px){.grid{grid-template-columns:repeat(4,1fr)}}

/* ⚠️ पहले कार्ड पर साफ़ लकीर थी, इसलिए हर फोटो डिब्बे में कैद दिखती थी.
   .shop पर लकीर नहीं है — सिर्फ़ हल्की परछाईं, और फोटो कार्ड के अंदर
   चारों तरफ़ थोड़ी जगह छोड़कर बैठती है (नापा हुआ ~4px), अपने गोल कोनों
   के साथ. इसी से वो खुली-खुली और सजी हुई लगती है. */
/* डिब्बा साफ़ दिखे — .shop पर कार्ड के किनारे पर हल्की पर पक्की लकीर है
   (नापी: #E7DDD1). इसलिए परछाईं थोड़ी गहरी रखी है, वरना कार्ड पन्ने में
   घुल जाता है और "डिब्बा" लगता ही नहीं. */
.card{
  border:0;border-radius:14px;
  background:var(--card);display:flex;flex-direction:column;
  box-shadow:0 1px 3px rgba(120,90,65,.18), 0 4px 12px rgba(120,90,65,.10);
  padding:4px;
}
/* ⚠️ फोटो चौकोर (1:1) थी, इसलिए छोटी लगती थी.
   .shop पर नापा — 468 चौड़ी × 630 ऊँची, यानी 3:4.
   गहनों में लंबी खिड़की ही सही है: चेन, हार और मांगलसूत्र पूरे दिखते हैं. */
.card-img{
  position:relative;aspect-ratio:3/4;
  border-radius:11px;overflow:hidden;background:var(--card);
}
/* ⚠️ पहले यहाँ object-fit:cover था — फोटो खिड़की भर तो देती थी, पर
   किनारे काट देती थी. अब contain — पूरा गहना दिखता है, और बची जगह में
   कार्ड का अपना रंग (रात वाले रंग में भी अपने आप सही). */
.card-img img{width:100%;height:100%;object-fit:contain}
.off{
  position:absolute;left:8px;top:8px;
  padding:3px 8px;border-radius:4px;
  background:var(--lac);color:#fff;font-size:11.5px;font-weight:700;
}
/* card ab khud 4px padding leta hai, isliye yahan thoda kam */
.card-body{padding:8px 7px 9px}
.card-name{
  margin:0 0 4px;font-size:14.5px;font-weight:600;line-height:1.35;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.card-price{margin:0;font-size:15.5px;font-weight:800;color:var(--lac)}
.card-price s{margin-left:5px;font-size:13px;font-weight:400}
.noimg{
  display:grid;place-items:center;width:100%;height:100%;
  color:var(--muted);font-size:13px;
}
.noimg.big{aspect-ratio:1/1;background:var(--card);border-radius:10px}

/* ---------- product detail ---------- */
.pdp{max-width:var(--wrap);margin:0 auto;padding:0 0 10px}
@media(min-width:820px){
  /* photo poori chaudai me — jaise unki site par dikhti hai */
  .pdp{max-width:none;padding:0}
  .pdp-media{max-width:none}
  .gal-track img,.gal-vid{max-height:78vh}
  .gal-track img{object-fit:contain;background:var(--card)}
  .pdp-info{max-width:1080px;margin:0 auto;padding:22px 16px 0}
  .chip-row{max-width:1080px;margin:0 auto}
}
/* ---------- photo slider ---------- */
.gal{position:relative}
.gal-track{
  display:flex;overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.gal-track::-webkit-scrollbar{display:none}
.gal-track img{
  flex:none;width:100%;aspect-ratio:1/1;object-fit:cover;scroll-snap-align:center;
}
.gal-vid{
  flex:none;width:100%;aspect-ratio:1/1;scroll-snap-align:center;
  background:#000;display:grid;place-items:center;
}
.gal-vid video{width:100%;height:100%;object-fit:contain;display:block}
.gal-nav{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:36px;height:36px;border-radius:50%;border:0;cursor:pointer;
  background:rgba(255,255,255,.88);color:var(--ink);
  font-size:22px;line-height:1;display:grid;place-items:center;
  box-shadow:0 2px 8px rgba(0,0,0,.16);
}
.gal-nav.prev{left:10px}
.gal-nav.next{right:10px}
.gal-dots{
  position:absolute;left:0;right:0;bottom:12px;z-index:3;
  display:flex;justify-content:center;gap:6px;
}
.gal-dots button{
  width:7px;height:7px;padding:0;border:0;border-radius:50%;cursor:pointer;
  background:rgba(255,255,255,.55);
}
.gal-dots button.on{background:var(--card);width:20px;border-radius:99px}
.gal-count{
  position:absolute;left:12px;bottom:10px;z-index:3;
  padding:3px 9px;border-radius:99px;
  background:rgba(0,0,0,.55);color:#fff;font-size:11.5px;font-weight:600;
}
@media(min-width:820px){
  /* bade screen par bhi ek hi photo poori chaudai me — slider chalta rahe */
  .gal-track img{border-radius:12px}
  .gal-nav{width:42px;height:42px;font-size:26px}
}

.pdp-info{padding:18px 16px 0}
@media(min-width:820px){.pdp-info{padding:0}}
.crumb{
  font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gold);
}
.pdp-name{
  margin:6px 0 18px;font-family:"Tiro Devanagari Hindi",serif;
  font-size:clamp(22px,5.5vw,30px);font-weight:400;line-height:1.3;
}

/* signature: dukaan ka latakta hua price tag */
.tag{
  position:relative;display:inline-block;
  margin:0 0 20px 14px;padding:13px 20px 13px 26px;
  background:var(--lac);color:#fff;
  border-radius:4px 8px 8px 4px;
  transform:rotate(-1.6deg);
}
.tag::before{
  content:"";position:absolute;left:9px;top:50%;transform:translateY(-50%);
  width:9px;height:9px;border-radius:50%;
  background:var(--paper);box-shadow:inset 0 0 0 1px rgba(0,0,0,.15);
}
.tag::after{
  content:"";position:absolute;right:100%;top:50%;
  width:22px;height:2px;background:var(--gold);
  transform:translateY(-50%) rotate(-16deg);transform-origin:right center;
}
.tag-price{font-size:25px;font-weight:800;line-height:1}
.tag-mrp{display:block;margin-top:3px;font-size:12.5px;color:var(--marigold)}
.tag-mrp s{color:rgba(255,255,255,.65)}

.pdp-desc{margin:0 0 18px;font-size:15px;color:#453733}
.trust{
  margin:0 0 22px;padding:0;list-style:none;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
.trust li{
  padding:9px 0 9px 22px;font-size:14px;color:var(--muted);
  border-bottom:1px solid var(--line);position:relative;
}
.trust li:last-child{border-bottom:0}
.trust li::before{
  content:"";position:absolute;left:4px;top:17px;
  width:7px;height:7px;border-radius:50%;background:var(--marigold);
}
.oos{color:var(--lac);font-weight:600}

/* ---------- buttons ---------- */
.pdp-actions{display:flex;gap:10px;flex-wrap:wrap;padding-bottom:8px}
.btn{
  appearance:none;border:0;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
  min-height:50px;padding:0 24px;border-radius:8px;
  font-family:inherit;font-size:16px;font-weight:700;
  transition:transform .12s ease,background .12s ease;
}
.btn:active{transform:scale(.985)}
/* kharidne wale button ka rang header se thoda alag — .shop me bhi wahi */
.btn-buy{background:var(--btn);color:#fff;flex:1 1 190px}
.btn-buy:hover{background:var(--lac-deep)}
.btn-ghost{
  background:var(--card);color:var(--lac);
  box-shadow:inset 0 0 0 2px var(--lac);flex:1 1 160px;
}
.btn.full{width:100%}

/* ---------- cart ---------- */
.crow{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}
.crow img{width:74px;height:74px;object-fit:cover;border-radius:8px;flex:none;background:#F6EDE3}
.crow-mid{flex:1;min-width:0}
.crow-name{margin:0 0 3px;font-size:15px;font-weight:600}
.crow-price{margin:0;font-size:15px;font-weight:800;color:var(--lac)}
.qty{display:flex;align-items:center;gap:10px;margin-top:8px}
.qty button{
  width:32px;height:32px;border-radius:6px;border:1px solid var(--line);
  background:var(--card);font-size:18px;line-height:1;cursor:pointer;color:var(--ink);
}
.qty span{min-width:22px;text-align:center;font-weight:700}
.crow-del{
  align-self:flex-start;background:none;border:0;cursor:pointer;
  color:var(--muted);font-size:13px;font-family:inherit;padding:2px 0;
}
.cart-foot{margin-top:22px}
.cart-total{margin:0 0 14px;font-size:19px}
.cart-total strong{color:var(--lac)}

/* ---------- form ---------- */
/* बाहर की गद्दी हटा दी — अब अंदर की पट्टी और ब्योरा अपनी गद्दी लेते हैं */
.summary{
  margin-bottom:16px;padding:0;
  background:var(--card);border:1px solid var(--line);
  border-radius:12px;font-size:14.5px;overflow:hidden;
}
.summary .sline{display:flex;justify-content:space-between;padding:3px 0}
.summary .sline.big{
  margin-top:7px;padding-top:9px;border-top:1px solid var(--line);
  font-size:17px;font-weight:800;color:var(--lac);
}
.form label{display:block;margin-bottom:14px;font-size:14px;font-weight:600}
.form input,.form textarea{
  width:100%;margin-top:5px;padding:12px 13px;
  border:1px solid var(--line);border-radius:8px;background:var(--card);
  font-family:inherit;font-size:16px;color:var(--ink);
}
.form input:focus,.form textarea:focus{border-color:var(--lac);outline:none}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pay-line{
  margin:6px 0 16px;padding:12px 14px;border-radius:8px;
  background:#F9F1E8;font-size:14.5px;
}
.err{
  margin:0 0 12px;padding:11px 14px;border-radius:8px;
  background:#FCE9EC;color:var(--lac-deep);font-size:14.5px;font-weight:600;
}

.summary .sline.off{color:var(--ok,#137A4B)}
.summary .sline.split{font-size:13.5px;color:var(--muted)}
.summary .sline.split:first-of-type{margin-top:6px}

.coupon-box{display:flex;gap:9px;margin-bottom:10px}
.coupon-box input{
  flex:1;padding:12px 13px;border:1px solid var(--line);border-radius:8px;
  font-family:inherit;font-size:16px;text-transform:uppercase;
}
.coupon-box .btn{flex:0 0 auto;min-height:46px;padding:0 18px;font-size:14.5px}
.coupon-msg{margin:0 0 14px;font-size:14px;font-weight:600;color:var(--lac)}
.coupon-msg.ok{color:#137A4B}

.sub-title{margin:20px 0 10px;font-size:15px;font-weight:800}
/* ---------- भुगतान का तरीका — डिब्बे वाला रूप ---------- */
.paymode{padding:15px 14px}
.pm-head{display:flex;align-items:center;gap:9px;margin-bottom:13px;flex-wrap:wrap}
.pm-head b{font-size:16px}
.pm-rec{
  padding:4px 10px;border-radius:7px;background:#EAF6EE;
  color:#137A4B;font-size:12px;font-weight:800;
}
.pm-tag{
  display:inline-block;margin-bottom:5px;padding:3px 9px;border-radius:6px;
  background:#EFEAE4;color:#6B5B52;
  font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
}
.pm-off{
  flex:none;align-self:center;padding:7px 12px;border-radius:99px;
  background:#137A4B;color:#fff;font-size:12.5px;font-weight:800;white-space:nowrap;
}
.pay-opts{display:grid;gap:10px;margin-bottom:12px}
.pay-opt{
  display:flex;align-items:flex-start;gap:11px;margin:0;
  padding:13px 14px;border:1.5px solid var(--line);border-radius:12px;
  background:var(--card);cursor:pointer;font-weight:400;
}
.pay-opt:has(input:checked){border:2px solid var(--ink);background:#F6F2EE;padding:12.5px 13.5px}
.pay-opt input{width:20px;height:20px;margin:2px 0 0;flex:none;accent-color:var(--ink)}
.pay-body{flex:1;min-width:0}
.pay-body b{display:block;font-size:15.5px}
.pay-body small{display:block;margin-top:2px;font-size:13.5px;color:var(--muted)}
html.dark .pm-rec{background:#16241C}
html.dark .pm-tag{background:#2A2426;color:#C9BDB4}
html.dark .pay-opt:has(input:checked){background:#2A2426}

.chk-line{
  display:flex;align-items:flex-start;gap:10px;margin:0 0 18px;
  padding:12px 14px;border-radius:8px;background:#FDF3E9;
  font-size:13.5px;font-weight:400;line-height:1.5;
}
.chk-line input{width:20px;height:20px;margin:1px 0 0;flex:none;accent-color:var(--lac)}
.chk-line a{color:var(--lac);font-weight:600;text-decoration:underline}

/* ---------- policy pages ---------- */
.prose h3{margin:22px 0 7px;font-size:16px;font-weight:800}
.prose p,.prose li{font-size:15px;color:#453733;margin:0 0 11px}
.prose ul{margin:0 0 14px;padding-left:20px}
.prose li{margin-bottom:6px}
.prose a{color:var(--lac);text-decoration:underline}
.prose-foot{margin-top:26px;padding-top:14px;border-top:1px solid var(--line);
  font-size:13px;color:var(--muted)}

.foot-links{
  display:flex;flex-wrap:wrap;justify-content:center;gap:4px 10px;
  margin-top:16px;padding-top:14px;
  border-top:1px solid rgba(255,255,255,.18);font-size:13px;
}
/* ⚠️ इन लिंक पर कोई गद्दी नहीं थी — 13px की लिखावट यानी ~18px ऊँचाई.
   नियम कम से कम 24px माँगता है, और उँगली से दबाने पर बगल वाला लिंक
   दब जाता था. अब हर लिंक के चारों तरफ़ जगह है. */
.foot-links a{
  display:inline-block;padding:5px 7px;min-height:24px;line-height:1.5;
  text-decoration:underline;opacity:.85;
}

/* ---------- order done ---------- */
.done-tick{
  width:62px;height:62px;margin:14px auto 16px;border-radius:50%;
  display:grid;place-items:center;
  background:var(--lac);color:#fff;font-size:30px;
}
.done-no{margin:0 0 8px;font-size:17px}
.done-sub{margin:0 0 24px;color:var(--muted);font-size:15px}

/* ---------- footer / whatsapp ---------- */
.foot{
  margin-top:20px;padding:28px 20px 90px;text-align:center;
  background:var(--lac-deep);color:#F3E2D6;font-size:14px;
}
.foot p{margin:3px 0}
.foot a{text-decoration:underline}
.foot-name{
  font-family:"Tiro Devanagari Hindi",serif;font-size:19px;
  color:var(--marigold);margin-bottom:8px;
}
.foot-note{margin-top:12px;font-size:13px;opacity:.75}


@media(prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
  .dtruck{left:50%}
  .tag{transform:none}
}

/* ============ Round 1 additions ============ */

/* ---------- dark mode ---------- */
html.dark{
  --paper:#17110F;
  --ink:#F3E8E0;
  --muted:#A99A93;
  --line:#3A2C27;
  --lac:#C8455C;
  --lac-deep:#8C1D2F;
}
html.dark body{background:var(--paper);color:var(--ink)}
html.dark .card,html.dark .pay-opt,html.dark .coupon-box input,
html.dark .form input,html.dark .form textarea,html.dark .form select,
html.dark .searchbar,html.dark .nav,html.dark .track-card{
  background:#211814;color:var(--ink);border-color:var(--line);
}
html.dark .card-img,html.dark .noimg.big,html.dark .cat-dot{background:#2B201B}
html.dark .summary,html.dark .pay-line,html.dark .chk-line{background:#241A16}
html.dark .chip{background:#241A16;border-color:var(--line);color:var(--muted)}
html.dark .btn-ghost{background:transparent}
html.dark .btn-add{background:#2B201B;color:var(--ink)}

/* ---------- announcement bar ---------- */
.announce{
  overflow:hidden;background:var(--lac-deep);color:#F0D9BE;
  font-size:12.5px;padding:6px 0;white-space:nowrap;
}
.announce-run{
  display:inline-block;padding-left:100%;
  animation:announce 26s linear infinite;
}
.announce-run span{padding:0 4px}
.announce-run i{padding:0 12px;color:var(--marigold);font-style:normal}
@keyframes announce{from{transform:translateX(0)}to{transform:translateX(-100%)}}

/* ---------- header extras ---------- */
.bar{gap:8px}
.bar-actions{display:flex;align-items:center;gap:2px;flex:none}
.icon-btn{
  position:relative;display:grid;place-items:center;
  width:38px;height:38px;border-radius:8px;
  background:none;border:0;color:inherit;cursor:pointer;padding:0;
}
.icon-btn:active{background:rgba(255,255,255,.15)}
.dot{
  position:absolute;top:3px;right:2px;
  min-width:17px;height:17px;padding:0 4px;border-radius:99px;
  display:grid;place-items:center;
  background:var(--marigold);color:var(--lac-deep);
  font-size:10.5px;font-weight:800;line-height:1;
}
.brand{flex:1;justify-content:center}
@media(min-width:700px){.brand{flex:0 1 auto;justify-content:flex-start}}

/* ---------- search bar ---------- */
.searchbar{
  display:flex;align-items:center;gap:9px;
  margin:0;padding:9px 14px;
  background:var(--card);border-bottom:1px solid var(--line);
  color:var(--muted);
}
.searchbar input{
  flex:1;border:0;outline:none;background:none;
  font-family:inherit;font-size:15px;color:var(--ink);
}

/* ---------- slide-out nav ---------- */
.nav{
  position:fixed;top:0;left:0;bottom:0;z-index:60;
  width:270px;max-width:82vw;padding:56px 0 24px;
  background:var(--card);border-right:1px solid var(--line);
  transform:translateX(-102%);transition:transform .22s ease;
  overflow-y:auto;
}
.nav.open{transform:translateX(0)}
.nav > a,.nav-drop summary{
  display:block;padding:13px 22px;
  font-size:15.5px;font-weight:600;cursor:pointer;
  border-bottom:1px solid var(--line);
}
.nav-drop summary{list-style:none}
.nav-drop summary::-webkit-details-marker{display:none}
.nav-drop summary::after{content:" ▾";color:var(--muted)}
.nav-sub{padding:4px 0 8px;background:#FBF5EF}
html.dark .nav-sub{background:#1B1310}
.nav-sub a{display:block;padding:9px 34px;font-size:14.5px;color:var(--muted)}
.nav-close{
  position:absolute;top:12px;right:14px;
  width:34px;height:34px;border-radius:8px;
  border:1px solid var(--line);background:none;color:inherit;
  font-size:15px;cursor:pointer;
}
.scrim{position:fixed;inset:0;z-index:55;background:rgba(0,0,0,.45)}

/* ---------- hero button ---------- */
.btn-hero{
  margin-top:18px;background:var(--marigold);color:var(--lac-deep);
  min-height:46px;padding:0 26px;
}

/* ---------- section head ---------- */
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.sec-more{font-size:14px;font-weight:600;color:var(--lac);white-space:nowrap}

/* ---------- card additions ---------- */
.card{position:relative}
.card-link{display:flex;flex-direction:column;flex:1}
.card-rate{margin:0 0 4px;font-size:12.5px;display:flex;align-items:center}
.stars{color:#B8891F;font-weight:700}
.stars small{color:var(--muted);font-weight:400}
.wish{
  position:absolute;top:7px;right:7px;z-index:2;
  width:32px;height:32px;border-radius:50%;
  display:grid;place-items:center;
  background:rgba(255,255,255,.92);border:0;cursor:pointer;
  color:var(--muted);
}
.wish.on{color:var(--lac)}
.wish.on svg{fill:var(--lac)}
.card-cta{padding:0 10px 10px}
.btn-add{
  width:100%;min-height:38px;border:0;border-radius:7px;cursor:pointer;
  background:#F4E7DA;color:var(--lac);
  font-family:inherit;font-size:13.5px;font-weight:700;
}
.btn-add:active{transform:scale(.98)}
.qty-inline{
  display:flex;align-items:center;justify-content:space-between;gap:6px;
  border:1px solid var(--lac);border-radius:7px;overflow:hidden;
}
.qty-inline button{
  width:34px;min-height:36px;border:0;background:var(--lac);color:#fff;
  font-size:17px;line-height:1;cursor:pointer;
}
.qty-inline span{flex:1;text-align:center;font-size:12.5px;font-weight:700;color:var(--lac)}

/* ---------- filters / chips ---------- */
.filters{margin:0 0 18px}
.chips{
  display:flex;gap:8px;overflow-x:auto;padding:2px 0 10px;
  scrollbar-width:none;
}
.chips::-webkit-scrollbar{display:none}
.chip{
  flex:none;padding:7px 15px;border-radius:99px;
  background:var(--card);border:1px solid var(--line);
  font-size:13.5px;font-weight:600;color:var(--muted);white-space:nowrap;
}
.chip.is-on{background:var(--lac);border-color:var(--lac);color:#fff}
.sorts{padding-bottom:2px}

/* ---------- pager ---------- */
.pager{
  display:flex;align-items:center;justify-content:center;gap:12px;
  margin-top:26px;font-size:14px;color:var(--muted);
}
.pager .btn{min-height:42px;padding:0 16px;font-size:14px;flex:0 0 auto}

/* ---------- pdp additions ---------- */
.pdp-rate{margin:-10px 0 14px}
.link-btn{
  display:block;margin-top:12px;padding:6px 0;
  background:none;border:0;cursor:pointer;
  color:var(--lac);font-family:inherit;font-size:14.5px;font-weight:600;
}

/* ---------- reviews ---------- */
.reviews{padding-top:8px}
.rev{padding:13px 0;border-bottom:1px solid var(--line)}
.rev-top{margin:0 0 4px;font-size:14.5px}
.rev-text{margin:0;font-size:14.5px;color:var(--muted)}
.rev-form{margin-top:20px}
.rev-form summary{
  padding:12px 0;font-size:15px;font-weight:700;color:var(--lac);cursor:pointer;
}
.note{margin:0 0 14px;font-size:13.5px;color:var(--muted)}

/* ---------- track ---------- */
.track-card{
  margin-top:22px;padding:16px 18px;
  background:var(--card);border:1px solid var(--line);border-radius:10px;
}
.track-no{margin:0;font-size:13px;color:var(--muted)}
.track-status{
  margin:2px 0 12px;font-size:21px;font-weight:800;color:var(--lac);
}
.track-awb{margin:12px 0 0;font-size:14px}

/* ---------- toast ---------- */
.toast{
  position:fixed;left:50%;bottom:88px;z-index:80;
  transform:translateX(-50%);
  padding:11px 20px;border-radius:99px;
  background:var(--ink);color:var(--paper);
  font-size:14px;font-weight:600;
  box-shadow:0 4px 16px rgba(0,0,0,.25);
}

/* ---------- misc ---------- */
.done-hint{margin:-10px 0 22px;font-size:14px;color:var(--muted)}
.done-hint a{color:var(--lac);font-weight:600;text-decoration:underline}
.form select{
  width:100%;margin-top:5px;padding:12px 13px;
  border:1px solid var(--line);border-radius:8px;background:var(--card);
  font-family:inherit;font-size:16px;color:var(--ink);
}

/* ---------- keemat: ₹ aur ank chipakne se rokna ---------- */
.card-price,.tag-price,.crow-price,.cart-total strong,.summary .sline span,.track-card .sline span{
  font-kerning:none;
  font-variant-ligatures:none;
  letter-spacing:.015em;
}
.card-price{white-space:nowrap}
.card-price s{white-space:nowrap}

/* ============ Round 2: product page + side cart ============ */

/* ---------- gallery chip ---------- */
.gallery{position:relative}
.gal-chip{
  position:absolute;right:12px;bottom:12px;
  padding:7px 14px;border-radius:99px;
  background:rgba(0,0,0,.62);color:#fff;
  font-size:12.5px;font-weight:700;backdrop-filter:blur(4px);
}

/* ---------- feature chips ---------- */
.chip-row{
  display:flex;gap:8px;overflow-x:auto;
  padding:14px 16px 4px;scrollbar-width:none;
}
.chip-row::-webkit-scrollbar{display:none}
.feat{
  flex:none;padding:7px 13px;border-radius:99px;
  background:var(--lac-deep);color:#F3E2D6;
  font-size:12.5px;font-weight:600;white-space:nowrap;
}
html.dark .feat{background:#3A2C27}

/* ---------- pdp meta ---------- */
.pdp-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:-10px 0 14px}
.sold{font-size:13px;font-weight:600;color:#B4562A}
.saved{
  margin:-12px 0 16px;font-size:14px;font-weight:700;color:#137A4B;
}

/* ---------- qty picker ---------- */
.qty-pick{display:flex;align-items:center;gap:14px;margin:0 0 16px;font-size:14px;font-weight:600}
.qty-box{display:flex;align-items:center;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.qty-box button{
  width:40px;height:42px;border:0;background:#F4E7DA;color:var(--lac);
  font-size:19px;line-height:1;cursor:pointer;
}
.qty-box span{min-width:44px;text-align:center;font-weight:800;font-size:16px}
html.dark .qty-box button{background:#2B201B}

/* ---------- glowing buy button ---------- */
.btn.glow{position:relative;overflow:hidden}
.btn.glow::after{
  content:"";position:absolute;top:0;left:-60%;width:50%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);
  animation:sheen 2.2s ease-in-out infinite;
}
@keyframes sheen{0%{left:-60%}50%{left:120%}100%{left:120%}}
/* chamak + dhadkan + daayen-baayen hilna — teeno ek saath.
   animation shorthand ek hi jagah likhna zaroori hai, warna baad wala pehle wale ko mita deta hai. */
.btn.glow{
  animation:pulse 2.2s ease-in-out infinite,
            wobble .85s ease-in-out infinite;
}
@keyframes pulse{
  0%,100%{box-shadow:0 0 0 0 rgba(140,29,47,.42)}
  50%    {box-shadow:0 0 0 7px rgba(140,29,47,0)}
}

/* ---------- delivery timeline + daudti gaadi ---------- */
.deliv{
  margin:4px 0 20px;padding:16px 16px 14px;
  background:#F9F1E8;border-radius:10px;
}
html.dark .deliv{background:#241A16}
.deliv-head{margin:0 0 16px;font-size:14px;font-weight:700}

.deliv-line{position:relative;display:flex;gap:4px}

/* patri — teeno padav ke beech */
.dtrack{
  position:absolute;top:21px;left:16%;right:16%;height:3px;
  background:var(--line);border-radius:2px;
}
.dtrack::before{
  content:"";position:absolute;inset:0 50% 0 0;
  background:var(--lac);border-radius:2px;
}

/* gaadi patri par daudti hai */
.dtruck{
  position:absolute;top:6px;left:16%;transform:translateX(-50%) scaleX(-1);
  font-size:17px;line-height:1;z-index:2;
  animation:drive 3.4s ease-in-out infinite;
}
/* emoji ki gaadi baayein dekhti hai, par chalti daayein hai —
   isliye scaleX(-1) se ulta kar diya taaki mukh aage rahe */
@keyframes drive{
  0%   {left:16%;  transform:translateX(-50%) scaleX(-1)}
  8%   {left:16%;  transform:translateX(-50%) scaleX(-1)}
  50%  {left:50%;  transform:translateX(-50%) scaleX(-1)}
  58%  {left:50%;  transform:translateX(-50%) scaleX(-1)}
  92%  {left:84%;  transform:translateX(-50%) scaleX(-1)}
  100% {left:84%;  transform:translateX(-50%) scaleX(-1)}
}

.dstep{flex:1;text-align:center;position:relative;z-index:1}
.dic{
  display:grid;place-items:center;position:relative;
  width:38px;height:38px;margin:0 auto 7px;border-radius:50%;
  background:var(--card);border:2px solid var(--line);
  font-size:17px;
}
html.dark .dic{background:#2B201B}
.dstep.on .dic{border-color:var(--lac)}
.dstep.end .dic i{
  position:absolute;right:-3px;top:-3px;
  width:17px;height:17px;border-radius:50%;
  display:grid;place-items:center;
  background:#1EA362;color:#fff;
  font-size:10px;font-style:normal;font-weight:800;
}
.dstep b{display:block;font-size:12.5px;line-height:1.3}
.dstep small{display:block;font-size:11px;color:var(--muted);margin-top:2px}

/* ---------- trust seals ---------- */
.seals{
  display:flex;gap:8px;overflow-x:auto;
  margin-top:18px;padding-bottom:4px;scrollbar-width:none;
}
.seals::-webkit-scrollbar{display:none}
.seal{
  flex:none;width:78px;text-align:center;
  font-size:11px;line-height:1.3;color:var(--muted);font-weight:600;
}
.seal b{
  display:grid;place-items:center;
  width:46px;height:46px;margin:0 auto 5px;border-radius:50%;
  background:#F4E7DA;font-size:19px;
}
html.dark .seal b{background:#2B201B}

/* ---------- side cart drawer ---------- */
.drawer{
  position:fixed;top:0;right:0;bottom:0;z-index:70;
  width:395px;max-width:92vw;
  display:flex;flex-direction:column;
  background:var(--paper);border-left:1px solid var(--line);
  transform:translateX(102%);transition:transform .24s ease;
  box-shadow:-6px 0 26px rgba(0,0,0,.18);
}
.drawer.open{transform:translateX(0)}
.dr-head{
  flex:none;display:flex;align-items:center;justify-content:space-between;
  padding:14px 16px;border-bottom:1px solid var(--line);font-size:16px;
}
.dr-x{
  width:34px;height:34px;border-radius:8px;
  border:1px solid var(--line);background:none;color:inherit;
  font-size:15px;cursor:pointer;
}
.dr-body{flex:1;overflow-y:auto;padding:8px 16px 16px;-webkit-overflow-scrolling:touch}
.dr-row{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid var(--line)}
.dr-row img{width:58px;height:58px;object-fit:cover;border-radius:7px;flex:none;background:#F6EDE3}
.dr-mid{flex:1;min-width:0}
.dr-name{margin:0 0 2px;font-size:13.5px;font-weight:600;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dr-price{margin:0;font-size:14px;font-weight:800;color:var(--lac)}
.dr-del{
  flex:none;width:26px;height:26px;border-radius:50%;
  border:0;background:none;color:var(--muted);font-size:13px;cursor:pointer;
}
.dr-clear{
  margin:10px 0 4px;background:none;border:0;cursor:pointer;
  color:var(--muted);font-family:inherit;font-size:13px;text-decoration:underline;
}
.qty-inline.small{border-radius:6px;flex:none;width:96px}
.qty-inline.small button{width:28px;min-height:30px;font-size:15px}
.qty-inline.small span{font-size:13px}

.dr-foot{
  flex:none;padding:14px 16px 18px;
  border-top:1px solid var(--line);background:var(--paper);
}
.dr-saved{
  margin:0 0 10px;padding:8px 12px;border-radius:7px;
  background:#E4F3EA;color:#137A4B;font-size:13.5px;font-weight:700;text-align:center;
}
html.dark .dr-saved{background:#16301F}
.dr-total{
  display:flex;justify-content:space-between;align-items:baseline;
  margin-bottom:12px;font-size:15px;
}
.dr-total b{font-size:20px;color:var(--lac)}
.dr-total s{color:var(--muted);font-size:14px;margin-right:5px}

/* ---------- cross-sell shelves ---------- */
.shelf{margin-top:20px}
.shelf-head{
  margin:0 0 10px;font-size:14.5px;font-weight:800;
  letter-spacing:.02em;color:var(--ink);
}
/* sabse pehli pankti sabse zyada bikwaati hai — usi ko ubhaara hai */
.shelf:first-child .shelf-head{color:var(--lac)}
.shelf-row{
  display:flex;gap:10px;overflow-x:auto;padding-bottom:6px;
  /* Pehle card aadha-aadha kata dikhta tha. Snap se har card
     poora aakar rukta hai, aur kinaare par jagah chhodne se
     teer wale button pehle card ko nahi dhakte. */
  scroll-snap-type:x mandatory;
  scroll-padding-left:18px;
  padding-left:18px;padding-right:18px;
  margin-left:-18px;margin-right:-18px;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.shelf-row::-webkit-scrollbar{display:none}
/* ⚠️ कार्ट में सुझाव की फोटो छोटी थी — गहना ठीक से दिखता ही नहीं था.
   .shop पर ये काफ़ी बड़ी हैं, इसलिए बड़ी कर दीं. */
/* ⚠️ 186px बहुत बड़ा हो गया था — कार्ट के डिब्बे में फोटो कटकर
   बाहर निकल रही थी. 162px ठीक बैठता है: गहना साफ़ दिखता है और
   दो कार्ड एक साथ स्क्रीन में आ जाते हैं. */
.mini{
  flex:none;width:162px;
  scroll-snap-align:start;
  border:1px solid var(--line);border-radius:12px;overflow:hidden;
  background:var(--card);
}
@media(min-width:620px){ .mini{width:190px} }
html.dark .mini{background:#211814}
/* ⚠️ pehle photo चौकोर kaatee jaati thi (cover) — lambi chain aur
   haar ka aadha hissa gayab ho jata tha. Ab poora gehna dikhta hai,
   aur khidki thodi lambi hai taaki gehna bhara-bhara lage. */
/* ⚠️ contain से फोटो के इर्द-गिर्द खाली जगह रहती थी और गहना छोटा
   दिखता था. cover से खिड़की भर जाती है — दुकान के कार्ड जैसा. */
.mini img,.mini-noimg{
  width:100%;aspect-ratio:3/4;object-fit:cover;
  background:var(--card);display:block;
}
html.dark .mini-noimg{background:#2B201B}
.mini-name{
  margin:6px 8px 2px;font-size:12px;font-weight:600;line-height:1.3;
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;
}
.mini-price{margin:0 8px 6px;font-size:12.5px;font-weight:800;color:var(--lac)}
.mini-price s{font-size:11px;font-weight:400;color:var(--muted)}
.mini-add{
  display:block;width:calc(100% - 16px);margin:0 8px 8px;
  min-height:30px;border:0;border-radius:6px;cursor:pointer;
  background:#F4E7DA;color:var(--lac);
  font-family:inherit;font-size:12px;font-weight:700;
}
html.dark .mini-add{background:#2B201B}

/* ---------- decorated section heading ---------- */
.sec-title.deco{text-align:center;position:relative;padding-bottom:12px}
.sec-title.deco::after{
  content:"◆";position:absolute;left:50%;bottom:-2px;transform:translateX(-50%);
  font-size:10px;color:var(--marigold);
}

/* ---------- steal deals patti ---------- */
.steal{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  margin:16px 0 4px;padding:9px 12px;border-radius:8px;
  background:#FDF3E9;
}
html.dark .steal{background:#241A16}
.steal-tag{
  padding:3px 10px;border-radius:5px;
  background:#C8E44B;color:#33420A;
  font-size:11px;font-weight:800;letter-spacing:.04em;
}
.steal-txt{flex:1;font-size:13.5px;font-weight:700}
.steal-off{
  padding:3px 10px;border-radius:5px;
  background:var(--lac);color:#fff;font-size:11px;font-weight:800;
}

/* ---------- carousel arrows ---------- */
.shelf-wrap{position:relative}
.sh-nav{
  position:absolute;top:38%;transform:translateY(-50%);z-index:3;
  width:28px;height:28px;border-radius:50%;border:0;cursor:pointer;
  background:rgba(255,255,255,.94);color:var(--ink);
  font-size:17px;line-height:1;display:grid;place-items:center;
  box-shadow:0 2px 7px rgba(0,0,0,.18);
}
html.dark .sh-nav{background:#3A2C27;color:var(--ink)}
.sh-nav.prev{left:-6px}
.sh-nav.next{right:-6px}
/* pehle/aakhri par pahunch gaye to teer ka koi kaam nahi */
.sh-nav[disabled]{opacity:0;pointer-events:none}

/* ---------- payment badges ---------- */
.pays{display:inline-flex;gap:4px;margin-left:6px;vertical-align:middle}
.pay{
  padding:2px 6px;border-radius:4px;
  font-size:9.5px;font-weight:800;font-style:normal;letter-spacing:.02em;
  color:#fff;line-height:1.5;
}
.pay.upi{background:#0B7A3E}
.pay.gp{background:#1A73E8}
.pay.pp{background:#5F259F}
.pay.pt{background:#00B9F1}

/* ---------- two-line CTA button ---------- */
.btn.dr-go{
  flex-direction:column;gap:2px;min-height:58px;padding:8px 20px;
}
.btn.dr-go b{font-size:16px;font-weight:800}
.btn.dr-go small{
  font-size:11.5px;font-weight:600;opacity:.92;
  display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:2px;
}

/* ---------- Buy Now: daayein-baayein hilna ---------- */
/* Pehle har 4 second me ek jhatka aata tha aur beech me ruk jata tha.
   Ab bina ruke hilta rehta hai — jab tak grahak order na kar de ya
   us page se chala na jaye. Halchal 4px ki hai taaki likha padha jaye
   aur ungli se dabane me dikkat na ho. */
@keyframes wobble{
  0%   {transform:translateX(-4px)}
  50%  {transform:translateX(4px)}
  100% {transform:translateX(-4px)}
}
/* dabate waqt hilna band, warna ajeeb lagta hai */
.btn.glow:active{animation:none;transform:scale(.985)}

/* "shake" naam kai jagah HTML me laga hai par CSS me tha hi nahi.
   Jise sirf hilana ho (chamak-dhadkan ke bina) uske liye. */
.shake{animation:wobble .85s ease-in-out infinite}
.shake:active{animation:none}

/* jinhe halchal se dikkat hoti hai, unke liye sab band */
@media(prefers-reduced-motion:reduce){
  .btn.glow,.bb-buy.glow,.shake{animation:none}
  .btn.glow::after,.bb-buy.glow::after{animation:none}
}

/* ---------- post office chunne ka box ---------- */
.po-box{
  margin:0 0 14px;padding:13px 15px;
  border:1px dashed var(--lac);border-radius:9px;
  background:#FDF7F2;
}
html.dark .po-box{background:#241A16}
.po-head{margin:0 0 3px;font-size:14px;font-weight:700}
.po-head span{font-weight:400;font-size:12.5px;color:var(--muted)}
.po-note{margin:0 0 10px;font-size:12.5px;color:var(--muted);line-height:1.45}
.po-box select{
  width:100%;padding:11px 12px;
  border:1px solid var(--line);border-radius:8px;background:var(--card);
  font-family:inherit;font-size:15px;color:var(--ink);
}
html.dark .po-box select{background:#211814;color:var(--ink)}
.po-msg{
  margin:-8px 0 14px;font-size:13px;font-weight:600;color:var(--muted);
}
.po-msg.ok{color:#137A4B}

/* ---------- neeche chipki buy patti (product page) ---------- */
.buybar{
  position:fixed;left:0;right:0;bottom:0;z-index:45;
  display:flex;align-items:center;gap:8px;
  padding:9px 12px calc(9px + env(safe-area-inset-bottom));
  background:var(--paper);
  border-top:1px solid var(--line);
  box-shadow:0 -4px 18px rgba(60,30,20,.13);
}
.bb-price{flex:0 0 auto;min-width:0;line-height:1.2}
.bb-price b{display:block;font-size:17px;font-weight:800;color:var(--lac)}
.bb-price span{font-size:10.5px;color:var(--muted);font-weight:600}
.bb-price s{color:var(--muted)}

.bb-add,.bb-buy{
  flex:1 1 0;min-width:0;min-height:48px;padding:0 6px;
  border:0;border-radius:9px;cursor:pointer;
  font-family:inherit;font-size:13.5px;font-weight:800;
  display:flex;align-items:center;justify-content:center;
  text-align:center;line-height:1.2;
}
.bb-add{
  background:var(--card);color:var(--lac);
  box-shadow:inset 0 0 0 2px var(--lac);
}
html.dark .bb-add{background:transparent}
.bb-buy{
  background:var(--btn);color:#fff;flex:1.5 1 0;
  position:relative;overflow:hidden;
}
/* bahut chhoti screen par akshar thode aur chhote */
@media(max-width:359px){
  .bb-add,.bb-buy{font-size:12px}
  .bb-price b{font-size:15px}
}
.bb-buy:active,.bb-add:active{transform:scale(.985)}

/* ⚠️ Neeche wali patti ka button "bb-buy" hai, "btn" nahi —
   isliye upar wala .btn.glow ka niyam is par lagta hi nahi tha,
   aur ye hilna band ho gaya tha. Ab isko alag se de rahe hain. */
.bb-buy.glow{
  position:relative;overflow:hidden;
  animation:pulse 2.2s ease-in-out infinite,
            wobble .85s ease-in-out infinite;
}
.bb-buy.glow::after{
  content:"";position:absolute;top:0;left:-60%;width:50%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);
  animation:sheen 2.2s ease-in-out infinite;
}
.bb-buy.glow:active{animation:none;transform:scale(.985)}
.bb-buy .pays{margin-left:3px}
.bb-buy .pay{font-size:8.5px;padding:2px 4px}

/* patti ke peeche cheezein na chhipein */
.has-buybar .foot{padding-bottom:120px}
.has-buybar .wa-float{bottom:88px}

/* bade screen par patti ki zaroorat nahi — button seedhe page me */
@media(min-width:820px){
  .buybar{display:none}
  .has-buybar .foot{padding-bottom:90px}
  .has-buybar .wa-float{bottom:18px}
}
/* chhoti screen par page ke andar ke button chhipa do — patti hi kaafi hai */
@media(max-width:819px){
  .has-buybar .pdp-actions{display:none}
}

/* ---------- neeche ki navigation patti ---------- */
.botnav{
  position:fixed;left:0;right:0;bottom:0;z-index:44;
  display:flex;
  padding:6px 4px calc(6px + env(safe-area-inset-bottom));
  background:var(--paper);
  border-top:1px solid var(--line);
  box-shadow:0 -3px 14px rgba(60,30,20,.10);
}
.bn{
  flex:1 1 0;min-width:0;
  display:flex;flex-direction:column;align-items:center;gap:3px;
  padding:6px 2px;border-radius:10px;
  color:var(--muted);
}
.bn-ic{width:23px;height:23px;display:block}
.bn-ic svg{width:100%;height:100%;display:block}
.bn-tx{
  font-size:10.5px;font-weight:600;line-height:1;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;
}
.bn.on{color:var(--lac);background:#F6EDE3}
html.dark .bn.on{background:#2B201B}
.bn:nth-child(4) .bn-ic{color:#25D366}

/* patti ke peeche kuch na chhipe */
.foot{padding-bottom:96px}
.has-buybar .botnav{display:none}   /* product page par buybar hi kaafi hai */

/* ⚠️ चेकआउट पर दुकान का हेडर और नीचे की पट्टी हटा देते हैं.
   दोनों रहने से चेकआउट का अपना ← तीर उनके नीचे छिप जाता था और
   ग्राहक वापस ही नहीं जा पाता था. भुगतान के पन्ने पर मेन्यू की
   ज़रूरत भी नहीं — ध्यान बँटता है. */
body.co-page .bar,
body.co-page .botnav{display:none !important}
body.co-page .main{padding-bottom:16px}

@media(min-width:820px){
  .botnav{display:none}
  .foot{padding-bottom:34px}
}

/* ---------- categories page ---------- */
.cat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:18px}
@media(min-width:620px){.cat-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:900px){.cat-grid{grid-template-columns:repeat(4,1fr)}}
.cat-tile{
  display:flex;flex-direction:column;align-items:center;gap:7px;
  padding:16px 10px;border:1px solid var(--line);border-radius:12px;background:var(--card);
}
html.dark .cat-tile{background:#211814}
.ct-pic{
  display:grid;place-items:center;overflow:hidden;
  width:88px;height:88px;border-radius:50%;
  background:#F6EDE3;border:2px solid var(--line);
}
html.dark .ct-pic{background:#2B201B}
.ct-pic img{width:100%;height:100%;object-fit:cover}
.ct-name{font-size:14.5px;font-weight:700;text-align:center;line-height:1.3}
.ct-n{font-size:11.5px;color:var(--muted)}

/* ---------- account page ---------- */
.acct-card{
  margin-top:22px;padding:26px 20px 22px;text-align:center;
  background:var(--card);border:1px solid var(--line);border-radius:14px;
  box-shadow:0 8px 26px rgba(60,30,20,.08);
}
html.dark .acct-card{background:#211814}
.acct-ic{
  display:grid;place-items:center;width:58px;height:58px;margin:0 auto 14px;
  border-radius:50%;background:#F4E7DA;font-size:24px;
}
html.dark .acct-ic{background:#2B201B}
.acct-title{margin:0 0 8px;font-family:"Tiro Devanagari Hindi",serif;font-size:24px;font-weight:400}
.acct-sub{margin:0 0 20px;font-size:14px;color:var(--muted);line-height:1.5}
.acct-lbl{display:block;margin-bottom:14px;text-align:left;font-size:13px;font-weight:700}
.acct-lbl input{
  width:100%;margin-top:5px;padding:12px 13px;
  border:1px solid var(--line);border-radius:8px;background:#FBF7F3;
  font-family:inherit;font-size:16px;color:var(--ink);
}
html.dark .acct-lbl input{background:#2B201B}
.acct-phone{display:flex;align-items:center;gap:9px;margin-top:5px}
.acct-phone b{
  flex:none;padding:12px 12px;border:1px solid var(--line);border-radius:8px;
  background:#F4E7DA;font-size:15px;
}
html.dark .acct-phone b{background:#2B201B}
.acct-phone input{margin-top:0}
.acct-note{
  margin:0 0 14px;padding:9px 12px;border-radius:7px;
  background:#E4F3EA;color:#137A4B;font-size:13px;font-weight:600;
}
html.dark .acct-note{background:#16301F}
.acct-foot{margin:14px 0 0;font-size:12px;color:var(--muted)}

.acct-top{
  display:flex;align-items:center;justify-content:space-between;
  margin:18px 0 8px;padding-bottom:12px;border-bottom:1px solid var(--line);
}
.acct-who{margin:0;font-size:14.5px}
.ao{
  padding:14px 15px;margin-bottom:12px;
  border:1px solid var(--line);border-radius:11px;background:var(--card);
}
html.dark .ao{background:#211814}
.ao-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}
.ao-top b{font-size:13.5px;letter-spacing:.02em}
.ao-st{
  padding:3px 10px;border-radius:99px;
  background:#F1E7DC;color:var(--lac);font-size:11.5px;font-weight:800;
}
html.dark .ao-st{background:#2B201B}
.ao-pics{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.ao-pics img{width:52px;height:52px;object-fit:cover;border-radius:7px}
.ao-it{margin:0 0 4px;font-size:13.5px;font-weight:600}
.ao-ad{margin:0 0 6px;font-size:12.5px;color:var(--muted);line-height:1.4}
.ao-bt{margin:0;font-size:14px;font-weight:800;color:var(--lac)}

/* ---------- card par video ka nishan ---------- */
.vid-dot{
  position:absolute;left:8px;bottom:8px;z-index:2;
  padding:3px 9px;border-radius:99px;
  background:rgba(0,0,0,.62);color:#fff;
  font-size:10.5px;font-weight:700;backdrop-filter:blur(3px);
}

/* ---------- home ka naya dhancha ---------- */
.hero-slim{
  padding:18px 20px 14px;text-align:center;
  background:linear-gradient(180deg,var(--lac) 0%,var(--lac-deep) 100%);
  color:#FFF3E4;
}
.hero-slim .eyebrow{
  margin:0 0 4px;font-size:11px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--marigold);
}
.hero-slim h1{
  margin:0;font-family:"Tiro Devanagari Hindi",serif;
  font-size:clamp(19px,5vw,26px);line-height:1.3;font-weight:400;color:#fff;
}
.wrap.tight{padding-top:18px;padding-bottom:6px}
.wrap.tight .cats{padding-left:0;padding-right:0;border-bottom:0}

/* ---------- ग्राहक का बिल ---------- */
.inv-sheet{
  background:var(--card);color:#111;padding:20px 18px;
  border:1px solid var(--line);border-radius:12px;margin-top:18px;
}
html.dark .inv-sheet{background:var(--card)}
.inv-hd{display:flex;justify-content:space-between;gap:14px;
  padding-bottom:12px;border-bottom:2px solid #111}
.inv-hd b{display:block;font-size:16px}
.inv-hd small{display:block;font-size:10.5px;color:#555;line-height:1.45;margin-top:3px}
.inv-rt{text-align:right;white-space:nowrap}
.inv-rt b{font-size:14px;margin:2px 0}
.inv-to{padding:13px 0;border-bottom:1px solid #ddd}
.inv-to small{display:block;font-size:11.5px;color:#555;line-height:1.5}
.inv-to b{display:block;font-size:14.5px;margin:3px 0}
.inv-to .inv-note{color:#8a6d3b;font-style:italic;margin-top:4px}
.inv-tbl{width:100%;border-collapse:collapse;margin:12px 0;font-size:12.5px}
.inv-tbl th{background:#111;color:#fff;padding:7px 6px;text-align:left;font-size:10.5px;font-weight:700}
.inv-tbl td{padding:8px 6px;border-bottom:1px solid #e3e3e3}
.inv-tbl th:nth-child(n+3),.inv-tbl td:nth-child(n+3){text-align:right}
.inv-sum{margin-left:auto;max-width:290px;font-size:13px}
.kvr{display:flex;justify-content:space-between;gap:12px;padding:5px 0}
.kvr.tot{border-top:1px solid #111;margin-top:5px;padding-top:9px;font-size:15.5px;font-weight:800}
.inv-awb{margin:12px 0 0;font-size:12.5px;font-weight:700}
.inv-ft{margin:16px 0 0;text-align:center;font-size:10.5px;color:#666}
.inv-btns{display:flex;gap:10px;margin-top:16px}
.inv-btns .btn{flex:1}
.center{text-align:center}
.small{font-size:12px}

/* अकाउंट में बिल का लिंक */
.ao-inv{display:inline-block;margin-top:8px;padding:7px 13px;
  border:1px solid var(--lac);border-radius:7px;
  font-size:12.5px;font-weight:700;color:var(--lac)}

/* छपाई में सिर्फ़ बिल */
@media print{
  body *{visibility:hidden}
  .inv-sheet,.inv-sheet *{visibility:visible}
  .inv-sheet{position:absolute;left:0;top:0;width:100%;border:0;margin:0}
  .inv-btns,.botnav,.topbar,.foot,.ann{display:none !important}
}

/* ---------- neeche jaate hi aage ke product ---------- */
.pager.hide-js{display:none}
.more-mark{display:grid;place-items:center;padding:26px 16px;min-height:70px}
.more-spin{
  width:26px;height:26px;border-radius:50%;
  border:3px solid var(--line);border-top-color:var(--lac);
  animation:spin .8s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}
.more-end{margin:0;font-size:13.5px;color:var(--muted)}

/* ---------- नंबर दोबारा जाँचने की चेतावनी ---------- */
.phone-warn{
  margin:-6px 0 14px;padding:11px 13px;border-radius:9px;
  background:#FDF4E7;border-left:3px solid var(--marigold);
}
.phone-warn b{display:block;font-size:13.5px;margin-bottom:2px}
.phone-warn span{font-size:12.5px;color:var(--muted);line-height:1.5}
.agree-line{
  margin:14px 0 0;font-size:12.5px;color:var(--muted);line-height:1.6;text-align:center;
}
.agree-line a{color:var(--lac);font-weight:600}

/* ---------- हर पंक्ति के नीचे "सब देखें" ----------
   पहले ये नाम के बगल में ऊपर था (.sec-more). अब नीचे बीच में बटन जैसा. */
.sec-foot{display:flex;justify-content:center;margin-top:16px}
.sec-foot .btn{flex:0 0 auto;min-width:190px}

/* ---------- इंस्टाग्राम की पट्टी ----------
   फोटो एडमिन पैनल से चुनी जाती हैं. फोन पर 3, बड़ी स्क्रीन पर 6. */
.ig-user{margin:-2px 0 16px;font-size:14px;color:var(--muted);text-align:center}
.ig-user a{color:var(--lac);font-weight:600}
.ig-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
@media(min-width:620px){.ig-grid{grid-template-columns:repeat(6,1fr);gap:10px}}
.ig-grid img{
  width:100%;aspect-ratio:1;object-fit:cover;display:block;
  border-radius:10px;background:var(--line);
}
.ig-grid a{
  display:block;border-radius:10px;overflow:hidden;
  transition:transform .15s ease;
}
.ig-grid a:active{transform:scale(.97)}
html.dark .ig-grid img{background:#2B201B}

/* ---------- रिव्यू में ग्राहक की फोटो/वीडियो ---------- */
/* ⚠️ 84px बहुत छोटा था — ग्राहक की भेजी फोटो-वीडियो में गहना दिखता
   ही नहीं था. यही सबसे ज़्यादा भरोसा बनाते हैं, इसलिए बड़े कर दिए.
   वीडियो और भी बड़ा, क्योंकि उसमें ▶ का बटन भी आता है. */
.rev-pics{display:flex;flex-wrap:wrap;gap:9px;margin-top:10px}
.rev-pics img{
  width:118px;height:148px;object-fit:cover;border-radius:10px;
  display:block;background:var(--line);cursor:zoom-in;
}
.rev-pics video{
  width:168px;height:210px;object-fit:cover;border-radius:10px;
  display:block;background:#111;
}
@media(min-width:620px){
  .rev-pics img{width:140px;height:176px}
  .rev-pics video{width:200px;height:250px}
}
html.dark .rev-pics img{background:#2B201B}

/* ---------- अपने ऑर्डर के नीचे रिव्यू ---------- */
.ao-revs{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.ao-revbtn{width:100%;flex:none;font-size:14px}
.ao-revok,.ao-revdone{
  display:block;margin-top:10px;font-size:13.5px;color:#137A4B;font-weight:600;
}
.rev-box{margin-top:12px;padding:14px;border-radius:10px;
  background:var(--card);box-shadow:inset 0 0 0 1px var(--line)}
html.dark .rev-box{background:#241A16}
.rev-for{margin:0 0 10px;font-size:14.5px}
.rev-thumbs{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 10px}
.rev-thumbs figure{margin:0;position:relative}
.rev-thumbs img,.rev-thumbs video{
  width:70px;height:70px;object-fit:cover;border-radius:8px;display:block;
}
.rev-thumbs button{
  position:absolute;top:-6px;right:-6px;width:22px;height:22px;border-radius:50%;
  border:none;background:var(--lac);color:#fff;font-size:14px;line-height:1;cursor:pointer;
}

/* ---------- "पहना हुआ" वीडियो ----------
   गैलरी वाले वीडियो से अलग — ये नीचे अपनी जगह पर दिखता है,
   ताकि ग्राहक को असली नाप और गिरावट का अंदाज़ा लगे. */
/* "बेस्ट सेलर" niche baayen baithta hai, isliye "पहना हुआ" uske
   thoda upar — dono ek doosre par nahi chadhte */
/* tamga niche baayen 78px ghera leta hai — "पहना हुआ" uske upar */
.gal-worn{right:auto;left:12px;bottom:96px;background:rgba(140,29,47,.85)}
.worn{margin:14px 16px 0}
.worn-t{
  margin:0 0 8px;font-size:15px;font-weight:800;color:var(--ink);
}
.worn video{
  width:100%;max-height:70vh;border-radius:12px;display:block;
  background:#000;
}

/* ---------- फुटर में कारोबार की जानकारी ----------
   पेमेंट गेटवे की जाँच में कानूनी नाम और GSTIN देखे जाते हैं. */
.foot-legal{font-weight:600;opacity:.92;margin-top:-4px}
.foot-gst{font-size:12.5px;opacity:.8;letter-spacing:.03em}

/* ---------- अपना पिनकोड डालकर तारीख देखें ---------- */
.pin-ask{display:flex;gap:8px;margin:2px 0 10px}
.pin-ask input{
  flex:1;min-width:0;padding:10px 12px;border-radius:9px;
  border:1px solid var(--line);background:var(--card);
  font-family:inherit;font-size:14.5px;color:var(--ink);letter-spacing:.06em;
}
.pin-ask .btn{flex:none;padding:10px 16px;font-size:14px}
.pin-msg{margin:-4px 0 10px;font-size:13px;color:var(--muted);line-height:1.45}

/* ---------- "इतने में मिल सकता है" ---------- */
.lowest{
  margin:12px 0 4px;padding:11px 13px;border-radius:10px;
  background:#EAF6EE;border:1px dashed #9CCFAE;
}
.lowest b{display:block;font-size:15.5px;color:#137A4B}
.lowest small{display:block;margin-top:3px;font-size:12.5px;color:var(--muted);line-height:1.45}
html.dark .lowest{background:#16241C;border-color:#2E5B3F}

/* ---------- दुकान किसने शुरू की ---------- */
.founder{
  margin:0 0 14px;padding:11px 14px;border-radius:10px;
  background:var(--card);border-left:3px solid var(--lac);
  font-size:14.5px;line-height:1.55;
}

/* ---------- बेस्ट सेलर का गोल तमगा ----------
   Card par upar baayen, aur product ke panne par photo ke niche baayen —
   theek jaisa dikhaya tha. */
.badges{
  position:absolute;left:8px;top:8px;
  display:flex;flex-direction:column;align-items:flex-start;gap:5px;
  max-width:calc(100% - 16px);
}
.badges .off{position:static;left:auto;top:auto}

.bsvg{position:absolute;z-index:3;line-height:0;pointer-events:none}
.bsvg svg{width:100%;height:100%;display:block;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.35))}

/* ⚠️ यह तमगा 54px का था — कार्ड की चौड़ाई का करीब एक-तिहाई. गहना
   ही ढक जाता था, और गहने की दुकान में फोटो ही बिक्री कराती है.
   डिब्बा बड़ा करने से कम प्रोडक्ट दिखते, इसलिए तमगा छोटा किया.
   38px पर भी साफ़ दिखता है और गहना खुला रहता है. */
.bsvg.on-card{left:5px;top:5px;width:38px;height:38px}
/* tamga upar baithta hai, isliye chhoot ka batch uske niche */
.bsvg.on-card ~ .badges{top:47px}

.bsvg.on-gal{left:10px;bottom:10px;width:64px;height:64px}

@media(min-width:620px){
  .bsvg.on-card{width:44px;height:44px}
  .bsvg.on-card ~ .badges{top:54px}
  .bsvg.on-gal{width:78px;height:78px}
}

/* ---------- ⚡ आज का ऑफर — चलती घड़ी ---------- */
.deal-tag{
  position:absolute;right:8px;top:8px;
  padding:3px 8px;border-radius:5px;
  background:rgba(20,20,20,.82);color:#FFD98A;
  font-size:11px;font-weight:800;letter-spacing:.02em;
  font-variant-numeric:tabular-nums;
}
.deal-tag.over{background:rgba(90,90,90,.75);color:#eee}

.deal-box{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin:12px 0 4px;padding:11px 14px;border-radius:10px;
  background:linear-gradient(90deg,#3A1016,var(--lac));color:#fff;
}
.deal-lbl{font-size:13.5px;font-weight:700}
.deal-clock{
  font-size:19px;font-weight:800;letter-spacing:.04em;
  font-variant-numeric:tabular-nums;
}
.deal-box.over{background:#6B6B6B}
.deal-box.over .deal-clock{font-size:15px}

/* ---------- ⚡ आज का ऑफर — चलती घड़ी ---------- */
.deal-tag{
  position:absolute;right:8px;top:8px;
  padding:3px 8px;border-radius:5px;
  background:rgba(20,20,20,.82);color:#FFD98A;
  font-size:11px;font-weight:800;letter-spacing:.02em;
  font-variant-numeric:tabular-nums;
}
.deal-tag.over{background:rgba(90,90,90,.75);color:#eee}

.deal-box{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin:12px 0 4px;padding:11px 14px;border-radius:10px;
  background:linear-gradient(90deg,#3A1016,var(--lac));color:#fff;
}
.deal-lbl{font-size:13.5px;font-weight:700}
.deal-clock{
  font-size:19px;font-weight:800;letter-spacing:.04em;
  font-variant-numeric:tabular-nums;
}
.deal-box.over{background:#6B6B6B}
.deal-box.over .deal-clock{font-size:15px}

/* ---------- अपने आप चलती डिज़ाइन ----------
   871 डिज़ाइन में से होम पर सिर्फ़ कुछ ही दिखते हैं — बाकी किसी की
   नज़र में नहीं आते. ये पट्टी बिना रुके चलती रहती है, इसलिए ग्राहक
   कुछ न भी दबाए तो भी नए डिज़ाइन सामने आते रहते हैं.
   उँगली रखते ही रुक जाती है, ताकि देखना और दबाना आसान रहे. */
.roll-sec{overflow:hidden}
.roll{
  overflow-x:auto;overflow-y:hidden;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;
  margin:0 -16px;padding:2px 16px 8px;
}
.roll::-webkit-scrollbar{display:none}

.roll-belt{
  display:flex;gap:12px;width:max-content;
  /* har card ke liye 4 second — jitne zyada, utni dheemi chaal */
  animation:rollBelt calc(var(--n,12) * 4s) linear infinite;
}
.roll:hover .roll-belt,
.roll:active .roll-belt{animation-play-state:paused}

@keyframes rollBelt{
  from{transform:translateX(0)}
  to  {transform:translateX(-50%)}
}

.roll-belt .card{flex:none;width:170px}
@media(min-width:620px){ .roll-belt .card{width:200px} }

@media(prefers-reduced-motion:reduce){
  .roll-belt{animation:none}
}

/* ---------- अपने आप चलती डिज़ाइन ----------
   871 डिज़ाइन में से होम पर सिर्फ़ कुछ ही दिखते हैं — बाकी किसी की
   नज़र में नहीं आते और पड़े-पड़े डेड स्टॉक बन जाते हैं. ये पट्टी बिना
   रुके चलती रहती है, इसलिए ग्राहक कुछ न भी दबाए तो भी नए डिज़ाइन
   सामने आते रहते हैं. उँगली रखते ही रुक जाती है. */
.roll-sec{overflow:hidden}
.roll{
  overflow-x:auto;overflow-y:hidden;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;
  margin:0 -16px;padding:2px 16px 8px;
}
.roll::-webkit-scrollbar{display:none}
.roll-belt{
  display:flex;gap:12px;width:max-content;
  animation:rollBelt calc(var(--n,12) * 4s) linear infinite;
}
.roll:hover .roll-belt,
.roll:active .roll-belt{animation-play-state:paused}
@keyframes rollBelt{
  from{transform:translateX(0)}
  to  {transform:translateX(-50%)}
}
.roll-belt .card{flex:none;width:170px}
@media(min-width:620px){ .roll-belt .card{width:200px} }
@media(prefers-reduced-motion:reduce){ .roll-belt{animation:none} }

/* ---------- रिव्यू का औसत और सितारों की पट्टी ---------- */
.rev-sum{
  display:flex;gap:18px;align-items:center;flex-wrap:wrap;
  margin:0 0 18px;padding:14px;border-radius:12px;background:var(--card);
}
.rev-big{text-align:center;flex:none;min-width:96px}
.rev-big b{display:block;font-size:34px;line-height:1.1;color:var(--lac)}
.rev-big small{display:block;margin-top:4px;font-size:11.5px;color:var(--muted)}
.rev-bars{flex:1;min-width:180px;display:flex;flex-direction:column;gap:5px}
.rev-bar{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.rb-n{flex:none;width:30px}
.rb-c{flex:none;width:22px;text-align:right}
.rb-track{
  flex:1;height:7px;border-radius:99px;background:var(--line);overflow:hidden;
}
.rb-track i{display:block;height:100%;background:var(--marigold);border-radius:99px}

/* ---------- खुलने-बंद होने वाले खाने ---------- */
.acc{margin:16px 0 4px;border-top:1px solid var(--line)}
.acc-i{border-bottom:1px solid var(--line)}
.acc-i summary{
  list-style:none;cursor:pointer;padding:13px 2px;
  font-size:14.5px;font-weight:700;color:var(--ink);
  display:flex;align-items:center;justify-content:space-between;
}
.acc-i summary::-webkit-details-marker{display:none}
.acc-i summary::after{content:"⌄";font-size:17px;opacity:.5;transition:transform .2s}
.acc-i[open] summary::after{transform:rotate(180deg)}
.acc-b{padding:0 2px 14px;font-size:13.5px;line-height:1.65;color:var(--muted)}
.acc-b p{margin:0 0 8px}
.acc-b ul{margin:6px 0 0;padding-left:18px}
.acc-b li{margin-bottom:5px}

/* ---------- "मेरे ऑर्डर" में मदद का खाना ---------- */
.help-card{
  margin:0 0 18px;padding:14px;border-radius:12px;
  background:var(--card);border:1px dashed var(--line);
}
.help-t{margin:0 0 3px;font-size:15px;font-weight:800}
.help-s{margin:0 0 11px;font-size:13px;color:var(--muted)}
.help-btns{display:flex;gap:8px;flex-wrap:wrap}
.help-btns .btn{flex:1;min-width:130px}
.btn-wa{background:#25D366;color:#fff;border-color:#25D366}

/* ---------- पतों की किताब ---------- */
.acct-tabs{display:flex;gap:8px;margin:18px 0 14px}
.atab{
  flex:1;padding:10px 8px;border-radius:10px;cursor:pointer;
  border:1px solid var(--line);background:var(--card);
  font-family:inherit;font-size:14px;font-weight:700;color:var(--muted);
}
.atab.is-on{background:var(--lac);border-color:var(--lac);color:#fff}

.addr{
  padding:13px 14px;border-radius:12px;margin-bottom:10px;
  background:var(--card);border:1px solid var(--line);
}
.addr.is-def{border-color:var(--lac);box-shadow:0 0 0 1px var(--lac) inset}
.addr-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.addr-top b{font-size:14.5px}
.addr-def{font-size:11.5px;font-weight:800;color:var(--lac)}
.addr-nm{margin:0 0 3px;font-size:14px;font-weight:600}
.addr-l{margin:0 0 2px;font-size:13px;color:var(--muted);line-height:1.5}
.addr-acts{display:flex;gap:8px;margin-top:10px}
.addr-acts .btn{flex:1;padding:8px;font-size:13px}
.link-btn{
  background:none;border:0;padding:0;cursor:pointer;
  font-family:inherit;font-size:12.5px;font-weight:700;color:var(--lac);
}
.addr-form{margin-bottom:14px}
.addr-form h3{margin:0 0 10px;font-size:16px}

/* ---------- रुके हुए ऑर्डर पर दोबारा भरने का खाना ---------- */
.ao-pend{
  margin:10px 0 4px;padding:11px 13px;border-radius:10px;
  background:#FCE9EC;border:1px solid var(--lac);
}
.ao-pend p{margin:0 0 9px;font-size:13px;line-height:1.55;color:var(--ink)}
.ao-pend .btn{margin:0}
html.dark .ao-pend{background:#3A1016}

/* ---------- रील: कोने में तैरता वीडियो ---------- */
/* ⚠️ पहले पीछे काला रंग था — पोस्टर न हो तो पूरा डिब्बा काला दिखता था.
   अब दुकान का रंग है, इसलिए खाली भी हो तो सजा हुआ लगता है. */
.reel-bub{
  position:fixed;right:12px;bottom:96px;z-index:70;
  width:72px;height:104px;border-radius:12px;overflow:hidden;cursor:pointer;
  background:linear-gradient(160deg,var(--lac),var(--lac-deep));
  box-shadow:0 4px 16px rgba(0,0,0,.35);
  border:2px solid #fff;
}
.reel-bub video,.reel-bub img{width:100%;height:100%;object-fit:cover;display:block}
/* ▶ का बटन — दबाते ही पूरी स्क्रीन पर आवाज़ के साथ चलेगा */
.reel-play{
  position:absolute;inset:0;display:grid;place-items:center;
  color:#fff;font-size:20px;
  text-shadow:0 2px 8px rgba(0,0,0,.75);
  pointer-events:none;
}
.reel-play::before{
  content:'';position:absolute;width:38px;height:38px;border-radius:50%;
  background:rgba(0,0,0,.42);
}
.reel-ph{
  display:grid;place-items:center;width:100%;height:100%;
  font-size:26px;color:#fff;
}

/* हटाने के बाद वापस लाने वाला छोटा निशान */
.reel-back{
  position:fixed;right:14px;bottom:100px;z-index:70;
  width:44px;height:44px;border-radius:50%;border:2px solid #fff;cursor:pointer;
  background:var(--lac);color:#fff;font-size:20px;
  box-shadow:0 3px 12px rgba(0,0,0,.3);
}
.reel-back[hidden]{display:none}
.reel-lbl{
  position:absolute;left:0;right:0;bottom:0;padding:3px 0;
  background:rgba(0,0,0,.55);color:#fff;text-align:center;
  font-size:9.5px;font-weight:800;letter-spacing:.06em;
}
.reel-x{
  position:absolute;top:-8px;right:-8px;width:22px;height:22px;
  border-radius:50%;border:0;cursor:pointer;
  background:#333;color:#fff;font-size:14px;line-height:1;
}

.reel-full{position:fixed;inset:0;z-index:130;background:#000;display:flex;flex-direction:column}
.reel-full[hidden]{display:none}
.reel-bar{
  position:absolute;top:0;left:0;right:0;z-index:3;
  display:flex;align-items:center;gap:10px;padding:12px 14px;
}
.reel-sp{flex:1}
.reel-btn{
  width:40px;height:40px;border-radius:50%;border:0;cursor:pointer;
  background:rgba(255,255,255,.22);color:#fff;font-size:17px;
  display:grid;place-items:center;text-decoration:none;
}
.reel-btn.wa{background:#25D366}

.reel-stage{
  flex:1;overflow-y:auto;scroll-snap-type:y mandatory;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.reel-stage::-webkit-scrollbar{display:none}
.reel-slide{
  height:100%;scroll-snap-align:start;position:relative;
  display:grid;place-items:center;
}
.reel-slide video{width:100%;height:100%;object-fit:contain;background:#000}
.reel-go{
  position:absolute;left:16px;right:16px;bottom:28px;
  padding:12px;border-radius:10px;text-align:center;
  background:var(--card);color:var(--lac);font-weight:800;font-size:14.5px;
  text-decoration:none;
}
.reel-dots{
  position:absolute;right:8px;top:50%;transform:translateY(-50%);z-index:3;
  display:flex;flex-direction:column;gap:6px;
}
.reel-dots i{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.4);cursor:pointer}
.reel-dots i.on{background:var(--card);height:14px;border-radius:3px}

/* ---------- फ्री गिफ्ट ---------- */
.giftbox{
  display:flex;align-items:center;gap:11px;
  margin:10px 0;padding:11px 13px;border-radius:11px;
}
.giftbox img{width:46px;height:46px;object-fit:cover;border-radius:8px;flex:none}
.gift-ic{font-size:30px;flex:none}
.giftbox b{display:block;font-size:14px;line-height:1.35}
.giftbox small{display:block;margin-top:2px;font-size:12.5px;line-height:1.45;opacity:.85}
.giftbox.got{background:#EAF6EE;border:1px solid #9CCFAE;color:#137A4B}
.giftbox.got small{color:var(--muted)}
.giftbox.near{background:#FFF6E5;border:1px dashed var(--marigold);color:#8A5A00}
.giftbox.near small{color:var(--muted)}
html.dark .giftbox.got{background:#16241C;border-color:#2E5B3F}
html.dark .giftbox.near{background:#2A2113;border-color:#7A5E1E}

/* ---------- "रुकिए" वाला परदा ---------- */
.kaamchalu{
  position:fixed;inset:0;z-index:95;
  display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(0,0,0,.45);
}
.kc-card{
  display:flex;flex-direction:column;align-items:center;gap:14px;
  padding:26px 30px;border-radius:16px;background:var(--card,#fff);
  box-shadow:0 14px 40px rgba(0,0,0,.28);
  font-size:15.5px;text-align:center;
}
.kc-ring{
  width:34px;height:34px;border-radius:50%;
  border:3px solid #E6D9CC;border-top-color:var(--lac);
  animation:kcSpin .8s linear infinite;
}
@keyframes kcSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.kc-ring{animation-duration:2.4s}}
html.dark .kc-card{background:#1E1A1B}

/* ---------- UPI का इंतज़ार वाला पन्ना ---------- */
.wait-card{
  width:100%;max-width:400px;padding:24px 20px 18px;border-radius:18px;
  background:var(--card,#fff);box-shadow:0 14px 44px rgba(0,0,0,.3);
  text-align:center;max-height:90vh;overflow:auto;
}
.kc-ring.big{width:56px;height:56px;border-width:4px;margin:0 auto 16px;display:block}
.wt-h{display:block;font-size:19px;line-height:1.35}
.wt-s{display:block;margin-top:6px;font-size:13.5px;color:var(--muted)}
.wt-amt{margin:16px 0;padding:14px;border-radius:12px;background:#F3EEE8}
.wt-amt small{display:block;font-size:11px;font-weight:800;letter-spacing:.07em;
  text-transform:uppercase;color:var(--muted)}
.wt-amt b{display:block;margin-top:4px;font-size:26px}
.wt-steps{margin:0 0 14px;padding:0;list-style:none;text-align:left}
.wt-steps li{
  position:relative;padding:7px 0 7px 32px;
  font-size:14.5px;color:var(--muted);
}
.wt-steps li::before{
  content:'';position:absolute;left:0;top:8px;
  width:20px;height:20px;border-radius:50%;
  border:2px dashed #C9BDB4;
}
.wt-steps li.ok{color:var(--ink);font-weight:700}
.wt-steps li.ok::before{
  content:'\2713';border:0;background:#137A4B;color:#fff;
  font-size:12px;line-height:20px;text-align:center;font-weight:800;
}
.wt-note{
  margin:0 0 14px;padding:11px 13px;border-radius:10px;
  background:#EAF6EE;color:#137A4B;font-size:13px;line-height:1.55;text-align:left;
}
.wt-note.bura{background:#FCE9EC;color:#8E1F2E}
.wt-note.theek{background:#EAF6EE;color:#137A4B;font-weight:700}
.wt-cancel{
  display:block;width:100%;margin-top:10px;padding:9px;
  background:none;border:0;color:var(--muted);
  font-family:inherit;font-size:13px;text-decoration:underline;cursor:pointer;
}
html.dark .wait-card{background:#1E1A1B}
html.dark .wt-amt{background:#2A2426}
html.dark .wt-note{background:#16241C}
html.dark .wt-note.bura{background:#2E1A1D;color:#F0A9B4}

/* ---------- ⭐ हरा रेटिंग बैज (मीशो जैसा) ---------- */
.rate-pill{
  display:inline-flex;align-items:center;gap:4px;
  padding:3px 8px;border-radius:6px;
  background:#15774A;color:#fff;   /* 1A8C55 पर सफ़ेद लिखावट का अनुपात कम था */
  font-size:12.5px;font-weight:700;line-height:1.3;
}
.rate-pill b{font-size:13.5px;font-weight:800}
.rate-shop{margin-right:6px;font-size:12.5px;color:var(--muted)}
.rate-n{margin-left:6px;font-size:12.5px;color:var(--muted)}

/* ---------- ⭐ रेटिंग और राय ---------- */
.rv-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}
.rv-head .sec-title{margin:0}
.rv-avg{font-size:16px;color:var(--muted);white-space:nowrap}
.rv-avg b{font-size:22px;color:var(--ink)}
.rv-avg i{font-style:normal;color:#F5A623}
.rv-bars{margin:16px 0 18px;display:grid;gap:9px}
.rv-row{display:flex;align-items:center;gap:10px}
.rv-n{flex:none;width:34px;font-size:14px;color:var(--muted)}
.rv-n i{font-style:normal;color:#F5A623}
.rv-track{flex:1;height:9px;border-radius:99px;background:#E7DED6;overflow:hidden}
.rv-track i{display:block;height:100%;background:var(--ink);border-radius:99px}
.rv-c{flex:none;min-width:36px;text-align:right;font-size:14px;color:var(--muted)}
.rv-bar2{
  position:relative;display:flex;align-items:center;justify-content:space-between;
  gap:10px;padding-top:14px;border-top:1px solid var(--line);
}
.rv-bar2 b{font-size:17px}
.rv-filt{
  padding:9px 15px;border:1px solid var(--line);border-radius:10px;
  background:var(--card);font-family:inherit;font-size:14px;font-weight:700;
  color:var(--ink);cursor:pointer;
}
.rv-filt i{font-style:normal;display:inline-block;margin-left:5px;transition:transform .2s}
.rv-filt[aria-expanded="true"] i{transform:rotate(180deg)}
.rv-menu{
  position:absolute;right:0;top:calc(100% + 8px);z-index:30;
  width:min(300px,84vw);max-height:60vh;overflow:auto;
  padding:12px;border-radius:14px;
  background:var(--card);border:1px solid var(--line);
  box-shadow:0 12px 34px rgba(0,0,0,.2);
}
.rv-lbl{
  margin:2px 0 6px;font-size:11px;font-weight:800;letter-spacing:.07em;
  text-transform:uppercase;color:var(--muted);
}
.rv-lbl + .rv-lbl,.rv-stars + .rv-lbl{margin-top:12px}
.rv-opt{
  display:block;width:100%;margin-bottom:3px;padding:10px 12px;
  border:0;border-radius:9px;background:none;text-align:left;
  font-family:inherit;font-size:15px;color:var(--ink);cursor:pointer;
}
.rv-opt.on{background:#F1E7DC;font-weight:700}
.rv-stars{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.rv-stars .rv-opt{
  width:auto;margin:0;padding:8px 14px;border:1px solid var(--line);border-radius:9px;
  font-size:14px;
}
.rv-stars .rv-opt i{font-style:normal;color:#F5A623}
.rv-stars .rv-opt.on{border-color:var(--ink);background:#F1E7DC}
html.dark .rv-track{background:#2A2426}
html.dark .rv-opt.on,html.dark .rv-stars .rv-opt.on{background:#2A2426}

/* ---------- 💳 चेकआउट पर भुगतान के विकल्प ---------- */
.co-back{
  flex:none;margin-right:2px;padding:4px 10px 6px;
  font-size:22px;line-height:1;color:inherit;text-decoration:none;
}
.co-lbl.cap{text-transform:uppercase;letter-spacing:.06em;font-size:11.5px}
.payopt{padding:14px}
.po-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.po-top b{font-size:17px;letter-spacing:.02em}
.po-top span{font-size:17px;font-weight:700}
.po-apps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:11px}
.po-app{
  border:1px solid var(--line);border-radius:12px;padding:13px 3px 11px;
  font-family:inherit;cursor:pointer;
}
.po-app:active{transform:translateY(1px)}
.po-app-ic{
  display:block;width:30px;height:30px;margin:0 auto 7px;
  object-fit:contain;
}
.po-app-ab{
  display:flex;align-items:center;justify-content:center;
  border-radius:50%;background:#fff;
  font-size:15px;font-weight:800;color:#3A3A3A;
}
.po-app-n{display:block;font-size:11.5px;font-weight:700;color:#2B2B2B;line-height:1.25}
.po-line{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  width:100%;padding:14px;border:1px solid var(--line);border-radius:12px;
  background:transparent;font-family:inherit;font-size:14.5px;font-weight:700;
  color:var(--ink);text-align:left;cursor:pointer;
}
.po-line.wide{margin-bottom:14px}
.po-line:active{background:#F1E7DC}
.po-ic{flex:none;font-size:20px}
.po-mid{flex:1;min-width:0}
.po-mid b{display:block;font-size:14.5px;line-height:1.3}
.po-mid small{display:block;margin-top:3px;font-size:12px;font-weight:400;color:var(--muted)}
html.dark .po-app-n{color:#2B2B2B}
html.dark .po-line:active{background:#2A2426}

/* ---------- 📱 कार्ट में नंबर माँगने वाला पॉपअप ---------- */
.leadpop{
  position:fixed;inset:0;z-index:80;
  display:flex;align-items:center;justify-content:center;padding:18px;
  background:rgba(0,0,0,.55);
}
.leadpop-card{
  width:100%;max-width:360px;padding:20px 18px 16px;border-radius:16px;
  background:var(--card,#fff);box-shadow:0 16px 44px rgba(0,0,0,.32);
  animation:leadUp .22s ease-out;
}
@keyframes leadUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.leadpop-card{animation:none}}
.leadpop-card b{display:block;font-size:17px;line-height:1.35}
.leadpop-card small{display:block;margin-top:6px;font-size:13px;line-height:1.5;color:var(--muted)}
.lead-row{display:flex;gap:8px;margin-top:14px}
.lead-row input{
  flex:1;min-width:0;padding:13px 12px;border:1px solid var(--line);
  border-radius:10px;background:#fff;font-family:inherit;font-size:16px;
}
.lead-row button{
  flex:none;padding:13px 18px;border:0;border-radius:10px;
  background:var(--lac);color:#fff;font-family:inherit;font-size:15px;font-weight:700;
}
.lead-row button:disabled{opacity:.55}
.lead-skip{
  display:block;width:100%;margin-top:12px;padding:6px;background:none;border:0;
  color:var(--muted);font-family:inherit;font-size:13px;text-decoration:underline;
}
.lead-err{display:block;margin-top:8px;font-size:12.5px;color:#B3261E}
.leadpop-card.ok b{color:#137A4B}
html.dark .leadpop-card{background:#1E1A1B}
html.dark .lead-row input{background:#141112;color:inherit}

/* बिल और ऑर्डर में तोहफे की लाइन */
.gift-tag{
  display:inline-block;margin-left:6px;padding:1px 7px;border-radius:4px;
  background:#137A4B;color:#fff;font-size:10.5px;font-weight:800;vertical-align:middle;
}

/* ---------- चेकआउट: ऊपर की पट्टी ---------- */
.co-top{
  display:flex;align-items:center;gap:10px;
  margin:0 -16px 14px;padding:14px 16px;
  background:var(--card);border-bottom:1px solid var(--line);
}
.co-top>div{flex:1;min-width:0}
.co-top b{display:block;font-size:17px;letter-spacing:-.01em}
.co-top a{display:block;margin-top:1px;font-size:12.5px;color:var(--muted)}
.co-safe{
  flex:none;padding:6px 11px;border-radius:8px;
  background:#EAF6EE;color:#137A4B;font-size:11px;font-weight:800;
  line-height:1.25;text-align:center;letter-spacing:.03em;
}
html.dark .co-safe{background:#16241C}
.vis-hide{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* कब पहुँचेगा */
.co-eta{
  margin:2px 0 12px;padding:11px 13px;border-radius:10px;
  background:#EAF6EE;color:#137A4B;font-size:13.5px;line-height:1.5;
}
.co-eta b{font-weight:800}
html.dark .co-eta{background:#16241C}

/* एडवांस क्यों — भरोसे के लिए */
.why-adv{margin:0;border:0;background:none}
.why-adv summary{
  list-style:none;cursor:pointer;
  display:block;width:fit-content;margin:0 auto;
  padding:9px 16px;border-radius:99px;background:#EAF6EE;
  font-size:13px;font-weight:700;color:#137A4B;text-align:center;
}
.why-adv summary::-webkit-details-marker{display:none}
.why-b{padding:12px 2px 0;font-size:13px;line-height:1.65;color:var(--muted)}
.why-b p{margin:0 0 8px}
html.dark .why-adv summary{background:#16241C}


/* ---------- चेकआउट: खाने अलग-अलग दिखें ---------- */
.co-lbl{
  margin:18px 0 8px;font-size:12px;font-weight:800;
  letter-spacing:.08em;text-transform:uppercase;color:var(--muted);
}
.co-card{
  padding:13px 14px;border-radius:12px;
  background:var(--card);border:1px solid var(--line);
}
.co-card .coupon-box{margin:0}
.co-card .coupon-msg{margin:9px 0 0}

/* पता और भुगतान के खाने भी वैसे ही डिब्बे लगें */
.wrap.narrow .form,
.wrap.narrow .pay-opts{
  padding:13px 14px;border-radius:12px;
  background:var(--card);border:1px solid var(--line);
}

/* ---------- भरा हुआ पता — छोटी पट्टी ---------- */
.addr-done{
  padding:13px 14px;border-radius:12px;
  background:var(--card);border:1px solid var(--line);
}
.addr-done[hidden]{display:none}
.ad-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.ad-top b{font-size:15px}
.ad-ch{flex:0 0 auto;padding:7px 14px;font-size:13px}
.ad-l{margin:0 0 4px;font-size:13.5px;line-height:1.55;color:var(--muted)}
.ad-ph{margin:0;font-size:13.5px;color:var(--muted)}
.ad-eta{margin-top:10px}

/* कार्ड पर "इतने बिके" */
.card-sold{
  /* ⚠️ यह #C05621 था — क्रीम कार्ड पर अनुपात 4.18, नियम 4.5 माँगता है.
     बस इतना गहरा किया कि नियम पूरा हो; नारंगी रंग वैसा ही दिखता है. */
  margin:2px 0 4px;font-size:11.5px;font-weight:700;color:#A4471B;
}

/* कूपन जो अपने आप लगता है */
.cp-auto{
  display:inline-block;margin-left:6px;padding:1px 7px;border-radius:4px;
  background:#137A4B;color:#fff;font-size:10.5px;font-weight:800;vertical-align:middle;
}

/* ---------- कूपन लग गया — हरा कार्ड ---------- */
.cp-on{
  display:flex;align-items:center;gap:11px;
  padding:12px 13px;border-radius:12px;
  background:#EAF6EE;border:1px solid #9CCFAE;
}
.cp-on[hidden]{display:none}
.cp-tick{
  flex:none;width:28px;height:28px;border-radius:50%;
  background:#137A4B;color:#fff;font-size:15px;font-weight:800;
  display:grid;place-items:center;
}
.cp-mid{flex:1;min-width:0}
.cp-mid b{display:block;font-size:14.5px;color:#0F5C39}
.cp-mid small{display:block;margin-top:2px;font-size:12.5px;color:#137A4B;font-weight:700}
.cp-badge{
  display:inline-block;margin-left:5px;padding:1px 7px;border-radius:4px;
  background:#137A4B;color:#fff;font-size:10px;font-weight:800;vertical-align:middle;
}
.cp-rm{
  flex:none;background:none;border:0;cursor:pointer;
  font-family:inherit;font-size:13px;font-weight:700;color:var(--muted);
  padding:6px 4px;
}
html.dark .cp-on{background:#16241C;border-color:#2E5B3F}
html.dark .cp-mid b,html.dark .cp-mid small{color:#7FD3A6}

/* ---------- तोहफ़ा मिलने पर बधाई का डिब्बा ---------- */
.gwrap{
  position:fixed;inset:0;z-index:140;
  display:grid;place-items:center;padding:20px;
  background:rgba(0,0,0,.55);
  opacity:0;transition:opacity .22s;
}
.gwrap.on{opacity:1}
.gbox{
  position:relative;width:100%;max-width:340px;
  padding:22px 20px;border-radius:18px;text-align:center;
  background:var(--card);
  box-shadow:0 12px 40px rgba(0,0,0,.3);
  transform:scale(.9);transition:transform .22s;
}
.gwrap.on .gbox{transform:scale(1)}
.gclose{
  position:absolute;top:10px;right:14px;cursor:pointer;
  font-size:17px;color:var(--muted);
}
.gemoji{font-size:52px;line-height:1;animation:gpop .5s ease-out}
@keyframes gpop{
  0%{transform:scale(.3) rotate(-18deg);opacity:0}
  60%{transform:scale(1.18) rotate(6deg)}
  100%{transform:scale(1) rotate(0);opacity:1}
}
.gt{margin:8px 0 2px;font-size:22px;font-weight:800;color:var(--lac)}
.gs{margin:0 0 12px;font-size:15px;line-height:1.5}
.gimg{
  width:110px;height:110px;object-fit:contain;border-radius:12px;
  margin:0 auto 12px;background:var(--paper);
}
.gn{margin:0 0 14px;font-size:12.5px;color:var(--muted);line-height:1.5}
@media(prefers-reduced-motion:reduce){
  .gwrap,.gbox{transition:none}
  .gemoji{animation:none}
}

/* रिव्यू पर "खरीद पक्की" का निशान */
.rev-vf{
  display:inline-block;margin-left:7px;padding:1px 8px;border-radius:4px;
  background:#EAF6EE;color:#137A4B;font-size:10.5px;font-weight:800;
  vertical-align:middle;
}
html.dark .rev-vf{background:#16241C}

/* रिव्यू में कितनी फाइलें */
.rev-lim{display:block;margin-top:4px;font-size:11.5px;color:var(--muted)}
/* एडमिन में वीडियो का थंबनेल */
.thumb video{width:100%;height:100%;object-fit:cover;display:block}

/* ---------- पार्सल की फोटो वाला खाना ---------- */
.wa-card{
  margin:16px 0;padding:15px 14px;border-radius:12px;text-align:left;
  background:#EAF6EE;border:1px solid #9CCFAE;
}
.wa-t{margin:0 0 5px;font-size:15.5px;font-weight:800;color:#0F5C39}
.wa-s{margin:0 0 12px;font-size:13.5px;line-height:1.55;color:var(--muted)}
.wa-card .btn{margin:0}
.wa-n{margin:9px 0 0;font-size:12.5px;color:var(--muted);text-align:center}
.wa-n b{color:var(--ink);letter-spacing:.02em}
html.dark .wa-card{background:#16241C;border-color:#2E5B3F}
html.dark .wa-t{color:#7FD3A6}

/* ---------- चेकआउट पर ग्राहकों की असली फोटो ---------- */
.proof{
  display:flex;align-items:center;gap:12px;
  margin:0 0 14px;padding:11px 13px;border-radius:12px;
  background:#EAF6EE;border:1px solid #9CCFAE;
}
.proof-pics{display:flex;flex:none}
.proof-pics img{
  width:46px;height:46px;object-fit:cover;border-radius:50%;
  border:2px solid #fff;margin-left:-12px;background:var(--line);
}
.proof-pics img:first-child{margin-left:0}
.proof-mid b{display:block;font-size:14px;color:#0F5C39}
.proof-mid small{display:block;margin-top:2px;font-size:12.5px;color:#137A4B}
.proof-mid{flex:1;min-width:0}
.proof-go{flex:none;font-size:13.5px;font-weight:800;color:#137A4B;text-decoration:underline}
html.dark .proof{background:#16241C;border-color:#2E5B3F}
html.dark .proof-mid b,html.dark .proof-mid small{color:#7FD3A6}

/* ---------- हिसाब: ऊपर एक लाइन, दबाने पर पूरा ब्योरा ---------- */
.sum-head{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  width:100%;padding:12px 13px;border:0;border-radius:12px;cursor:pointer;
  background:var(--card);font-family:inherit;text-align:left;color:var(--ink);
}
.sum-ic{
  flex:none;width:40px;height:40px;border-radius:10px;background:#F3EEE8;
  display:flex;align-items:center;justify-content:center;font-size:19px;
}
.sum-l{flex:1;min-width:0}
.sum-l b{display:block;font-size:15px}
.sum-l small{display:block;margin-top:2px;font-size:12.5px;color:#137A4B;font-weight:700}
.sum-r{flex:none;font-size:13.5px;color:var(--muted);text-align:right}
.sum-r small{display:block;margin-bottom:2px;font-size:12px}
.sum-r s{font-size:13px;color:var(--muted)}
.sum-r b{font-size:16px;color:var(--ink)}
html.dark .sum-ic{background:#2A2426}
.sum-ar{font-style:normal;margin-left:5px;font-size:16px;transition:transform .2s;display:inline-block}
.sum-head.open .sum-ar{transform:rotate(180deg)}
.sum-body{padding:4px 13px 10px}
.sum-body[hidden]{display:none}

/* ---------- 📱 फ़ोन पर पहली स्क्रीन में ही पहली दो फोटो पूरी ----------
   ⚠️ पहले फ़ोन पर पहली स्क्रीन ऊपर की रंगीन पट्टी, बड़े कैटेगरी गोलों
   और उनके बीच की खाली जगह में ही भर जाती थी — "हमारी पसंद" की पहली
   दो फोटो नीचे से कटी दिखती थीं, ग्राहक को स्क्रॉल करना पड़ता था.
   अब सिर्फ़ फ़ोन पर (620px से छोटी स्क्रीन):
     • रंगीन पट्टी पतली — ऊपर की छोटी लाइन (टैगलाइन) फ़ोन पर छिपी,
       बड़ी लाइन (h1) वैसी ही दिखती है
     • कैटेगरी के गोले 96 से 88px, उनके ऊपर-नीचे की खाली जगह कम
     • पंक्तियों के बीच की खाली जगह थोड़ी कम
   इससे पहली पंक्ति करीब 110px ऊपर आ जाती है.
   प्रोडक्ट फोटो का नाप और क्वालिटी बिल्कुल वही. कैटेगरी की फोटो भी
   वही माँगी जाती है (320 नाप). कंप्यूटर/टैबलेट पर कुछ नहीं बदला. */
@media (max-width:619px){
  .hero-slim{padding:10px 16px 9px}
  .hero-slim .eyebrow{display:none}
  .hero-slim h1{font-size:18px;line-height:1.25}
  .wrap.tight{padding-top:10px}
  /* देवनागरी फ़ॉन्ट की अपनी ऊँचाई ज़्यादा होती है — लाइन की ऊँचाई तय
     कर दी, ताकि हर फ़ोन पर हिसाब एक जैसा रहे (अक्षर का नाप वही) */
  .wrap.tight > .sec-title.deco{font-size:20px;line-height:1.3;padding-bottom:10px}
  .wrap.tight > .sec-head > .sec-title{line-height:1.3}
  .wrap.tight .cats{padding-top:8px;padding-bottom:6px}
  .cats{gap:14px}
  /* गोला थोड़ा बड़ा रखा (88) — पहले 76 पर छोटा लग रहा था */
  .cat{width:96px}
  .cat-dot{width:88px;height:88px;margin-bottom:6px}
  .cat-label{font-size:13px}
}

/* ---------- 💳 चेकआउट: भुगतान के विकल्प ऊपर ----------
   ⚠️ पहले चेकआउट पर भी ऊपर की चलती पट्टी और "डिज़ाइन खोजें" दिखते थे,
   दुकान का नाम दो लाइन में टूटता था, और "भुगतान का तरीका" डिब्बे के
   अंदर एक और डिब्बा था — सब मिलाकर भुगतान के विकल्प बहुत नीचे चले
   जाते थे. भुगतान के पन्ने पर इनकी ज़रूरत नहीं, ध्यान बँटता है. */
body.co-page .announce,
body.co-page .searchbar{display:none !important}
body.co-page main > .wrap.narrow{padding-top:0}
body.co-page .co-top{padding:10px 16px;margin-bottom:12px}
body.co-page .co-top b{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* भुगतान का तरीका — अंदर वाला दूसरा डिब्बा हटाया (दोनों तरफ़ जगह खाता था) */
body.co-page .paymode .pay-opts{padding:0;border:0;background:none;margin-bottom:10px}
/* "₹100 और छूट" अब ऊपर दाएँ कोने में — लिखावट दबकर तीन लाइन में नहीं टूटती */
body.co-page .pay-opt{position:relative}
body.co-page .pay-opt .pm-off{position:absolute;top:10px;right:10px;padding:5px 10px;font-size:12px}
body.co-page .agree-line{margin:12px 0 0}

/* ---------- चेकआउट: ग्राहकों की राय — नीचे से खुलने वाली खिड़की ---------- */
.rv-sheet{position:fixed;inset:0;z-index:100}
.rv-sheet[hidden]{display:none}
.rv-sheet-bg{position:absolute;inset:0;background:rgba(0,0,0,.45)}
.rv-sheet-box{
  position:absolute;left:0;right:0;bottom:0;max-height:86vh;overflow-y:auto;
  background:var(--paper);border-radius:16px 16px 0 0;
  padding:0 14px calc(18px + env(safe-area-inset-bottom, 0px));
  -webkit-overflow-scrolling:touch;overscroll-behavior:contain;
}
.rv-sheet-top{
  position:sticky;top:0;z-index:1;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin:0 -14px 6px;padding:13px 14px;
  background:var(--paper);border-bottom:1px solid var(--line);
}
.rv-sheet-top b{font-size:15.5px}
.rv-sheet-x{
  flex:none;width:34px;height:34px;border:0;border-radius:50%;cursor:pointer;
  background:var(--line);color:var(--ink);font-size:15px;font-family:inherit;
}
.rv-sheet [data-proof-more]{margin-top:12px}
html.rv-sheet-on,html.rv-sheet-on body{overflow:hidden}
@media(min-width:620px){.rv-sheet-box{left:50%;right:auto;width:560px;transform:translateX(-50%)}}
/* रात वाले रंग में --paper अपने आप गहरा हो जाता है — अलग नियम की ज़रूरत नहीं */
