/* ============ ZARPOSH FEATURES ============ */
:root{--ab:36px}

/* skip link */
.skip{position:fixed;left:12px;top:-60px;z-index:2000;background:var(--gold-fill,var(--gold));color:var(--on-gold);padding:10px 16px;font-size:.8rem;letter-spacing:.1em;transition:top .2s}
.skip:focus{top:10px}

/* announcement bar (in flow, scrolls away; header follows it) */
.abar{height:var(--ab);background:linear-gradient(90deg,#5a0e24,#7a1630 50%,#5a0e24);color:#f6e7c8;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;padding:0 16px;position:relative;z-index:5;overflow:hidden;white-space:nowrap}
.ab-msg{transition:opacity .3s,transform .3s;display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.ab-msg.out{opacity:0;transform:translateY(-8px)}
.hdr{top:var(--abh,0px)}
.mega{top:calc(var(--abh,0px) + var(--hh))}
.hero2{height:calc(100vh - var(--ab));height:calc(100svh - var(--ab))}

/* header icons */
.ic .badge{top:2px;right:0}
#wlBtn svg,.wl svg,.qvb svg{stroke:var(--ivory);fill:none;stroke-width:1.4}
#wlBtn .badge{background:var(--gold-fill,var(--gold))}
@media (max-width:1060px){.acts{gap:2px}}
@media (max-width:420px){#searchBtn{display:none}.ic{width:38px;height:38px}}

/* card extras */
.card-media .tag{position:static}
.tags{position:absolute;top:12px;left:12px;z-index:3;display:flex;flex-direction:column;gap:6px;align-items:flex-start;max-width:calc(100% - 64px)}
.tag.sale{background:#b23a48;color:#fff}
.tag.out{background:#1a1a1a;color:#ddd;border:1px solid #555}
.tag.pre{background:transparent;color:var(--gold2);border:1px solid var(--gold)}
.wl{position:absolute;top:10px;right:10px;z-index:4;width:38px;height:38px;border-radius:50%;background:rgba(74,29,51,.62);display:grid;place-items:center;transition:background .3s,transform .3s var(--ease)}
.wl svg{width:19px;height:19px}
.wl:hover{background:rgba(74,29,51,.9);transform:scale(1.08)}
.wl.on svg,.ic .on~svg{fill:var(--gold);stroke:var(--gold)}
.wl.on{background:rgba(74,29,51,.9)}
.wl.big{position:static;flex:none;width:52px;height:auto;min-height:50px;border-radius:0;border:1px solid var(--line);background:none}
.wl.big:hover{background:rgba(214,106,140,.12);transform:none}
.qvb{position:absolute;top:56px;right:10px;z-index:4;width:38px;height:38px;border-radius:50%;background:rgba(74,29,51,.62);display:grid;place-items:center;opacity:0;transform:translateX(10px);transition:.35s var(--ease)}
.qvb svg{width:19px;height:19px}
.card:hover .qvb,.card:focus-within .qvb{opacity:1;transform:none}
.qvb:hover{background:var(--gold-fill,var(--gold))}.qvb:hover svg{stroke:var(--on-gold)}
@media (hover:none),(max-width:900px){.qvb{display:none}}
.quick .sz button.x,.sizes button.x{opacity:.35;text-decoration:line-through;cursor:not-allowed}
.quick .sz button.x:hover{background:none;color:inherit;border-color:var(--line)}
.notify{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold2);border-bottom:1px solid var(--gold)}

/* cart drawer extras */
.item small.nt{color:var(--gold2);margin:-6px 0 8px;white-space:pre-wrap;word-break:break-word}
.ship-note{font-size:.8rem;color:var(--muted)}
.row.disc{color:#8fd6a8}
.promo{display:flex;border:1px solid var(--line);margin:0 0 14px}
.promo input{flex:1;min-width:0;background:none;border:0;padding:11px 14px;outline:0;text-transform:uppercase;letter-spacing:.1em;font-size:.8rem}
.promo button{padding:0 16px;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold2);border-left:1px solid var(--line)}
.promo button:hover{background:var(--gold-fill,var(--gold));color:var(--on-gold)}
.promo-on{display:flex;justify-content:space-between;align-items:center;gap:10px;border:1px dashed var(--gold);padding:10px 14px;margin:0 0 14px;font-size:.78rem;letter-spacing:.08em;color:var(--gold2)}
.promo-on button{font-size:.7rem;text-decoration:underline;color:var(--muted)}
.wa.sm{margin-top:10px;padding:12px;font-size:.7rem}
.rm.lnk{display:inline-block;margin-right:14px;color:var(--gold2)}
.dbody .item .rm{margin-top:6px}

/* ---------- shop toolbar + filters ---------- */
.fbtn{display:inline-flex;align-items:center;gap:8px;cursor:pointer;white-space:nowrap}
.fbtn svg{width:16px;height:16px;stroke:var(--ivory);fill:none;stroke-width:1.5}
.fbtn i{font-style:normal;min-width:18px;height:18px;border-radius:9px;background:var(--gold-fill,var(--gold));color:var(--on-gold);font-size:.66rem;display:none;place-items:center;padding:0 5px}
.fbtn i.on{display:inline-grid}
.pills{display:flex;flex-wrap:wrap;gap:8px;padding:0 var(--pad) 14px}
.pills:empty{display:none}
.pill{border:1px solid var(--gold);color:var(--gold2);padding:6px 14px;border-radius:30px;font-size:.72rem;letter-spacing:.08em}
.pill i{font-style:normal;margin-left:6px}
.pill.clear{border-color:var(--line);color:var(--muted)}
.fbody{padding:8px 26px 20px}
.fg2{padding:20px 0;border-bottom:1px solid rgba(214,106,140,.15)}
.fg2 h6{font-family:var(--sans);font-weight:400;font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}
.prange{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.prange input{flex:1;min-width:0;background:rgba(255,255,255,.03);border:1px solid var(--line);padding:11px 12px;outline:0;font-size:.85rem}
.prange input:focus{border-color:var(--gold)}
.prange span{color:var(--muted);font-size:.8rem}
.bk{display:flex;flex-wrap:wrap;gap:8px}
.bk button{padding:9px 14px;border:1px solid var(--line);font-size:.76rem;transition:.25s}
.bk button:hover{border-color:var(--gold)}
.bk button.on{background:var(--gold-fill,var(--gold));color:var(--on-gold);border-color:var(--gold)}
.sw{display:flex;flex-wrap:wrap;gap:12px}
.sw button{width:34px;height:34px;border-radius:50%;background:var(--c);border:2px solid transparent;outline:1px solid var(--line);outline-offset:2px;transition:.25s}
.sw button:hover{outline-color:var(--gold)}
.sw button.on{border-color:var(--g1);outline:2px solid var(--gold)}
.tg{display:flex;align-items:center;gap:10px;font-size:.88rem;padding:7px 0;cursor:pointer}
.tg input{accent-color:var(--gold);width:16px;height:16px}
.df .clr{display:block;width:100%;margin-top:12px;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);text-decoration:underline}
.toolbar .tools{flex-wrap:wrap}

/* ---------- product page ---------- */
.price{display:flex;align-items:center;flex-wrap:wrap;gap:4px 12px}
.price s{margin-left:0}
.st{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;padding:5px 10px;border:1px solid var(--line);color:var(--muted)}
.st.ok{color:#8fd6a8;border-color:#2f6b55}.st.pre{color:var(--gold2);border-color:var(--gold)}.st.out{color:#ff9aa5;border-color:#7a3140}
.opt h6 .lk{font-size:.7rem;letter-spacing:.1em;text-decoration:underline;color:var(--muted);text-transform:none}
.sizes.dim{opacity:.4;pointer-events:none}
.mtm{border:1px solid var(--line);padding:14px 16px;margin:-8px 0 22px}
.rd{display:flex;align-items:center;gap:10px;padding:5px 0;font-size:.9rem;cursor:pointer}
.rd input{accent-color:var(--gold)}
.mtm textarea{width:100%;margin-top:10px;background:rgba(255,255,255,.03);border:1px solid var(--line);padding:12px;outline:0;resize:vertical}
.mtm textarea:focus{border-color:var(--gold)}
.mtm textarea[hidden]{display:none}
.eta,.eta2{display:flex;align-items:flex-start;gap:10px;font-size:.88rem;color:var(--muted);margin:0 0 18px}
.eta svg,.eta2 svg,.safe svg{width:20px;height:20px;flex:none;stroke:var(--gold);fill:none;stroke-width:1.4;margin-top:1px}
.eta2{margin:16px 0 0}
.share{display:flex;align-items:center;gap:16px;margin-top:18px;font-size:.78rem;color:var(--muted)}
.share a,.share button{text-decoration:underline;color:var(--gold2)}
.buyrow{align-items:stretch}
.sbar{position:fixed;left:0;right:0;bottom:0;z-index:95;background:var(--g1);border-top:1px solid var(--line);padding:10px 16px calc(10px + env(safe-area-inset-bottom));display:none;align-items:center;justify-content:space-between;gap:14px}
.sbar div{display:flex;flex-direction:column;min-width:0}
.sbar b{font-family:var(--serif);font-weight:500;font-size:1.05rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sbar span{font-size:.85rem;color:var(--gold2)}
.sbar .btn{padding:13px 22px;flex:none}
@media (max-width:900px){.sbar.on{display:flex}body.has-sbar{padding-bottom:76px}body.has-sbar .toast{bottom:92px}}
.recent{background:var(--g0)}

/* ---------- checkout extras ---------- */
.tg.full{grid-column:1/-1}
.safe{display:flex;gap:10px;align-items:flex-start;font-size:.82rem;color:var(--muted);border:1px solid var(--line);padding:12px 14px;margin:0 0 22px}
.sum .promo{margin-top:16px}
.sum .promo-on{margin-top:16px}

/* ---------- modals ---------- */
.modal{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:16px;visibility:hidden;opacity:0;transition:opacity .25s,visibility 0s .25s}
.modal.on{visibility:visible;opacity:1;transition:opacity .25s}
.mb{position:absolute;inset:0;background:rgba(0,0,0,.72)}
.mp{position:relative;background:var(--g1);border:1px solid var(--line);width:min(920px,100%);max-height:calc(100svh - 32px);overflow:auto;overscroll-behavior:contain;transform:translateY(16px) scale(.98);transition:transform .35s var(--ease)}
.modal.on .mp{transform:none}
.mp.sm{width:min(520px,100%)}.mp.wide{width:min(940px,100%)}
.mx{position:absolute;top:10px;right:10px;z-index:3;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:rgba(74,29,51,.7)}
.mx svg{width:20px;height:20px;stroke:var(--ivory);fill:none;stroke-width:1.5}
.mx:hover{background:var(--gold-fill,var(--gold))}.mx:hover svg{stroke:var(--on-gold)}
.mc{padding:34px}
.mc h3{font-size:2rem;margin-bottom:10px}
.mc h4{font-size:1.3rem;margin:22px 0 8px}
.mt{color:var(--muted);font-size:.92rem;margin-bottom:16px}
.center{text-align:center}
.qvg{display:grid;grid-template-columns:1fr 1.05fr;gap:30px;margin:-34px}
.qvi{position:relative;min-height:420px;background:var(--g2)}
.qvi .art{position:absolute;inset:0}
.qvx{padding:44px 34px 34px 4px;display:flex;flex-direction:column;gap:14px;min-width:0}
.qvx h3{margin:0;font-size:1.9rem}
.qvx p{color:var(--muted);font-size:.95rem}
.qvx .price{font-size:1.3rem}
.qvx .opt{margin:0}.qvx .sizes{margin-bottom:6px}
.qvx .eta{margin:0}
.qvx .link{align-self:flex-start}
.mp.lb{width:min(980px,100%);background:#000;border-color:transparent}
.mp.lb .mc{padding:0}
.lbi{aspect-ratio:4/5;max-height:calc(100svh - 32px);margin:auto;position:relative;background:#000}
.lbi .art{position:absolute;inset:0}.lbi img{object-fit:contain!important}
.lbn{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;background:rgba(74,29,51,.7);font-size:1.8rem;line-height:1;z-index:3}
.lbn:hover{background:var(--gold-fill,var(--gold));color:var(--on-gold)}
.lbn.prev{left:12px}.lbn.next{right:12px}
.lbc{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);font-size:.75rem;letter-spacing:.2em;background:rgba(74,29,51,.7);padding:5px 12px;z-index:3}
@media (min-width:700px){.mp.lb .lbi{aspect-ratio:auto;height:calc(100svh - 32px);width:min(100%,calc((100svh - 32px)*.8))}}

/* size guide */
.seg{display:inline-flex;border:1px solid var(--line);margin-bottom:16px}
.seg button{padding:9px 18px;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase}
.seg button.on{background:var(--gold-fill,var(--gold));color:var(--on-gold)}
.sgt{width:100%;border-collapse:collapse;font-size:.9rem}
.sgt th,.sgt td{padding:11px 10px;border-bottom:1px solid rgba(214,106,140,.18);text-align:center}
.sgt thead th{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);font-weight:400}
.sgt tbody th{font-family:var(--serif);font-size:1.15rem;font-weight:500;color:var(--gold2)}
.how{margin:0 0 18px 18px;color:var(--muted);font-size:.92rem}.how li{margin-bottom:4px}

/* search */
.modal:has(.sr){place-items:start center;padding-top:calc(var(--abh,0px) + 70px)}
.mp.sr{width:min(720px,100%);max-height:calc(100svh - 110px)}
.mp.sr .mc{padding:26px}
.srin{display:flex;align-items:center;gap:14px;border-bottom:1px solid var(--gold);padding-bottom:10px;margin-right:44px}
.srin svg{width:22px;height:22px;stroke:var(--gold);fill:none;stroke-width:1.5;flex:none}
.srin input{flex:1;min-width:0;background:none;border:0;outline:0;font-family:var(--serif);font-size:1.7rem;color:var(--ivory)}
.srin input::placeholder{color:#6d8076}
#srRes{margin-top:18px}
.srh{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.srp{display:flex;flex-wrap:wrap;gap:8px}
.srp button{padding:9px 16px;border:1px solid var(--line);border-radius:30px;font-size:.78rem}
.srp button:hover{border-color:var(--gold);color:var(--gold2)}
.sres{display:flex;gap:16px;align-items:center;padding:10px 4px;border-bottom:1px solid rgba(214,106,140,.14);transition:background .25s}
.sres:hover{background:rgba(214,106,140,.08)}
.sres .th{width:54px;aspect-ratio:4/5;position:relative;overflow:hidden;flex:none}
.sres .th .art{position:absolute;inset:0}
.sres b{display:block;font-family:var(--serif);font-weight:500;font-size:1.15rem}
.sres small{color:var(--muted);font-size:.8rem}
.link.all{display:inline-block;margin-top:16px}

/* welcome popup */
.pop h3{font-size:2.2rem;line-height:1.1;margin:10px 0 12px}
.pop p{color:var(--muted);margin-bottom:20px}
.pop form{display:grid;gap:12px}
.pop input{background:rgba(255,255,255,.03);border:1px solid var(--line);padding:14px 16px;outline:0;text-align:center}
.pop input:focus{border-color:var(--gold)}
.nothanks{margin-top:14px;font-size:.76rem;color:var(--muted);text-decoration:underline}

/* ---------- help centre ---------- */
.help{max-width:960px;margin:0 auto;padding:0 var(--pad) 90px}
.hq{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:0 0 54px}
.hq a{border:1px solid var(--line);padding:20px 12px;text-align:center;font-family:var(--serif);font-size:1.2rem;transition:.3s var(--ease)}
.hq a:hover{border-color:var(--gold);background:rgba(214,106,140,.07)}
.hp{padding:0 0 54px;scroll-margin-top:calc(var(--hh) + 20px)}
.hp h2{font-size:clamp(1.9rem,3.6vw,2.8rem);margin-bottom:18px}
.hp p,.hp li{color:var(--muted);margin-bottom:10px}
.hp ul{margin-left:20px}
.hp .acc{margin-top:0}
.trkf,.cf{display:grid;gap:12px;max-width:520px}
.trkf{grid-template-columns:1fr auto}
.trkf input,.cf input,.cf textarea{background:rgba(255,255,255,.03);border:1px solid var(--line);padding:14px 16px;outline:0;width:100%}
.trkf input:focus,.cf input:focus,.cf textarea:focus{border-color:var(--gold)}
.trk{margin-top:18px;border:1px solid var(--line);padding:18px 20px;max-width:520px}
.trk b{font-family:var(--serif);font-size:1.4rem;margin-right:12px}
.trk p{margin:8px 0}
.cf .btn{justify-self:start}

/* footer / misc */
.ft-bot span:last-child{text-align:right}
@media (max-width:900px){.hq{grid-template-columns:repeat(2,1fr)}.hq a:last-child{grid-column:1/-1}.qvg{grid-template-columns:1fr;margin:-34px -34px -34px}.qvi{min-height:0;aspect-ratio:4/4.4}.qvx{padding:6px 28px 30px}.ft-bot span:last-child{text-align:left}}
@media (max-width:640px){
  .mc{padding:26px 20px}.mp.sr .mc{padding:20px 16px}.srin input{font-size:1.3rem}
  .qvg{margin:-26px -20px -26px}.qvx{padding:4px 20px 26px}
  .abar{letter-spacing:.14em;font-size:.62rem}
  .trkf{grid-template-columns:1fr}
  .tags{max-width:calc(100% - 58px)}
  .wl{width:34px;height:34px;top:8px;right:8px}.tags{top:8px;left:8px}
}
@media (prefers-reduced-motion:reduce){.ab-msg,.mp,.modal{transition:none}}