/* ====================================================
   AHD APPARELS — DESIGN TOKENS
   ==================================================== */
:root{
  --ink:#111111;
  --ink-soft:#3a3a3a;
  --muted:#6b6b6b;
  --line:#e7e7e7;
  --line-strong:#d9d9d9;
  --bg:#ffffff;
  --panel:#f6f6f6;
  --panel-2:#efefef;
  --display:'Space Grotesk', system-ui, sans-serif;
  --ui:'Archivo', system-ui, sans-serif;
  --maxw:1440px;
  --pad:48px;

  /* Legacy tokens kept for cart drawer / checkout / auth */
  --cs-primary:#1F6E5A;
  --cs-bg:#ffffff;
  --cs-card-bg:#ffffff;
  --cs-text-primary:#111111;
  --cs-text-muted:#6b6b6b;
  --cs-border:#e7e7e7;
  --cs-soft-highlight:#f6f6f6;
  --cs-accent:#D97706;
  --font-heading:'Space Grotesk', system-ui, sans-serif;
  --font-body:'Archivo', system-ui, sans-serif;
  --transition-smooth:all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* ====================================================
   BASE
   ==================================================== */
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--ui);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
h1,h2,h3,h4,h5,h6,.font-heading{font-family:var(--display);color:var(--ink);}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad);}

/* ====================================================
   PLACEHOLDER SYSTEM
   ==================================================== */
.ph{
  position:relative;width:100%;height:100%;
  background:repeating-linear-gradient(135deg,#f3f3f3 0 14px,#ededed 14px 28px);
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.ph::after{
  content:attr(data-label);
  font-family:'Space Grotesk',monospace;
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  color:#9a9a9a;background:rgba(255,255,255,.78);
  padding:6px 12px;border:1px solid #e0e0e0;white-space:nowrap;
}

/* ====================================================
   HEADER / NAV
   ==================================================== */
header.site{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(120%) blur(8px);
  border-bottom:1px solid var(--line);
}
.nav{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:24px;
  height:84px;
}
.brand{display:flex;align-items:center;gap:12px;justify-self:start;}
.mark{width:34px;height:34px;flex:none;display:block;}
.brand .name{
  font-family:var(--display);font-weight:700;font-size:22px;
  letter-spacing:.02em;line-height:1;
}
.brand .name span{font-weight:400;color:var(--muted);}

nav.menu{display:flex;gap:36px;justify-self:center;}
nav.menu a{
  font-family:var(--ui);font-size:15px;font-weight:500;
  color:var(--ink-soft);padding:4px 0;position:relative;
  transition:color .18s ease;
}
nav.menu a::after{
  content:"";position:absolute;left:0;right:0;bottom:-3px;height:2px;
  background:var(--ink);transform:scaleX(0);transform-origin:center;
  transition:transform .2s ease;
}
nav.menu a:hover{color:var(--ink);}
nav.menu a:hover::after,nav.menu a.active::after{transform:scaleX(1);}
nav.menu a.active{color:var(--ink);font-weight:600;}

nav.menu .has-sub{position:relative;display:flex;align-items:center;}
nav.menu .has-sub > a{display:inline-flex;align-items:center;gap:6px;}
nav.menu .has-sub > a .caret{transition:transform .2s ease;}
nav.menu .has-sub:hover > a .caret{transform:rotate(180deg);}
nav.menu .has-sub::after{content:"";position:absolute;top:100%;left:-12px;right:-12px;height:18px;}
nav.menu .has-sub .nav-sub{
  position:absolute;top:calc(100% + 14px);left:50%;
  transform:translateX(-50%) translateY(6px);
  background:#fff;border:1px solid var(--line);
  min-width:208px;padding:8px;
  box-shadow:0 20px 44px -22px rgba(0,0,0,.4);
  display:flex;flex-direction:column;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .18s ease,transform .18s ease,visibility .18s;
  z-index:60;
}
nav.menu .has-sub:hover .nav-sub,
nav.menu .has-sub:focus-within .nav-sub{
  opacity:1;visibility:visible;pointer-events:auto;
  transform:translateX(-50%) translateY(0);
}
nav.menu .nav-sub a{
  display:block;padding:11px 14px;font-size:14px;font-weight:500;
  color:var(--ink-soft);white-space:nowrap;border-radius:2px;
}
nav.menu .nav-sub a::after{display:none;}
nav.menu .nav-sub a:hover{background:var(--panel);color:var(--ink);}

.tools{display:flex;align-items:center;gap:14px;justify-self:end;}
.search{
  display:flex;align-items:center;gap:8px;
  border:1px solid var(--line-strong);border-radius:2px;
  padding:9px 12px;background:#fff;
  transition:border-color .18s ease;
  min-width:220px;position:relative;
}
.search:focus-within{border-color:var(--ink);}
.search input{
  border:0;outline:0;background:transparent;
  font-family:var(--ui);font-size:14px;color:var(--ink);width:100%;
}
.search input::placeholder{color:#9a9a9a;}
.search svg{flex:none;}

.icon-btn{
  display:flex;align-items:center;justify-content:center;
  width:42px;height:42px;border:1px solid transparent;border-radius:2px;
  background:transparent;cursor:pointer;color:var(--ink);
  transition:background .18s ease,border-color .18s ease;
  position:relative;
}
.icon-btn:hover{background:var(--panel);border-color:var(--line);}
.cart-count{
  position:absolute;top:4px;right:4px;
  background:var(--ink);color:#fff;
  font-family:var(--ui);font-size:10px;font-weight:700;
  min-width:16px;height:16px;border-radius:9px;
  display:flex;align-items:center;justify-content:center;
  padding:0 4px;
}

/* Bootstrap dropdown override to match design */
.dropdown-menu{
  background:#fff;border:1px solid var(--line);border-radius:2px;
  box-shadow:0 20px 44px -22px rgba(0,0,0,.4);
  padding:8px;min-width:200px;
}
.dropdown-item{
  font-family:var(--ui);font-size:14px;font-weight:500;
  color:var(--ink-soft);padding:11px 14px;border-radius:2px;
}
.dropdown-item:hover,.dropdown-item:focus{background:var(--panel);color:var(--ink);}
.dropdown-divider{border-color:var(--line);margin:4px 0;}
.dropdown-toggle::after{display:none;}

/* ====================================================
   HERO CAROUSEL
   ==================================================== */
.hero{position:relative;background:#fff;overflow:hidden;margin:16px 24px 0;}
.hero-track{display:flex;transition:transform .6s cubic-bezier(.7,0,.2,1);}
.hero-slide{min-width:100%;display:grid;grid-template-columns:1fr 1fr;}
.hero-pane{position:relative;height:min(72vh,720px);overflow:hidden;}
.hero-pane .ph{background:repeating-linear-gradient(135deg,#efefef 0 18px,#e8e8e8 18px 36px);}
.hero-pane .cap{
  position:absolute;left:0;top:0;right:0;bottom:0;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:44px;gap:14px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.04) 100%);
  pointer-events:none;
}
.hero-pane .kicker{
  font-family:var(--display);font-size:12px;letter-spacing:.32em;
  text-transform:uppercase;color:var(--muted);
}
.hero-pane h2{
  font-family:var(--display);font-weight:700;
  font-size:clamp(34px,4.4vw,64px);line-height:.98;margin:0;
  letter-spacing:-.01em;color:var(--ink);
}
.hero-pane .lede{font-size:15px;color:var(--ink-soft);max-width:38ch;}
.hero-slide--banner{grid-template-columns:1fr;}
.hero-pane--full{position:relative;height:min(72vh,720px);overflow:hidden;}
.hero-banner-img{width:100%;height:100%;object-fit:cover;display:block;}
.hero-pane--full .cap{
  position:absolute;left:0;top:0;right:0;bottom:0;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:44px;gap:14px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.55) 100%);
  pointer-events:none;
}
.hero-pane--full h2{
  font-family:var(--display);font-weight:700;
  font-size:clamp(34px,4.4vw,64px);line-height:.98;margin:0;
  letter-spacing:-.01em;color:#fff;
}
.hero-pane--full .lede{font-size:15px;color:rgba(255,255,255,.85);max-width:52ch;}
.hero-cta{
  pointer-events:auto;align-self:flex-start;margin-top:6px;
  display:inline-flex;align-items:center;gap:10px;
  background:var(--ink);color:#fff;
  font-family:var(--ui);font-weight:600;font-size:13px;
  letter-spacing:.12em;text-transform:uppercase;
  padding:14px 26px;border-radius:2px;
  transition:opacity .18s ease,transform .18s ease;
}
.hero-cta:hover{opacity:.85;transform:translateY(-1px);}
.hero-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  width:48px;height:48px;border-radius:50%;
  background:rgba(255,255,255,.9);border:1px solid var(--line-strong);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;z-index:5;color:var(--ink);
  transition:background .18s ease;
}
.hero-arrow:hover{background:#fff;}
.hero-arrow.prev{left:38px;}
.hero-arrow.next{right:38px;}
.hero-dots{
  position:absolute;left:50%;bottom:18px;transform:translateX(-50%);
  display:flex;gap:8px;z-index:5;
}
.hero-dots button{
  width:8px;height:8px;border-radius:50%;border:1px solid var(--ink);
  background:transparent;cursor:pointer;padding:0;transition:all .18s ease;
}
.hero-dots button.active{background:var(--ink);width:22px;border-radius:6px;}

/* ====================================================
   SECTION HEADING
   ==================================================== */
section.block{padding-block:64px;}
.heading{
  display:flex;align-items:center;gap:24px;justify-content:center;
  margin-bottom:8px;
}
.heading::before,.heading::after{
  content:"";height:1px;background:var(--line-strong);flex:1;max-width:160px;
}
.heading h3{
  font-family:var(--display);font-weight:600;
  font-size:30px;margin:0;letter-spacing:.01em;
}
.sub{text-align:center;color:var(--muted);font-size:14px;margin:0 0 40px;}

.collection-bar{
  background:linear-gradient(180deg,var(--panel) 0%,var(--panel-2) 100%);
  border:1px solid var(--line);
  text-align:center;padding:20px;margin-bottom:28px;
}
.collection-bar h4{
  font-family:var(--display);font-weight:700;font-size:24px;margin:0;
  letter-spacing:.01em;
}

/* ====================================================
   PRODUCT GRID
   ==================================================== */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.grid > *{min-width:0;}
.ahd-card{
  border:1px solid var(--line);background:#fff;
  display:flex;flex-direction:column;
  transition:box-shadow .22s ease,border-color .22s ease;
}
.ahd-card:hover{box-shadow:0 14px 40px -22px rgba(0,0,0,.4);border-color:var(--line-strong);}
.ahd-card .media{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--panel);}
.ahd-card .media .ph{background:repeating-linear-gradient(135deg,#f4f4f4 0 16px,#ececec 16px 32px);}
.product-badge{
  position:absolute;top:12px;left:12px;z-index:3;
  background:var(--ink);color:#fff;
  font-family:var(--ui);font-weight:700;font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;
  padding:5px 10px;border-radius:2px;
}
.product-badge-sale{background:var(--cs-accent);}
.actions{
  position:absolute;top:12px;right:12px;z-index:3;
  display:flex;flex-direction:column;gap:8px;
  opacity:0;transform:translateX(8px);
  transition:opacity .22s ease,transform .22s ease;
}
.ahd-card:hover .actions{opacity:1;transform:none;}
.actions button{
  width:38px;height:38px;border-radius:50%;
  background:#fff;border:1px solid var(--line-strong);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  color:var(--ink);transition:background .16s ease,color .16s ease;
  padding:0;
}
.actions button:hover{background:var(--ink);color:#fff;}
.ahd-card .media .media-link{display:block;width:100%;height:100%;}
.ahd-card .media .media-link img{width:100%;height:100%;object-fit:cover;display:block;}
.ahd-card .body{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1;}
.ahd-card .title{display:block;font-size:15px;font-weight:500;line-height:1.4;color:var(--ink);text-decoration:none;overflow-wrap:anywhere;}
.price-row{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.price{font-family:var(--display);font-weight:700;font-size:18px;}
.price .tk{font-size:14px;color:var(--muted);}
.price-old{font-size:13px;color:var(--muted);text-decoration:line-through;}
.select-btn{
  margin-top:auto;display:block;width:100%;text-align:center;
  background:var(--ink);color:#fff;
  font-family:var(--ui);font-weight:600;font-size:13px;
  letter-spacing:.12em;text-transform:uppercase;
  padding:15px;border:0;cursor:pointer;
  transition:background .18s ease,color .18s ease;
}
.select-btn:hover{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);}

/* Wishlist toggle */
.btn-wishlist{
  position:absolute;top:12px;right:12px;
  background:#fff;border:1px solid var(--line-strong);
  width:38px;height:38px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;color:var(--ink);z-index:3;
  transition:background .16s ease,color .16s ease;
}
.btn-wishlist:hover,.btn-wishlist.text-danger{background:var(--ink);color:#fff;}

/* ====================================================
   TRUST STRIP
   ==================================================== */
.trust{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.trust .tc{
  border:1px solid var(--line);background:#fff;
  padding:36px 24px;text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:16px;
  transition:border-color .2s ease,transform .2s ease;
}
.trust .tc:hover{border-color:var(--ink);transform:translateY(-3px);}
.trust .tc svg{color:var(--ink);}
.trust .tc h5{font-family:var(--display);font-weight:600;font-size:17px;margin:0;}

/* ====================================================
   FOOTER
   ==================================================== */
footer.site{border-top:1px solid var(--line);padding:72px 0 0;background:#fff;}
.foot-grid{
  display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:40px;
  padding-bottom:56px;
}
.foot-brand .name{
  font-family:var(--display);font-weight:700;font-size:22px;
  display:flex;align-items:center;gap:10px;margin-bottom:18px;
}
.foot-brand p{color:var(--muted);font-size:14px;line-height:1.7;max-width:42ch;margin:0 0 22px;}
.pay{display:flex;gap:10px;flex-wrap:wrap;}
.pay span{
  border:1px solid var(--line-strong);border-radius:3px;
  padding:8px 12px;font-size:12px;font-weight:600;color:var(--ink-soft);
}
.foot-col h6{font-family:var(--display);font-weight:600;font-size:16px;margin:0 0 18px;}
.foot-col a{
  display:flex;align-items:center;gap:8px;
  color:var(--muted);font-size:14px;margin-bottom:14px;
  transition:color .16s ease;
}
.foot-col a:hover{color:var(--ink);}
.soon{
  font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);background:var(--panel);border:1px solid var(--line);
  padding:2px 7px;border-radius:3px;
}
.foot-col .ct{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:14px;margin-bottom:14px;}
.foot-bottom{
  border-top:1px solid var(--line);
  padding:24px 0;text-align:center;color:var(--muted);font-size:13px;
}

/* ====================================================
   MOBILE DRAWER
   ==================================================== */
.menu-toggle{display:none;}
.drawer-backdrop{
  position:fixed;inset:0;z-index:70;
  background:rgba(0,0,0,.42);
  opacity:0;visibility:hidden;transition:opacity .28s ease,visibility .28s;
}
.drawer-backdrop.open{opacity:1;visibility:visible;}
.drawer{
  position:fixed;top:0;right:0;bottom:0;z-index:80;
  width:min(86vw,360px);
  background:#fff;border-left:1px solid var(--line);
  transform:translateX(100%);transition:transform .3s cubic-bezier(.6,0,.2,1);
  display:flex;flex-direction:column;
  padding:18px 20px 28px;overflow-y:auto;
}
.drawer.open{transform:translateX(0);box-shadow:-24px 0 60px -30px rgba(0,0,0,.5);}
.drawer-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
.drawer-title{font-family:var(--display);font-weight:700;font-size:18px;letter-spacing:.04em;text-transform:uppercase;}
.drawer-search{
  display:flex;align-items:center;gap:8px;
  border:1px solid var(--line-strong);border-radius:2px;
  padding:11px 12px;margin-bottom:20px;
}
.drawer-search input{border:0;outline:0;background:transparent;font-family:var(--ui);font-size:15px;width:100%;}
.drawer-search input::placeholder{color:#9a9a9a;}
.drawer-nav{display:flex;flex-direction:column;border-top:1px solid var(--line);}
.drawer-nav > a{
  padding:16px 4px;font-size:16px;font-weight:600;color:var(--ink);
  border-bottom:1px solid var(--line);
}
.m-acc{border-bottom:1px solid var(--line);}
.m-acc-trigger{
  width:100%;display:flex;align-items:center;justify-content:space-between;
  background:none;border:0;cursor:pointer;
  padding:16px 4px;font-family:var(--ui);font-size:16px;font-weight:600;color:var(--ink);
}
.m-acc-trigger .caret{transition:transform .22s ease;}
.m-acc-trigger[aria-expanded="true"] .caret{transform:rotate(180deg);}
.m-acc-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .26s ease;}
.m-acc-inner{min-height:0;overflow:hidden;}
.m-acc.open .m-acc-panel{grid-template-rows:1fr;}
.m-acc-panel a{display:block;padding:12px 4px 12px 18px;font-size:15px;color:var(--muted);}
.m-acc-panel a:first-child{padding-top:4px;}
.m-acc-panel a:last-child{padding-bottom:16px;}
.m-acc-panel a:hover{color:var(--ink);}
.drawer-account{
  display:flex;align-items:center;gap:10px;margin-top:24px;
  padding:14px 16px;border:1px solid var(--ink);border-radius:2px;
  font-weight:600;font-size:15px;justify-content:center;
}
.drawer-account:hover{background:var(--ink);color:#fff;}

/* WhatsApp chat button */
.chat{
  position:fixed;right:26px;bottom:26px;z-index:60;
  width:56px;height:56px;border-radius:50%;
  background:var(--ink);color:#fff;border:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 12px 30px -10px rgba(0,0,0,.5);
  transition:transform .2s ease;
  text-decoration:none;
}
.chat:hover{transform:scale(1.06);}

/* ====================================================
    RECENTLY VIEWED
    ==================================================== */
.rv-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;}
.rv-grid > a{display:block;text-decoration:none;color:inherit;}
.rv-grid > a > div{border:1px solid var(--line);background:#fff;}
.rv-grid > a > div > img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block;}
.rv-grid > a > div > .ph{aspect-ratio:1/1;width:100%;height:auto;}
.rv-grid .rv-name{padding:10px;font-size:13px;font-weight:500;}
@media (max-width:1100px){.rv-grid{grid-template-columns:repeat(3,1fr);}}
@media (max-width:760px){.rv-grid{grid-template-columns:repeat(2,1fr);gap:12px;}}
@media (max-width:450px){.rv-grid{grid-template-columns:repeat(2,1fr);}}

#recently-viewed-section{padding:4rem 0;}
@media (max-width:760px){#recently-viewed-section{padding:2rem 0;}}

/* ====================================================
    RESPONSIVE
    ==================================================== */
@media (max-width:1100px){
  :root{--pad:28px;}
  .search{min-width:160px;}
  nav.menu{gap:26px;}
  .grid{grid-template-columns:repeat(2,1fr);}
  .trust{grid-template-columns:repeat(2,1fr);}
  .foot-grid{grid-template-columns:1fr 1fr;gap:32px;}
}
@media (max-width:760px){
  .nav{grid-template-columns:auto 1fr;height:64px;gap:14px;}
  nav.menu{display:none;}
  .search{display:none;}
  .menu-toggle{display:flex;}
  .tools{gap:4px;}
  .brand .name{font-size:19px;}
  .hero-slide{grid-template-columns:1fr;}
  .hero{margin:12px 14px 0;}
  .hero-pane{height:52vh;}
  .hero-pane:nth-child(2){display:none;}
  .hero-pane .cap{padding:28px;}
  section.block{padding-block:44px;}
  .grid{grid-template-columns:1fr 1fr;gap:14px;}
  .ahd-card .body{padding:12px;gap:8px;}
  .ahd-card .title{font-size:13px;}
  .price-row{flex-wrap:wrap;row-gap:2px;}
  .price{font-size:16px;}
  .price-old{font-size:12px;}
  .product-badge{font-size:9px;letter-spacing:.1em;padding:4px 8px;top:8px;left:8px;}
  .btn-wishlist{width:32px;height:32px;top:8px;right:8px;}
  .select-btn{font-size:10px;letter-spacing:.08em;padding:11px 6px;}
  .trust{grid-template-columns:1fr 1fr;gap:14px;}
  .trust .tc{padding:26px 16px;}
  .foot-grid{grid-template-columns:1fr;}
  .heading h3{font-size:24px;}
  .chat{right:16px;bottom:16px;}
}
@media (max-width:420px){
  .heading::before,.heading::after{max-width:48px;}
}

/* ====================================================
   AUTOCOMPLETE DROPDOWN
   ==================================================== */
#autocomplete-dropdown{
  position:absolute;top:100%;left:0;right:0;
  background:#fff;border:1px solid var(--line);
  box-shadow:0 8px 24px -8px rgba(0,0,0,.2);
  max-height:360px;overflow-y:auto;z-index:1050;display:none;
}
.ac-item{
  display:flex;align-items:center;gap:10px;
  padding:10px 14px;cursor:pointer;font-size:14px;
  transition:background .14s ease;
}
.ac-item:hover{background:var(--panel);}

/* ====================================================
   SCROLL REVEAL
   ==================================================== */
.reveal-up{opacity:0;transform:translateY(30px);transition:opacity 0.6s ease-out,transform 0.6s ease-out;}
.reveal-up.active{opacity:1;transform:translateY(0);}

/* ====================================================
   UTILITY
   ==================================================== */
.text-muted-cs{color:var(--muted)!important;}
.text-primary-cs{color:var(--cs-primary)!important;}
.page-content{padding:2rem 0 3rem;}

/* ====================================================
   BUTTONS (used in cart drawer / checkout)
   ==================================================== */
.btn-cs-primary{
  background-color:var(--cs-primary);color:#fff;
  border:1px solid var(--cs-primary);padding:.75rem 1.5rem;
  border-radius:0;font-weight:500;font-family:var(--ui);
  display:inline-block;cursor:pointer;
  transition:var(--transition-smooth);
}
.btn-cs-primary:hover{background-color:#165243;color:#fff;transform:translateY(-2px);}
.btn-cs-outline{
  background-color:transparent;color:var(--ink);
  border:1px solid var(--line);padding:.75rem 1.5rem;
  font-weight:500;font-family:var(--ui);display:inline-block;cursor:pointer;
  transition:var(--transition-smooth);
}
.btn-cs-outline:hover{border-color:var(--cs-primary);color:var(--cs-primary);}

/* ====================================================
   CART DRAWER
   ==================================================== */
.cart-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.45);
  z-index:1060;opacity:0;pointer-events:none;transition:opacity .3s ease;
}
.cart-overlay.active{opacity:1;pointer-events:all;}
.cart-drawer{
  position:fixed;top:0;right:0;width:400px;max-width:95vw;
  height:100dvh;background:#fff;z-index:1061;
  transform:translateX(110%);transition:transform .35s cubic-bezier(.4,0,.2,1);
  display:flex;flex-direction:column;
  box-shadow:-4px 0 40px rgba(0,0,0,.12);
}
.cart-drawer.active{transform:translateX(0);}
.cart-drawer-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:1.25rem 1.5rem;border-bottom:1px solid var(--line);flex-shrink:0;
}
.cart-drawer-close{
  background:none;border:none;font-size:1.6rem;line-height:1;
  cursor:pointer;color:var(--muted);padding:.1rem .4rem;transition:color .2s;
}
.cart-drawer-close:hover{color:var(--ink);}
.cart-drawer-body{flex:1;overflow-y:auto;padding:.5rem 1.5rem;}
.cart-drawer-footer{
  padding:1.25rem 1.5rem;border-top:1px solid var(--line);
  flex-shrink:0;background:#fff;
}
.cart-drawer-item{
  display:flex;gap:1rem;align-items:flex-start;
  padding:1rem 0;border-bottom:1px solid var(--line);
}
.cart-drawer-item:last-child{border-bottom:none;}
.cart-drawer-item-img{
  width:72px;height:90px;flex-shrink:0;
  background:var(--panel);border-radius:4px;overflow:hidden;
}
.cart-drawer-item-img img{width:100%;height:100%;object-fit:cover;display:block;}
.cart-drawer-item-img .img-placeholder{width:100%;height:100%;background:var(--panel);}
.cart-drawer-item-info{flex:1;min-width:0;}
.cart-drawer-item-info .name{font-size:.875rem;font-weight:600;margin:0 0 .2rem;}
.cart-drawer-item-info .name a{
  color:var(--ink);text-decoration:none;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.cart-drawer-item-info .name a:hover{color:var(--cs-primary);}
.cart-drawer-item-info .variant{font-size:.75rem;color:var(--muted);margin:0 0 .6rem;}
.qty-controls{display:flex;align-items:center;gap:.5rem;}
.qty-btn{
  background:var(--panel);border:1px solid var(--line);
  width:28px;height:28px;border-radius:50%;cursor:pointer;
  font-size:1rem;line-height:1;display:flex;align-items:center;justify-content:center;
  color:var(--ink);transition:background .2s;padding:0;flex-shrink:0;
}
.qty-btn:hover{background:var(--line);}
.qty-val{font-size:.875rem;font-weight:600;min-width:22px;text-align:center;}
.cart-drawer-item-right{display:flex;flex-direction:column;align-items:flex-end;gap:.5rem;flex-shrink:0;}
.cart-drawer-item-right .price{font-weight:600;font-size:.875rem;margin:0;color:var(--ink);}
.remove-btn{
  background:none;border:none;cursor:pointer;color:var(--muted);
  padding:.2rem;transition:color .2s;display:flex;align-items:center;
}
.remove-btn:hover{color:#dc3545;}

/* ====================================================
   AUTH PAGES
   ==================================================== */
.auth-page{background:#fff;font-family:var(--ui);min-height:100vh;position:relative;overflow:hidden;}
.auth-decoration-1,.auth-decoration-2{position:fixed;border-radius:50%;z-index:0;opacity:.4;pointer-events:none;}
.auth-decoration-1{width:500px;height:500px;top:-200px;right:-150px;background:var(--panel);filter:blur(80px);}
.auth-decoration-2{width:350px;height:350px;bottom:-120px;left:-100px;background:#E8F0EE;filter:blur(70px);}
.auth-card-wrap{position:relative;z-index:1;display:flex;justify-content:center;align-items:center;min-height:100vh;padding:2rem 1rem;}
.auth-card{background:#fff;border:1px solid var(--line);border-radius:16px;width:100%;max-width:440px;box-shadow:0 8px 40px rgba(0,0,0,.04);}
.auth-card-body{padding:2.5rem 2rem;}
.auth-brand{font-family:var(--display);font-size:1.75rem;font-weight:700;letter-spacing:-.5px;color:var(--ink);text-decoration:none;display:inline-block;margin-bottom:.25rem;}
.auth-brand:hover{color:var(--cs-primary);}
.auth-title{font-family:var(--display);font-size:1.5rem;font-weight:600;color:var(--ink);margin-bottom:.25rem;}
.auth-subtitle{color:var(--muted);font-size:.9rem;margin-bottom:1.75rem;}
.auth-input{width:100%;border:1px solid var(--line);border-radius:6px;padding:.75rem 1rem;font-size:.9rem;font-family:var(--ui);color:var(--ink);background:#fff;transition:border-color .2s,box-shadow .2s;outline:none;}
.auth-input:focus{border-color:var(--cs-primary);box-shadow:0 0 0 3px rgba(31,110,90,.1);}
.auth-input::placeholder{color:#B0B0B0;}
.auth-label{display:block;font-size:.8rem;font-weight:500;color:var(--muted);margin-bottom:.35rem;}
.auth-link{color:var(--cs-primary);text-decoration:none;font-weight:500;font-size:.85rem;}
.auth-link:hover{color:#165243;text-decoration:underline;}
.auth-alt-action{text-align:center;font-size:.85rem;color:var(--muted);margin-top:1.5rem;margin-bottom:0;}
.auth-checkbox{accent-color:var(--cs-primary);}
.auth-check-label{font-size:.85rem;color:var(--muted);cursor:pointer;}
.auth-validation{background:#FFF8F0;border:1px solid #F0C8A0;border-radius:8px;padding:.75rem 1rem;font-size:.8rem;color:#8B5E3C;margin-bottom:1.25rem;list-style:none;}
.auth-validation li{margin-bottom:.1rem;}
.auth-field-error{font-size:.78rem;color:#dc3545;margin-top:.25rem;display:block;}
.field-error{display:block;color:#dc3545;font-size:.78rem;margin-top:.25rem;}

/* ====================================================
   CHECKOUT PAGE
   ==================================================== */
.checkout-page{background:#fff;margin:0;padding:0;font-family:var(--ui);color:var(--ink);}
.checkout-page-wrap{display:flex;min-height:100vh;}
.checkout-left{flex:0 0 55%;max-width:55%;background:#fff;overflow-y:auto;display:flex;flex-direction:column;align-items:flex-end;}
.checkout-left-inner{width:100%;max-width:500px;padding:3rem 2.5rem 4rem;}
.checkout-right{flex:0 0 45%;max-width:45%;background:#fafaf8;border-left:1px solid var(--line);position:sticky;top:0;height:100vh;overflow-y:auto;}
.checkout-summary-inner{padding:3rem 2.5rem;max-width:450px;}
.checkout-logo-link{font-family:var(--display);font-size:1.75rem;font-weight:700;color:var(--ink);text-decoration:none;display:inline-block;margin-bottom:1.5rem;}
.checkout-logo-link:hover{color:var(--cs-primary);}
.checkout-breadcrumbs{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:var(--muted);margin-bottom:2.5rem;}
.checkout-breadcrumbs a{color:var(--cs-primary);text-decoration:none;}
.checkout-breadcrumbs a:hover{text-decoration:underline;}
.checkout-breadcrumbs .sep{color:var(--line);}
.checkout-breadcrumbs .active{color:var(--ink);font-weight:500;}
.checkout-section{margin-bottom:2rem;}
.checkout-section h2{font-family:var(--ui);font-size:1rem;font-weight:600;color:var(--ink);margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid var(--line);}
.checkout-field{margin-bottom:.875rem;}
.checkout-field label{display:block;font-size:.75rem;font-weight:500;color:var(--muted);margin-bottom:.3rem;text-transform:uppercase;letter-spacing:.5px;}
.checkout-input{width:100%;border:1px solid var(--line);border-radius:6px;padding:.75rem 1rem;font-size:.9rem;font-family:var(--ui);color:var(--ink);background:#fff;transition:border-color .2s,box-shadow .2s;outline:none;resize:none;}
.checkout-input:focus{border-color:var(--cs-primary);box-shadow:0 0 0 3px rgba(31,110,90,.1);}
.checkout-field-row-two{display:grid;grid-template-columns:1fr 1fr;gap:.875rem;}
.zone-list{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:6px;overflow:hidden;}
.zone-option-label{display:flex;align-items:center;gap:.75rem;padding:.875rem 1rem;cursor:pointer;transition:background .2s;border-bottom:1px solid var(--line);position:relative;}
.zone-option-label:last-child{border-bottom:none;}
.zone-option-label:hover{background:var(--panel);}
.zone-option-label input[type="radio"]{accent-color:var(--cs-primary);width:18px;height:18px;flex-shrink:0;cursor:pointer;}
.zone-option-content{display:flex;justify-content:space-between;align-items:center;flex:1;}
.zone-option-content .zone-name{font-size:.9rem;font-weight:500;}
.zone-option-content .zone-price{font-size:.875rem;color:var(--muted);}
.zone-option-content .free{color:#28a745;font-weight:600;}
.zone-option-label.zone-selected{background:#edf5f2;}
.checkout-actions{display:flex;align-items:center;justify-content:space-between;margin-top:2rem;flex-wrap:wrap;gap:1rem;}
.return-link{font-size:.85rem;color:var(--muted);text-decoration:none;transition:color .2s;}
.return-link:hover{color:var(--cs-primary);}
.btn-place-order{background:var(--cs-primary);color:#fff;border:none;padding:.875rem 2.5rem;font-size:.95rem;font-weight:600;font-family:var(--ui);border-radius:6px;cursor:pointer;transition:background .2s,transform .2s;letter-spacing:.3px;}
.btn-place-order:hover{background:#165243;transform:translateY(-1px);}
.summary-items{margin-bottom:1.5rem;}
.summary-item{display:flex;align-items:flex-start;gap:1rem;margin-bottom:1.25rem;}
.summary-item:last-child{margin-bottom:0;}
.summary-item-img{position:relative;width:64px;height:80px;flex-shrink:0;background:var(--panel);border-radius:6px;overflow:hidden;border:1px solid var(--line);}
.summary-item-img img{width:100%;height:100%;object-fit:cover;display:block;}
.summary-item-qty{position:absolute;top:-8px;right:-8px;background:var(--muted);color:#fff;font-size:.65rem;font-weight:700;width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.summary-item-details{flex:1;min-width:0;}
.summary-item-name{font-size:.875rem;font-weight:600;margin:0 0 .2rem;color:var(--ink);}
.summary-item-variant{font-size:.75rem;color:var(--muted);margin:0;display:flex;align-items:center;gap:.35rem;}
.summary-color-dot{width:10px;height:10px;border-radius:50%;border:1px solid rgba(0,0,0,.1);flex-shrink:0;display:inline-block;}
.summary-item-price{font-size:.875rem;font-weight:600;flex-shrink:0;color:var(--ink);}
.summary-divider{border:none;border-top:1px solid var(--line);margin:1.25rem 0;}
.summary-row{display:flex;justify-content:space-between;align-items:center;font-size:.875rem;margin-bottom:.6rem;}
.summary-row .label{color:var(--muted);}
.summary-grand-total{display:flex;justify-content:space-between;align-items:center;padding-top:1rem;border-top:1px solid var(--line);margin-top:.5rem;}
.summary-grand-total .gt-label{font-size:1rem;font-weight:600;}
.summary-grand-total .gt-amount{display:flex;align-items:baseline;gap:.4rem;}
.summary-grand-total .gt-currency{font-size:.75rem;color:var(--muted);}
.summary-grand-total .gt-value{font-size:1.25rem;font-weight:700;}
.cod-badge{display:flex;align-items:center;gap:.5rem;margin-top:1.5rem;font-size:.8rem;color:var(--muted);background:var(--panel);padding:.6rem 1rem;border-radius:6px;}
.cod-badge svg{flex-shrink:0;}
.checkout-alert-error{background:#fff3f3;border:1px solid #f5c6cb;border-radius:6px;padding:.875rem 1rem;font-size:.875rem;color:#721c24;margin-bottom:1.5rem;}
@media (max-width:767px){
  .checkout-page-wrap{flex-direction:column;}
  .checkout-right{order:-1;flex:none;max-width:100%;position:static;height:auto;border-left:none;border-bottom:1px solid var(--line);}
  .checkout-left{flex:none;max-width:100%;align-items:stretch;}
  .checkout-left-inner,.checkout-summary-inner{padding:1.5rem 1rem;max-width:100%;}
  .checkout-field-row-two{grid-template-columns:1fr;}
  .checkout-actions{flex-direction:column-reverse;align-items:stretch;}
  .btn-place-order{width:100%;text-align:center;}
}
@media (min-width:768px) and (max-width:1024px){
  .checkout-left{flex:0 0 52%;max-width:52%;}
  .checkout-right{flex:0 0 48%;max-width:48%;}
  .checkout-left-inner,.checkout-summary-inner{padding:2rem 1.5rem;}
}

/* ====================================================
   PRODUCT DETAIL PAGE
   ==================================================== */

/* Breadcrumb */
.breadcrumb-bar{border-bottom:1px solid var(--line);padding:14px 0;}
.breadcrumb-bar .breadcrumb{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);flex-wrap:wrap;list-style:none;padding:0;margin:0;background:none;}
.breadcrumb-bar .breadcrumb a{color:var(--muted);text-decoration:none;transition:color .16s;}
.breadcrumb-bar .breadcrumb a:hover{color:var(--ink);}
.breadcrumb-bar .breadcrumb .sep{color:var(--line-strong);}
.breadcrumb-bar .breadcrumb .current{color:var(--ink);font-weight:500;}

/* Product layout */
.product-section{padding:40px 0 56px;}
.product-layout{display:grid;grid-template-columns:88px 1fr 1fr;gap:0 28px;align-items:start;}

/* Thumbnail rail */
.thumb-rail{display:flex;flex-direction:column;gap:0;position:relative;}
.thumb-arrow{width:100%;height:32px;background:var(--panel);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink-soft);transition:background .16s,color .16s;flex:none;}
.thumb-arrow:hover{background:var(--panel-2);color:var(--ink);}
.thumb-list{display:flex;flex-direction:column;gap:8px;overflow:hidden;padding:8px 0;flex:1;}
.thumb{width:88px;height:88px;border:2px solid var(--line);overflow:hidden;cursor:pointer;flex:none;background:var(--panel);transition:border-color .18s;}
.thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.thumb.active{border-color:var(--ink);}
.thumb:hover{border-color:var(--ink-soft);}

/* Main image */
.main-img-wrap{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--panel);}
.main-img-wrap img{width:100%;height:100%;object-fit:cover;display:block;}
.zoom-btn{position:absolute;bottom:16px;left:16px;z-index:4;width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.9);border:1px solid var(--line-strong);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink);transition:background .16s;}
.zoom-btn:hover{background:#fff;}

/* Product info */
.product-info{display:flex;flex-direction:column;gap:22px;}
.prod-title{font-family:var(--display);font-weight:700;font-size:28px;line-height:1.2;letter-spacing:-.01em;margin:0;}
.prod-price{font-family:var(--display);font-weight:700;font-size:26px;margin:0;}
.prod-price .tk{font-size:18px;margin-left:2px;}
.prod-price .original{font-size:18px;font-weight:400;color:var(--muted);text-decoration:line-through;margin-left:8px;}
.divider{border:none;border-top:1px solid var(--line);margin:0;}

/* Size guide */
.size-guide{background:var(--panel);border:1px solid var(--line);padding:18px 20px;}
.size-guide h4{font-family:var(--display);font-weight:600;font-size:14px;margin:0 0 10px;letter-spacing:.02em;}
.size-guide table{border-collapse:collapse;width:100%;}
.size-guide td{font-size:13px;color:var(--ink-soft);padding:3px 0;line-height:1.6;}
.size-guide td:first-child{color:var(--muted);width:60px;}

/* Size selector */
.size-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.size-label{font-family:var(--ui);font-size:15px;font-weight:600;color:var(--ink);}
.size-btns{display:flex;gap:8px;flex-wrap:wrap;}
.sz{min-width:46px;height:46px;border:1px solid var(--line-strong);background:#fff;font-family:var(--ui);font-size:14px;font-weight:600;cursor:pointer;color:var(--ink);display:flex;align-items:center;justify-content:center;padding:0 10px;transition:border-color .18s,background .18s,color .18s;}
.sz:hover{border-color:var(--ink);}
.sz.active{border-color:var(--ink);background:var(--ink);color:#fff;}
.sz.out{border-color:var(--line);color:var(--line-strong);background:#fff;cursor:not-allowed;position:relative;}
.sz.out::before,.sz.out::after{content:"";position:absolute;width:1px;background:#e02020;top:4px;bottom:4px;}
.sz.out::before{left:calc(50% - .5px);transform:rotate(-45deg);transform-origin:center;}
.sz.out::after{left:calc(50% - .5px);transform:rotate(45deg);transform-origin:center;}
.sz-clear{font-size:12px;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;gap:4px;margin-top:6px;transition:color .16s;background:none;border:none;padding:0;}
.sz-clear:hover{color:var(--ink);}

/* Qty + CTA */
.qty-cta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.qty{display:flex;align-items:center;border:1px solid var(--line-strong);}
.qty button{width:38px;height:52px;background:#fff;border:0;font-size:18px;cursor:pointer;color:var(--ink);display:flex;align-items:center;justify-content:center;font-weight:400;transition:background .16s;}
.qty button:hover{background:var(--panel);}
.qty input{width:52px;height:52px;border:0;border-left:1px solid var(--line-strong);border-right:1px solid var(--line-strong);text-align:center;font-family:var(--display);font-weight:600;font-size:16px;outline:0;}
.btn-cart{flex:1;min-width:160px;height:52px;background:var(--ink);color:#fff;border:0;cursor:pointer;font-family:var(--ui);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;display:flex;align-items:center;justify-content:center;gap:10px;transition:opacity .18s,transform .18s;}
.btn-cart:hover{opacity:.85;transform:translateY(-1px);}
.btn-cart:disabled{opacity:.5;cursor:not-allowed;transform:none;}
.btn-buy{flex:1;min-width:140px;height:52px;background:#fff;color:var(--ink);cursor:pointer;font-family:var(--ui);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;display:flex;align-items:center;justify-content:center;gap:10px;transition:opacity .18s,background .18s;border:1px solid var(--ink);}
.btn-buy:hover{background:var(--ink);color:#fff;}

/* Extra actions */
.extra-actions{display:flex;gap:24px;}
.extra-actions a{display:inline-flex;align-items:center;gap:7px;font-size:14px;color:var(--ink-soft);text-decoration:none;transition:color .16s;}
.extra-actions a:hover{color:var(--ink);}

/* Prod meta */
.prod-meta{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--line);padding-top:18px;}
.meta-row{display:flex;gap:8px;font-size:13px;}
.meta-row .mk{font-weight:600;color:var(--ink);min-width:90px;}
.meta-row .mv{color:var(--ink-soft);line-height:1.6;}
.meta-row .mv a{color:var(--muted);text-decoration:none;transition:color .16s;}
.meta-row .mv a:hover{color:var(--ink);}
.share-icons{display:flex;gap:10px;align-items:center;margin-top:2px;}
.share-icons a{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border:1px solid var(--line-strong);border-radius:50%;color:var(--muted);text-decoration:none;transition:border-color .16s,color .16s;}
.share-icons a:hover{border-color:var(--ink);color:var(--ink);}

/* Stock feedback */
.atc-feedback{padding:8px 14px;font-size:13px;border-radius:2px;margin-top:4px;}
.atc-feedback.success{background:#d1fae5;color:#065f46;}
.atc-feedback.error{background:#fee2e2;color:#991b1b;}

/* Tabs */
.tabs-section{border-top:1px solid var(--line);padding:56px 0;}
.tab-nav{display:flex;gap:0;border-bottom:1px solid var(--line);margin-bottom:36px;overflow-x:auto;}
.tab-btn{padding:16px 32px;font-family:var(--ui);font-weight:600;font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);background:none;border:0;cursor:pointer;position:relative;transition:color .18s;white-space:nowrap;}
.tab-btn::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:center;transition:transform .2s ease;}
.tab-btn.active{color:var(--ink);}
.tab-btn.active::after{transform:scaleX(1);}
.tab-btn:hover{color:var(--ink-soft);}
.tab-panel{display:none;}
.tab-panel.active{display:block;}

/* Description */
.desc-body{max-width:860px;}
.desc-body p{font-size:15px;color:var(--ink-soft);line-height:1.78;margin:0 0 14px;}
.desc-body h4{font-family:var(--display);font-weight:600;font-size:16px;margin:20px 0 10px;}
.desc-body ul{margin:0 0 14px;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:7px;}
.desc-body ul li{display:flex;gap:10px;font-size:14px;color:var(--ink-soft);line-height:1.6;}
.desc-body ul li::before{content:"•";color:var(--ink);font-weight:700;flex:none;}

/* Shipping */
.shipping-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:780px;}
.ship-card{border:1px solid var(--line);padding:28px 22px;display:flex;flex-direction:column;gap:12px;}
.ship-card h5{font-family:var(--display);font-weight:600;font-size:16px;margin:0;}
.ship-card p{font-size:14px;color:var(--muted);margin:0;line-height:1.6;}

/* Reviews inside tab */
.review-tab-inner{max-width:680px;}
.review-tab-inner .rev-item{border-bottom:1px solid var(--line);padding:16px 0;}
.review-tab-inner .rev-header{display:flex;justify-content:space-between;margin-bottom:4px;}
.review-tab-inner .rev-author{font-weight:600;font-size:14px;}
.review-tab-inner .rev-date{font-size:13px;color:var(--muted);}
.review-tab-inner .rev-title{font-size:14px;font-weight:600;margin:4px 0 2px;}
.review-tab-inner .rev-body{font-size:14px;color:var(--ink-soft);margin:0 0 6px;line-height:1.6;}
.review-tab-inner .rev-vote form{display:inline;}
.review-tab-inner .rev-vote button{background:none;border:none;cursor:pointer;font-size:13px;color:var(--muted);padding:0;transition:color .16s;}
.review-tab-inner .rev-vote button:hover{color:var(--ink);}
.review-form{margin-bottom:28px;}
.review-form .rf-label{font-size:14px;font-weight:600;margin-bottom:6px;display:block;}
.review-form select,.review-form input,.review-form textarea{width:100%;border:1px solid var(--line-strong);padding:10px 12px;font-family:var(--ui);font-size:14px;outline:none;background:#fff;transition:border-color .18s;margin-bottom:10px;}
.review-form select:focus,.review-form input:focus,.review-form textarea:focus{border-color:var(--ink);}
.review-form textarea{resize:vertical;min-height:80px;}
.btn-review-submit{background:var(--ink);color:#fff;border:0;cursor:pointer;font-family:var(--ui);font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;padding:12px 28px;transition:opacity .18s;}
.btn-review-submit:hover{opacity:.85;}

/* Related products */
.related-section{padding:0 0 72px;}
.section-heading{display:flex;align-items:center;gap:24px;justify-content:flex-start;margin-bottom:32px;}
.section-heading h3{font-family:var(--display);font-weight:600;font-size:24px;margin:0;letter-spacing:.01em;}
.section-heading::after{content:"";height:1px;background:var(--line-strong);flex:1;}
.related-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.pd-card{border:1px solid var(--line);background:#fff;display:flex;flex-direction:column;transition:box-shadow .22s ease,border-color .22s ease;text-decoration:none;color:inherit;}
.pd-card:hover{box-shadow:0 14px 40px -22px rgba(0,0,0,.4);border-color:var(--line-strong);}
.pd-card .pd-media{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--panel);}
.pd-card .pd-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease;}
.pd-card:hover .pd-media img{transform:scale(1.04);}
.pd-card-badge{position:absolute;top:10px;left:10px;z-index:3;background:var(--ink);color:#fff;font-family:var(--ui);font-weight:700;font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:4px 9px;}
.pd-card .pd-body{padding:18px;display:flex;flex-direction:column;gap:10px;flex:1;}
.pd-card .pd-name{font-size:14px;font-weight:500;line-height:1.4;color:var(--ink);}
.pd-card .pd-price{font-family:var(--display);font-weight:700;font-size:17px;}
.pd-card .pd-price .tk{font-size:13px;color:var(--muted);}
.pd-select-btn{display:block;width:100%;text-align:center;background:var(--ink);color:#fff;font-family:var(--ui);font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;padding:14px;border:0;cursor:pointer;transition:background .18s,color .18s;}
.pd-select-btn:hover{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);}

/* Lightbox */
.lightbox{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.88);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .22s ease,visibility .22s;}
.lightbox.open{opacity:1;visibility:visible;}
.lightbox .lb-inner{width:min(90vw,760px);height:min(90vh,760px);position:relative;}
.lightbox .lb-inner img{width:100%;height:100%;object-fit:contain;display:block;}
.lb-close{position:absolute;top:-44px;right:0;background:none;border:0;color:#fff;cursor:pointer;font-size:28px;line-height:1;width:36px;height:36px;display:flex;align-items:center;justify-content:center;opacity:.8;transition:opacity .16s;}
.lb-close:hover{opacity:1;}

/* Responsive */
@media(max-width:1100px){
  .product-layout{grid-template-columns:76px 1fr;grid-template-rows:auto auto;}
  .product-info{grid-column:1/-1;}
  .prod-title{font-size:24px;}
  .related-grid{grid-template-columns:repeat(2,1fr);}
  .shipping-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:760px){
  .product-layout{grid-template-columns:1fr;gap:20px;}
  .thumb-rail{flex-direction:row;flex-wrap:nowrap;overflow-x:auto;}
  .thumb-arrow{display:none;}
  .thumb-list{flex-direction:row;padding:0;overflow-x:auto;}
  .thumb{width:68px;height:68px;}
  .main-img-wrap{aspect-ratio:4/3;}
  .product-info{grid-column:1;}
  .prod-title{font-size:20px;}
  .qty-cta{flex-direction:column;align-items:stretch;}
  .btn-cart,.btn-buy{min-width:unset;flex:unset;width:100%;}
  .related-grid{grid-template-columns:1fr 1fr;gap:14px;}
  .shipping-grid{grid-template-columns:1fr;}
  .tab-btn{padding:12px 18px;font-size:12px;}
}

/* ====================================================
   CATEGORY / SHOP PAGE
   ==================================================== */

/* Hero */
.cat-hero{padding:36px 0 28px;border-bottom:1px solid var(--line);}
.cat-hero-inner{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;}
.cat-hero-kicker{font-size:11.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--muted);font-weight:500;margin-bottom:8px;}
.cat-hero-title{font-family:var(--display);font-weight:700;font-size:clamp(28px,3.6vw,44px);line-height:1;margin:0;letter-spacing:-.01em;}
.cat-hero-meta{display:flex;align-items:center;gap:16px;margin-top:12px;font-size:13.5px;color:var(--muted);}
.cat-hero-meta strong{color:var(--ink);}
.cat-hero-desc{max-width:52ch;font-size:14px;color:var(--ink-soft);line-height:1.65;margin-top:10px;}

/* Layout */
.cat-layout{display:grid;grid-template-columns:260px 1fr;gap:32px;padding-top:32px;padding-bottom:72px;align-items:start;}

/* Sidebar */
.sidebar{position:sticky;top:calc(84px + 16px);display:flex;flex-direction:column;gap:0;}
.filter-section{border-bottom:1px solid var(--line);padding:0;}
.filter-section:last-child{border-bottom:0;}
.filter-title{display:flex;align-items:center;justify-content:space-between;font-family:var(--display);font-size:13.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:16px 0;cursor:pointer;user-select:none;}
.filter-title .arrow{transition:transform .22s ease;color:var(--muted);flex:none;}
.filter-section.open .filter-title .arrow{transform:rotate(180deg);}
.filter-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .24s ease;}
.filter-section.open .filter-body{grid-template-rows:1fr;}
.filter-inner{min-height:0;overflow:hidden;padding-bottom:16px;}

/* Category tree */
.cat-tree-nav{display:flex;flex-direction:column;gap:0;}
.cat-top-group{}
.cat-top{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;font-size:14px;font-weight:600;color:var(--ink-soft);cursor:pointer;border-radius:2px;transition:background .15s;}
.cat-top:hover{background:var(--panel);}
.cat-top .count{font-size:12px;color:var(--muted);font-weight:400;}
.cat-top-arrow{transition:transform .2s ease;flex:none;}
.cat-top-group.open .cat-top-arrow{transform:rotate(90deg);}
.cat-sub-list{display:grid;grid-template-rows:0fr;transition:grid-template-rows .22s ease;}
.cat-top-group.open .cat-sub-list{grid-template-rows:1fr;}
.cat-sub-inner{min-height:0;overflow:hidden;}
.cat-sub-link{display:flex;align-items:center;justify-content:space-between;padding:8px 12px 8px 28px;font-size:13.5px;color:var(--muted);border-radius:2px;cursor:pointer;transition:background .15s,color .15s;text-decoration:none;}
.cat-sub-link:hover{background:var(--panel);color:var(--ink);}
.cat-sub-link.active{background:var(--ink);color:#fff;font-weight:600;}
.cat-sub-link.active .cat-count{color:rgba(255,255,255,.6);}
.cat-sub-link .cat-count{font-size:12px;color:var(--muted);font-weight:400;}

/* Price filter */
.price-range{display:flex;flex-direction:column;gap:12px;}
.price-inputs{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;}
.price-inp{border:1px solid var(--line-strong);border-radius:2px;padding:9px 10px;font-family:var(--ui);font-size:13px;color:var(--ink);background:#fff;width:100%;outline:0;}
.price-inp:focus{border-color:var(--ink);}
.price-dash{color:var(--muted);font-size:13px;text-align:center;}
.price-slider{-webkit-appearance:none;appearance:none;width:100%;height:3px;border-radius:2px;background:linear-gradient(to right,var(--ink) 0%,var(--ink) 60%,var(--line-strong) 60%);outline:0;cursor:pointer;}
.price-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--ink);border:2px solid #fff;box-shadow:0 0 0 1px var(--ink);cursor:pointer;}

/* Size filter */
.size-grid{display:flex;flex-wrap:wrap;gap:8px;}
.cat-size-btn{min-width:44px;height:38px;padding:0 12px;border:1px solid var(--line-strong);border-radius:2px;font-family:var(--ui);font-size:13px;font-weight:500;color:var(--ink-soft);background:#fff;cursor:pointer;transition:all .16s ease;display:flex;align-items:center;justify-content:center;}
.cat-size-btn:hover{border-color:var(--ink);color:var(--ink);}
.cat-size-btn.on{background:var(--ink);color:#fff;border-color:var(--ink);}

/* Color filter */
.cat-color-grid{display:flex;flex-wrap:wrap;gap:10px;}
.cat-color-swatch{width:28px;height:28px;border-radius:50%;cursor:pointer;border:2px solid transparent;outline:2px solid transparent;outline-offset:2px;transition:outline .15s,transform .15s;}
.cat-color-swatch:hover{transform:scale(1.1);}
.cat-color-swatch.on{outline:2px solid var(--ink);}

/* Reset */
.filter-reset{font-size:12.5px;color:var(--muted);cursor:pointer;text-decoration:underline;text-underline-offset:3px;background:none;border:0;padding:0;font-family:var(--ui);transition:color .15s;}
.filter-reset:hover{color:var(--ink);}
.filter-reset-all{display:block;width:100%;text-align:center;background:transparent;color:var(--ink);font-family:var(--ui);font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;padding:11px;border:1px solid var(--ink);cursor:pointer;transition:background .18s,color .18s;margin-top:8px;}
.filter-reset-all:hover{background:var(--ink);color:#fff;}

/* Sort bar */
.sort-bar{display:flex;align-items:center;gap:12px;padding-bottom:20px;border-bottom:1px solid var(--line);margin-bottom:24px;flex-wrap:wrap;}
.sort-count{font-size:14px;color:var(--muted);}
.sort-count strong{color:var(--ink);font-weight:600;}
.spacer{flex:1;}
.active-filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.active-tag{display:inline-flex;align-items:center;gap:6px;background:var(--ink);color:#fff;font-size:12px;font-weight:500;padding:5px 10px;border-radius:2px;cursor:pointer;text-decoration:none;}
.active-tag svg{width:10px;height:10px;opacity:.7;}
.active-tag:hover svg{opacity:1;}
.sort-label{font-size:13.5px;color:var(--muted);}
.sort-select{border:1px solid var(--line-strong);border-radius:2px;padding:8px 32px 8px 12px;font-family:var(--ui);font-size:13.5px;color:var(--ink);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b6b6b' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center;-webkit-appearance:none;appearance:none;outline:0;cursor:pointer;}
.sort-select:focus{border-color:var(--ink);}
.view-toggle{display:flex;gap:0;border:1px solid var(--line-strong);border-radius:2px;overflow:hidden;}
.view-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:#fff;border:0;cursor:pointer;color:var(--muted);transition:background .15s,color .15s;}
.view-btn.on{background:var(--ink);color:#fff;}
.view-btn:hover:not(.on){background:var(--panel);}

/* Product grid */
.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-bottom:40px;}
.prod-grid.list-view{grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--line);}

/* Cat card */
.cat-card{border:1px solid var(--line);background:#fff;display:flex;flex-direction:column;transition:box-shadow .22s ease,border-color .22s ease;}
.cat-card:hover{box-shadow:0 14px 40px -22px rgba(0,0,0,.4);border-color:var(--line-strong);}
.cat-card .media{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--panel);}
.cat-card .media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease;}
.cat-card:hover .media img{transform:scale(1.04);}
.cat-badge{position:absolute;top:12px;left:12px;z-index:3;font-family:var(--ui);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:5px 10px;border-radius:2px;color:#fff;}
.cat-badge.default{background:var(--ink);}
.cat-badge.new-badge{background:#2a6a2a;}
.cat-badge.sale-badge{background:#a02020;}
.cat-badge.out-badge{background:#6b6b6b;}
.card-actions{position:absolute;top:12px;right:12px;z-index:3;display:flex;flex-direction:column;gap:8px;opacity:0;transform:translateX(8px);transition:opacity .22s ease,transform .22s ease;}
.cat-card:hover .card-actions{opacity:1;transform:none;}
.card-actions button{width:38px;height:38px;border-radius:50%;background:#fff;border:1px solid var(--line-strong);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink);transition:background .16s,color .16s;}
.card-actions button:hover{background:var(--ink);color:#fff;}
.cat-card .body{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1;}
.cat-card .ctitle{font-size:14.5px;font-weight:500;line-height:1.4;color:var(--ink);text-decoration:none;display:block;}
.cat-card .ctitle:hover{color:var(--ink-soft);}
.cat-price-row{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.cat-price{font-family:var(--display);font-weight:700;font-size:18px;}
.cat-price .tk{font-size:14px;color:var(--muted);}
.cat-price-old{font-size:13px;color:var(--muted);text-decoration:line-through;font-family:var(--display);}
.cat-select-btn{margin-top:auto;display:block;width:100%;text-align:center;background:var(--ink);color:#fff;font-family:var(--ui);font-weight:600;font-size:13px;letter-spacing:.12em;text-transform:uppercase;padding:15px;border:0;cursor:pointer;transition:background .18s,color .18s;text-decoration:none;}
.cat-select-btn:hover{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);}

/* List view card variant */
.list-view .cat-card{flex-direction:row;border:0;border-radius:0;background:#fff;}
.list-view .cat-card .media{width:140px;min-width:140px;aspect-ratio:auto;height:140px;}
.list-view .cat-card .body{flex-direction:row;align-items:center;gap:24px;padding:20px 24px;flex-wrap:wrap;}
.list-view .cat-card .ctitle{flex:1;min-width:180px;font-size:15px;}
.list-view .cat-card .cat-price-row{flex-direction:column;align-items:flex-start;gap:2px;}
.list-view .cat-card .cat-select-btn{width:auto;padding:12px 24px;white-space:nowrap;}
.list-view .cat-card .card-actions{display:none;}
.list-view .cat-card:hover{box-shadow:none;}

/* Pagination */
.cat-pagination{display:flex;align-items:center;justify-content:center;gap:4px;padding-top:12px;border-top:1px solid var(--line);}
.page-btn{min-width:38px;height:38px;padding:0 8px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:2px;font-family:var(--ui);font-size:14px;font-weight:500;color:var(--ink-soft);background:#fff;cursor:pointer;transition:all .16s ease;text-decoration:none;}
.page-btn:hover{border-color:var(--ink);color:var(--ink);}
.page-btn.on{background:var(--ink);color:#fff;border-color:var(--ink);}
.page-btn:disabled{color:var(--muted);cursor:default;border-color:var(--line);}
.page-dots{color:var(--muted);padding:0 4px;}

/* Trust strip */
.trust-strip{border-top:1px solid var(--line);padding:40px 0;}
.trust{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.trust .tc{border:1px solid var(--line);background:#fff;padding:28px 20px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px;transition:border-color .2s,transform .2s;}
.trust .tc:hover{border-color:var(--ink);transform:translateY(-3px);}
.trust .tc h5{font-family:var(--display);font-weight:600;font-size:15px;margin:0;}
.trust .tc p{font-size:13px;color:var(--muted);margin:0;}

/* Category page responsive */
@media(max-width:1100px){
  .cat-layout{grid-template-columns:230px 1fr;gap:24px;}
  .prod-grid{grid-template-columns:repeat(2,1fr);}
  .trust{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:860px){
  .cat-layout{grid-template-columns:1fr;}
  .sidebar{position:static;}
  .prod-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:760px){
  .cat-hero-title{font-size:26px;}
  .prod-grid{grid-template-columns:repeat(2,1fr);gap:12px;}
  .cat-card .body{padding:14px;}
  .trust{grid-template-columns:repeat(2,1fr);}
}