:root{
  --green:#0B6E4F;--green-dark:#08553D;--green-ink:#0B5A41;--mint:#EAF4EF;
  --ink:#16181B;--body:#3A3F45;--muted:#5F646B;--muted2:#6B7076;
  --line:#E8EAE6;--line2:#D5D9D2;--line3:#DDE0DA;--soft:#F4F5F3;--soft2:#E6E8E3;
  --amber-bg:#FDF5EA;--amber:#9A5B13;--amber-ink:#7A4510;--err:#B42318;
  --pad:80px;--font:'Plus Jakarta Sans','Hind Siliguri',sans-serif;--display:'Plus Jakarta Sans','Anek Bangla',sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:var(--ink);font-family:var(--font);font-size:15px;line-height:1.5;display:flex;flex-direction:column;min-height:100vh}
main{flex-grow:1}
a{color:var(--green)}a:hover{color:var(--green-dark)}
img{max-width:100%;display:block}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
h1,h2,h3{margin:0}
p{margin:0}
.wrap{width:100%;max-width:1440px;margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:10px 16px;z-index:99}
.skip:focus{left:8px;top:8px}
:focus-visible{outline:2px solid var(--green);outline-offset:2px}

/* buttons */
.btn{height:52px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 28px;border-radius:10px;font-weight:700;font-size:16px;text-decoration:none;border:0;cursor:pointer;white-space:nowrap}
.btn-primary{background:var(--green);color:#fff}.btn-primary:hover{background:var(--green-dark);color:#fff}
.btn-outline{border:1px solid var(--line2);color:var(--ink);background:#fff;font-weight:600}.btn-outline:hover{border-color:var(--ink);color:var(--ink)}
.btn-dark-outline{border:1px solid var(--ink);color:var(--ink);background:#fff}.btn-dark-outline:hover{background:var(--soft);color:var(--ink)}
.btn[disabled]{background:var(--line3);color:var(--muted);cursor:not-allowed}
.link-more{font-weight:700;font-size:15px;min-height:44px;display:inline-flex;align-items:center;text-decoration:none;white-space:nowrap}

/* header */
.site-header{background:#fff;border-bottom:1px solid var(--line);position:relative;z-index:20}
.announce{height:36px;display:flex;align-items:center;justify-content:center;background:var(--mint);color:var(--green-ink);font-size:14px;font-weight:500;text-align:center;padding:0 12px}
.announce .m{display:none}
.hdr{height:64px;display:flex;align-items:center;gap:40px}
.logo{display:flex;align-items:center;gap:8px;color:var(--ink);text-decoration:none;flex-shrink:0}
.logo:hover{color:var(--ink)}
.logo .mark{width:30px;height:30px;border-radius:8px;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800}
.logo .word{font-size:20px;font-weight:800;letter-spacing:-.02em}
.logo .word span{font-weight:500;color:var(--muted)}
.search{flex-grow:1;max-width:520px;height:44px;display:flex;align-items:center;gap:10px;padding:0 16px;background:var(--soft);border-radius:10px;color:var(--muted)}
.search input{flex-grow:1;min-width:0;border:0;background:transparent;font-size:14px;color:var(--ink);outline:none;height:100%}
.search:focus-within{box-shadow:0 0 0 2px var(--green)}
.hdr .spacer{flex-grow:1}
.acct{display:flex;align-items:center;gap:24px;font-size:14px;font-weight:600}
.acct a{color:var(--ink);text-decoration:none;min-height:44px;display:flex;align-items:center}
.acct a:hover{color:var(--green)}
.cart-btn{gap:8px;height:44px;padding:0 16px;border-radius:10px;border:1px solid var(--line)}
.badge{min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--green);color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center}
.icon-btn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border:0;background:transparent;color:var(--ink);cursor:pointer;border-radius:10px;flex-shrink:0}
.menu-btn,.m-cart{display:none}
.catnav{height:40px;display:flex;align-items:center;gap:32px;font-size:14px;font-weight:600}
.catnav a{color:var(--body);text-decoration:none}
.catnav a:hover,.catnav a.smart{color:var(--green)}

/* drawer */
.drawer-bg{position:fixed;inset:0;background:rgba(22,24,27,.4);z-index:40}
.drawer{position:fixed;top:0;left:0;bottom:0;width:min(390px,88vw);background:#fff;z-index:41;display:flex;flex-direction:column;overflow-y:auto}
.drawer[hidden],.drawer-bg[hidden]{display:none}
.drawer-top{height:60px;padding:0 8px 0 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);font-size:17px;font-weight:800}
.drawer-cats{padding:20px;display:flex;flex-direction:column}
.drawer-label{font-size:12px;font-weight:700;color:var(--muted);margin-bottom:6px}
.drawer-cats a{min-height:54px;display:flex;flex-direction:column;justify-content:center;border-bottom:1px solid #EEF0EC;color:var(--ink);text-decoration:none}
.drawer-cats a b{font-size:16px}.drawer-cats a span{font-size:13px;color:var(--muted)}
.drawer-cats a.smart{color:var(--green)}
.drawer-links{padding:4px 20px;display:flex;flex-direction:column;font-size:15px;font-weight:600}
.drawer-links a{min-height:46px;display:flex;align-items:center;color:var(--ink);text-decoration:none}
.drawer-help{margin:auto 20px 20px;padding:16px;border-radius:12px;background:var(--mint);display:flex;flex-direction:column;gap:4px}
.drawer-help strong{color:var(--green-ink)}.drawer-help span{font-size:14px;color:var(--body)}
body.noscroll{overflow:hidden}

/* footer */
.site-footer{background:var(--soft);border-top:1px solid var(--line);color:var(--body);font-size:14px;margin-top:0}
.foot{padding-top:56px;padding-bottom:28px;display:flex;flex-direction:column;gap:40px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:48px}
.foot-col{display:flex;flex-direction:column;gap:10px}
.foot-col .h{color:var(--ink);font-weight:700}
.foot-col a{color:var(--body);text-decoration:none}.foot-col a:hover{color:var(--green)}
.foot-brand{gap:14px}.foot-brand p{max-width:320px;line-height:1.7}
.foot-brand .logo .mark{width:28px;height:28px;font-size:12px}.foot-brand .logo .word{font-size:18px}
.foot-bottom{display:flex;justify-content:space-between;gap:16px;padding-top:20px;border-top:1px solid #E0E3DE;font-size:13px;color:var(--muted)}
.foot-bottom a{color:var(--muted);text-decoration:none}

/* shared bits */
.crumbs{padding-top:20px;display:flex;flex-wrap:wrap;gap:8px;font-size:13px;color:var(--muted)}
.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--green)}
.crumbs .cur{color:var(--ink);font-weight:600}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.sec-title{display:flex;flex-direction:column;gap:6px}
.sec-title h2{font-size:30px;font-weight:800;letter-spacing:-.02em;line-height:1.25}
.sec-title p{font-size:16px;color:var(--muted)}
.eyebrow{font-size:13px;font-weight:800;color:var(--green);letter-spacing:.06em;text-transform:uppercase}
.pill{padding:5px 12px;border-radius:6px;font-size:13px;font-weight:700;display:inline-block}
.pill.ok{background:var(--mint);color:var(--green-ink)}.pill.order{background:var(--amber-bg);color:var(--amber-ink)}
.note-amber{padding:12px 14px;border-radius:10px;background:var(--amber-bg);font-size:13px;line-height:1.7;color:var(--amber-ink)}
.check-ico{flex-shrink:0}

/* product card */
.pgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.pcard{display:flex;flex-direction:column;gap:12px;color:var(--ink);text-decoration:none}
.pcard:hover{color:var(--ink)}
.pcard:hover .pimg{filter:brightness(.97)}
.pimg{height:290px;border-radius:12px;background:var(--soft);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;color:#AEB4AC}
.pimg.tint{background:var(--mint);color:#9CC2B1}
.pimg img{width:100%;height:100%;object-fit:cover}
.pimg svg.ph{width:34%;height:auto;max-width:96px;opacity:.9}
.tag{position:absolute;top:12px;left:12px;padding:4px 10px;border-radius:6px;background:#fff;font-size:12px;font-weight:700;color:var(--green);z-index:1}
.pmeta{display:flex;flex-direction:column;gap:4px}
.pcat{font-size:12px;font-weight:600;color:var(--muted)}
.pname{font-size:15px;font-weight:600;line-height:1.4;min-height:42px}
.pprice{font-size:18px;font-weight:800}
.pstock{font-size:13px;font-weight:500;color:var(--green)}
.pstock.order{color:var(--amber)}

/* home */
.hero{padding-top:56px;padding-bottom:48px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px;align-items:center}
.hero-text{display:flex;flex-direction:column;gap:22px}
.hero-text .kicker{font-size:14px;font-weight:700;color:var(--green)}
.hero-text h1{font-family:var(--display);font-size:58px;line-height:1.12;font-weight:800;letter-spacing:-.03em}
.hero-text p{max-width:520px;font-size:18px;line-height:1.7;color:var(--muted)}
.hero-cta{display:flex;gap:12px;padding-top:6px;flex-wrap:wrap}
.hero-art{height:480px;border-radius:16px;background:var(--soft);padding:32px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:16px}
.hero-art a{border-radius:14px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--ink);text-decoration:none;font-weight:700;font-size:14px;text-align:center;padding:12px}
.hero-art a:hover{color:var(--green);box-shadow:0 1px 0 var(--line2)}
.hero-art a.smart{background:var(--mint);color:var(--green-ink)}
.hero-art a svg{width:44px;height:44px;color:var(--green)}
.hero-art .hero-note{grid-column:span 1;border-radius:14px;background:var(--green);color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:18px;gap:4px}
.hero-art .hero-note b{font-size:22px;line-height:1.2}
.hero-art .hero-note span{font-size:13px;opacity:.85}
.trust{margin-top:0;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.trust-item{display:flex;align-items:center;gap:12px}
.trust-ico{width:36px;height:36px;flex-shrink:0;border-radius:10px;background:var(--mint);display:flex;align-items:center;justify-content:center}
.trust-item b{font-size:15px;display:block}.trust-item span{font-size:13px;color:var(--muted)}
.section{padding-top:64px;padding-bottom:32px;display:flex;flex-direction:column;gap:24px}
.section.mid{padding-top:48px;padding-bottom:48px}
.catgrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}
.cattile{display:flex;flex-direction:column;gap:12px;color:var(--ink);text-decoration:none}
.cattile:hover{color:var(--ink)}
.cattile .cimg{height:180px;border-radius:12px;background:var(--soft);display:flex;align-items:center;justify-content:center;color:var(--green)}
.cattile.smart .cimg{background:var(--mint)}
.cattile .cimg svg{width:56px;height:56px}
.cattile:hover .cimg{filter:brightness(.97)}
.cattile b{font-size:16px;display:block}.cattile span{font-size:14px;color:var(--muted)}
.cattile .chev{display:none}
.how{margin-top:16px;padding:48px 56px;border-radius:16px;background:var(--soft);display:flex;flex-direction:column;gap:32px}
.how-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.how-step{padding:28px;border-radius:12px;background:#fff;display:flex;flex-direction:column;gap:10px}
.how-step .n{font-size:14px;font-weight:800;color:var(--green)}
.how-step b{font-size:19px}
.how-step span{font-size:15px;line-height:1.7;color:var(--muted)}
.wrap-how{padding-top:16px}
.section.smartsec .pimg{background:var(--mint);color:#9CC2B1}
.tabs-pill{display:flex;gap:4px;padding:4px;background:var(--soft);border-radius:10px}
.tabs-pill button{min-height:40px;padding:0 16px;border:0;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;background:transparent;color:var(--muted)}
.tabs-pill button[aria-selected="true"]{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.section.last{padding-bottom:80px}

/* shop */
.shop-head{padding-top:20px;padding-bottom:28px;display:flex;justify-content:space-between;align-items:flex-end;gap:24px}
.shop-head h1{font-size:36px;font-weight:800;letter-spacing:-.02em}
.shop-head p{font-size:16px;color:var(--muted);margin-top:6px}
.sortbar{display:flex;align-items:center;gap:12px;font-size:14px}
.sortbar .count{color:var(--muted)}
.sortbar label{font-weight:600}
.sortbar select,.field select{height:42px;padding:0 12px;border:1px solid var(--line2);border-radius:10px;background:#fff;font-size:14px}
.shop-body>*{min-width:0}
.shop-body{padding-bottom:72px;display:grid;grid-template-columns:240px minmax(0,1fr);gap:40px;align-items:start}
.filters{display:flex;flex-direction:column;gap:28px}
.fgroup{display:flex;flex-direction:column;gap:2px}
.fgroup .fl{font-size:13px;font-weight:700;color:var(--ink);margin-bottom:8px}
.fopts{display:flex;flex-direction:column;gap:2px}
.fbtn{min-height:38px;padding:0 12px;text-align:left;border:0;border-radius:8px;font-size:14px;cursor:pointer;background:transparent;color:var(--body);font-weight:500;white-space:nowrap}
.fbtn:hover{background:var(--soft)}
.fbtn[aria-pressed="true"]{background:var(--mint);color:var(--green-ink);font-weight:700}
.finfo{padding:16px;border-radius:12px;background:var(--soft);font-size:13px;line-height:1.7;color:var(--body)}
.shop-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 24px}
.shop-grid .pimg{height:260px}
.empty{padding:56px;border-radius:12px;background:var(--soft);display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.empty b{font-size:20px}.empty span{color:var(--muted)}
.empty[hidden]{display:none}

/* product */
.pd{padding-top:24px;padding-bottom:64px;display:grid;grid-template-columns:minmax(0,640px) minmax(0,1fr);gap:64px;align-items:start}
.gallery{display:flex;flex-direction:column;gap:12px}
.gmain{height:600px;border-radius:16px}
.gmain .tag{top:16px;left:16px;padding:5px 12px;font-size:13px}
.gthumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.gthumbs button{height:100px;border-radius:10px;background:var(--soft);border:2px solid transparent;cursor:pointer;padding:0;overflow:hidden}
.gthumbs button[aria-pressed="true"]{border-color:var(--green)}
.gthumbs img{width:100%;height:100%;object-fit:cover}
.pinfo{display:flex;flex-direction:column;gap:20px;padding-top:8px}
.pinfo .cat-link{font-size:14px;font-weight:600;text-decoration:none}
.pinfo h1{margin-top:-8px;font-size:36px;line-height:1.2;font-weight:800;letter-spacing:-.02em}
.pinfo .short{font-size:17px;line-height:1.7;color:var(--muted)}
.price-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.price-row .big{font-size:32px;font-weight:800}
.dbox{padding:16px 18px;border-radius:12px;background:var(--soft);font-size:15px;line-height:1.7;display:flex;flex-direction:column}
.dbox span{color:var(--muted)}.dbox .adv{color:var(--amber-ink)}
.qty-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.qty-row .lbl{font-size:15px;font-weight:600}
.qty{display:flex;align-items:center;border:1px solid var(--line2);border-radius:10px}
.qty button{width:44px;height:44px;border:0;background:transparent;font-size:20px;cursor:pointer}
.qty output,.qty .v{min-width:32px;text-align:center;font-weight:700}
.qty-row .tot{font-size:14px;color:var(--muted)}.qty-row .tot strong{color:var(--ink)}
.buy{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.buy .btn{height:54px;padding:0 12px}
.perks{display:flex;flex-direction:column;gap:10px;padding-top:8px;font-size:14px;color:var(--body)}
.perks span{display:flex;gap:10px;align-items:center}
.added{font-size:14px;color:var(--green);font-weight:600;min-height:20px}
.ptabs-wrap{display:flex;flex-direction:column;gap:24px}
.ptabs{display:flex;gap:8px;border-bottom:1px solid var(--line);overflow-x:auto}
.ptabs button{min-height:48px;padding:0 16px;margin-bottom:-1px;border:0;border-bottom:2px solid transparent;background:transparent;font-size:15px;cursor:pointer;color:var(--muted);font-weight:500;white-space:nowrap}
.ptabs button[aria-selected="true"]{border-bottom-color:var(--green);color:var(--ink);font-weight:700}
.ppanel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px;font-size:16px;line-height:1.8;color:var(--body)}
.ppanel ul{margin:0;padding-left:20px}
.ppanel[hidden]{display:none}
.ppanel strong{color:var(--ink)}
.specs{display:flex;flex-direction:column;font-size:15px;grid-column:1/-1}
.specs div{display:grid;grid-template-columns:240px minmax(0,1fr);border-bottom:1px solid #EEF0EC}
.specs span{padding:14px 0}.specs span:first-child{color:var(--muted)}
.faq-sec{padding-top:72px;padding-bottom:24px;display:grid;grid-template-columns:320px minmax(0,1fr);gap:48px}
.faq-sec h2{font-size:28px;font-weight:800;letter-spacing:-.02em;line-height:1.3}
.faqs{border-top:1px solid var(--line)}
.faqs details{border-bottom:1px solid var(--line)}
.faqs summary{min-height:60px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:16px;font-weight:600;cursor:pointer;list-style:none}
.faqs summary::-webkit-details-marker{display:none}
.faqs summary::after{content:'+';font-size:20px;color:var(--muted);font-weight:400}
.faqs details[open] summary::after{content:'−'}
.faqs p{margin:0 0 18px;max-width:720px;font-size:15px;line-height:1.8;color:var(--muted)}
.related{padding-top:56px;padding-bottom:72px;display:flex;flex-direction:column;gap:24px}
.related h2{font-size:28px;font-weight:800;letter-spacing:-.02em}
.related .pimg{height:260px}

/* cart & checkout */
.twocol{padding-top:48px;padding-bottom:72px;display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:56px;align-items:start}
.twocol.co{grid-template-columns:minmax(0,1fr) 420px}
.page-title{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.page-title h1{font-size:34px;font-weight:800;letter-spacing:-.02em}
.page-title span{font-size:15px;color:var(--muted)}
.cart-main{display:flex;flex-direction:column;gap:20px}
.lines{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.line{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:24px;align-items:center;padding:24px 0;border-bottom:1px solid var(--line)}
.line .thumb{height:120px;border-radius:10px;background:var(--soft);display:flex;align-items:center;justify-content:center;color:#AEB4AC;overflow:hidden}
.line .thumb svg{width:44px;height:44px}
.line .thumb img{width:100%;height:100%;object-fit:cover}
.line .info{display:flex;flex-direction:column;gap:6px}
.line .info a{font-size:16px;font-weight:700;color:var(--ink);text-decoration:none}
.line .ctrl{display:flex;align-items:center;gap:16px;margin-top:8px}
.line .qty button{width:40px;height:40px;font-size:18px}
.line .qty .v{min-width:26px}
.rm{min-height:44px;border:0;background:transparent;font-size:14px;color:var(--muted);text-decoration:underline;cursor:pointer}
.line .amt{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.line .amt b{font-size:18px}.line .amt span{font-size:13px;color:var(--muted)}
.summary{display:flex;flex-direction:column;gap:18px;padding:28px;border-radius:16px;background:var(--soft)}
.summary h2{font-size:20px;font-weight:800}
.srows{display:flex;flex-direction:column;gap:12px;font-size:15px}
.srows div{display:flex;justify-content:space-between;gap:12px}
.srows .k{color:var(--muted)}
.stotal{display:flex;justify-content:space-between;align-items:baseline;padding-top:16px;border-top:1px solid var(--line3)}
.stotal b{font-size:26px}
.summary .btn{height:54px;width:100%}
.summary small{font-size:13px;line-height:1.7;color:var(--muted)}
.sitems{display:flex;flex-direction:column;gap:14px}
.sitem{display:flex;gap:14px;align-items:center}
.sitem .thumb{width:64px;height:64px;flex-shrink:0;border-radius:10px;background:var(--soft2);display:flex;align-items:center;justify-content:center;color:#AEB4AC;overflow:hidden}
.sitem .thumb svg{width:26px;height:26px}
.sitem .thumb img{width:100%;height:100%;object-fit:cover}
.sitem .t{flex-grow:1;display:flex;flex-direction:column;gap:2px}
.sitem .t b{font-weight:600;font-size:14px}.sitem .t span{font-size:13px;color:var(--muted)}.sitem .t span.order{color:var(--amber)}
.co-form{display:flex;flex-direction:column;gap:28px}
.co-intro{display:flex;flex-direction:column;gap:8px}
.co-intro a{font-size:14px;font-weight:600;text-decoration:none}
.co-intro p{font-size:16px;color:var(--muted);line-height:1.7}
.fgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.field{display:flex;flex-direction:column;gap:8px}
.field label{font-size:14px;font-weight:600}
.field label .opt{font-weight:400;color:var(--muted)}
.field input,.field textarea,.field select{height:50px;padding:0 14px;border:1px solid var(--line2);border-radius:10px;font-size:16px;background:#fff;color:var(--ink);width:100%}
.field textarea{height:auto;padding:12px 14px;resize:vertical;line-height:1.6}
.field .err{font-size:13px;color:var(--err);min-height:0}
.field.bad input,.field.bad select,.field.bad textarea{border-color:var(--err)}
.agree{display:flex;gap:12px;align-items:flex-start;font-size:15px;line-height:1.6;cursor:pointer}
.agree input{width:20px;height:20px;margin:2px 0 0;flex-shrink:0;accent-color:var(--green)}
.hp{position:absolute;left:-5000px;width:1px;height:1px;overflow:hidden}
.form-msg{padding:12px 14px;border-radius:10px;font-size:14px;line-height:1.6}
.form-msg.err{background:#FEF3F2;color:var(--err)}
.form-msg[hidden]{display:none}
.cart-empty{padding:48px;border-radius:12px;background:var(--soft);display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.cart-empty b{font-size:20px}
.m-summary{display:none}

/* success */
.done{padding-top:72px;padding-bottom:72px;display:flex;justify-content:center}
.done-in{width:100%;max-width:760px;display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center}
.done-ico{width:72px;height:72px;border-radius:999px;background:var(--mint);display:flex;align-items:center;justify-content:center}
.done-in h1{font-size:38px;font-weight:800;letter-spacing:-.02em;line-height:1.25}
.done-in p{font-size:17px;line-height:1.7;color:var(--muted)}
.ordno{display:flex;gap:10px;align-items:center;padding:12px 20px;border-radius:10px;background:var(--soft);font-size:15px}
.ordno span{color:var(--muted)}.ordno strong{font-size:17px}
.bars{width:100%;margin-top:20px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;text-align:left}
.bars div{display:flex;flex-direction:column;gap:8px}
.bars i{height:4px;border-radius:999px;background:var(--line3);display:block}
.bars i.on{background:var(--green)}
.bars b{font-size:15px}.bars span{font-size:13px;color:var(--muted)}
.done-cta{display:flex;gap:12px;margin-top:16px;flex-wrap:wrap;justify-content:center}
.done-cta .btn{height:50px;padding:0 24px}
.done-in .small{font-size:14px;color:var(--muted)}

/* track */
.track{padding-top:56px;padding-bottom:72px;display:grid;grid-template-columns:420px minmax(0,1fr);gap:64px;align-items:start}
.track-form{display:flex;flex-direction:column;gap:20px}
.track-form h1{font-size:34px;font-weight:800;letter-spacing:-.02em}
.track-form p{font-size:16px;color:var(--muted);line-height:1.7}
.track-form .btn{width:100%}
.track-out{min-height:520px;padding:36px;border-radius:16px;background:var(--soft)}
.track-idle{height:440px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;color:var(--muted)}
.track-idle b{font-size:18px;color:var(--ink)}
.track-res{display:flex;flex-direction:column;gap:28px}
.track-res .top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.track-res .top span.s{font-size:13px;color:var(--muted)}
.track-res .top b{font-size:24px;display:block}
.steps{display:flex;flex-direction:column}
.step{display:grid;grid-template-columns:28px minmax(0,1fr);gap:16px}
.step .rail{display:flex;flex-direction:column;align-items:center}
.step .dot{width:16px;height:16px;border-radius:999px;margin-top:3px;background:var(--line3)}
.step.done .dot{background:var(--green)}
.step.now .dot{background:#fff;border:4px solid var(--green)}
.step .ln{flex-grow:1;width:2px;background:var(--line3)}
.step.done .ln{background:var(--green)}
.step:last-child .ln{display:none}
.step .tx{display:flex;flex-direction:column;gap:2px;padding-bottom:20px}
.step .tx b{font-size:16px;font-weight:500;color:var(--muted)}
.step.done .tx b,.step.now .tx b{font-weight:700;color:var(--ink)}
.step .tx span{font-size:14px;color:var(--muted)}

/* help */
.help-head{padding-top:48px;padding-bottom:24px;display:flex;flex-direction:column;gap:6px}
.help-head h1{font-size:34px;font-weight:800;letter-spacing:-.02em}
.help-head p{font-size:16px;color:var(--muted)}
.help-body{padding-top:16px;padding-bottom:72px;display:grid;grid-template-columns:260px minmax(0,1fr);gap:56px;align-items:start}
.help-nav{display:flex;flex-direction:column;gap:2px}
.help-nav a{min-height:44px;padding:0 14px;display:flex;align-items:center;border-radius:8px;font-size:15px;color:var(--body);text-decoration:none;font-weight:500;white-space:nowrap}
.help-nav a:hover{background:var(--soft)}
.help-nav a[aria-current="page"]{background:var(--mint);color:var(--green-ink);font-weight:700}
.help-panels{min-height:640px;font-size:16px;line-height:1.85;color:var(--body);max-width:780px}
.hpanel{display:flex;flex-direction:column;gap:18px}
.hpanel[hidden]{display:none}
.hpanel h2{font-size:26px;font-weight:800;color:var(--ink)}
.hpanel strong{color:var(--ink)}
.hpanel strong.g{color:var(--green)}
.contact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.contact-grid div{padding:20px;border-radius:12px;background:var(--soft);display:flex;flex-direction:column}
.contact-grid span{font-size:13px;color:var(--muted)}
.contact-grid strong{word-break:break-word}

/* 404 */
.nf{padding-top:96px;padding-bottom:96px;display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}
.nf h1{font-size:34px;font-weight:800}
.nf p{color:var(--muted)}

/* ---------- responsive ---------- */
@media (max-width:1200px){
  :root{--pad:40px}
  .hdr{gap:24px}
  .catnav{gap:24px;overflow-x:auto}
  .hero-text h1{font-size:48px}
  .catgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pd{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
  .gmain{height:auto;aspect-ratio:1/1}
  .twocol,.twocol.co{grid-template-columns:minmax(0,1fr) 360px;gap:40px}
  .track{grid-template-columns:360px minmax(0,1fr);gap:40px}
  .foot-grid{gap:32px}
}
@media (max-width:900px){
  .pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .shop-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero{grid-template-columns:1fr;gap:32px}
  .hero-art{order:-1;height:auto}
  .trust{grid-template-columns:repeat(2,minmax(0,1fr))}
  .how-grid{grid-template-columns:1fr}
  .pd{grid-template-columns:1fr}
  .twocol,.twocol.co{grid-template-columns:1fr}
  .track{grid-template-columns:1fr}
  .help-body{grid-template-columns:1fr;gap:24px}
  .help-nav{flex-direction:row;overflow-x:auto}
  .faq-sec{grid-template-columns:1fr;gap:16px}
  .foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .shop-body{grid-template-columns:1fr;gap:24px}
  .fopts{flex-direction:row;overflow-x:auto;gap:6px;padding-bottom:2px}
  .fbtn{background:var(--soft)}
  .filters{gap:16px}
  .finfo{display:none}
}
@media (max-width:760px){
  :root{--pad:16px}
  body{font-size:15px}
  .announce{height:32px;font-size:12px}
  .announce .d{display:none}.announce .m{display:inline}
  .hdr{height:auto;display:grid;grid-template-columns:44px 1fr 44px;grid-template-areas:"menu logo cart" "search search search";gap:0;padding-left:8px;padding-right:8px}
  .menu-btn{display:flex;grid-area:menu}
  .m-cart{display:flex;grid-area:cart;position:relative;color:var(--ink)}
  .m-cart .badge{position:absolute;top:5px;right:3px;min-width:17px;height:17px;font-size:10px;padding:0 4px}
  .logo{grid-area:logo;justify-self:center;height:56px;gap:7px}
  .logo .mark{width:26px;height:26px;border-radius:7px;font-size:11px}
  .logo .word{font-size:17px}
  .search{grid-area:search;max-width:none;height:42px;margin:0 8px 10px;padding:0 14px}
  .search input{font-size:15px}
  .hdr .spacer,.acct,.catnav{display:none}
  .hero{padding-top:20px;padding-bottom:24px;gap:20px}
  .hero-art{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto auto;padding:12px;gap:8px;border-radius:14px}
  .hero-art a{padding:12px 4px;font-size:12px;gap:6px;border-radius:10px;min-height:88px}
  .hero-art a svg{width:28px;height:28px}
  .hero-art .hero-note{padding:12px;border-radius:10px}
  .hero-art .hero-note b{font-size:15px}.hero-art .hero-note span{font-size:11px}
  .hero-text{gap:16px}
  .hero-text .kicker{font-size:13px}
  .hero-text h1{font-size:34px;line-height:1.2}
  .hero-text p{font-size:15px}
  .hero-cta .btn{width:100%}
  .hero-cta .btn-outline{display:none}
  .trust{margin:0;padding:16px;border:0;border-radius:12px;background:var(--soft);gap:12px}
  .trust-ico{display:none}
  .trust-item b{font-size:13px}.trust-item span{display:none}
  .trust-item::before{content:'';width:14px;height:14px;flex-shrink:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B6E4F' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/contain no-repeat}
  .trust-item{gap:8px}
  .section{padding-top:40px;padding-bottom:16px;gap:16px}
  .section.mid{padding-top:32px;padding-bottom:24px}
  .sec-title h2{font-size:22px}
  .sec-title p{font-size:14px}
  .catgrid{grid-template-columns:1fr;gap:0;border-top:1px solid var(--line)}
  .cattile{flex-direction:row;align-items:center;gap:14px;padding:10px 0;border-bottom:1px solid var(--line)}
  .cattile .cimg{width:48px;height:48px;border-radius:10px;flex-shrink:0}
  .cattile .cimg svg{width:24px;height:24px}
  .cattile .ct{flex-grow:1}
  .cattile b{font-size:15px}.cattile span{font-size:13px}
  .cattile .chev{display:block;color:var(--muted)}
  .pgrid{gap:16px 12px}
  .pimg,.shop-grid .pimg,.related .pimg{height:auto;aspect-ratio:1/1}
  .pname{font-size:14px;min-height:40px}
  .pprice{font-size:16px}
  .pstock{font-size:12px}
  .pcat{display:none}
  .tag{top:8px;left:8px;font-size:11px;padding:3px 8px}
  .how{margin:8px 16px 0;padding:24px 20px;gap:16px}
  .wrap-how{padding-left:0;padding-right:0}
  .how-grid{gap:0}
  .how-step{padding:10px 0;background:transparent;display:grid;grid-template-columns:28px 1fr;gap:2px 8px}
  .how-step .n{grid-row:span 2;font-size:0}
  .how-step .n::after{content:attr(data-n);font-size:14px}
  .how-step b{font-size:15px}.how-step span{font-size:14px}
  .smartsec .pgrid{grid-template-columns:1fr;gap:12px}
  .smartsec .pcard{flex-direction:row;gap:14px;align-items:center}
  .smartsec .pimg{width:96px;height:96px;flex-shrink:0;aspect-ratio:auto}
  .smartsec .pimg .tag{display:none}
  .smartsec .pname{min-height:0}
  .tabs-pill{width:100%}
  .tabs-pill button{flex:1;padding:0 6px;font-size:13px}
  .newsec .sec-head{flex-direction:column;align-items:stretch}
  .section.last{padding-bottom:48px}
  .shop-head{flex-direction:column;align-items:flex-start;padding-bottom:16px;gap:12px}
  .shop-head h1{font-size:26px}
  .shop-head p{font-size:14px}
  .sortbar{width:100%}
  .sortbar select{flex-grow:1}
  .shop-grid{gap:20px 12px}
  .pd{padding-top:12px;padding-bottom:32px;gap:20px}
  .gmain{border-radius:12px}
  .gthumbs{gap:8px}.gthumbs button{height:64px}
  .pinfo{gap:14px;padding-top:0}
  .pinfo h1{font-size:24px;margin-top:-4px}
  .pinfo .short{font-size:15px}
  .price-row .big{font-size:28px}
  .dbox{font-size:14px;padding:14px 16px}
  .qty-row{justify-content:space-between}
  .qty-row .tot{display:none}
  .buy{grid-template-columns:1fr}
  .buy .order-now{order:-1}
  .ppanel{grid-template-columns:1fr;gap:16px;font-size:15px}
  .specs div{grid-template-columns:140px minmax(0,1fr)}
  .faq-sec{padding-top:40px}
  .faq-sec h2,.related h2{font-size:22px}
  .faqs summary{font-size:15px;min-height:54px}
  .related{padding-top:32px;padding-bottom:40px}
  .twocol,.twocol.co{padding-top:24px;padding-bottom:40px;gap:24px}
  .page-title h1,.co-h1{font-size:26px!important}
  .line{grid-template-columns:80px minmax(0,1fr);gap:14px;padding:16px 0}
  .line .thumb{height:80px}
  .line .amt{grid-column:2;align-items:flex-start;flex-direction:row;gap:8px;align-items:baseline}
  .line .ctrl{gap:8px}
  .fgrid{grid-template-columns:1fr;gap:16px}
  .co-form{gap:20px}
  .co .summary{order:-1;padding:16px 18px;gap:12px}
  .co .summary .sitems,.co .summary .note-amber,.co .summary h2,.co .summary .desk-only{display:none}
  .co .summary.open .sitems{display:flex}
  .m-summary{display:flex;justify-content:space-between;align-items:center;min-height:44px;border:0;background:transparent;font-weight:700;font-size:15px;padding:0;cursor:pointer;width:100%}
  .done{padding-top:40px;padding-bottom:48px}
  .done-in h1{font-size:26px}
  .done-in p{font-size:15px}
  .bars{grid-template-columns:repeat(2,minmax(0,1fr))}
  .done-cta .btn{width:100%}
  .track{padding-top:24px;padding-bottom:40px;gap:24px}
  .track-form h1{font-size:26px}
  .track-out{min-height:0;padding:24px 20px}
  .track-idle{height:200px}
  .track-res .top b{font-size:20px}
  .help-head{padding-top:24px;padding-bottom:8px}
  .help-head h1{font-size:26px}
  .help-panels{min-height:0;font-size:15px}
  .hpanel h2{font-size:22px}
  .contact-grid{grid-template-columns:1fr}
  .foot{padding-top:32px;gap:28px}
  .foot-grid{gap:24px 16px}
  .foot-brand{grid-column:1/-1}
  .foot-contact{grid-column:1/-1}
  .foot-bottom{flex-direction:column;gap:6px}
}
.btn.m-submit{display:none}
@media (max-width:760px){.btn.desk-submit{display:none}.btn.m-submit{display:flex;width:100%;height:56px;font-size:17px}}

/* ---------- lead bands (request / notify) ---------- */
.band{padding-top:24px;padding-bottom:24px}
.band-in{border-radius:16px;background:var(--mint);padding:40px 48px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px;align-items:start}
.band-soft .band-in{background:var(--soft)}
.band-text{display:flex;flex-direction:column;gap:10px;padding-top:6px}
.band-text h2{font-size:28px;font-weight:800;letter-spacing:-.02em;line-height:1.25}
.band-text p{font-size:16px;line-height:1.7;color:var(--body)}
.lead-form{display:flex;flex-direction:column;gap:14px}
.lead-form .field input,.lead-form .field textarea{height:48px}
.lead-form .field textarea{height:auto}
.lead-form .fgrid{gap:14px}
.lead-form .btn{align-self:flex-start}
.lead-msg{padding:12px 14px;border-radius:10px;font-size:14px;line-height:1.6;background:#fff;color:var(--green-ink);font-weight:600}
.lead-msg.err{background:#FEF3F2;color:var(--err)}
.chips{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.chips legend{font-size:14px;font-weight:600;margin-bottom:8px;padding:0}
.chip{position:relative;cursor:pointer}
.chip input{position:absolute;opacity:0;width:1px;height:1px}
.chip span{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--line2);background:#fff;font-size:14px;font-weight:600;color:var(--body)}
.chip input:checked+span{background:var(--green);border-color:var(--green);color:#fff}
.chip input:focus-visible+span{outline:2px solid var(--green);outline-offset:2px}
.section.last+.band{padding-top:0}
.band:last-of-type{padding-bottom:72px}

/* ---------- reviews ---------- */
.rgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.rcard{margin:0;padding:24px;border-radius:14px;background:var(--soft);display:flex;flex-direction:column;gap:12px}
.rcard blockquote{margin:0;font-size:15px;line-height:1.7;color:var(--body)}
.rcard figcaption{font-size:13px;color:var(--muted)}
.rcard figcaption b{color:var(--ink)}
.stars{color:#C98A12;letter-spacing:2px;font-size:15px}
.stars .off{color:var(--line2)}

/* ---------- request page ---------- */
.req-body{padding-top:16px;padding-bottom:72px;display:grid;grid-template-columns:minmax(0,0.9fr) minmax(0,1.1fr);gap:56px;align-items:start}
.req-steps{display:flex;flex-direction:column;gap:12px}
.req-steps div{display:grid;grid-template-columns:40px 1fr;gap:2px 14px;padding:18px;border-radius:12px;background:var(--soft)}
.req-steps .n{grid-row:span 2;width:40px;height:40px;border-radius:999px;background:var(--mint);color:var(--green);font-weight:800;display:flex;align-items:center;justify-content:center}
.req-steps b{font-size:16px}.req-steps span:last-child{font-size:14px;color:var(--muted)}
.req-card{padding:28px;border-radius:16px;border:1px solid var(--line)}

/* ---------- chat widget ---------- */
.chat-fab{position:fixed;right:20px;bottom:20px;z-index:30;height:52px;padding:0 18px 0 14px;border:0;border-radius:999px;background:var(--green);color:#fff;display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px;cursor:pointer;box-shadow:0 6px 20px rgba(11,110,79,.28)}
.chat-fab:hover{background:var(--green-dark)}
.chat-fab[aria-expanded="true"]{display:none}
.chatbox{position:fixed;right:20px;bottom:20px;z-index:31;width:380px;height:min(620px,calc(100vh - 40px));background:#fff;border-radius:16px;box-shadow:0 12px 40px rgba(22,24,27,.22);display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line)}
.chat-head{display:flex;align-items:center;gap:10px;padding:10px 6px 10px 14px;background:var(--green);color:#fff}
.chat-av{width:34px;height:34px;border-radius:10px;background:#fff;color:var(--green);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;flex-shrink:0}
.chat-title{flex-grow:1;display:flex;flex-direction:column;line-height:1.3;min-width:0}
.chat-title b{font-size:15px}.chat-title span{font-size:12px;opacity:.85}
.chat-lang{display:flex;background:rgba(255,255,255,.16);border-radius:8px;padding:2px}
.chat-lang button{border:0;background:transparent;color:#fff;font-size:12px;font-weight:700;padding:5px 8px;border-radius:6px;cursor:pointer;min-height:28px}
.chat-lang button[aria-pressed="true"]{background:#fff;color:var(--green)}
.chat-close{color:#fff}
.chat-log{flex-grow:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;background:#FAFAF8}
.msg{max-width:86%;padding:10px 13px;border-radius:14px;font-size:14px;line-height:1.6;white-space:pre-line;word-wrap:break-word}
.msg.bot{align-self:flex-start;background:#fff;border:1px solid var(--line);border-bottom-left-radius:4px}
.msg.user{align-self:flex-end;background:var(--green);color:#fff;border-bottom-right-radius:4px}
.msg a{color:var(--green);font-weight:600}
.msg.user a{color:#fff}
.msg.typing{color:var(--muted);font-style:italic}
.chat-cards{align-self:stretch;display:flex;flex-direction:column;gap:8px}
.ccard{display:grid;grid-template-columns:52px 1fr;gap:4px 10px;align-items:center;padding:8px;border-radius:12px;background:#fff;border:1px solid var(--line);text-decoration:none;color:var(--ink)}
.ccard .ci{grid-row:span 3;width:52px;height:52px;border-radius:10px;background:var(--soft);display:flex;align-items:center;justify-content:center;color:#AEB4AC;overflow:hidden}
.ccard .ci svg{width:26px;height:26px}.ccard .ci img{width:100%;height:100%;object-fit:cover}
.ccard b{font-size:13px;line-height:1.35}
.ccard .cp{font-size:13px;font-weight:800}
.ccard .cs{font-size:11px;color:var(--green)}.ccard .cs.order{color:var(--amber)}
.ccard-actions{grid-column:2;display:flex;gap:6px;margin-top:2px}
.ccard-actions a,.ccard-actions button{font-size:12px;font-weight:700;min-height:30px;padding:0 10px;border-radius:8px;border:1px solid var(--line2);background:#fff;color:var(--ink);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center}
.ccard-actions button{background:var(--green);border-color:var(--green);color:#fff}
.chat-quick{display:flex;flex-wrap:wrap;gap:6px;padding:8px 12px;border-top:1px solid var(--line);background:#fff;max-height:118px;overflow-y:auto}
.chat-quick:empty{display:none}
.chat-quick button{border:1px solid var(--green);background:#fff;color:var(--green);border-radius:999px;font-size:13px;font-weight:600;padding:6px 12px;cursor:pointer;min-height:34px}
.chat-quick button:hover{background:var(--mint)}
.chat-input{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line);background:#fff}
.chat-input input{flex-grow:1;min-width:0;height:44px;border:1px solid var(--line2);border-radius:10px;padding:0 12px;font-size:15px}
.chat-send{width:44px;height:44px;border:0;border-radius:10px;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}
.chat-send[disabled]{background:var(--line3)}

@media (max-width:900px){
  .band-in{grid-template-columns:1fr;gap:20px;padding:28px}
  .rgrid{grid-template-columns:1fr}
  .req-body{grid-template-columns:1fr;gap:24px}
}
@media (max-width:760px){
  .band{padding-top:16px;padding-bottom:16px}
  .band-in{padding:22px 18px;border-radius:14px}
  .band-text h2{font-size:22px}
  .band-text p{font-size:14px}
  .lead-form .btn{align-self:stretch}
  .req-card{padding:18px}
  .chat-fab{right:14px;bottom:14px;height:50px;padding:0 14px}
  .chat-fab span{display:none}
  .chatbox{right:0;bottom:0;left:0;top:0;width:auto;height:auto;border-radius:0;border:0}
}