/* ===== extra.css : calm premium layer (style.css er por load hoy) ===== */
:root{--primary:#4f46e5;--accent:#f43f5e;--r:16px;
--grad:linear-gradient(135deg,#4f46e5,#6366f1 60%,#7c6cf5);
--shadow:0 1px 2px rgba(15,18,34,.04),0 6px 18px rgba(15,18,34,.06);
--shadow2:0 14px 34px rgba(79,70,229,.16)}
body{font-family:'Plus Jakarta Sans','Hind Siliguri',system-ui,Segoe UI,Roboto,sans-serif}
body::before{background:radial-gradient(600px 400px at 8% -5%,rgba(79,70,229,.07),transparent),radial-gradient(500px 400px at 100% 8%,rgba(79,70,229,.04),transparent)}

/* announcement: shanto, chokh e na lage */
#announce{background:var(--surface2);color:var(--text);border-bottom:1px solid var(--border);font-weight:500}
#announce button{color:var(--text)}

/* hero + category: halka rong, 3D tilt bondho */
.hero{background:linear-gradient(135deg,rgba(79,70,229,.08),rgba(99,102,241,.04))}
.f{background:linear-gradient(135deg,rgba(79,70,229,.9),rgba(124,108,245,.85))}
.cat3d span{background:linear-gradient(135deg,hsl(var(--h) 60% 62%),hsl(calc(var(--h) + 30) 60% 56%));box-shadow:0 8px 18px hsl(var(--h) 60% 60%/.25);transform:none}
.card.tilt,.cat3d.tilt{transform:none!important}
.card,.cat3d{transition:translate .25s,box-shadow .25s}
.card:hover,.cat3d:hover{translate:0 -3px}
.card::after{display:none}

/* buttons + product card */
.btn{box-shadow:0 4px 12px rgba(79,70,229,.2)}
.btn:hover{box-shadow:0 8px 18px rgba(79,70,229,.28)}
.qadd{box-shadow:none;width:40px;height:40px}.qadd:hover{transform:scale(1.06)}
.nm{font-size:14px;font-weight:600}
.pr b{font-size:16px}
.bd{font-weight:700}

/* WhatsApp floating button + back-to-top */
.wafab{position:fixed;right:16px;bottom:96px;width:50px;height:50px;border-radius:0;background:transparent;color:var(--text);display:grid;place-items:center;font-size:0;box-shadow:none;z-index:44;transition:transform .16s ease;touch-action:manipulation}
.wafab svg{display:block;width:40px;height:40px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.wafab svg circle{fill:currentColor;stroke:none}
#up{bottom:158px;right:21px;width:40px;height:40px}
body.pdp .wafab{bottom:92px}
body.pdp #up{bottom:150px}
.wabtn{margin-top:10px}.trust.pt2{margin:10px 0}

/* checkout: kono distraction na. Shudhu form, total, confirm button */
body.co #cats,body.co .bnav,body.co #announce,body.co #up{display:none}
body.co .wafab{bottom:84px}

/* mobile */
@media(max-width:799px){.scene{display:none}.hero{padding:26px 20px}}
@media(max-width:700px){
 .fld input,.fld select,.fld textarea,input,select,textarea{font-size:16px}
 #announce{padding:5px 34px;font-size:11.5px;line-height:1.35}
 #announce button{right:4px;padding:3px}
 #announce button .ic{width:16px;height:16px}
 .wafab{width:42px;height:42px;right:12px;bottom:88px}
 .wafab svg{width:33px;height:33px}
 .wafab.tap-bounce{animation:chatIconBounce .42s cubic-bezier(.2,.75,.3,1.35)}
 .pr b{font-size:14px;line-height:1.2}
 .pr s{font-size:10px}
 #up{width:34px;height:34px;right:13px;background:linear-gradient(145deg,rgba(255,255,255,.72),rgba(125,190,255,.28));color:var(--text);border:1px solid rgba(255,255,255,.72);box-shadow:inset 0 1px 2px rgba(255,255,255,.8),0 5px 14px rgba(56,110,170,.18);backdrop-filter:blur(10px) saturate(150%);-webkit-backdrop-filter:blur(10px) saturate(150%)}
 #up .ic{width:17px;height:17px}
}
@keyframes chatIconBounce{0%{transform:scale(1)}32%{transform:scale(.78)}64%{transform:scale(1.12)}82%{transform:scale(.96)}100%{transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.wafab.tap-bounce{animation-duration:.01ms}}
@media(max-width:360px){#announce{padding:4px 30px;font-size:10.5px}#announce button .ic{width:14px;height:14px}}
@media(max-width:899px){
 body.co #po{position:fixed;left:14px;right:14px;width:auto;bottom:calc(12px + env(safe-area-inset-bottom));z-index:50;margin:0!important;box-shadow:0 10px 30px rgba(79,70,229,.4)}
 body.co main,body.co footer{padding-bottom:110px}
}
@media(min-width:701px){
 .wafab,body.pdp .wafab,body.co .wafab{bottom:24px}
 #up,body.pdp #up{bottom:84px;background:linear-gradient(145deg,rgba(255,255,255,.72),rgba(125,190,255,.28));color:var(--text);border:1px solid rgba(255,255,255,.72);box-shadow:inset 0 1px 2px rgba(255,255,255,.8),0 5px 14px rgba(56,110,170,.18);backdrop-filter:blur(10px) saturate(150%);-webkit-backdrop-filter:blur(10px) saturate(150%)}
}
