:root{
  --navy:#1A1A1A; --navy-2:#000000; --gold:#D6272C; --gold-2:#FF5A5F;
  --deal:#C8102E; --deal-soft:#FDE9EA;
  --accent:#D6272C; --accent-2:#FF5A5F;
  --bg:#FAFAFA; --card:#FFFFFF; --ink:#1A1A1A; --muted:#6B6B6B; --muted-2:#9A9A9A;
  --line:#E7E2E2; --star:#D6272C; --ok:#2E9E56; --ok-soft:#E7F7EC;
  --shadow-sm:0 1px 2px rgba(0,0,0,.35), 0 1px 3px rgba(0,0,0,.3);
  --shadow-md:0 10px 26px rgba(0,0,0,.45);
  --shadow-lg:0 22px 55px rgba(0,0,0,.55);
  --radius:14px; --radius-sm:10px; --wrap:1240px;
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; overflow-x:hidden; }
body{ margin:0; background:var(--bg); color:var(--ink); font-family:'Plus Jakarta Sans',sans-serif; line-height:1.55; -webkit-font-smoothing:antialiased; overflow-x:hidden; max-width:100vw; }
h1,h2,h3,h4{ font-family:'Sora',sans-serif; margin:0; color:var(--navy); letter-spacing:-.01em; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
button{ font-family:inherit; cursor:pointer; }
svg{ display:block; }
::selection{ background:var(--gold); color:var(--navy); }
.wrap{ max-width:var(--wrap); margin:0 auto; padding:0 18px; }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* ---------- Static policy pages ---------- */
.policy-hero{ background:linear-gradient(120deg,var(--navy),var(--navy-2)); color:#fff; padding:38px 0 30px; }
.policy-hero .wrap{ display:flex; flex-direction:column; gap:8px; }
.policy-hero .crumb{ font-size:.82rem; color:rgba(255,255,255,.7); }
.policy-hero .crumb a{ color:var(--gold-2); }
.policy-hero h1{ color:#fff; font-size:1.7rem; }
.policy-hero p{ color:rgba(255,255,255,.78); margin:0; font-size:.92rem; }
.policy-body{ padding:36px 0 60px; }
.policy-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); padding:32px clamp(18px,4vw,44px); max-width:900px; margin:0 auto; }
.policy-card .updated{ font-size:.8rem; color:var(--muted-2); margin-bottom:22px; }
.policy-card h2{ font-size:1.12rem; margin:28px 0 10px; padding-top:16px; border-top:1px solid var(--line); }
.policy-card h2:first-of-type{ margin-top:0; padding-top:0; border-top:none; }
.policy-card p{ color:var(--muted); margin:0 0 12px; font-size:.95rem; }
.policy-card ul{ margin:0 0 12px; padding-left:20px; color:var(--muted); font-size:.95rem; }
.policy-card li{ margin-bottom:6px; }
.policy-card a.inline-link{ color:var(--navy-2); font-weight:600; text-decoration:underline; }
.policy-nav-links{ display:flex; flex-wrap:wrap; gap:10px 18px; max-width:900px; margin:22px auto 0; font-size:.86rem; }
.policy-nav-links a{ color:var(--muted); font-weight:600; }
.policy-nav-links a.active, .policy-nav-links a:hover{ color:var(--navy); }

/* ---------- Announcement bar ---------- */
.topbar{ background:var(--navy); color:#fff; font-size:.78rem; }
.topbar .wrap{ display:flex; align-items:center; justify-content:space-between; height:38px; gap:16px; }
.topbar-left{ display:flex; align-items:center; gap:9px; color:rgba(255,255,255,.82); overflow:hidden; white-space:nowrap; }
.topbar-left .dot{ color:var(--gold); }
.topbar-right{ display:flex; align-items:center; gap:20px; color:rgba(255,255,255,.75); }
.topbar-right a{ display:inline-flex; align-items:center; gap:6px; transition:color .2s; }
.topbar-right a:hover{ color:var(--gold-2); }
@media(max-width:760px){ .topbar-right{ display:none; } }

/* ---------- Header ---------- */
.header{ background:var(--card); position:sticky; top:0; z-index:60; box-shadow:var(--shadow-sm); }
.header-main{ display:flex; align-items:center; gap:22px; height:76px; }
.brand{ display:flex; align-items:center; gap:11px; flex-shrink:0; }
.brand img{ height:50px; width:auto; }
.brand-txt{ line-height:1.05; }
.brand-txt b{ font-family:'Sora',sans-serif; font-weight:800; font-size:1.18rem; color:var(--navy); display:block; }
.brand-txt span{ font-size:.58rem; letter-spacing:.32em; color:var(--gold); font-weight:600; }
@media(max-width:520px){ .brand-txt{ display:none; } .brand img{ height:44px; } }

.searchbar{ position:relative; flex:1; display:flex; align-items:center; background:var(--bg); border:2px solid var(--line); border-radius:999px; padding:4px 4px 4px 18px; transition:border-color .2s, box-shadow .2s; min-width:0; }
.searchbar:focus-within{ border-color:var(--gold); box-shadow:0 0 0 4px rgba(0,174,184,.14); }
.searchbar svg{ color:var(--muted-2); flex-shrink:0; }
.searchbar input{ flex:1; border:none; background:none; outline:none; font-size:.95rem; color:var(--ink); padding:11px 12px; min-width:0; font-family:inherit; }
.searchbar input::placeholder{ color:var(--muted-2); }
.search-btn{ background:var(--navy); color:#fff; border:none; border-radius:999px; padding:11px 24px; font-weight:600; font-size:.9rem; display:inline-flex; align-items:center; gap:8px; transition:background .2s, transform .15s; }
.search-btn:hover{ background:var(--navy-2); }
.search-btn:active{ transform:scale(.97); }
.search-btn span{ display:inline; }
@media(max-width:760px){ .search-btn span{ display:none; } .search-btn{ padding:11px 15px; } }

.header-actions{ display:flex; align-items:center; gap:6px; flex-shrink:0; }
.icon-btn{ position:relative; background:none; border:none; color:var(--navy); width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center; transition:background .2s; }
.icon-btn:hover{ background:var(--bg); }
.icon-btn .label{ display:none; }
.cart-count{ position:absolute; top:5px; right:5px; min-width:18px; height:18px; padding:0 4px; background:var(--deal); color:#fff; font-size:.66rem; font-weight:700; border-radius:999px; display:flex; align-items:center; justify-content:center; border:2px solid var(--card); }
.cart-count:empty, .cart-count[data-n="0"]{ display:none; }
@media(max-width:760px){ .header-main{ flex-wrap:wrap; height:auto; padding:12px 0; gap:12px; } .searchbar{ order:3; flex-basis:100%; } .account-btn{ display:none; } }

/* category strip under header */
.catbar{ background:var(--card); border-top:1px solid var(--line); }
.catbar .wrap{ display:flex; gap:26px; overflow-x:auto; padding:12px 18px; scrollbar-width:none; }
.catbar .wrap::-webkit-scrollbar{ display:none; }
.catbar a{ font-size:.86rem; font-weight:600; color:var(--muted); white-space:nowrap; padding:5px 2px; border-bottom:2px solid transparent; transition:color .2s, border-color .2s; }
.catbar a:hover, .catbar a.active{ color:var(--navy); border-color:var(--gold); }

/* ---------- Marquee sale ribbon ---------- */
.marquee{ background:linear-gradient(90deg,var(--gold),var(--navy-2) 130%); overflow:hidden; position:relative; }
.marquee-track{ display:flex; width:max-content; animation:marquee-scroll 26s linear infinite; }
.marquee-set{ display:flex; flex-shrink:0; }
.marquee-item{ display:inline-flex; align-items:center; gap:9px; padding:9px 30px; color:#fff; font-size:.78rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; white-space:nowrap; }
.marquee-item .pct{ width:19px; height:19px; border-radius:50%; background:rgba(255,255,255,.24); display:inline-flex; align-items:center; justify-content:center; font-size:.6rem; font-weight:800; flex-shrink:0; }
@keyframes marquee-scroll{ 0%{ transform:translateX(0); } 100%{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){ .marquee-track{ animation:none; } }

/* ---------- Shop by category (circles) ---------- */
.cat-circles{ padding:20px 0 4px; }
.cat-circles-head{ text-align:center; margin-bottom:16px; }
.cat-circles-head h2{ font-size:1.05rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--navy); }
.cat-circles-row{ display:flex; gap:16px; overflow-x:auto; padding:4px 34px 14px 4px; scrollbar-width:none; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; }
.cat-circles-row::-webkit-scrollbar{ display:none; }
.cat-circles-wrap{ position:relative; }
.cat-circles-wrap::after{ content:''; position:absolute; top:0; right:0; bottom:14px; width:38px; pointer-events:none; background:linear-gradient(to right, rgba(0,0,0,0), var(--bg)); }
.cat-circle{ display:flex; flex-direction:column; align-items:center; gap:8px; background:none; border:none; flex-shrink:0; width:72px; scroll-snap-align:start; }
.cat-circle .ring{ width:62px; height:62px; border-radius:50%; background:linear-gradient(160deg,#ffffff,#f1efef); border:1.5px solid var(--line); display:flex; align-items:center; justify-content:center; color:var(--gold); transition:border-color .2s, transform .18s, box-shadow .2s; box-shadow:var(--shadow-sm); }
.cat-circle:hover .ring{ border-color:var(--gold); transform:translateY(-3px); box-shadow:var(--shadow-md); }
.cat-circle span{ font-size:.68rem; font-weight:600; color:var(--ink); text-align:center; line-height:1.2; }
.cat-circle.active .ring{ border-color:var(--gold); background:linear-gradient(160deg,var(--gold),var(--gold-2)); color:#fff; }

.btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:13px 26px; font-weight:700; font-size:.9rem; border-radius:999px; border:2px solid transparent; transition:transform .15s, background .2s, color .2s, border-color .2s, box-shadow .2s; white-space:nowrap; }
.btn:active{ transform:scale(.97); }
.btn-gold{ background:var(--gold); color:var(--navy); }
.btn-gold:hover{ background:var(--gold-2); box-shadow:0 8px 24px rgba(0,174,184,.35); }
.btn-ghost{ background:transparent; color:var(--navy); border-color:var(--line); }
.btn-ghost:hover{ border-color:var(--gold); color:var(--navy-2); background:var(--bg); }
.btn-navy{ background:var(--navy); color:#fff; }
.btn-navy:hover{ background:var(--navy-2); }
.btn-block{ width:100%; }
.btn-lg{ padding:15px 30px; font-size:.98rem; }

/* ---------- Trust strip ---------- */

/* ---------- Section heading ---------- */
.section{ padding:30px 0; }
.sec-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:18px; }
.sec-head h2{ font-size:clamp(1.3rem,2.4vw,1.7rem); font-weight:700; display:flex; align-items:center; gap:11px; }
.sec-head h2 .bar{ width:5px; height:24px; background:var(--gold); border-radius:3px; }
.sec-head p{ margin:4px 0 0; color:var(--muted); font-size:.9rem; }

/* filter tabs */
.cat-tabs{ display:flex; gap:9px; overflow-x:auto; padding-bottom:6px; margin-bottom:18px; scrollbar-width:none; }
.cat-tabs::-webkit-scrollbar{ display:none; }
.cat-tabs button{ background:var(--card); border:1.5px solid var(--line); color:var(--muted); padding:9px 18px; border-radius:999px; font-size:.85rem; font-weight:600; white-space:nowrap; transition:all .18s; }
.cat-tabs button:hover{ border-color:var(--gold); color:var(--navy); }
.cat-tabs button.active{ background:var(--navy); border-color:var(--navy); color:#fff; }

/* ---------- Product grid ---------- */
.product-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
@media(min-width:560px){ .product-grid{ grid-template-columns:repeat(3,1fr); } }
@media(min-width:840px){ .product-grid{ grid-template-columns:repeat(4,1fr); } }
@media(min-width:1080px){ .product-grid{ grid-template-columns:repeat(5,1fr); gap:16px; } }

.pcard{ background:var(--card); border-radius:var(--radius-sm); overflow:hidden; box-shadow:var(--shadow-sm); cursor:pointer; display:flex; flex-direction:column; transition:transform .18s, box-shadow .2s; border:1px solid var(--line); }
.pcard:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:transparent; }
.pcard-img{ position:relative; aspect-ratio:1/1; background:#f7f7f8; overflow:hidden; }
.pcard-img img{ width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.pcard:hover .pcard-img img{ transform:scale(1.06); }
.badge-disc{ position:absolute; top:9px; left:9px; background:var(--gold); color:#fff; font-size:.72rem; font-weight:700; padding:3px 8px; border-radius:7px; box-shadow:0 2px 6px rgba(0,0,0,.35); }
.badge-tag{ position:absolute; top:9px; right:9px; background:rgba(15,27,46,.9); color:var(--gold-2); font-size:.66rem; font-weight:700; padding:4px 9px; border-radius:999px; letter-spacing:.04em; }
.wish{ position:absolute; bottom:9px; right:9px; width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.92); border:none; color:var(--muted); display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow-sm); opacity:.9; transition:all .2s; }
.wish:hover{ opacity:1; transform:translateY(-1px); }
.wish.on{ color:var(--deal); opacity:1; }
.wish.on svg{ animation:wishPop .28s ease; }
@keyframes wishPop{ 0%{ transform:scale(.7); } 60%{ transform:scale(1.2); } 100%{ transform:scale(1); } }

/* ---------- Account modal: login/signup tabs + liked products grid ---------- */
.acc-tabs{ display:flex; gap:8px; margin-bottom:18px; background:var(--bg); border-radius:11px; padding:4px; }
.acc-tab{ flex:1; border:none; background:none; padding:10px 8px; border-radius:8px; font-weight:700; font-size:.85rem; color:var(--muted); transition:background .2s, color .2s; }
.acc-tab.active{ background:var(--card); color:var(--navy); box-shadow:var(--shadow-sm); }
.acc-pane{ display:none; }
.acc-pane.show{ display:block; }
.like-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; max-height:52vh; overflow-y:auto; padding-right:2px; }
@media(min-width:500px){ .like-grid{ grid-template-columns:repeat(3,1fr); } }
.account-btn.logged-in{ color:var(--gold); }
.pcard-body{ padding:12px 13px 14px; display:flex; flex-direction:column; gap:7px; flex:1; }
.pcard-name{ font-family:'Plus Jakarta Sans',sans-serif; font-weight:600; font-size:.9rem; color:var(--ink); line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.4em; }
.pcard-price{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.pcard-price .now{ font-family:'Sora',sans-serif; font-weight:700; font-size:1.06rem; color:var(--navy); }
.pcard-price .was{ font-size:.8rem; color:var(--muted-2); text-decoration:line-through; }
.pcard-meta{ display:flex; align-items:center; gap:8px; font-size:.75rem; color:var(--muted); margin-top:-1px; }
.rating{ display:inline-flex; align-items:center; gap:3px; color:var(--star); font-weight:600; }
.rating .num{ color:var(--ink); }
.pcard-meta .sep{ color:var(--line); }
.pcard-add{ margin-top:auto; display:flex; align-items:center; justify-content:center; gap:7px; background:var(--accent); color:#fff; border:none; border-radius:9px; padding:10px; font-weight:700; font-size:.84rem; transition:background .2s, transform .12s; }
.pcard-add:hover{ background:var(--gold-2); }
.pcard-add:active{ transform:scale(.97); }

/* skeleton */
.sk{ background:var(--card); border-radius:var(--radius-sm); overflow:hidden; border:1px solid var(--line); }
.sk .ln, .sk .box{ background:linear-gradient(90deg,#eee 25%,#f6f6f6 37%,#eee 63%); background-size:400% 100%; animation:sh 1.3s infinite; }
.sk .box{ aspect-ratio:1/1; }
.sk .pad{ padding:12px 13px; display:flex; flex-direction:column; gap:9px; }
.sk .ln{ height:11px; border-radius:5px; }
.sk .ln.w70{ width:70%; } .sk .ln.w40{ width:40%; } .sk .ln.w90{ width:90%; }
@keyframes sh{ 0%{ background-position:100% 0; } 100%{ background-position:-100% 0; } }

.empty{ grid-column:1/-1; text-align:center; padding:70px 20px; color:var(--muted); }
.empty svg{ margin:0 auto 14px; color:var(--muted-2); }
.empty b{ display:block; font-family:'Sora',sans-serif; color:var(--navy); font-size:1.05rem; margin-bottom:5px; }

/* ---------- Payment / trust section ---------- */
.payment-sec{ background:var(--card); border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin-top:16px; }
.pay-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:6px; }
.pay-card{ border:1.5px solid var(--line); border-radius:var(--radius-sm); padding:18px; background:var(--bg); transition:border-color .2s, transform .15s; }
.pay-card:hover{ border-color:var(--gold); transform:translateY(-2px); }
.pay-card h4{ font-size:.95rem; color:var(--navy); margin-bottom:9px; display:flex; align-items:center; gap:8px; }
.pay-card .badge-m{ font-size:.6rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; background:var(--ok-soft); color:var(--ok); padding:2px 7px; border-radius:5px; }
.pay-number{ font-family:'Sora',sans-serif; font-weight:700; color:var(--ink); font-size:1.02rem; letter-spacing:.02em; }
.pay-name{ font-size:.78rem; color:var(--muted); margin-top:3px; }
@media(max-width:820px){ .pay-grid{ grid-template-columns:1fr 1fr; } }

/* ---------- Footer ---------- */
.footer{ background:var(--navy); color:rgba(255,255,255,.72); margin-top:20px; padding:48px 0 26px; }
.foot-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:34px; }
.footer .brand-txt b{ color:#fff; } .footer .brand-txt span{ color:var(--gold); }
.footer p{ font-size:.86rem; margin:14px 0 0; max-width:320px; }
.foot-col h5{ font-family:'Sora',sans-serif; color:#fff; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; margin:0 0 14px; }
.foot-col a, .foot-col div{ display:block; font-size:.86rem; color:rgba(255,255,255,.68); padding:5px 0; transition:color .2s; }
.foot-col a:hover{ color:var(--gold-2); }
.foot-bottom{ border-top:1px solid rgba(255,255,255,.12); margin-top:34px; padding-top:18px; display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; font-size:.78rem; color:rgba(255,255,255,.5); }
@media(max-width:760px){ .foot-grid{ grid-template-columns:1fr 1fr; } .footer{ padding-bottom:90px; } }

/* ---------- Bottom nav (mobile) ---------- */
.botnav{ display:none; position:fixed; bottom:0; left:0; right:0; z-index:70; background:var(--card); border-top:1px solid var(--line); box-shadow:0 -4px 20px rgba(19,34,77,.08); padding-bottom:env(safe-area-inset-bottom); }
.botnav-inner{ display:grid; grid-template-columns:repeat(5,1fr); }
.botnav button{ background:none; border:none; padding:9px 0 8px; display:flex; flex-direction:column; align-items:center; gap:3px; color:var(--muted); font-size:.64rem; font-weight:600; position:relative; }
.botnav button.active{ color:var(--gold); }
.botnav .bn-count{ position:absolute; top:4px; right:calc(50% - 20px); min-width:16px; height:16px; padding:0 4px; background:var(--deal); color:#fff; font-size:.6rem; font-weight:700; border-radius:999px; display:flex; align-items:center; justify-content:center; }
.botnav .bn-count[data-n="0"]{ display:none; }
@media(max-width:760px){ .botnav{ display:block; } body{ padding-bottom:0; } }

/* ---------- Drawer / cart ---------- */
.overlay{ position:fixed; inset:0; background:rgba(0,0,0,.65); backdrop-filter:blur(2px); opacity:0; visibility:hidden; transition:opacity .25s, visibility .25s; z-index:100; }
.overlay.open{ opacity:1; visibility:visible; }
.drawer{ position:fixed; top:0; right:0; height:100%; width:min(420px,100%); background:var(--bg); z-index:101; transform:translateX(100%); transition:transform .3s cubic-bezier(.4,0,.2,1); display:flex; flex-direction:column; box-shadow:var(--shadow-lg); }
.drawer.open{ transform:none; }
.drawer-head{ background:var(--card); padding:18px 20px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.drawer-head h3{ font-size:1.1rem; display:flex; align-items:center; gap:9px; }
.drawer-body{ flex:1; overflow-y:auto; padding:16px 16px 8px; }
.drawer-foot{ background:var(--card); border-top:1px solid var(--line); padding:16px 18px 18px; }
.close-x{ background:var(--bg); border:none; width:38px; height:38px; border-radius:10px; color:var(--navy); display:flex; align-items:center; justify-content:center; transition:background .2s; }
.close-x:hover{ background:var(--line); }

.citem{ background:var(--card); border-radius:12px; padding:11px; display:flex; gap:12px; margin-bottom:11px; box-shadow:var(--shadow-sm); }
.citem img{ width:70px; height:70px; border-radius:9px; object-fit:cover; flex-shrink:0; background:#f2f2f2; }
.citem-info{ flex:1; min-width:0; }
.citem-info h4{ font-family:'Plus Jakarta Sans',sans-serif; font-weight:600; font-size:.85rem; line-height:1.3; margin-bottom:3px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.citem-info .csize{ font-size:.72rem; color:var(--muted); }
.citem-info .cprice{ font-family:'Sora',sans-serif; font-weight:700; color:var(--deal); font-size:.95rem; margin-top:4px; }
.citem-bottom{ display:flex; align-items:center; justify-content:space-between; margin-top:7px; }
.stepper{ display:inline-flex; align-items:center; border:1.5px solid var(--line); border-radius:8px; overflow:hidden; }
.stepper button{ width:28px; height:28px; background:var(--card); border:none; color:var(--navy); font-size:1rem; display:flex; align-items:center; justify-content:center; }
.stepper button:hover{ background:var(--bg); }
.stepper span{ min-width:30px; text-align:center; font-weight:600; font-size:.85rem; }
.link-del{ background:none; border:none; color:var(--muted-2); font-size:.76rem; display:inline-flex; align-items:center; gap:5px; padding:4px; }
.link-del:hover{ color:var(--deal); }

.cart-empty{ text-align:center; padding:60px 24px; color:var(--muted); }
.cart-empty svg{ margin:0 auto 16px; color:var(--muted-2); }
.cart-empty b{ display:block; font-family:'Sora',sans-serif; color:var(--navy); margin-bottom:6px; }
.coupon-box{ margin:14px 0; }
.coupon-row{ display:flex; gap:8px; }
.coupon-row input{ flex:1; padding:10px 12px; border:1px solid var(--line); border-radius:9px; font-size:.85rem; text-transform:uppercase; }
.coupon-row .btn{ padding:10px 16px; font-size:.85rem; white-space:nowrap; }
.coupon-msg{ display:none; font-size:.8rem; margin-top:6px; }
.coupon-msg.show{ display:block; }
.coupon-msg.ok{ color:#1a8a4a; }
.coupon-msg.err{ color:#c0392b; }
.pd-reviews{ margin-top:26px; padding-top:20px; border-top:1px solid var(--line); }
.pd-reviews h4{ font-size:.92rem; font-weight:700; margin-bottom:12px; }
.rv-summary{ display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.rv-summary .rv-avg{ font-size:1.6rem; font-weight:700; color:var(--navy); font-family:'Sora',sans-serif; }
.rv-stars{ color:var(--star); display:inline-flex; gap:2px; }
.rv-stars svg{ width:15px; height:15px; }
.rv-item{ padding:12px 0; border-bottom:1px solid var(--line); }
.rv-item .rv-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.rv-item .rv-name{ font-weight:600; font-size:.85rem; }
.rv-item .rv-date{ font-size:.72rem; color:var(--muted); }
.rv-item p{ font-size:.85rem; color:var(--ink); margin-top:4px; }
.rv-form{ margin-top:16px; padding:14px; background:var(--bg); border-radius:10px; }
.rv-form .frow{ margin-bottom:10px; }
.rv-star-pick{ display:flex; gap:4px; cursor:pointer; }
.rv-star-pick svg{ width:22px; height:22px; cursor:pointer; }
.product-row{ display:flex; gap:14px; overflow-x:auto; padding:6px 2px 14px; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; }
.product-row::-webkit-scrollbar{ height:6px; }
.product-row::-webkit-scrollbar-thumb{ background:var(--line); border-radius:6px; }
.product-row .pcard{ flex:0 0 200px; scroll-snap-align:start; }
.prow-sec{ margin-top:10px; }
.search-suggest{ display:none; position:absolute; top:calc(100% + 6px); left:0; right:0; background:var(--card); border:1px solid var(--line); border-radius:12px; box-shadow:0 16px 40px rgba(0,0,0,.5); z-index:60; max-height:360px; overflow-y:auto; }
.search-suggest.show{ display:block; }
.ss-item{ display:flex; align-items:center; gap:10px; padding:9px 12px; cursor:pointer; }
.ss-item:hover{ background:var(--bg); }
.ss-item img{ width:38px; height:38px; object-fit:cover; border-radius:7px; flex-shrink:0; }
.ss-item b{ display:block; font-size:.82rem; font-weight:600; }
.ss-item span{ font-size:.76rem; color:var(--muted); }
.ss-empty{ padding:14px; text-align:center; color:var(--muted); font-size:.82rem; }
.pd-related{ margin-top:26px; padding-top:20px; border-top:1px solid var(--line); }
.pd-related h4{ font-size:.92rem; font-weight:700; margin-bottom:12px; }
.google-btn{ display:flex; align-items:center; justify-content:center; background:#fff; border:1.5px solid var(--line); color:#1f1f1f; font-weight:600; }
.google-btn:hover{ background:#f2f2f2; }
.or-divider{ display:flex; align-items:center; text-align:center; color:var(--muted); font-size:.76rem; margin:14px 0; }
.or-divider::before,.or-divider::after{ content:''; flex:1; height:1px; background:var(--line); }
.or-divider span{ padding:0 10px; }
.hero-banner{ position:relative; border-radius:18px; overflow:hidden; margin:16px 0 6px; min-height:220px; background:linear-gradient(120deg,#B3121B,#7A0C13); border:1px solid var(--line); }
.hero-slide{ position:absolute; inset:0; display:none; align-items:center; background-size:cover; background-position:center; }
.hero-slide.active{ display:flex; position:relative; }
.hero-slide img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.hero-slide::after{ content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(0,0,0,.78),rgba(0,0,0,.22)); z-index:1; }
.hero-text{ position:relative; z-index:2; padding:36px 40px; max-width:520px; color:#fff; }
.hero-kicker{ font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:#D6272C; font-weight:700; }
.hero-text h2{ font-family:'Sora',sans-serif; font-size:1.9rem; margin:8px 0 10px; }
.hero-text p{ font-size:.92rem; opacity:.9; margin-bottom:18px; }
.hero-dots{ position:absolute; bottom:14px; left:50%; transform:translateX(-50%); display:flex; gap:6px; z-index:3; }
.hero-dots button{ width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.5); border:none; padding:0; }
.hero-dots button.active{ background:#fff; width:20px; border-radius:5px; }
@media(max-width:640px){ .hero-banner{ min-height:180px; } .hero-text{ padding:22px; } .hero-text h2{ font-size:1.4rem; } }
.cmp-btn{ position:absolute; left:9px; top:44px; width:30px; height:30px; border-radius:50%; background:rgba(255,255,255,.92); border:none; display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow-sm); color:var(--muted); z-index:2; }
.cmp-btn.on{ background:var(--navy); color:#fff; }
.compare-bar{ position:fixed; left:50%; bottom:18px; transform:translateX(-50%) translateY(120%); display:flex; align-items:center; gap:12px; background:#fff; padding:10px 16px; border-radius:14px; box-shadow:var(--shadow-lg); z-index:90; transition:transform .25s; max-width:94vw; }
.compare-bar.show{ transform:translateX(-50%) translateY(0); }
.cmp-thumbs{ display:flex; gap:6px; }
.cmp-thumb{ position:relative; width:38px; height:38px; }
.cmp-thumb img{ width:38px; height:38px; object-fit:cover; border-radius:7px; }
.cmp-thumb button{ position:absolute; top:-6px; right:-6px; width:16px; height:16px; border-radius:50%; background:#c0392b; color:#fff; border:none; font-size:11px; line-height:1; cursor:pointer; }
.cmp-count{ font-size:.78rem; color:var(--muted); white-space:nowrap; }
.compare-table{ width:100%; border-collapse:collapse; }
.compare-table th,.compare-table td{ border:1px solid var(--line); padding:10px; text-align:center; font-size:.85rem; vertical-align:top; }
.compare-table th{ background:var(--bg); text-align:left; font-weight:600; white-space:nowrap; }
@media print{
  body *{ visibility:hidden; }
  #invoicePrintArea, #invoicePrintArea *{ visibility:visible; }
  #invoicePrintArea{ position:absolute; left:0; top:0; width:100%; }
  .no-print{ display:none !important; }
}
.sumrow{ display:flex; justify-content:space-between; font-size:.88rem; color:var(--muted); margin-bottom:8px; }
.sumrow.total{ color:var(--navy); font-family:'Sora',sans-serif; font-weight:700; font-size:1.15rem; padding-top:12px; margin-top:4px; border-top:1px dashed var(--line); }
.sumrow.total .amt{ color:var(--deal); }

/* ---------- Modal ---------- */
.modal{ position:fixed; inset:0; height:100vh; height:100svh; z-index:110; display:flex; align-items:flex-start; justify-content:center; padding:28px 16px; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; opacity:0; visibility:hidden; transition:opacity .25s, visibility .25s; }
@media(max-width:720px){ .modal{ padding:12px 8px; } }
.modal.open{ opacity:1; visibility:visible; }
.modal-bg{ position:fixed; inset:0; background:rgba(15,27,46,.55); backdrop-filter:none; -webkit-backdrop-filter:none; z-index:0; }
.modal-box{ position:relative; background:var(--card); border:1px solid rgba(214,39,44,.35); border-radius:18px; width:100%; max-width:920px; min-height:80px; box-shadow:var(--shadow-lg), 0 0 0 1px rgba(0,0,0,.4); z-index:10; margin:auto; overflow:hidden; pointer-events:auto; -webkit-transform:translateZ(0); transform:translateZ(0); }
.modal-box.sm{ max-width:460px; }
.modal-close{ position:absolute; top:14px; right:14px; z-index:5; background:rgba(255,255,255,.9); border:none; width:40px; height:40px; border-radius:50%; color:var(--navy); display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow-sm); transition:transform .15s, background .2s; }
.modal-close:hover{ background:#fff; transform:rotate(90deg); }
.modal-pad{ padding:26px 28px 30px; }
@media(max-width:640px){ .modal-pad{ padding:22px 18px 26px; } }

/* product detail */
.pd-grid{ display:grid; grid-template-columns:1fr 1fr; }
@media(max-width:720px){ .pd-grid{ grid-template-columns:1fr; } }
.pd-gallery{ background:#f5f5f6; position:relative; }
.pd-main{ aspect-ratio:1/1; position:relative; overflow:hidden; background:var(--bg); }
/* Mobile: image ko poori screen jitna bara na hone dein — chota/fixed
   rakhein taake price, size aur "Add to Cart" scroll kiye bina jaldi
   nazar aa jayen (laptop wale full-square zoom se bachne ke liye). */
@media(max-width:720px){ .pd-main{ aspect-ratio:auto; height:52vw; max-height:320px; min-height:220px; } }
.pd-main{position:relative;overflow:hidden;background:#fff;}
.pd-main img{ width:100%; height:100%; display:block; object-fit:contain; object-position:center; background:#fff; -webkit-transform:translateZ(0); transform:translateZ(0); -webkit-backface-visibility:hidden; backface-visibility:hidden; }
.pd-nav{ position:absolute; top:50%; transform:translateY(-50%); width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.9); border:none; color:var(--navy); display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow-sm); }
.pd-nav.prev{ left:12px; } .pd-nav.next{ right:12px; }
.pd-dots{ position:absolute; left:0; right:0; bottom:10px; display:flex; align-items:center; justify-content:center; gap:5px; z-index:2; pointer-events:none; }
.pd-dots span{ width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.55); box-shadow:0 1px 3px rgba(0,0,0,.4); transition:width .2s,background .2s; }
.pd-dots span.active{ width:16px; border-radius:4px; background:#fff; }
.pd-thumbs{ display:flex; gap:8px; padding:12px; overflow-x:auto; scrollbar-width:none; }
.pd-thumbs::-webkit-scrollbar{ display:none; }
.pd-thumbs img{ width:56px; height:56px; border-radius:8px; object-fit:cover; border:2px solid transparent; cursor:pointer; flex-shrink:0; }
.pd-thumbs img.active{ border-color:var(--gold); }
.pd-info{ padding:26px 28px; display:flex; flex-direction:column; }
@media(max-width:720px){ .pd-info{ padding:18px 18px 22px; } }
.pd-info .pd-badge{ align-self:flex-start; background:var(--deal-soft); color:var(--deal); font-size:.68rem; font-weight:700; padding:4px 10px; border-radius:6px; text-transform:uppercase; letter-spacing:.06em; margin-bottom:12px; }
.pd-info h2{ font-size:1.4rem; font-weight:700; line-height:1.25; }
.pd-rate{ display:flex; align-items:center; gap:10px; margin:10px 0 14px; font-size:.82rem; color:var(--muted); }
.pd-price{ display:flex; align-items:baseline; gap:12px; margin-bottom:4px; }
.pd-price .now{ font-family:'Sora',sans-serif; font-weight:800; font-size:1.9rem; color:var(--deal); }
.pd-price .was{ text-decoration:line-through; color:var(--muted-2); font-size:1rem; }
.pd-price .off{ background:var(--deal); color:#fff; font-size:.72rem; font-weight:700; padding:3px 8px; border-radius:6px; }
.pd-delivery{ font-size:.8rem; color:var(--muted); margin-bottom:18px; }
.pd-field{ margin-bottom:16px; }
.pd-field > label{ display:block; font-size:.74rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--navy); margin-bottom:8px; }
.size-opts{ display:flex; gap:8px; flex-wrap:wrap; }
.size-opts button{ border:1.5px solid var(--line); background:var(--card); color:var(--ink); padding:8px 15px; border-radius:9px; font-size:.83rem; font-weight:600; transition:all .15s; }
.size-opts button:hover{ border-color:var(--gold); }
.size-opts button.active{ background:var(--navy); border-color:var(--navy); color:#fff; }
.pd-actions{ display:flex; gap:10px; margin-top:auto; padding-top:8px; }
.pd-actions .btn{ flex:1; }
.pd-details{ margin-top:18px; border-top:1px solid var(--line); padding-top:16px; }
.pd-details p{ font-size:.86rem; color:var(--muted); margin:0 0 10px; white-space:pre-line; }
.pd-details ul{ margin:0; padding-left:18px; font-size:.84rem; color:var(--ink); line-height:1.8; }
.pd-details .note{ font-style:italic; font-size:.8rem; color:var(--muted-2); margin-top:10px; }
.pd-share{ background:none; border:none; color:var(--navy); font-size:.82rem; font-weight:600; display:inline-flex; align-items:center; gap:7px; margin-top:14px; padding:6px 0; }
.pd-share:hover{ color:var(--gold); }

/* ---------- Order / checkout form ---------- */
.co-head{ padding:24px 28px 6px; }
.co-head .kicker{ font-size:.7rem; letter-spacing:.24em; text-transform:uppercase; color:var(--gold); font-weight:700; }
.co-head h2{ font-size:1.5rem; margin:6px 0 4px; }
.co-head p{ color:var(--muted); font-size:.9rem; margin:0; }
.co-body{ display:grid; grid-template-columns:1fr 1.15fr; gap:0; }
@media(max-width:760px){ .co-body{ grid-template-columns:1fr; } }
.co-summary{ background:var(--bg); padding:22px 24px; border-right:1px solid var(--line); }
.co-summary h4{ font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); margin-bottom:14px; }
.co-line{ display:flex; gap:11px; margin-bottom:13px; }
.co-line img{ width:52px; height:52px; border-radius:8px; object-fit:cover; flex-shrink:0; background:#eee; }
.co-line .m{ flex:1; min-width:0; }
.co-line h5{ font-family:'Plus Jakarta Sans',sans-serif; font-weight:600; font-size:.82rem; line-height:1.3; margin:0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.co-line small{ font-size:.72rem; color:var(--muted); }
.co-line .lp{ font-family:'Sora',sans-serif; font-weight:700; font-size:.85rem; color:var(--navy); white-space:nowrap; }
.co-form{ padding:22px 26px 26px; position:relative; }
.frow{ margin-bottom:14px; }
.frow label{ display:block; font-size:.76rem; font-weight:700; color:var(--navy); margin-bottom:6px; }
.frow input, .frow textarea, .frow select{ width:100%; padding:11px 13px; border:1.5px solid var(--line); border-radius:10px; font-family:inherit; font-size:.9rem; color:var(--ink); background:var(--card); transition:border-color .2s, box-shadow .2s; }
.frow input:focus, .frow textarea:focus, .frow select:focus{ outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(0,174,184,.14); }
.fgrid2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media(max-width:480px){ .fgrid2{ grid-template-columns:1fr; } }
.pay-choice{ display:grid; gap:9px; }
.pay-opt{ display:flex; align-items:flex-start; gap:11px; border:1.5px solid var(--line); border-radius:11px; padding:13px 14px; cursor:pointer; transition:border-color .2s, background .2s; }
.pay-opt:hover{ border-color:var(--gold); }
.pay-opt input{ margin-top:2px; accent-color:var(--gold); width:auto; }
.pay-opt.sel{ border-color:var(--gold); background:rgba(214,39,44,.12); }
.pay-opt b{ display:block; font-size:.88rem; color:var(--navy); }
.pay-opt span{ font-size:.76rem; color:var(--muted); }
.form-error{ display:none; background:var(--deal-soft); color:var(--deal); font-size:.82rem; padding:11px 13px; border-radius:9px; margin-top:12px; line-height:1.5; }
.form-error.show{ display:block; }
.form-success{ background:var(--ok-soft); color:var(--ok); font-size:.82rem; padding:11px 13px; border-radius:9px; margin-top:12px; line-height:1.5; }

/* ---------- Auth UX: loading buttons, password toggle, inline links ---------- */
.form-link{ background:none; border:none; padding:0; color:var(--navy-2); font-weight:700; font-size:.8rem; text-decoration:underline; text-underline-offset:2px; cursor:pointer; }
.form-link:hover{ color:var(--navy); }

.btn[disabled], .btn.btn-loading{ cursor:not-allowed; opacity:.85; }
.btn-spinner{ width:16px; height:16px; border-radius:50%; border:2.5px solid rgba(255,255,255,.4); border-top-color:#fff; animation:btnspin .7s linear infinite; flex:0 0 auto; }
.google-btn .btn-spinner, .btn-ghost .btn-spinner{ border-color:rgba(8,55,67,.25); border-top-color:var(--navy); }
@keyframes btnspin{ to{ transform:rotate(360deg); } }

.pw-wrap{ position:relative; }
.pw-wrap input{ padding-right:44px; width:100%; }
.pw-toggle{ position:absolute; top:50%; right:6px; transform:translateY(-50%); background:none; border:none; padding:8px; color:var(--muted); display:flex; align-items:center; justify-content:center; border-radius:8px; }
.pw-toggle:hover{ color:var(--navy); background:var(--bg); }
.pw-toggle .ic-eye-off{ display:none; }
.pw-toggle[aria-pressed="true"] .ic-eye{ display:none; }
.pw-toggle[aria-pressed="true"] .ic-eye-off{ display:block; }

.toast.toast-success{ background:var(--ok); }
.toast.toast-error{ background:var(--deal); }
.size-group-label{ display:block; font-size:.8rem; font-weight:700; color:var(--navy); margin:14px 0 8px; }
.size-chip-wrap{ display:flex; flex-wrap:wrap; gap:8px; }
.size-chip{ padding:10px 16px; border:1.5px solid var(--line); border-radius:10px; background:var(--card); font-size:.85rem; font-weight:600; color:var(--ink); cursor:pointer; transition:border-color .2s, background .2s, color .2s; }
.size-chip:hover{ border-color:var(--gold); }
.size-chip.active{ border-color:var(--gold); background:var(--gold); color:#fff; }
.admin-plist-row{ display:flex; align-items:center; gap:10px; border:1.5px solid var(--line); border-radius:10px; padding:8px 10px; flex-wrap:wrap; }
.admin-plist-actions{ display:flex; gap:8px; }

.success{ display:none; text-align:center; padding:20px 10px; }
.success.show{ display:block; }
.success .check{ width:64px; height:64px; border-radius:50%; background:var(--ok-soft); color:var(--ok); display:flex; align-items:center; justify-content:center; margin:0 auto 16px; }
.success h3{ font-size:1.3rem; }
.success p{ color:var(--muted); font-size:.9rem; margin-top:8px; }
.total-pill{ display:inline-flex; align-items:center; gap:9px; background:var(--bg); border:1px solid var(--line); border-radius:10px; padding:11px 18px; margin-top:16px; font-family:'Sora',sans-serif; font-weight:700; color:var(--navy); }
.total-pill .amt{ color:var(--deal); }

.toast{ position:fixed; bottom:82px; left:50%; transform:translateX(-50%) translateY(20px); background:var(--navy); color:#fff; padding:12px 20px; border-radius:999px; font-size:.86rem; font-weight:600; box-shadow:var(--shadow-lg); z-index:200; opacity:0; visibility:hidden; transition:all .3s; display:flex; align-items:center; gap:9px; }
.toast.show{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.toast svg{ color:var(--gold-2); }
@media(min-width:761px){ .toast{ bottom:28px; } }

/* Admin panel tabs + order cards */
.admin-tab.active{ background:var(--navy,#1A1A1A) !important; color:#fff !important; border-color:var(--navy,#1A1A1A) !important; }
.order-card{ background:#fafafa; }

/* ---------- Dark theme text-contrast overrides ---------- */
h1,h2,h3,h4,
.policy-nav-links a.active, .policy-nav-links a:hover,
.brand-txt b, .icon-btn, .catbar a:hover, .catbar a.active,
.cat-circles-head h2, .btn-ghost, .cat-tabs button:hover,
.acc-tab.active, .pcard-price .now, .empty b, .pay-card h4,
.close-x, .stepper button, .cart-empty b, .rv-summary .rv-avg,
.pd-field > label, .pd-share, .co-line .lp, .frow label,
.pay-opt b, .form-link:hover, .pw-toggle:hover,
.size-group-label, .total-pill{
  color:var(--ink);
}
.btn-ghost:hover{ color:var(--gold); background:var(--navy); }
::selection{ background:var(--gold); color:#fff; }
.google-btn .btn-spinner, .btn-ghost .btn-spinner{ border-color:rgba(26,26,26,.2); border-top-color:var(--ink); }

/* subtle warm glow + gold hairline accents to match a premium dark aesthetic */
body{ background:radial-gradient(1100px 600px at 50% -10%, #FDE9EA 0%, var(--bg) 55%) fixed; }
.header{ border-bottom:1px solid var(--line); }
.hero-slide .hero-text .hero-kicker{ letter-spacing:.3em; text-transform:uppercase; color:var(--gold); font-weight:700; font-size:.72rem; }
.hero-slide .hero-text h2{ color:#fff; font-family:'Sora',sans-serif; font-weight:800; letter-spacing:-.01em; }
.hero-slide .hero-text p{ color:rgba(244,239,228,.75); }
.pcard{ background:var(--card); }
.pcard-img{ background:#F2F2F2; }