/* ============================================
   LASER WORLD KARAOKE — Complete Redesign
   Dark theme + neon accents for karaoke niche
   ============================================ */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:'Inter',sans-serif;background:#0a0a0f;color:#b8b8c8;line-height:1.6;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{font-family:inherit;font-size:inherit}
ul,ol{list-style:none}

:root{
  --bg:#0a0a0f;--surface:#13131c;--surface-2:#1a1a28;--surface-3:#20202e;
  --border:#2a2a3e;--border-2:#353550;
  --text:#f5f5fa;--text-2:#b8b8c8;--muted:#7a7a90;
  --accent:#e8148e;--accent-h:#ff1a9e;--accent-fg:#fff;
  --accent2:#00e5ff;--accent2-h:#33ebff;
  --success:#22c55e;--warning:#f59e0b;--error:#ef4444;
  --glow:rgba(232,20,142,.3);--glow2:rgba(0,229,255,.2);
  --font-h:'Poppins',sans-serif;--font-b:'Inter',sans-serif;--font-m:'JetBrains Mono',monospace;
  --r-sm:8px;--r-md:12px;--r-lg:20px;--r-full:9999px;
  --sh-sm:0 2px 8px rgba(0,0,0,.3);--sh-md:0 4px 20px rgba(0,0,0,.4);--sh-lg:0 8px 40px rgba(0,0,0,.5);
  --s-xs:4px;--s-sm:8px;--s-md:16px;--s-lg:24px;--s-xl:40px;--s-2xl:64px;--s-3xl:96px;
  --t-fast:.15s ease;--t-base:.25s ease;--t-slow:.4s ease;
  --max:1280px;
}

.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
:focus-visible{outline:2px solid var(--accent2);outline-offset:2px;border-radius:var(--r-sm)}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

.container{max-width:var(--max);margin:0 auto;padding:0 var(--s-md)}
@media(min-width:768px){.container{padding:0 var(--s-lg)}}
@media(min-width:1024px){.container{padding:0 var(--s-xl)}}

h1,h2,h3,h4,h5,h6{font-family:var(--font-h);color:var(--text);line-height:1.2;font-weight:700}
h1{font-size:clamp(2rem,5vw,3.5rem)}h2{font-size:clamp(1.5rem,4vw,2.5rem)}
h3{font-size:clamp(1.25rem,3vw,1.75rem)}h4{font-size:1.125rem}
p{margin-bottom:var(--s-md)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-sm);padding:12px 28px;font-family:var(--font-h);font-weight:600;font-size:.95rem;border-radius:var(--r-full);transition:all var(--t-base);white-space:nowrap;text-align:center;line-height:1.4}
.btn-primary{background:linear-gradient(135deg,var(--accent),#c00d72);color:var(--accent-fg);box-shadow:0 4px 20px var(--glow)}
.btn-primary:hover{background:linear-gradient(135deg,var(--accent-h),var(--accent));box-shadow:0 6px 30px var(--glow);transform:translateY(-2px)}
.btn-secondary{background:linear-gradient(135deg,var(--accent2),#00b8d4);color:#001a20;box-shadow:0 4px 20px var(--glow2)}
.btn-secondary:hover{transform:translateY(-2px);box-shadow:0 6px 30px var(--glow2)}
.btn-ghost{background:transparent;color:var(--text);border:1px solid var(--border-2)}
.btn-ghost:hover{background:var(--surface-2);border-color:var(--accent)}
.btn-sm{padding:8px 18px;font-size:.85rem}
.btn-lg{padding:16px 40px;font-size:1.05rem}
.btn-block{display:flex;width:100%}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}

/* Badges */
.badge{display:inline-flex;align-items:center;padding:3px 10px;font-size:.75rem;font-weight:600;border-radius:var(--r-full);font-family:var(--font-h)}
.badge-sale{background:var(--accent);color:var(--accent-fg)}
.badge-new{background:var(--accent2);color:#001a20}
.badge-out{background:var(--error);color:#fff}
.badge-count{background:var(--accent);color:var(--accent-fg);min-width:20px;height:20px;border-radius:var(--r-full);font-size:.7rem;display:inline-flex;align-items:center;justify-content:center;padding:0 6px}

/* Announcement */
.announce{background:linear-gradient(90deg,var(--accent),var(--accent2));color:#fff;text-align:center;padding:8px var(--s-md);font-size:.85rem;font-weight:600;font-family:var(--font-h);overflow:hidden}
.announce .sep{margin:0 12px;opacity:.5}

/* Nav */
.nav{position:sticky;top:0;z-index:100;background:rgba(10,10,15,.9);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--s-md);padding:12px var(--s-md);max-width:var(--max);margin:0 auto}
@media(min-width:768px){.nav-inner{padding:12px var(--s-lg)}}
@media(min-width:1024px){.nav-inner{padding:12px var(--s-xl)}}
.nav-logo{font-family:var(--font-h);font-weight:800;font-size:1.3rem;color:var(--text);display:flex;align-items:center;gap:8px;flex-shrink:0}
.nav-logo .lic{width:36px;height:36px;background:linear-gradient(135deg,var(--accent),var(--accent2));border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:1.1rem}
.nav-logo .ltxt{background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.nav-links{display:none;align-items:center;gap:var(--s-lg)}
@media(min-width:1024px){.nav-links{display:flex}}
.nav-links a{color:var(--text-2);font-weight:500;font-size:.95rem;transition:color var(--t-fast);position:relative}
.nav-links a:hover{color:var(--text)}
.nav-links a::after{content:'';position:absolute;bottom:-4px;left:0;width:0;height:2px;background:var(--accent);transition:width var(--t-base)}
.nav-links a:hover::after{width:100%}
.nav-dd{position:relative}
.nav-dd-c{position:absolute;top:100%;left:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);padding:var(--s-sm);min-width:200px;box-shadow:var(--sh-lg);opacity:0;visibility:hidden;transform:translateY(10px);transition:all var(--t-base)}
.nav-dd:hover .nav-dd-c{opacity:1;visibility:visible;transform:translateY(0)}
.nav-dd-c a{display:block;padding:8px 12px;border-radius:var(--r-sm);font-size:.9rem}
.nav-dd-c a:hover{background:var(--surface-2);color:var(--accent)}
.nav-actions{display:flex;align-items:center;gap:var(--s-md)}
.nav-ic{background:none;color:var(--text);padding:6px;display:flex;align-items:center;justify-content:center;transition:color var(--t-fast);position:relative}
.nav-ic:hover{color:var(--accent)}
.nav-ic .badge-count{position:absolute;top:-2px;right:-4px;font-size:.65rem}

/* Search */
.nav-search-w{display:none;position:absolute;top:100%;left:0;right:0;background:var(--surface);border-bottom:1px solid var(--border);padding:var(--s-md) 0;z-index:99}
.nav-search-w.active{display:block}
.nav-search-f{max-width:var(--max);margin:0 auto;padding:0 var(--s-md);display:flex;gap:var(--s-sm)}
.nav-search-i{flex:1;padding:12px 20px;background:var(--surface-2);border:1px solid var(--border-2);border-radius:var(--r-full);color:var(--text);font-size:1rem}
.nav-search-i:focus{border-color:var(--accent);outline:none}
.nav-search-i::placeholder{color:var(--muted)}
.search-res{position:absolute;top:100%;left:50%;transform:translateX(-50%);width:90%;max-width:500px;background:var(--surface-3);border:1px solid var(--border);border-radius:var(--r-md);box-shadow:var(--sh-lg);max-height:400px;overflow-y:auto;display:none}
.search-res.active{display:block}
.search-item{display:flex;align-items:center;gap:var(--s-md);padding:var(--s-sm) var(--s-md);border-bottom:1px solid var(--border);transition:background var(--t-fast)}
.search-item:hover{background:var(--surface-2)}
.search-item img{width:50px;height:50px;border-radius:var(--r-sm);object-fit:cover}
.search-item h4{font-size:.9rem;margin-bottom:2px}
.search-item .p{color:var(--accent);font-weight:600;font-size:.85rem}

/* Mobile menu */
.mm{position:fixed;top:0;right:-100%;width:80%;max-width:360px;height:100vh;background:var(--surface);z-index:200;transition:right var(--t-slow);overflow-y:auto;padding:var(--s-xl) var(--s-lg)}
.mm.active{right:0}
.mm-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:199;opacity:0;visibility:hidden;transition:opacity var(--t-slow)}
.mm-overlay.active{opacity:1;visibility:visible}
.mm-close{position:absolute;top:var(--s-md);right:var(--s-md);font-size:1.5rem;color:var(--text)}
.mm nav{display:flex;flex-direction:column;gap:var(--s-md);margin-top:var(--s-xl)}
.mm nav a{font-family:var(--font-h);font-size:1.1rem;font-weight:600;color:var(--text);padding:var(--s-sm) 0;border-bottom:1px solid var(--border)}
.mm nav a:hover{color:var(--accent)}

/* Hero */
.hero{position:relative;min-height:600px;display:flex;align-items:center;overflow:hidden;background:var(--bg)}
@media(min-width:768px){.hero{min-height:650px}}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg img{width:100%;height:100%;object-fit:cover;opacity:.45}
.hero-ov{position:absolute;inset:0;background:linear-gradient(135deg,rgba(10,10,15,.92) 0%,rgba(10,10,15,.5) 50%,rgba(232,20,142,.12) 100%);z-index:1}
.hero-c{position:relative;z-index:2;padding:var(--s-2xl) 0;max-width:700px}
.hero-eb{display:inline-block;padding:6px 16px;background:rgba(232,20,142,.15);border:1px solid var(--accent);border-radius:var(--r-full);color:var(--accent);font-family:var(--font-h);font-size:.85rem;font-weight:600;margin-bottom:var(--s-md);text-transform:uppercase;letter-spacing:1px}
.hero-t{font-size:clamp(2.5rem,6vw,4.5rem);font-weight:800;line-height:1.05;margin-bottom:var(--s-md);background:linear-gradient(135deg,#fff 0%,var(--accent2) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-s{font-size:clamp(1.1rem,2vw,1.35rem);color:var(--text-2);margin-bottom:var(--s-xl);max-width:560px}
.hero-a{display:flex;flex-wrap:wrap;gap:var(--s-md)}

/* Sections */
.sec{padding:var(--s-2xl) 0}
.sec-alt{background:var(--surface-2)}
.sec-h{text-align:center;margin-bottom:var(--s-xl)}
.sec-t{margin-bottom:var(--s-sm)}
.sec-sub{color:var(--text-2);max-width:600px;margin:0 auto;font-size:1.05rem}
.sec-eb{display:inline-block;color:var(--accent);font-family:var(--font-h);font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:2px;margin-bottom:var(--s-sm)}

/* Grids */
.g2{display:grid;grid-template-columns:1fr;gap:var(--s-lg)}
.g3{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s-md)}
.g4{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s-md)}
@media(min-width:640px){.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(3,1fr)}}
@media(min-width:768px){.g4{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1024px){.g4{grid-template-columns:repeat(4,1fr)}}

/* Product Card */
.pc{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:all var(--t-base);display:flex;flex-direction:column;position:relative}
.pc:hover{border-color:var(--border-2);box-shadow:var(--sh-lg);transform:translateY(-4px)}
.pc-img{position:relative;aspect-ratio:1;overflow:hidden;background:var(--surface-2)}
.pc-img img{width:100%;height:100%;object-fit:cover;transition:transform var(--t-slow)}
.pc:hover .pc-img img{transform:scale(1.05)}
.pc-badges{position:absolute;top:10px;left:10px;display:flex;flex-direction:column;gap:4px;z-index:2}
.pc-body{padding:var(--s-md);display:flex;flex-direction:column;gap:var(--s-sm);flex:1}
.pc-title{font-size:.95rem;font-weight:600;color:var(--text);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.6em}
.pc-title a:hover{color:var(--accent)}
.pc-price-w{display:flex;align-items:center;gap:var(--s-sm);margin-top:auto}
.pc-price{font-family:var(--font-m);font-size:1.1rem;font-weight:700;color:var(--accent)}
.pc-cmp{font-family:var(--font-m);font-size:.9rem;color:var(--muted);text-decoration:line-through}
.pc-atc{width:100%;margin-top:var(--s-sm)}

/* Collection Card */
.cc{position:relative;aspect-ratio:4/3;border-radius:var(--r-lg);overflow:hidden;display:block}
.cc img{width:100%;height:100%;object-fit:cover;transition:transform var(--t-slow)}
.cc:hover img{transform:scale(1.08)}
.cc-ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(10,10,15,.92) 0%,rgba(10,10,15,.3) 60%,transparent 100%);display:flex;flex-direction:column;justify-content:flex-end;padding:var(--s-lg)}
.cc-ov h3{color:#fff;font-size:1.3rem;margin-bottom:4px}
.cc-ov p{color:rgba(255,255,255,.7);font-size:.85rem;margin:0}
.cc-ov .btn{margin-top:var(--s-sm);align-self:flex-start}

/* Blog Card */
.bc{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:all var(--t-base);display:flex;flex-direction:column}
.bc:hover{border-color:var(--border-2);transform:translateY(-4px)}
.bc-img{aspect-ratio:16/9;overflow:hidden}
.bc-img img{width:100%;height:100%;object-fit:cover;transition:transform var(--t-slow)}
.bc:hover .bc-img img{transform:scale(1.05)}
.bc-body{padding:var(--s-lg);display:flex;flex-direction:column;gap:var(--s-sm);flex:1}
.bc-meta{font-size:.8rem;color:var(--muted)}
.bc-title{font-size:1.15rem;line-height:1.3}
.bc-excerpt{font-size:.9rem;color:var(--text-2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bc-read{margin-top:auto;color:var(--accent);font-weight:600;font-size:.9rem}
.bc-read:hover{color:var(--accent-h)}

/* Trust */
.trust{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s-md);padding:var(--s-xl) 0}
@media(min-width:768px){.trust{grid-template-columns:repeat(4,1fr)}}
.trust-item{text-align:center;padding:var(--s-lg);background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md)}
.trust-item .ti{font-size:2rem;margin-bottom:var(--s-sm);color:var(--accent)}
.trust-item h4{font-size:.95rem;margin-bottom:4px}
.trust-item p{font-size:.8rem;color:var(--muted);margin:0}

/* Breadcrumb */
.bc-nav{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-xs);padding:var(--s-md) 0;font-size:.85rem;color:var(--muted)}
.bc-nav a:hover{color:var(--accent)}
.bc-nav .sep{opacity:.5}
.bc-nav .cur{color:var(--text-2)}

/* Product Layout */
.pl{display:grid;grid-template-columns:1fr;gap:var(--s-xl);padding:var(--s-lg) 0}
@media(min-width:768px){.pl{grid-template-columns:1fr 1fr;gap:var(--s-2xl)}}
@media(min-width:1024px){.pl{grid-template-columns:1.1fr .9fr}}

/* Gallery */
.gal{display:flex;flex-direction:column;gap:var(--s-md)}
.gal-main{position:relative;aspect-ratio:1;border-radius:var(--r-lg);overflow:hidden;background:var(--surface);border:1px solid var(--border)}
.gal-main img{width:100%;height:100%;object-fit:cover}
.gal-thumbs{display:flex;gap:var(--s-sm);overflow-x:auto;padding-bottom:var(--s-xs)}
.gal-thumb{width:80px;height:80px;border-radius:var(--r-sm);overflow:hidden;border:2px solid var(--border);cursor:pointer;flex-shrink:0;transition:border-color var(--t-fast)}
.gal-thumb.active{border-color:var(--accent)}
.gal-thumb img{width:100%;height:100%;object-fit:cover}
@media(min-width:768px){.gal-thumb{width:100px;height:100px}}

/* Product Info */
.pinfo{display:flex;flex-direction:column;gap:var(--s-md)}
.pvendor{font-size:.85rem;color:var(--muted);text-transform:uppercase;letter-spacing:1px;font-weight:600}
.ptitle{font-size:clamp(1.5rem,3vw,2rem);line-height:1.2}
.pprice-w{display:flex;align-items:center;gap:var(--s-md);flex-wrap:wrap}
.pprice{font-family:var(--font-m);font-size:1.75rem;font-weight:700;color:var(--accent)}
.pcmp{font-family:var(--font-m);font-size:1.2rem;color:var(--muted);text-decoration:line-through}
.psave{background:var(--success);color:#fff;padding:3px 10px;border-radius:var(--r-full);font-size:.75rem;font-weight:600}

/* Stars */
.stars{display:inline-flex;align-items:center;gap:2px;color:var(--warning);font-size:1rem}
.stars .empty{color:var(--border-2)}
.stars-t{font-size:.85rem;color:var(--muted);margin-left:var(--s-sm)}

/* Options */
.opt-g{margin-bottom:var(--s-md)}
.opt-l{display:block;font-size:.85rem;font-weight:600;color:var(--text);margin-bottom:var(--s-sm);font-family:var(--font-h)}
.opt-btns{display:flex;flex-wrap:wrap;gap:var(--s-sm)}
.opt-btn{padding:8px 18px;background:var(--surface-2);border:1px solid var(--border-2);border-radius:var(--r-sm);color:var(--text-2);font-size:.9rem;font-weight:500;transition:all var(--t-fast)}
.opt-btn:hover{border-color:var(--accent);color:var(--text)}
.opt-btn.active{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}

/* Qty */
.qty{display:inline-flex;align-items:center;border:1px solid var(--border-2);border-radius:var(--r-sm);overflow:hidden}
.qty-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;color:var(--text);font-size:1.2rem;transition:background var(--t-fast)}
.qty-btn:hover{background:var(--surface-2);color:var(--accent)}
.qty-i{width:50px;height:40px;text-align:center;background:var(--surface-2);border:none;border-left:1px solid var(--border-2);border-right:1px solid var(--border-2);color:var(--text);font-family:var(--font-m);font-weight:600}

/* Sticky ATC */
.satc{position:fixed;bottom:0;left:0;right:0;background:rgba(19,19,28,.95);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid var(--border);padding:var(--s-md);z-index:90;transform:translateY(100%);transition:transform var(--t-slow)}
.satc.active{transform:translateY(0)}
.satc-in{max-width:var(--max);margin:0 auto;display:flex;align-items:center;gap:var(--s-md)}
.satc-p{display:flex;align-items:center;gap:var(--s-sm);flex:1;min-width:0}
.satc-p img{width:50px;height:50px;border-radius:var(--r-sm);object-fit:cover;flex-shrink:0}
.satc-p h4{font-size:.85rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.satc-p .p{color:var(--accent);font-weight:700;font-family:var(--font-m)}
@media(max-width:640px){.satc-p h4{display:none}}

/* Accordions */
.acc{border:1px solid var(--border);border-radius:var(--r-md);margin-bottom:var(--s-sm);overflow:hidden}
.acc-h{padding:var(--s-md);display:flex;align-items:center;justify-content:space-between;cursor:pointer;background:var(--surface-2);transition:background var(--t-fast)}
.acc-h:hover{background:var(--surface-3)}
.acc-h h4{font-size:1rem;font-weight:600}
.acc-ic{font-size:1.2rem;color:var(--accent);transition:transform var(--t-base)}
.acc.open .acc-ic{transform:rotate(45deg)}
.acc-b{max-height:0;overflow:hidden;transition:max-height var(--t-slow)}
.acc.open .acc-b{max-height:3000px}
.acc-bi{padding:var(--s-md);color:var(--text-2);line-height:1.7;font-size:.9rem}
.acc-bi h3{color:var(--text);margin:var(--s-md) 0 var(--s-sm);font-size:1rem}
.acc-bi h3:first-child{margin-top:0}
.acc-bi ul{list-style:disc;padding-left:var(--s-lg);margin-bottom:var(--s-md)}
.acc-bi li{margin-bottom:var(--s-xs)}
.acc-bi p{margin-bottom:var(--s-sm)}

/* Cart Drawer */
.cart-ov{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:150;opacity:0;visibility:hidden;transition:opacity var(--t-slow)}
.cart-ov.active{opacity:1;visibility:visible}
.cart-d{position:fixed;top:0;right:-100%;width:90%;max-width:420px;height:100vh;background:var(--surface);z-index:160;transition:right var(--t-slow);display:flex;flex-direction:column;border-left:1px solid var(--border)}
.cart-d.active{right:0}
.cart-dh{display:flex;align-items:center;justify-content:space-between;padding:var(--s-lg);border-bottom:1px solid var(--border)}
.cart-dh h2{font-size:1.25rem;display:flex;align-items:center;gap:var(--s-sm)}
.cart-close{font-size:1.5rem;color:var(--text-2);transition:color var(--t-fast)}
.cart-close:hover{color:var(--accent)}
.cart-lines{flex:1;overflow-y:auto;padding:var(--s-md)}
.cart-item{display:flex;gap:var(--s-md);padding:var(--s-md) 0;border-bottom:1px solid var(--border)}
.cart-item img{width:70px;height:70px;border-radius:var(--r-sm);object-fit:cover;flex-shrink:0}
.cart-item-info{flex:1;min-width:0}
.cart-item-t{font-size:.9rem;font-weight:600;color:var(--text);margin-bottom:2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cart-item-v{font-size:.8rem;color:var(--muted);margin-bottom:var(--s-sm)}
.cart-item-p{font-family:var(--font-m);color:var(--accent);font-weight:600;font-size:.9rem}
.cart-item-c{display:flex;align-items:center;gap:var(--s-sm);margin-top:var(--s-sm)}
.cart-item-r{font-size:.8rem;color:var(--muted);transition:color var(--t-fast);margin-left:auto}
.cart-item-r:hover{color:var(--error)}
.cart-empty{text-align:center;padding:var(--s-2xl) var(--s-md);color:var(--muted)}
.cart-empty .cei{font-size:3rem;margin-bottom:var(--s-md)}
.cart-foot{padding:var(--s-lg);border-top:1px solid var(--border)}
.cart-sub{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--s-sm)}
.cart-sub strong{font-family:var(--font-m);font-size:1.3rem;color:var(--accent)}
.cart-note{font-size:.8rem;color:var(--muted);margin-bottom:var(--s-md)}
.cart-foot .btn{margin-bottom:var(--s-sm)}

/* Toast */
.toast{position:fixed;bottom:var(--s-xl);left:50%;transform:translateX(-50%) translateY(100px);background:var(--surface-3);border:1px solid var(--border);border-radius:var(--r-md);padding:var(--s-md) var(--s-lg);box-shadow:var(--sh-lg);z-index:300;opacity:0;transition:all var(--t-slow);font-weight:500;font-size:.9rem;display:flex;align-items:center;gap:var(--s-sm)}
.toast.show{transform:translateX(-50%) translateY(0);opacity:1}
.toast-success{border-color:var(--success)}
.toast-error{border-color:var(--error)}

/* Pagination */
.pag{display:flex;align-items:center;justify-content:center;gap:var(--s-xs);padding:var(--s-xl) 0}
.pag-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text-2);font-weight:600;transition:all var(--t-fast)}
.pag-btn:hover{border-color:var(--accent);color:var(--accent)}
.pag-btn.active{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
.pag-btn:disabled{opacity:.4;cursor:not-allowed}

/* Availability */
.avail{display:flex;align-items:center;gap:var(--s-sm);font-size:.85rem;font-weight:500}
.avail.in{color:var(--success)}
.avail.out{color:var(--error)}

/* Sort */
.sortbar{display:flex;align-items:center;justify-content:space-between;gap:var(--s-md);padding:var(--s-md) 0;flex-wrap:wrap}
.sortbar select{padding:8px 16px;background:var(--surface-2);border:1px solid var(--border-2);border-radius:var(--r-sm);color:var(--text);font-size:.9rem}
.sortbar select:focus{border-color:var(--accent);outline:none}
.sortbar .count{font-size:.85rem;color:var(--muted)}

/* Footer */
.footer{background:var(--surface);border-top:1px solid var(--border);padding:var(--s-2xl) 0 var(--s-lg)}
.footer-grid{display:grid;grid-template-columns:1fr;gap:var(--s-xl);margin-bottom:var(--s-xl)}
@media(min-width:640px){.footer-grid{grid-template-columns:1fr 1fr}}
@media(min-width:768px){.footer-grid{grid-template-columns:2fr 1fr 1fr 1fr}}
.footer-col h4{font-size:1rem;margin-bottom:var(--s-md);color:var(--text)}
.footer-col ul li{margin-bottom:var(--s-sm)}
.footer-col ul li a{color:var(--text-2);font-size:.9rem;transition:color var(--t-fast)}
.footer-col ul li a:hover{color:var(--accent)}
.footer-logo{font-family:var(--font-h);font-weight:800;font-size:1.3rem;margin-bottom:var(--s-md);display:flex;align-items:center;gap:8px}
.footer-logo .lic{width:36px;height:36px;background:linear-gradient(135deg,var(--accent),var(--accent2));border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:1.1rem}
.footer-logo .ltxt{background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.footer-about{font-size:.9rem;color:var(--text-2);margin-bottom:var(--s-md);max-width:300px}
.footer-contact{font-size:.85rem;color:var(--muted);line-height:1.8}
.footer-contact a:hover{color:var(--accent)}
.social{display:flex;gap:var(--s-sm)}
.social a{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text-2);transition:all var(--t-fast)}
.social a:hover{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
.footer-bottom{border-top:1px solid var(--border);padding-top:var(--s-lg);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-md)}
.footer-bottom p{font-size:.85rem;color:var(--muted);margin:0}
.footer-pay{display:flex;gap:var(--s-sm);font-size:1.5rem;color:var(--muted)}

/* 404 */
.err-p{text-align:center;padding:var(--s-3xl) 0}
.err-code{font-size:clamp(5rem,15vw,10rem);font-weight:800;font-family:var(--font-h);background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1}

/* Cart page */
.cp{padding:var(--s-xl) 0}
.cp-item{display:grid;grid-template-columns:80px 1fr auto;gap:var(--s-md);padding:var(--s-lg) 0;border-bottom:1px solid var(--border);align-items:center}
@media(min-width:768px){.cp-item{grid-template-columns:100px 2fr 1fr 1fr auto}}
.cp-item img{width:80px;height:80px;border-radius:var(--r-sm);object-fit:cover}
.cp-item h4{font-size:.95rem;margin-bottom:4px}
.cp-item .v{font-size:.8rem;color:var(--muted)}
.cp-item .pr{font-family:var(--font-m);font-weight:600;color:var(--accent)}
.cp-item .rm{color:var(--muted);font-size:1.2rem;transition:color var(--t-fast)}
.cp-item .rm:hover{color:var(--error)}
.cp-sum{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s-xl);margin-top:var(--s-xl)}
.cp-sum h3{margin-bottom:var(--s-md)}
.cp-row{display:flex;justify-content:space-between;padding:var(--s-sm) 0;font-size:.95rem}
.cp-row.total{border-top:1px solid var(--border);margin-top:var(--s-sm);padding-top:var(--s-md);font-size:1.2rem;font-weight:700}
.cp-row.total strong{color:var(--accent);font-family:var(--font-m)}
.cp-layout{display:grid;grid-template-columns:1fr;gap:var(--s-xl)}
@media(min-width:1024px){.cp-layout{grid-template-columns:2fr 1fr}.cp-sum{margin-top:0}}

/* Checkout */
.co{padding:var(--s-xl) 0}
.co-layout{display:grid;grid-template-columns:1fr;gap:var(--s-xl)}
@media(min-width:1024px){.co-layout{grid-template-columns:1.5fr 1fr}}
.co-sec{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s-xl);margin-bottom:var(--s-lg)}
.co-sec h3{margin-bottom:var(--s-lg);display:flex;align-items:center;gap:var(--s-sm)}
.co-sec h3 .sn{width:28px;height:28px;background:var(--accent);color:var(--accent-fg);border-radius:var(--r-full);display:flex;align-items:center;justify-content:center;font-size:.85rem}
.fg{display:grid;grid-template-columns:1fr;gap:var(--s-md)}
@media(min-width:640px){.fg{grid-template-columns:1fr 1fr}}
.ff{display:flex;flex-direction:column;gap:var(--s-xs)}
.ff.full{grid-column:1/-1}
.ff label{font-size:.85rem;font-weight:600;color:var(--text);font-family:var(--font-h)}
.ff input,.ff select,.ff textarea{padding:12px 16px;background:var(--surface-2);border:1px solid var(--border-2);border-radius:var(--r-sm);color:var(--text);font-size:.95rem;transition:border-color var(--t-fast)}
.ff input:focus,.ff select:focus,.ff textarea:focus{border-color:var(--accent);outline:none}
.ff input::placeholder{color:var(--muted)}
.co-sum{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s-xl);position:sticky;top:80px}
.co-sum h3{margin-bottom:var(--s-lg)}
.co-si{display:flex;gap:var(--s-sm);padding:var(--s-sm) 0;border-bottom:1px solid var(--border)}
.co-si img{width:50px;height:50px;border-radius:var(--r-sm);object-fit:cover}
.co-si-info{flex:1;min-width:0}
.co-si-info h4{font-size:.85rem;margin-bottom:2px}
.co-si-info .q{font-size:.75rem;color:var(--muted)}
.co-si .pr{font-family:var(--font-m);font-weight:600;color:var(--accent);font-size:.85rem}
.co-tot{margin-top:var(--s-md)}
.co-tot .row{display:flex;justify-content:space-between;padding:var(--s-xs) 0;font-size:.9rem}
.co-tot .row.total{border-top:1px solid var(--border);margin-top:var(--s-sm);padding-top:var(--s-md);font-size:1.2rem;font-weight:700}
.co-tot .row.total strong{color:var(--accent);font-family:var(--font-m)}
.pay-methods{display:flex;gap:var(--s-sm);margin-bottom:var(--s-md)}
.pay-m{flex:1;padding:var(--s-md);border:2px solid var(--border-2);border-radius:var(--r-md);text-align:center;cursor:pointer;transition:border-color var(--t-fast)}
.pay-m.active{border-color:var(--accent);background:rgba(232,20,142,.05)}
.pay-m h4{font-size:.85rem;margin-bottom:2px}
.pay-m p{font-size:.75rem;color:var(--muted);margin:0}
.co-trust{display:flex;align-items:center;gap:var(--s-sm);justify-content:center;padding:var(--s-md);font-size:.8rem;color:var(--muted)}

/* Thank You */
.ty-p{text-align:center;padding:var(--s-3xl) 0}
.ty-ic{width:100px;height:100px;margin:0 auto var(--s-lg);background:linear-gradient(135deg,var(--success),#16a34a);border-radius:var(--r-full);display:flex;align-items:center;justify-content:center;font-size:3rem;color:#fff}
.ty-d{max-width:600px;margin:0 auto;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s-xl);text-align:left}
.ty-d h3{margin-bottom:var(--s-md)}
.ty-d .dr{display:flex;justify-content:space-between;padding:var(--s-sm) 0;border-bottom:1px solid var(--border)}
.ty-d .dr:last-child{border-bottom:none}
.ty-d .dr strong{color:var(--text)}

/* Policy */
.pol-p{padding:var(--s-xl) 0}
.pol-layout{display:grid;grid-template-columns:1fr;gap:var(--s-xl)}
@media(min-width:768px){.pol-layout{grid-template-columns:1fr 250px}}
.pol-c{color:var(--text-2);line-height:1.8}
.pol-c h1{color:var(--text);margin-bottom:var(--s-md)}
.pol-c h2{color:var(--text);margin:var(--s-lg) 0 var(--s-sm);font-size:1.25rem}
.pol-c h3{color:var(--text);margin:var(--s-md) 0 var(--s-sm);font-size:1.05rem}
.pol-c p{margin-bottom:var(--s-md)}
.pol-c ul{list-style:disc;padding-left:var(--s-lg);margin-bottom:var(--s-md)}
.pol-c li{margin-bottom:var(--s-sm)}
.pol-c ol{list-style:decimal;padding-left:var(--s-lg);margin-bottom:var(--s-md)}
.pol-sb{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s-lg);height:fit-content}
.pol-sb h4{margin-bottom:var(--s-md);font-size:.9rem;text-transform:uppercase;letter-spacing:1px;color:var(--muted)}
.pol-sb ul li{margin-bottom:var(--s-sm)}
.pol-sb ul li a{font-size:.9rem;color:var(--text-2);transition:color var(--t-fast)}
.pol-sb ul li a:hover{color:var(--accent)}

/* Contact */
.ct-p{padding:var(--s-xl) 0}
.ct-layout{display:grid;grid-template-columns:1fr;gap:var(--s-xl)}
@media(min-width:768px){.ct-layout{grid-template-columns:1fr 1fr}}
.ct-info{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s-xl)}
.ct-item{display:flex;gap:var(--s-md);margin-bottom:var(--s-lg)}
.ct-item .ic{font-size:1.5rem;color:var(--accent);flex-shrink:0}
.ct-item h4{font-size:.95rem;margin-bottom:2px}
.ct-item p{font-size:.9rem;color:var(--text-2);margin:0}
.ct-form{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s-xl)}

/* FAQ */
.faq-p{padding:var(--s-xl) 0}
.faq-item{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);margin-bottom:var(--s-sm);overflow:hidden}
.faq-q{padding:var(--s-md) var(--s-lg);display:flex;align-items:center;justify-content:space-between;cursor:pointer;font-weight:600;color:var(--text);transition:background var(--t-fast)}
.faq-q:hover{background:var(--surface-2)}
.faq-a{max-height:0;overflow:hidden;transition:max-height var(--t-slow)}
.faq-item.open .faq-a{max-height:500px}
.faq-ai{padding:0 var(--s-lg) var(--s-md);color:var(--text-2);font-size:.9rem;line-height:1.7}

/* Collection Hero */
.col-hero{position:relative;min-height:300px;display:flex;align-items:center;overflow:hidden}
.col-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.35}
.col-hero-ov{position:absolute;inset:0;background:linear-gradient(135deg,rgba(10,10,15,.9),rgba(10,10,15,.5))}
.col-hero-c{position:relative;z-index:2;padding:var(--s-2xl) 0;text-align:center}
.col-hero-c h1{margin-bottom:var(--s-sm)}
.col-hero-c p{color:var(--text-2);max-width:600px;margin:0 auto}

/* Article */
.art-hero{position:relative;min-height:400px;display:flex;align-items:flex-end;overflow:hidden}
.art-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.art-hero-ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(10,10,15,.95) 0%,rgba(10,10,15,.4) 60%,rgba(10,10,15,.2) 100%)}
.art-hero-c{position:relative;z-index:2;padding:var(--s-2xl) 0;max-width:800px}
.art-meta{display:flex;align-items:center;gap:var(--s-md);margin-bottom:var(--s-sm);font-size:.85rem;color:var(--muted)}
.art-body{max-width:800px;margin:0 auto;padding:var(--s-xl) 0;line-height:1.8;color:var(--text-2)}
.art-body h2,.art-body h3{color:var(--text);margin:var(--s-lg) 0 var(--s-sm)}
.art-body p{margin-bottom:var(--s-md)}
.art-body img{border-radius:var(--r-lg);margin:var(--s-md) 0}
.art-body ul{list-style:disc;padding-left:var(--s-lg);margin-bottom:var(--s-md)}
.art-body li{margin-bottom:var(--s-sm)}

/* Spinner */
.spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;margin:var(--s-xl) auto}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes slideUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
.fade-in{animation:fadeIn var(--t-slow) ease}
.slide-up{animation:slideUp var(--t-slow) ease}

/* Newsletter */
.newsletter{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s-xl);text-align:center;margin:var(--s-xl) 0}
.newsletter h3{margin-bottom:var(--s-sm)}
.newsletter p{color:var(--text-2);margin-bottom:var(--s-lg)}
.newsletter-form{display:flex;gap:var(--s-sm);max-width:500px;margin:0 auto;flex-wrap:wrap}
.newsletter-form input{flex:1;min-width:200px;padding:12px 20px;background:var(--surface-2);border:1px solid var(--border-2);border-radius:var(--r-full);color:var(--text);font-size:.95rem}
.newsletter-form input:focus{border-color:var(--accent);outline:none}

@media(min-width:768px){.hide-d{display:none}}
@media(max-width:767px){.hide-m{display:none}}