:root{--nb:#060C1B;--ns:#0A1428;--nc:#0F1C36;--nb2:#152248;--nbr:#1A2F5C;--gold:#C9A84C;--gold2:#f0c040;--gldl:#E8C96B;--gldd:#8A7030;--txt:#EDE8DF;--mut:#4A6090;--mut2:#2A3D60}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--nb);color:var(--txt);font-family:'Rubik',sans-serif;line-height:1.6;min-height:100vh}
.topnav{position:sticky;top:0;z-index:100;background:rgba(6,12,27,.97);border-bottom:1px solid rgba(201,168,76,.15);backdrop-filter:blur(12px);padding:0 1.5rem;display:flex;align-items:center;justify-content:space-between;height:60px}
.nav-brand{font-family:'Rubik',sans-serif;font-weight:900;font-size:1.25rem;letter-spacing:.08em;color:var(--gold);text-decoration:none}.nav-brand span{color:var(--txt)}.nav-brand img{height:52px;width:auto;display:block}
.nav-actions{display:flex;align-items:center;gap:.75rem}
.btn-back{display:inline-flex;align-items:center;gap:.4rem;font-family:'Panchang',sans-serif; font-weight:700;font-size:0.85rem;letter-spacing:.1em;color:var(--mut);text-decoration:none;padding:.35rem .7rem;border:1px solid var(--mut2);border-radius:4px;transition:color .2s,border-color .2s}
.btn-back:hover{color:var(--txt);border-color:var(--mut)}
.cart-icon-btn{position:relative;background:none;border:none;cursor:pointer;color:var(--txt);padding:.4rem;display:flex;align-items:center}
.cart-badge{position:absolute;top:0;right:0;background:var(--gold);color:#07101F;font-size:.6rem;font-weight:700;width:16px;height:16px;border-radius:50%;display:none;align-items:center;justify-content:center}.cart-badge.visible{display:flex}
.breadcrumb{padding:.6rem 2rem;font-family:'Panchang',sans-serif; font-weight:700;font-size:0.78rem;letter-spacing:.1em;color:var(--mut);border-bottom:1px solid rgba(255,255,255,.04)}
.breadcrumb a{color:var(--mut);text-decoration:none}.breadcrumb a:hover{color:var(--gold)}.breadcrumb span{color:var(--txt)}
.product-hero{max-width:1100px;margin:0 auto;padding:3rem 2rem 2rem;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
@media(max-width:720px){.product-hero{display:block;padding:1.5rem 1.25rem}.product-image-wrap{margin-bottom:2rem}}
.product-image-wrap{position:sticky;top:76px;background:#08112a;border:1px solid rgba(201,168,76,.18);border-radius:14px;overflow:hidden;min-height:400px;aspect-ratio:1}
/* Mobile: the sticky offset's `top:76px` isn't reset by `position:static`
   above alone — the image wrap's own inline `style="position:relative"`
   (needed so its absolutely-positioned badges/dots have a containing
   block) keeps `top:76px` active as a relative offset, visually shifting
   the image down without reserving that space, so the next sibling
   (product info) overlapped it by ~44px. `top:0` neutralizes the shift
   while still letting the inline position:relative anchor the badges. */
@media(max-width:720px){.product-image-wrap{position:static;min-height:280px;aspect-ratio:1;top:0}}
.product-image-wrap.placeholder-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.9rem}
.placeholder-emoji{font-size:5rem;line-height:1;filter:grayscale(.15)}
.placeholder-text{font-family:'Panchang',sans-serif; font-weight:700;font-size:0.83rem;letter-spacing:.14em;color:var(--mut);text-align:center;padding:0 1.5rem;text-transform:uppercase}
.img-track{display:flex;height:100%;transition:transform .42s cubic-bezier(.4,0,.2,1)}
.slide{min-width:100%;height:100%;object-fit:contain;user-select:none;pointer-events:none;-webkit-user-drag:none;background:#08112a}
.img-arr{position:absolute;top:50%;transform:translateY(-50%);background:rgba(6,12,27,.75);border:1px solid rgba(201,168,76,.3);color:var(--gold);width:38px;height:38px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .18s,border-color .18s;z-index:10;padding:0}
.img-arr:hover{background:rgba(201,168,76,.2);border-color:var(--gold)}
.img-prev{left:.7rem}.img-next{right:.7rem}
.img-dots{position:absolute;bottom:.9rem;left:50%;transform:translateX(-50%);display:flex;gap:.38rem;z-index:10}
.img-dot{width:7px;height:7px;border-radius:50%;background:rgba(201,168,76,.28);cursor:pointer;transition:background .2s,transform .2s;border:none;padding:0}
.img-dot.active{background:var(--gold);transform:scale(1.35)}
.img-ctr{position:absolute;bottom:.8rem;right:.8rem;font-family:'Panchang',sans-serif; font-weight:700;font-size:0.73rem;color:var(--mut);background:rgba(6,12,27,.75);padding:.2rem .5rem;border-radius:4px;letter-spacing:.07em;z-index:10}
.product-code-badge{position:absolute;top:1rem;left:1rem;background:rgba(201,168,76,.12);border:1px solid rgba(201,168,76,.28);color:var(--gold);font-family:'Panchang',sans-serif; font-weight:700;font-size:0.78rem;letter-spacing:.12em;padding:.22rem .55rem;border-radius:4px;z-index:10}
.pair-badge,.uni-badge{position:absolute;top:1rem;right:.8rem;background:rgba(240,192,64,.1);border:1px solid rgba(240,192,64,.25);color:var(--gold2);font-family:'Panchang',sans-serif; font-weight:700;font-size:0.75rem;letter-spacing:.1em;padding:.22rem .55rem;border-radius:4px;z-index:10}
.soon-badge{position:absolute;top:1rem;right:.8rem;background:rgba(239,83,80,.1);border:1px solid rgba(239,83,80,.3);color:#ef8a87;font-family:'Panchang',sans-serif; font-weight:700;font-size:0.75rem;letter-spacing:.1em;padding:.22rem .55rem;border-radius:4px;z-index:10}
.product-info{display:flex;flex-direction:column;gap:1.4rem}
.product-subtitle{font-family:'Panchang',sans-serif; font-weight:700;font-size:0.83rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:.2rem}
.product-name{font-size:clamp(1.6rem,4vw,2.3rem);font-weight:700;line-height:1.15;color:var(--txt)}
.product-tagline{font-size:.93rem;color:var(--mut);line-height:1.7;margin-top:.5rem}
.divider{height:1px;background:rgba(255,255,255,.07)}
.pricing-block{display:flex;align-items:baseline;gap:.9rem;flex-wrap:wrap}
.price-selling{font-size:2.1rem;font-weight:700;color:var(--gold2);line-height:1}
.price-mrp{font-size:1.05rem;color:var(--mut);text-decoration:line-through}
.price-discount{font-family:'Panchang',sans-serif; font-weight:700;font-size:0.85rem;letter-spacing:.08em;background:rgba(240,192,64,.14);color:var(--gold2);border:1px solid rgba(240,192,64,.24);padding:.18rem .48rem;border-radius:4px}
.price-note{font-family:'Panchang',sans-serif; font-weight:700;font-size:0.77rem;color:var(--mut);margin-top:.25rem}
.soon-notice{background:rgba(239,83,80,.06);border:1px solid rgba(239,83,80,.22);border-radius:8px;padding:.85rem 1rem;font-size:.85rem;color:var(--txt);display:flex;align-items:center;gap:.6rem}
.soon-notice span{font-family:'Panchang',sans-serif; font-weight:700;font-size:0.79rem;letter-spacing:.1em;color:#ef8a87}
.uni-fit-box{background:rgba(201,168,76,.07);border:1px solid rgba(201,168,76,.18);border-radius:8px;padding:.75rem 1rem;display:flex;align-items:center;gap:.6rem;font-size:.88rem;color:var(--txt)}
.uni-fit-box span{font-family:'Panchang',sans-serif; font-weight:700;font-size:0.8rem;letter-spacing:.12em;color:var(--gold)}
.selector-label,.qty-label{font-family:'Panchang',sans-serif; font-weight:700;font-size:0.82rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mut);margin-bottom:.55rem}
.selector-label strong{color:var(--txt)}
.size-pills{display:flex;flex-wrap:wrap;gap:.45rem}
.size-pill{min-width:46px;padding:.42rem .7rem;background:var(--nc);border:1.5px solid var(--mut2);border-radius:6px;color:var(--txt);font-family:'Rubik',sans-serif;font-size:.82rem;font-weight:500;cursor:pointer;transition:all .15s;text-align:center}
.size-pill:hover{border-color:var(--gold);color:var(--gold)}
.size-pill.active{background:rgba(201,168,76,.16);border-color:var(--gold);color:var(--gold);font-weight:600}
.size-hint{font-family:'Panchang',sans-serif; font-weight:700;font-size:0.75rem;color:var(--mut);margin-top:.35rem;line-height:1.5}
.size-error{font-family:'Panchang',sans-serif; font-weight:700;font-size:0.83rem;color:#ef5350;display:none;margin-top:.25rem}.size-error.visible{display:block}
.qty-row{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap}
.qty-stepper{display:flex;align-items:center;background:var(--nc);border:1.5px solid var(--mut2);border-radius:6px;overflow:hidden}
.qty-btn{width:36px;height:36px;background:none;border:none;cursor:pointer;color:var(--txt);font-size:1.1rem;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
.qty-btn:hover{background:rgba(201,168,76,.14);color:var(--gold)}
.qty-val{width:40px;text-align:center;font-weight:600;font-size:.95rem;color:var(--txt);border-left:1px solid var(--mut2);border-right:1px solid var(--mut2);height:36px;line-height:36px;user-select:none}
.btn-add-cart{flex:1;min-height:48px;background:linear-gradient(135deg,var(--gold),var(--gldl));color:#07101F;font-family:'Rubik',sans-serif;font-weight:700;font-size:.95rem;letter-spacing:.03em;border:none;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:opacity .2s,transform .1s}
.btn-add-cart:hover{opacity:.9}.btn-add-cart:active{transform:scale(.98)}
.btn-add-cart.added{background:linear-gradient(135deg,#2e7d32,#43a047);color:#fff}
.btn-add-cart:disabled{background:var(--nc);color:var(--mut);border:1.5px solid var(--mut2);cursor:not-allowed;opacity:1}
.after-add-actions{display:flex;gap:.7rem;flex-wrap:wrap}
.btn-continue{flex:1;min-height:44px;background:var(--nc);color:var(--txt);border:1.5px solid var(--mut2);border-radius:8px;font-family:'Rubik',sans-serif;font-weight:500;font-size:.87rem;cursor:pointer;text-decoration:none;display:flex;align-items:center;justify-content:center;gap:.4rem;transition:border-color .2s,color .2s}
.btn-continue:hover{border-color:var(--mut);color:var(--txt)}
.btn-checkout{flex:1;min-height:44px;background:none;color:var(--gold);border:1.5px solid var(--gold);border-radius:8px;font-family:'Rubik',sans-serif;font-weight:600;font-size:.87rem;cursor:pointer;text-decoration:none;display:flex;align-items:center;justify-content:center;gap:.4rem;transition:background .2s,color .2s}
.btn-checkout:hover{background:var(--gold);color:#07101F}
.trust-badges{display:flex;flex-wrap:wrap;gap:.4rem}
.trust-badge{display:inline-flex;align-items:center;gap:.28rem;font-family:'Panchang',sans-serif; font-weight:700;font-size:0.73rem;letter-spacing:.07em;color:var(--mut);padding:.22rem .48rem;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.06);border-radius:4px}
.product-content{max-width:1100px;margin:0 auto;padding:0 2rem 4rem;display:grid;grid-template-columns:2fr 1fr;gap:2.5rem}
@media(max-width:720px){.product-content{grid-template-columns:1fr;padding:0 1.25rem 3rem;gap:1.5rem}}
.sec-heading{font-family:'Panchang',sans-serif; font-weight:700;font-size:0.82rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:.9rem;display:flex;align-items:center;gap:.7rem}
.sec-heading::after{content:'';flex:1;height:1px;background:rgba(201,168,76,.18)}
.section-card{background:var(--ns);border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:1.6rem;margin-bottom:1.25rem}
.feature-list{list-style:none;display:flex;flex-direction:column;gap:.6rem}
.feature-list li{display:flex;align-items:flex-start;gap:.65rem;font-size:.92rem;line-height:1.6;color:var(--txt)}
.feature-list li::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--gold);margin-top:.52rem;flex-shrink:0}
.desc-text{font-size:.93rem;line-height:1.78;color:rgba(237,232,223,.75)}
.specs-table{width:100%;border-collapse:collapse;font-size:.875rem}
.specs-table tr{border-bottom:1px solid rgba(255,255,255,.06)}.specs-table tr:last-child{border-bottom:none}
.specs-table td{padding:.7rem .4rem;vertical-align:top}
.specs-table td:first-child{font-family:'Panchang',sans-serif; font-weight:700;font-size:0.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);white-space:nowrap;padding-right:1.25rem;width:1%}
.specs-table td:last-child{color:rgba(237,232,223,.8);line-height:1.6}
.cert-block{background:var(--ns);border:1px solid rgba(201,168,76,.1);border-radius:12px;padding:1.4rem;margin-bottom:1.25rem}
.cert-list{list-style:none;display:flex;flex-direction:column;gap:.45rem;margin-top:.65rem}
.cert-list li{font-family:'Panchang',sans-serif; font-weight:700;font-size:0.78rem;letter-spacing:.07em;color:var(--mut);display:flex;align-items:center;gap:.45rem}
.cert-list li::before{content:'✓';color:var(--gold);font-size:.72rem}
.page-footer{border-top:1px solid rgba(255,255,255,.06);padding:1.4rem 2rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.75rem;font-family:'Panchang',sans-serif; font-weight:700;font-size:0.75rem;letter-spacing:.09em;color:var(--mut)}
.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(70px);background:rgba(10,20,40,.97);border:1px solid rgba(201,168,76,.35);color:var(--txt);padding:.7rem 1.4rem;border-radius:8px;font-size:.875rem;font-weight:500;z-index:999;transition:transform .3s cubic-bezier(.34,1.56,.64,1);white-space:nowrap;pointer-events:none}
.toast.show{transform:translateX(-50%) translateY(0)}
