/* Mariam Fashion — dark premium black + gold. Mobile-first; desktop >= 1024px */
:root{--bg:#0B0B0B;--surf:#141414;--card:#1E1E1E;--line:#2A2A2A;--gold:#D4A24C;--gl:#F6E3B4;--gd:#A8742A;--iv:#F5EFE3;--mu:#9C958A;--pink:#C2185B;--wa:#25D366;--deep:#070707;
--grad:linear-gradient(135deg,#F6E3B4 0%,#D4A24C 50%,#A8742A 100%);--pf:'Exo 2','Anek Bangla',sans-serif;--bn:'Exo 2','Anek Bangla',sans-serif;--in:'Exo 2','Anek Bangla',sans-serif;--hh:64px}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--bg);color:var(--iv);font-family:var(--bn);font-size:15px;line-height:1.5;padding-top:var(--hh);padding-bottom:72px;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
[hidden]{display:none!important}
.wrap{width:100%;max-width:1200px;margin:0 auto;padding:0 16px}
.narrow{max-width:900px}
.gold{color:var(--gold)}.muted{color:var(--mu)}.small{font-size:12px}.tiny{font-size:11px}.center{text-align:center}
.ic{flex:none;display:inline-block;vertical-align:middle}
.d-only{display:none!important}
.eyebrow,.eyebrow-t{font-family:var(--in);font-weight:600;font-size:10px;letter-spacing:.3em;color:var(--gold);text-transform:uppercase}
.eyebrow{display:flex;align-items:center;gap:10px}.eyebrow::before{content:"";width:24px;height:1px;background:var(--gold)}
.eyebrow.sm{margin:22px 0 10px}
hr{border:0;border-top:1px solid var(--line);margin:16px 0}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 22px;border-radius:999px;font-weight:600;font-size:15px;white-space:nowrap;transition:transform .15s,filter .15s,background .15s}
.btn:active{transform:scale(.97)}
.btn.gold{background:var(--grad);color:var(--bg);box-shadow:0 8px 24px rgba(212,162,76,.25)}.btn.gold:hover{filter:brightness(1.06)}
.btn.ghost{border:1px solid rgba(212,162,76,.7);color:var(--iv)}.btn.ghost:hover{background:rgba(212,162,76,.1)}
.btn.line{border:1px solid var(--line);color:var(--iv)}
.btn.wa{background:var(--wa);color:#fff}
.btn.waline{border:1px solid rgba(37,211,102,.7);color:var(--wa);height:48px}.btn.waline:hover{background:rgba(37,211,102,.08)}
.btn.lg{height:52px;padding:0 26px}.btn.sm{height:40px;padding:0 16px;font-size:13px}.btn.block{display:flex;width:100%}
.textbtn{display:inline-flex;align-items:center;gap:6px;color:var(--gold);font-size:13px;font-weight:600}
.ibtn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;color:var(--iv);flex:none;transition:background .15s}
.ibtn:hover{background:rgba(255,255,255,.05)}
.ibtn.line{border:1px solid var(--line)}.ibtn.goldline{border:1px solid rgba(212,162,76,.5)}.ibtn.gold{color:var(--gold)}.ibtn.lg{width:50px;height:50px}.ibtn.sm{width:30px;height:30px;color:var(--mu)}
.badge{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:999px;font:700 10px var(--in);color:#fff;background:var(--pink)}
.badge.goldb{background:var(--gold);color:var(--bg)}.badge.lg{height:26px;font-size:12px;padding:0 10px}
.badge.pink{background:var(--pink);color:#fff;font-family:var(--bn)}
.cbadge{position:absolute;top:4px;right:3px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--gold);color:var(--bg);font:700 9px/13px var(--in);text-align:center;border:2px solid var(--bg)}
/* header */
.announce{display:none}
.hdr{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(11,11,11,.96);backdrop-filter:blur(10px);border-bottom:1px solid rgba(212,162,76,.22)}
.hdr-in{height:var(--hh);display:flex;align-items:center;gap:4px;padding:0 8px}
.hdr .logo{margin:0 auto;padding-left:44px}
.hdr-act{display:flex;align-items:center;gap:0}
.logo{display:inline-flex;align-items:center;gap:10px}
.logo img{width:40px;height:40px;border-radius:50%;border:1px solid rgba(212,162,76,.5);object-fit:cover}
.logo span{display:flex;flex-direction:column;line-height:1}
.logo b{font:700 17px var(--pf);letter-spacing:.12em;color:var(--iv)}
.logo small{font:600 8px var(--in);letter-spacing:.34em;color:var(--gold);margin-top:5px}
.logo.lg img{width:52px;height:52px}.logo.lg b{font-size:22px}.logo.lg small{font-size:10px}
.msearch,.dsearch{display:flex;align-items:center;gap:10px;height:44px;border-radius:22px;background:var(--surf);border:1px solid var(--line);padding:0 16px;color:var(--mu)}
.msearch{margin:0 12px 12px}
.msearch input,.dsearch input,.shopsearch input{flex:1;min-width:0;background:none;border:0;outline:0;color:var(--iv);font-size:14px}
input::placeholder,textarea::placeholder{color:var(--mu);opacity:1}
/* drawer */
.drawer-ov{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:90;opacity:0;transition:opacity .25s}.drawer-ov.open{opacity:1}
.drawer{position:fixed;top:0;bottom:0;left:0;width:min(330px,86vw);background:#101010;z-index:91;transform:translateX(-102%);transition:transform .28s ease;overflow-y:auto;padding:18px 20px 24px;border-right:1px solid rgba(212,162,76,.3);box-shadow:0 0 40px rgba(0,0,0,.6)}
.drawer.open{transform:none}
.drawer-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.drawer .logo img{width:44px;height:44px}
.dcats{list-style:none;margin:0 -8px}
.dcats li+li{border-top:1px solid var(--line);margin-left:64px}
.dcats li+li a{margin-left:-64px}
.dcats a{display:flex;align-items:center;gap:12px;padding:9px 8px;border-radius:14px;color:var(--mu)}
.dcats a:hover{background:rgba(212,162,76,.06)}
.dcats img{width:44px;height:44px;border-radius:50%;object-fit:cover;border:1px solid rgba(212,162,76,.4)}
.dcats span{flex:1;display:flex;flex-direction:column;line-height:1.3}
.dcats b{font-weight:600;font-size:15px;color:var(--iv)}.dcats b.gold{color:var(--gold)}.dcats small{font:400 11px var(--in);color:var(--mu)}
.contacts{display:flex;flex-direction:column;gap:10px;font-size:13px}
.contacts a,.contacts .c{display:flex;align-items:center;gap:12px;color:rgba(245,239,227,.85)}
.contacts .ic{color:var(--gold)}
.drawer-btns{display:flex;gap:10px;margin:20px 0}.drawer-btns .btn{flex:1;padding:0 10px}
.drawer p{margin-top:6px}
/* bottom nav + fab */
.bnav{position:fixed;left:0;right:0;bottom:0;height:72px;background:#0E0E0E;border-top:1px solid rgba(212,162,76,.18);display:flex;z-index:40;padding-bottom:env(safe-area-inset-bottom)}
.bnav a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--mu);font-size:11px;font-weight:500;position:relative}
.bnav a.on{color:var(--gold)}.bnav a.on::before{content:"";position:absolute;top:0;width:20px;height:2px;border-radius:1px;background:var(--gold)}
.rel{position:relative;display:inline-flex}.bnav .cbadge{top:-6px;right:-10px}
.fab{position:fixed;right:20px;bottom:96px;width:54px;height:54px;border-radius:50%;background:var(--wa);color:#fff;display:flex;align-items:center;justify-content:center;z-index:45;box-shadow:0 8px 20px rgba(0,0,0,.45);transition:transform .2s}
.fab:hover{transform:scale(1.06)}
body[data-page=product] .fab{bottom:108px}
body[data-nobnav]{padding-bottom:0}
body[data-page=product]{padding-bottom:92px}
/* toast */
.toast{position:fixed;left:50%;bottom:90px;transform:translate(-50%,30px);opacity:0;pointer-events:none;background:#1b1b1b;border:1px solid rgba(212,162,76,.5);color:var(--iv);padding:10px 16px;border-radius:999px;display:flex;gap:10px;align-items:center;font-size:13px;z-index:100;transition:.25s;white-space:nowrap;box-shadow:0 10px 30px rgba(0,0,0,.5)}
.toast .ic{color:var(--gold)}.toast a{color:var(--gold);font-weight:600}
.toast.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}
/* hero */
.hero,.shop-hero,.success{position:relative;overflow:hidden;background:linear-gradient(135deg,#1E160A 0%,#0F0D09 50%,#0B0B0B 100%)}
.hero-tex{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 75% 0%,rgba(212,162,76,.16),transparent 45%),radial-gradient(circle at 0% 80%,rgba(168,116,42,.12),transparent 40%),repeating-linear-gradient(-45deg,rgba(212,162,76,.045) 0 1px,transparent 1px 14px)}
.hero-in{position:relative;padding-top:36px;padding-bottom:28px}
.hero-art{position:relative;height:300px;margin-bottom:44px}
.wm{position:absolute;left:-14px;top:290px;font:700 300px/1 var(--pf);color:transparent;-webkit-text-stroke:1px rgba(212,162,76,.09);pointer-events:none;user-select:none}
.feat{position:absolute;left:4px;top:40px;display:flex;flex-direction:column;gap:6px}
.feat i{width:36px;height:1px;background:var(--gold);margin-bottom:6px}
.feat em{font:italic 400 19px/24px var(--pf);color:var(--iv)}.feat b{font-weight:600;font-size:16px;color:var(--gold)}
.arch{position:absolute;right:8px;top:0;width:216px;height:300px}
.arch img{width:100%;height:100%;object-fit:cover;border-radius:108px 108px 24px 24px;position:relative}
.arch-ol{position:absolute;left:-12px;top:12px;width:100%;height:100%;border:1px solid rgba(212,162,76,.55);border-radius:108px 108px 24px 24px}
.hbadge{position:absolute;left:calc(100% - 258px);top:236px;width:88px;height:88px;border-radius:50%;background:var(--grad);color:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 10px 24px rgba(0,0,0,.5);line-height:1.15}
.hbadge small{font-size:11px;font-weight:500}.hbadge b{font-size:22px;font-weight:700}
.hero-txt h1{font:700 38px/44px var(--pf);margin:12px 0}
.hero-txt h1 em{font-style:italic;color:var(--gold)}
.lead{color:rgba(245,239,227,.78);font-size:15px;line-height:23px;max-width:500px}
.btns{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}
.hdots{display:flex;gap:6px;margin-top:30px}.hdots i{width:8px;height:2px;border-radius:1px;background:rgba(245,239,227,.3)}.hdots i.on{width:24px;background:var(--gold)}
/* trust */
.trust{display:grid;grid-template-columns:1fr 1fr;background:var(--surf);border:1px solid var(--line);border-radius:20px;margin-top:24px}
.trust>div{display:flex;align-items:center;gap:10px;padding:18px 10px 18px 12px;min-height:80px;position:relative}
.trust>div:nth-child(2n)::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:1px;background:var(--line)}
.trust>div:nth-child(n+3){border-top:1px solid var(--line)}
.ring{flex:none;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;border:1px solid rgba(212,162,76,.45);color:var(--gold)}
.trust .ring svg{width:17px;height:17px}
.trust p{display:flex;flex-direction:column;line-height:1.35}.trust b{font-weight:600;font-size:13px}.trust small{font-size:11px;color:var(--mu)}
/* sections */
.sec{margin-top:44px}
.sec-h{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:18px;gap:12px}
.sec-h h2{font:700 28px/1.2 var(--pf);margin-top:8px}
.tiles{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(4,129px);gap:10px}
.tile{position:relative;border-radius:20px;overflow:hidden;display:block;background:#1a1a1a}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.tile:hover img{transform:scale(1.05)}
.tile::after{content:"";position:absolute;left:0;right:0;bottom:0;height:70%;background:linear-gradient(transparent,rgba(0,0,0,.88))}
.tile-frame{position:absolute;inset:8px;border:1px solid rgba(212,162,76,.3);border-radius:14px;z-index:1}
.tile .badge{position:absolute;top:16px;left:16px;z-index:2}
.tile-txt{position:absolute;left:18px;right:50px;bottom:16px;z-index:2;display:flex;flex-direction:column;line-height:1.1}
.tile-txt b{font:700 16px var(--pf)}.tile-txt small{font-size:11px;color:var(--gold);margin-top:4px}
.tile-arrow{position:absolute;right:16px;bottom:16px;width:28px;height:28px;border-radius:50%;border:1px solid rgba(212,162,76,.5);color:var(--gold);display:flex;align-items:center;justify-content:center;z-index:2}
.tile-arrow svg{width:13px;height:13px}
.t0{grid-column:1;grid-row:1/3}.t1{grid-column:2;grid-row:1}.t2{grid-column:2;grid-row:2}.t3{grid-column:1;grid-row:3}.t4{grid-column:1;grid-row:4}.t5{grid-column:2;grid-row:3/5}
.t0 .tile-txt b,.t5 .tile-txt b{font-size:21px}
.tabs,.chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin-bottom:16px}
.tabs::-webkit-scrollbar,.chips::-webkit-scrollbar,.scroller::-webkit-scrollbar{display:none}
.tabs button,.chips button{flex:none;height:34px;padding:0 16px;border-radius:999px;border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--iv);transition:.15s}
.tabs button.on,.chips button.on{background:var(--gold);border-color:var(--gold);color:var(--bg)}
.chips button{height:36px}
.scroller{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -16px;padding:0 16px;scrollbar-width:none}
.scroller .card{flex:0 0 160px;scroll-snap-align:start}
/* product card */
.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.card{position:relative;background:var(--card);border-radius:20px;overflow:hidden;display:flex;flex-direction:column}
.card-img{display:block;position:relative;aspect-ratio:3/4;overflow:hidden;background:#222}
.card-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.card:hover .card-img img{transform:scale(1.04)}
.card-img::after{content:"";position:absolute;left:0;right:0;bottom:0;height:70px;background:linear-gradient(transparent,rgba(0,0,0,.45))}
.card-media{position:relative}.card-media>.badge{position:absolute;top:10px;left:10px;z-index:2}
.order-pill{position:absolute;right:8px;bottom:8px;z-index:2;display:flex;align-items:center;gap:6px;height:30px;padding:0 11px;border-radius:999px;background:rgba(11,11,11,.78);border:1px solid rgba(212,162,76,.45);color:var(--iv);font-size:12px;font-weight:600}
.order-pill:hover{background:var(--gold);color:var(--bg)}
.card-body{padding:12px;display:flex;flex-direction:column;flex:1}
.ccat{font:600 9px var(--in);letter-spacing:.18em;color:var(--mu)}
.card h3{font:500 13px/17px var(--in);margin-top:6px;min-height:34px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cprice{display:flex;align-items:baseline;gap:8px;margin-top:8px}
.cprice b{font-weight:600;font-size:16px;color:var(--gold)}.cprice s{font-size:12px;color:var(--mu)}
/* offer band */
.offer{position:relative;display:block;height:250px;border-radius:24px;overflow:hidden;background:linear-gradient(135deg,#2B1F0E,#0F0D0A)}
.offer-imgs{position:absolute;right:0;top:0;bottom:0;width:45%;display:flex}
.offer-imgs img{flex:1;min-width:0;height:100%;object-fit:cover}
.offer-imgs::before{content:"";position:absolute;left:0;top:0;bottom:0;width:90px;background:linear-gradient(90deg,#1F170C,rgba(31,23,12,0));z-index:1}
.offer-frame{position:absolute;inset:8px;border:1px solid rgba(212,162,76,.35);border-radius:18px;z-index:2;pointer-events:none}
.offer-gem{position:absolute;right:18px;top:20px;z-index:3;height:26px;padding:0 10px;border-radius:999px;background:var(--pink);color:#fff;font:700 12px/26px var(--in)}
.offer-txt{position:relative;z-index:3;display:flex;flex-direction:column;align-items:flex-start;padding:28px 24px;height:100%;max-width:60%}
.ot{font:700 30px/36px var(--pf);margin-top:8px}.ot em{color:var(--gold);font-style:italic}
.od{font-size:13px;line-height:19px;color:rgba(245,239,227,.8);margin-top:8px;max-width:170px}
.offer-txt .btn{margin-top:auto;height:40px;font-size:14px}
/* story */
.story{margin-top:56px;padding-top:40px;border-top:1px solid rgba(212,162,76,.2);text-align:center;padding-bottom:50px}
.story-logo img{width:88px;height:88px;border-radius:50%;border:1px solid rgba(212,162,76,.5);margin:0 auto 20px}
.story h2{font:700 26px/32px var(--pf)}.story p{color:var(--mu);font-size:14px;line-height:22px;margin:12px auto 0;max-width:760px}
.sig{display:block;margin-top:12px;font:italic 14px var(--pf);color:var(--gold)}
/* footer */
.ftr{background:var(--deep);border-top:1px solid rgba(212,162,76,.25);padding:36px 0 0}
.ftr-grid{display:flex;flex-direction:column;gap:22px;padding:0 24px}
.ftr-brand p{color:var(--mu);font-size:14px;line-height:22px;margin-top:18px;max-width:420px}
.social{display:flex;gap:10px;margin-top:20px}.social .ibtn{width:40px;height:40px;color:var(--gold)}
.ftr-col h4{font-weight:600;font-size:16px;margin-bottom:22px;position:relative}.ftr-col h4::after{content:"";position:absolute;left:0;bottom:-10px;width:24px;height:1px;background:var(--gold)}
.ftr-grid>.ftr-col:nth-child(2) h4{display:none}
.ftr-col>a{display:block;font-size:14px;color:rgba(245,239,227,.8);margin-bottom:10px}.ftr-col>a:hover{color:var(--gold)}
.policies{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:13px;color:rgba(245,239,227,.8)}
.policies span{position:relative}.policies span+span::before{content:"";position:absolute;left:-13px;top:9px;width:3px;height:3px;border-radius:50%;background:var(--gold)}
.ftr-bot{display:flex;justify-content:space-between;padding:18px 24px 22px;margin-top:22px;border-top:1px solid var(--line);font:400 12px var(--in);color:var(--mu);max-width:1152px}
/* shop */
.shop-hero{padding:24px 0 20px}.shop-hero-in{position:relative;display:flex;justify-content:space-between;align-items:center}
.crumb{font-size:12px;color:var(--mu);white-space:pre-wrap;margin-bottom:10px}.crumb a:hover{color:var(--gold)}
.shop-hero h1{font:700 30px/1.2 var(--pf);margin:8px 0 4px}
.shop-hero .muted{font-size:13px}
.shop-logo img{width:160px;height:160px;border-radius:50%;opacity:.85;border:1px solid rgba(212,162,76,.5);box-shadow:0 0 0 20px rgba(212,162,76,.04),0 0 0 21px rgba(212,162,76,.25)}
.shop{padding-top:16px;padding-bottom:60px}
.shopsearch{display:flex;align-items:center;gap:10px;height:44px;border-radius:22px;background:var(--surf);border:1px solid var(--line);padding:0 16px;color:var(--mu);margin-bottom:14px}
.shopsearch:focus-within,.dsearch:focus-within,.msearch:focus-within{border-color:rgba(212,162,76,.7)}
.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:10px}
.sortsel{position:relative;display:inline-flex;align-items:center}
.sortsel select{appearance:none;-webkit-appearance:none;height:40px;padding:0 40px 0 16px;border-radius:999px;border:1px solid var(--line);background:var(--bg);font-size:13px;cursor:pointer}
.sortsel .ic{position:absolute;right:14px;pointer-events:none;color:var(--iv)}
.filters{position:fixed;inset:auto 0 0 0;max-height:85vh;overflow-y:auto;z-index:95;background:var(--surf);border:1px solid var(--line);border-radius:24px 24px 0 0;padding:22px 24px 28px;transform:translateY(105%);transition:transform .3s;box-shadow:0 -10px 40px rgba(0,0,0,.6)}
.filters.open{transform:none}
.fhead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}.fhead h3{font-weight:600;font-size:18px;flex:1}
.fsec{border-top:1px solid var(--line);padding:16px 0}.fsec h4{font-weight:600;font-size:15px;margin-bottom:14px}
.chk{display:flex;align-items:center;gap:12px;font-size:14px;padding:6px 0;cursor:pointer}
.chk input{position:absolute;opacity:0}.chk i{width:18px;height:18px;border-radius:5px;border:1.2px solid rgba(156,149,138,.6);display:flex;align-items:center;justify-content:center;color:transparent}
.chk input:checked+i{background:var(--gold);border-color:var(--gold);color:var(--bg)}.chk input:focus-visible+i{outline:2px solid var(--gold)}
.chk span{flex:1}.chk em{font:400 12px var(--in);color:var(--mu);font-style:normal}
.sizes{display:flex;gap:10px}.sizes button{width:64px;height:44px;border-radius:999px;border:1px solid var(--line);font:600 15px var(--in);transition:.15s}
.sizes button.on{border-color:rgba(212,162,76,.7);background:rgba(212,162,76,.12);color:var(--gold)}
.sizes.sm button{width:56px;height:38px;font-size:13px}
.prange{display:flex;gap:8px}.prange input{width:50%;height:40px;border-radius:20px;border:1px solid var(--line);background:var(--bg);text-align:center;font-size:13px;outline:0}
.prange input:focus{border-color:var(--gold)}
.swatches{display:flex;flex-wrap:wrap;gap:14px}.sw{width:30px;height:30px;border-radius:50%;border:1px solid var(--line)}.sw.on{outline:2px solid var(--gold);outline-offset:2px}
.toggle{display:flex;align-items:center;justify-content:space-between;font-size:14px;cursor:pointer}.toggle input{position:absolute;opacity:0}
.toggle i{width:44px;height:24px;border-radius:12px;background:var(--line);position:relative;transition:.2s}.toggle i::after{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:var(--iv);transition:.2s}
.toggle input:checked+i{background:var(--gold)}.toggle input:checked+i::after{left:23px;background:var(--bg)}
.filters .btn{margin-top:8px}
.empty{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;gap:12px;padding:50px 20px;text-align:center;color:var(--mu)}
.empty h3{color:var(--iv);font-weight:600;font-size:18px}.empty .ic{color:var(--gold)}
/* product page */
.pd{display:flex;flex-direction:column}
.gallery{margin:0 -16px;display:flex;flex-direction:column-reverse}
.gmain{position:relative;height:500px;overflow:hidden;background:#ddd}
.gmain img{width:100%;height:100%;object-fit:cover;transition:transform .35s,object-position .35s}
.gmain .badge{position:absolute;top:16px;left:16px;z-index:2;height:28px}
.dots{position:absolute;bottom:23px;left:0;right:0;display:flex;justify-content:center;gap:8px;z-index:2}
.dots i{width:8px;height:3px;border-radius:2px;background:rgba(245,239,227,.4);cursor:pointer}.dots i.on{width:24px;background:var(--gold)}
.thumbs{display:flex;gap:10px;padding:12px 16px 0}
.thumbs button{width:66px;height:88px;border-radius:12px;overflow:hidden;opacity:.7;border:1.5px solid transparent;transition:.15s}
.thumbs button.on{opacity:1;border-color:var(--gold)}
.thumbs img{width:100%;height:100%;object-fit:cover}
.pinfo{padding-top:24px}
.pinfo h1{font:700 26px/32px var(--pf);margin-top:8px}
.pprice{display:flex;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap}.pprice b{font-weight:700;font-size:28px;color:var(--gold)}.pprice s{color:var(--mu);font-size:16px}
.stock{display:flex;align-items:center;gap:8px;color:var(--mu);font-size:13px;margin-top:6px}.stock i{width:7px;height:7px;border-radius:50%;background:var(--gold)}
.row-sb{display:flex;align-items:center;justify-content:space-between;gap:10px}
.pinfo h3{font-weight:600;font-size:15px}
.pinfo .sizes{margin:14px 0 16px}
.chart{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--surf);scroll-margin-top:90px}
.chart table{width:100%;border-collapse:collapse;text-align:center}
.chart thead th{background:#1B1B1B;font-weight:500;font-size:12px;color:var(--mu);height:40px}
.chart tbody th{font:700 15px var(--pf);color:var(--gold)}.chart td{font:500 14px var(--in)}
.chart tbody tr{border-top:1px solid var(--line);height:40px}
.pinfo .tiny{margin-top:8px}
.buyrow{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:20px 0 24px}.qlabel{font-weight:600;font-size:15px}
.stepper{display:inline-flex;align-items:center;justify-content:space-between;width:96px;height:32px;padding:3px;border-radius:999px;background:var(--surf);border:1px solid var(--line)}
.stepper button{width:26px;height:26px;border-radius:50%;background:var(--card);display:flex;align-items:center;justify-content:center}
.stepper button:hover{color:var(--gold)}
.stepper span{font:600 14px var(--in)}
.stepper.lg{width:132px;height:46px;padding:4px}.stepper.lg button{width:38px;height:38px}.stepper.lg span{font-size:16px}
.info{border:1px solid var(--line);background:var(--surf);border-radius:18px;margin-bottom:20px}
.info>div{display:flex;align-items:center;gap:12px;padding:13px 16px;min-height:64px}.info>div+div{border-top:1px solid var(--line)}
.info p{display:flex;flex-direction:column;line-height:1.35}.info b{font-weight:600;font-size:14px}.info small{font-size:12px;color:var(--mu)}
.dt{margin:28px 0 14px}
.bul{list-style:none;display:flex;flex-direction:column;gap:8px;margin-bottom:32px}
.bul li{position:relative;padding-left:16px;font-size:14px;color:rgba(245,239,227,.85)}.bul li::before{content:"";position:absolute;left:0;top:9px;width:5px;height:5px;border-radius:50%;background:var(--gold)}
.orderbar{position:fixed;left:0;right:0;bottom:0;z-index:40;height:92px;background:#0E0E0E;border-top:1px solid rgba(212,162,76,.25);display:flex;align-items:center;gap:10px;padding:0 16px env(safe-area-inset-bottom)}
.orderbar div{flex:1;display:flex;flex-direction:column}.orderbar small{font-size:11px;color:var(--mu)}.orderbar b{font-weight:700;font-size:22px;color:var(--gold);line-height:1.2}
.orderbar .btn{height:50px;min-width:164px}
/* cart */
.back{margin:20px 0 16px}
.ptitle{display:flex;align-items:baseline;gap:10px;margin-bottom:20px}.ptitle h1{font:700 32px var(--pf)}
.cartwrap{display:flex;flex-direction:column;gap:20px;padding-bottom:40px}
.cart-list{display:flex;flex-direction:column;gap:12px}
.citem{position:relative;display:flex;gap:14px;background:var(--card);border-radius:18px;padding:12px;min-height:136px}
.citem>a img{width:84px;height:112px;border-radius:12px;object-fit:cover}
.cmeta{flex:1;min-width:0;display:flex;flex-direction:column;padding-right:30px}
.cmeta .ccat{color:var(--gold)}.cmeta h3{font:500 14px/18px var(--in);margin-top:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cmeta small{color:var(--mu);font-size:12px;margin-top:4px}.cmeta b{margin-top:auto;font-weight:600;font-size:16px;color:var(--gold)}
.citem .trash{position:absolute;top:10px;right:10px}.citem .trash:hover{color:var(--pink)}
.citem .stepper{position:absolute;right:12px;bottom:12px}
.citem.sm{min-height:112px;background:var(--card)}.citem.sm>a img{width:66px;height:88px}
.dnote{display:flex;align-items:center;gap:10px;min-height:48px;padding:10px 16px;border-radius:24px;background:rgba(212,162,76,.07);border:1px solid rgba(212,162,76,.3);font-size:13px}.dnote .ic{color:var(--gold)}
.card-s{background:var(--surf);border:1px solid var(--line);border-radius:20px;padding:20px}
.summary h2,.coform h2{font-weight:600;font-size:17px;margin-bottom:18px}
.trow{display:flex;justify-content:space-between;gap:12px;font-size:14px;padding:5px 0}.trow span{color:var(--mu)}.trow b{font-weight:500}
.trow.total{align-items:center;padding:4px 0 18px}.trow.total span{color:var(--iv);font-weight:600;font-size:17px}.trow.total b{font:700 26px var(--pf);color:var(--gold)}
.summary .center{margin-top:14px;display:flex;align-items:center;justify-content:center;gap:8px}
.card-s.empty{gap:14px}
/* checkout */
.co-head{display:flex;flex-direction:column;gap:20px;padding:20px 0 20px}.co-head h1{font:700 32px var(--pf)}.co-head p{font-size:13px}
.steps{display:flex;justify-content:space-between;position:relative;width:310px;max-width:100%;margin:0 auto}
.steps::before{content:"";position:absolute;left:14px;right:14px;top:14px;height:1px;background:linear-gradient(90deg,var(--gold) 50%,var(--line) 50%)}
.st{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12px;font-weight:500;width:28px}
.st i{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--bg);border:1.5px solid var(--line);font:600 12px var(--in);font-style:normal;color:var(--mu)}
.st.done i{background:var(--grad);border:0;color:var(--bg)}.st.cur i{border-color:var(--gold);color:var(--gold)}.st span{white-space:nowrap}.st:last-child span{color:var(--mu)}
.co{display:flex;flex-direction:column;gap:16px;padding-bottom:48px}
.field{margin-bottom:18px}.field label{display:block;font-weight:500;font-size:13px;margin-bottom:8px}.field label b{color:var(--gold)}.field label small{color:var(--mu);font-weight:400;font-size:12px}
.field input,.field textarea,.pfx{width:100%;height:50px;border-radius:25px;background:var(--surf);border:1px solid var(--line);padding:0 20px;font-size:14px;outline:0;transition:border .15s}
.coform .field input,.coform .field textarea,.coform .pfx,.coform .select{background:var(--bg)}
.field textarea{height:auto;min-height:92px;border-radius:18px;padding:14px 20px;resize:vertical;line-height:1.5}
.field input:focus,.field textarea:focus,.pfx:focus-within{border-color:rgba(212,162,76,.75)}
.pfx{display:flex;align-items:center;gap:12px;padding:0 0 0 20px}.pfx span{font:500 14px var(--in);padding-right:12px;border-right:1px solid var(--line);line-height:24px}.pfx input{border:0!important;height:48px;padding:0 20px 0 0;background:transparent!important;font-family:var(--in)}
.field.bad input,.field.bad textarea,.field.bad .pfx{border-color:#E0566B}
.err{color:#FF7A8C;font-size:12px;margin-top:6px}.err:empty{display:none}
.select{width:100%;height:50px;border-radius:25px;border:1px solid rgba(212,162,76,.75);display:flex;align-items:center;gap:10px;padding:0 16px 0 20px;font-weight:500;font-size:14px;text-align:left}
.select span{flex:1}.select b{color:var(--gold);font-weight:600}.select .ic{color:var(--gold);transition:transform .2s}.select.open .ic{transform:rotate(180deg)}
.opts{margin-top:6px;border:1px solid var(--line);border-radius:18px;background:var(--surf);padding:4px;box-shadow:0 10px 24px rgba(0,0,0,.5)}
.opts>div{display:flex;align-items:center;gap:12px;padding:8px 16px 8px 14px;border-radius:14px;cursor:pointer;min-height:52px}
.opts>div:hover{background:rgba(255,255,255,.03)}.opts>div.on{background:rgba(212,162,76,.09)}
.opts i,.pay>i{width:18px;height:18px;border-radius:50%;border:1.5px solid rgba(156,149,138,.6);flex:none;position:relative}
.opts .on i,.pay>i{border-color:var(--gold)}.opts .on i::after,.pay>i::after{content:"";position:absolute;inset:2.5px;border-radius:50%;background:var(--gold)}
.opts p{flex:1;display:flex;flex-direction:column;font-weight:500;font-size:14px;line-height:1.3}.opts small{font-size:11px;color:var(--mu);font-weight:400}.opts b{font-weight:600}.opts .on b{color:var(--gold)}
.coform h3{font-weight:600;font-size:16px;margin:8px 0 14px}
.pay{display:flex;align-items:center;gap:12px;padding:16px;border-radius:18px;border:1px solid rgba(212,162,76,.8);background:rgba(212,162,76,.06)}
.pay .ring{width:40px;height:40px}.pay p{flex:1;display:flex;flex-direction:column;line-height:1.35}.pay b{font-weight:600;font-size:15px}.pay small{font-size:12px;color:var(--mu)}
.m-submit{margin-top:22px}
.summary #sumitems{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}
.summary #sumtotals{border-top:1px solid var(--line);padding-top:12px}
.lockn{display:flex;gap:8px;color:var(--mu);font-size:12px;margin-top:14px;line-height:18px}
.co.one{display:block}
/* success */
.success{min-height:calc(100vh - var(--hh));padding:56px 24px 40px}
.succ-in{position:relative;max-width:520px;margin:0 auto;text-align:center}
.sring{position:relative;width:128px;height:128px;margin:0 auto 28px;border-radius:50%;border:1px solid rgba(212,162,76,.4);display:flex;align-items:center;justify-content:center}
.sring span{width:96px;height:96px;border-radius:50%;background:var(--grad);color:var(--bg);display:flex;align-items:center;justify-content:center;box-shadow:0 0 40px rgba(212,162,76,.4)}
.sring i{position:absolute;width:8px;height:8px;background:rgba(212,162,76,.7);transform:rotate(45deg)}
.d1{left:-46px;top:20px}.d2{right:-32px;top:8px}.d3{left:-16px;top:120px}.d4{right:-54px;top:104px}
.success h1{font:700 36px var(--pf)}.success h2{font-weight:600;font-size:18px;color:var(--gold);margin:8px 0}
.success .muted{font-size:14px;line-height:22px;margin-bottom:24px}
.oinfo{text-align:left;padding:8px 20px;margin-bottom:24px}.oinfo>.trow{padding:11px 0;border-top:1px solid var(--line)}.oinfo>.trow:first-child{border:0}
.oinfo .trow b{font-weight:500}.oinfo .oitems{border-top:1px solid var(--line);padding:8px 0}.oinfo .trow.sm{font-size:13px;padding:3px 0}
.oinfo .trow.total{border-top:1px solid var(--line);padding:12px 0}.oinfo .trow.total b{font-size:20px;font-family:var(--bn)}
.success .btn{margin-bottom:12px}
/* ---------- desktop ---------- */
@media (min-width:1024px){
  :root{--hh:118px}
  body{padding-bottom:0}
  .m-only{display:none!important}.d-only{display:revert!important}
  .wrap{padding:0 24px;max-width:1248px}
  .announce{display:flex;align-items:center;justify-content:center;position:fixed;top:0;left:0;right:0;height:34px;background:var(--surf);color:var(--gold);font-weight:500;font-size:13px;z-index:51}
  .hdr{top:34px}
  .hdr-in{height:84px;gap:0;padding:0 24px}
  .hdr .logo{margin:0;padding:0}
  .hdr .logo img{width:52px;height:52px}.hdr .logo b{font-size:22px}.hdr .logo small{font-size:10px}
  .dnav{display:flex!important;gap:30px;margin-left:56px;flex:1}
  .dnav a{font-weight:500;font-size:15px;position:relative;padding:8px 0;white-space:nowrap}.dnav a:hover,.dnav a.on,.dnav a.nav-offer{color:var(--gold)}
  .dnav a.on::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--gold)}
  .dnav a.nav-offer::after{content:"";position:absolute;right:-10px;top:8px;width:6px;height:6px;border-radius:50%;background:var(--pink)}
  .dsearch{display:flex!important;width:250px;margin-right:16px}
  .hdr-act{gap:10px}.hdr-act .cartbtn{border:1px solid rgba(212,162,76,.5)}
  .hdr-act .cbadge{top:-2px;right:-2px}
  .fab{width:60px;height:60px;right:32px;bottom:32px}.fab svg{width:28px;height:28px}
  body[data-page=product] .fab{bottom:32px}
  .toast{bottom:40px}
  /* hero */
  .hero-in{display:flex;flex-direction:row-reverse;justify-content:space-between;min-height:720px;padding-top:32px;padding-bottom:40px}
  .hero-txt{padding-top:0;width:640px;position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center}
  .hero-txt .eyebrow{font-size:12px}
  .hero-txt h1{font-size:68px;line-height:78px;margin:20px 0}
  .lead{font-size:19px;line-height:30px;max-width:500px}
  .btns{margin-top:36px;gap:12px}.btns .btn{height:56px;padding:0 30px;font-size:16px}
  .stats{display:flex!important;gap:48px;margin-top:52px}
  .stats div{display:flex;flex-direction:column;position:relative}.stats div+div::before{content:"";position:absolute;left:-24px;top:4px;height:48px;width:1px;background:rgba(212,162,76,.35)}
  .stats b{font-weight:700;font-size:24px;color:var(--gold)}.stats b.pf{font-family:var(--pf)}.stats small{font-size:13px;color:var(--mu);margin-top:4px}
  .hdots{margin-top:60px}
  .hero-art{width:560px;height:640px;margin:0;flex:none}
  .wm{left:-260px;top:-80px;font-size:520px;-webkit-text-stroke-color:rgba(212,162,76,.07)}
  .arch{right:40px;top:70px;width:400px;height:560px}
  .arch img,.arch-ol{border-radius:200px 200px 28px 28px}
  .arch-ol{left:16px;top:-16px}
  .p2{display:block!important;position:absolute;left:0;top:404px;width:200px;height:264px;border-radius:20px;overflow:hidden;border:6px solid var(--bg);z-index:2}
  .p2 img{width:100%;height:100%;object-fit:cover}
  .hbadge.gemb{display:flex!important;left:auto;right:-8px;top:520px;width:116px;height:116px;gap:6px;z-index:3}
  .gemb b{font:700 11px/14px var(--in);letter-spacing:.18em;text-align:center}
  .vtext{display:block!important;position:absolute;right:-56px;top:120px;writing-mode:vertical-rl;font:500 11px var(--in);letter-spacing:.4em;color:rgba(212,162,76,.7)}
  .trust{grid-template-columns:repeat(4,1fr);margin-top:48px}
  .trust>div{min-height:104px;padding:20px 16px 20px 28px;gap:16px}
  .trust>div:nth-child(n+3){border-top:0}.trust>div+div::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:1px;background:var(--line)}
  .trust .ring{width:48px;height:48px}.trust .ring svg{width:23px;height:23px}
  .trust b{font-size:16px}.trust small{font-size:13px}
  .sec{margin-top:96px}.sec-h{margin-bottom:32px}.sec-h h2{font-size:42px}.eyebrow{font-size:12px}
  .sec-h .textbtn{font-size:15px}
  .arrows{display:flex!important;gap:12px}
  .tiles{grid-template-columns:480px 340px 160px 160px;grid-template-rows:290px 290px;gap:20px;justify-content:space-between}
  .t0{grid-column:1;grid-row:1/3}.t1{grid-column:2;grid-row:1}.t2{grid-column:2;grid-row:2}.t3{grid-column:3/5;grid-row:1}.t4{grid-column:3;grid-row:2}.t5{grid-column:4;grid-row:2}
  .tile-txt b{font-size:26px}.t0 .tile-txt b{font-size:36px}.t4 .tile-txt b,.t5 .tile-txt b{font-size:19px}.tile-txt small{font-size:14px}
  .tile-arrow{width:36px;height:36px}.tile-arrow svg{width:16px;height:16px}
  .tabs button{height:40px;padding:0 22px;font-size:14px}.tabs{margin-bottom:28px}
  .scroller{margin:0;padding:0;gap:20px}.scroller .card{flex:0 0 224px}
  .card h3{font-size:15px;line-height:20px;min-height:40px;margin-top:8px}.card-body{padding:16px}.ccat{font-size:10px}.cprice b{font-size:19px}.cprice s{font-size:14px}
  .card-media{position:relative}.card-media>.badge{height:26px;font-size:12px;padding:0 11px}
  .order-pill{height:36px;padding:0 14px;font-size:13px}
  .grid.g4{grid-template-columns:repeat(4,1fr);gap:20px}
  .grid.g3{grid-template-columns:repeat(3,1fr);gap:24px}
  .offer{height:380px;border-radius:28px}
  .offer-imgs{width:560px}.offer-imgs img+img{border-left:1px solid rgba(212,162,76,.5)}.offer-imgs::before{width:160px;background:linear-gradient(90deg,#21180C,rgba(33,24,12,0))}
  .offer-frame{inset:12px;border-radius:20px}
  .offer-gem{right:auto;left:730px;top:36px;width:92px;height:92px;border-radius:50%;font:700 22px/92px var(--pf);text-align:center;padding:0;box-shadow:0 8px 24px rgba(0,0,0,.4)}
  .offer-txt{padding:64px;max-width:640px}.offer-txt .eyebrow-t{font-size:12px}
  .ot{font-size:52px;line-height:1.2;margin-top:12px}.od{font-size:17px;line-height:27px;max-width:480px;margin-top:14px}
  .offer-txt .btn{margin-top:36px;height:52px;padding:0 30px;font-size:15px}
  .story{display:flex;align-items:center;gap:100px;text-align:left;border:0;margin-top:110px;padding:0 40px 110px}
  .story-logo{flex:none;width:260px;height:260px;border-radius:50%;border:1px solid rgba(212,162,76,.35);display:flex;align-items:center;justify-content:center}
  .story-logo img{width:220px;height:220px;margin:0}
  .story h2{font-size:44px;line-height:1.3;margin-top:14px}.story p{font-size:17px;line-height:28px;margin:16px 0 0}.sig{font-size:16px;margin-top:16px}
  .ftr{padding-top:64px}
  .ftr-grid{display:grid;grid-template-columns:440px 340px 220px 1fr;gap:0;padding:0 24px}
  .ftr-grid>.ftr-col:nth-child(2) h4{display:block}
  .logo.lg img{width:60px;height:60px}.logo.lg b{font-size:25px}
  .ftr-brand p{font-size:15px;line-height:24px;max-width:380px}
  .ftr-col .contacts{font-size:14px;gap:14px}
  .policies{flex-direction:column;gap:12px;font-size:14px}.policies span+span::before{display:none}
  .ftr-col p.gold{margin-top:12px;font-size:14px}
  .ftr-bot{margin-top:56px;padding:22px 0 26px;font-size:13px;max-width:1200px}
  /* shop */
  .shop-hero{padding:0;height:260px;display:flex;align-items:center}.shop-hero-in{width:100%}
  .shop-hero h1{font-size:52px}.shop-hero .muted{font-size:17px;color:rgba(245,239,227,.75)}.crumb{font-size:13px}
  .shop{display:grid;grid-template-columns:264px 1fr;gap:32px;padding-top:48px;padding-bottom:110px;align-items:start}
  .filters{position:sticky;top:140px;inset:auto;transform:none;max-height:none;border-radius:20px;box-shadow:none;padding:22px 24px 24px;z-index:1}
  .shop .chips button{height:40px;font-size:14px}
  .toolbar .pcount{display:block!important;font-size:15px}
  .sortsel select{height:44px;font-size:14px;padding-left:20px}
  /* product */
  .crumb#crumb{margin:28px 0 24px}
  .pd{display:grid;grid-template-columns:636px 1fr;gap:60px;padding-bottom:120px;align-items:start}
  .gallery{margin:0;flex-direction:row;gap:20px;position:sticky;top:140px}
  .thumbs{flex-direction:column;padding:0;gap:16px}.thumbs button{width:96px;height:128px;border-radius:14px}
  .gmain{width:520px;height:693px;border-radius:24px}
  .gmain .badge{top:20px;left:20px;height:30px;font-size:13px}
  .dots{display:none}
  .pinfo{padding-top:0}.pinfo .eyebrow-t{font-size:12px}
  .pinfo h1{font-size:40px;line-height:48px;margin-top:10px}
  .pprice b{font-size:34px}.pprice s{font-size:18px}.pprice .badge{height:28px;font-size:13px}
  .stock{font-size:14px}.pinfo h3{font-size:16px}
  .pinfo .sizes button{width:72px;height:48px}
  .buyrow{justify-content:flex-start}.buyrow .btn{height:52px;flex:1}.stepper.lg{height:52px}.stepper.lg button{width:44px;height:44px}
  /* cart */
  .cartwrap{display:grid;grid-template-columns:1fr 360px;align-items:start}
  /* checkout */
  .co-head{flex-direction:row;justify-content:space-between;align-items:flex-start;padding:16px 0 40px}.co-head h1{font-size:48px}.co-head p{font-size:16px}
  .steps{width:320px;margin:12px 0 0}
  .co{display:grid;grid-template-columns:720px 1fr;gap:32px;padding-bottom:120px;align-items:start}
  .coform{padding:28px 32px 32px;border-radius:24px}.coform h2,.summary h2{font-size:20px}
  .frow2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
  .summary{position:sticky;top:140px;border-radius:24px;padding:28px 24px}
  .m-submit{display:none!important}
  .success{padding-top:80px;min-height:calc(100vh - var(--hh))}.success h1{font-size:48px}.success h2{font-size:22px}
}
@media (max-width:1023px){ .coform .m-submit{display:none} .summary .btn{margin-top:4px} }
@media (max-width:360px){ .arch{width:190px;height:270px} .hbadge{left:calc(100% - 232px);top:210px} .hero-txt h1{font-size:33px;line-height:40px} .orderbar .btn{min-width:0;padding:0 16px} }