*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  /* G'millennial palette — warm, nostalgic, confident */
  --ink:       #1A1714;
  --espresso:  #2C2420;
  --mocha:     #3D3028;
  --bark:      #6B5344;
  --tan:       #A8876E;
  --sand:      #D4B89A;
  --cream:     #F5EFE6;
  --paper:     #FAF7F3;
  --white:     #FFFFFF;
  --accent:    #E85D26;   /* Burnt orange — nostalgia meets energy */
  --accent2:   #F0C93A;   /* Warm gold */
  --green:     #4CAF7D;
  --muted:     #9A8880;
  --nav-h:     60px;
  --font-d:    'Syne', sans-serif;
  --font-mono: 'Syne Mono', monospace;
  --font-ser:  'Lora', serif;
}

html { scroll-behavior: smooth; }
body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-d);
  font-weight: 400;
  overflow-x: hidden;
}

/* ── CURSOR ── */
.cursor {
  width: 8px; height: 8px;
  background: var(--accent);
  border-radius: 50%;
  position: fixed;
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%,-50%);
  transition: transform .1s;
}
.cursor-ring {
  width: 32px; height: 32px;
  border: 1px solid var(--accent);
  border-radius: 50%;
  position: fixed;
  pointer-events: none;
  z-index: 9998;
  transform: translate(-50%,-50%);
  transition: left .12s ease, top .12s ease;
  opacity: .5;
}
@media (hover:none) { .cursor,.cursor-ring { display:none; } }

/* ── BREADCRUMB (product pages only) ── */
.breadcrumb {
  display: none;
  font-size: .65rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--bark);
  gap: 6px;
  align-items: center;
  font-family: var(--font-mono);
}
.breadcrumb a { color: var(--bark); text-decoration: none; }
.breadcrumb a:hover { color: var(--accent2); }
.breadcrumb .sep { color: var(--mocha); }
@media(min-width:768px){ .breadcrumb{display:flex;} }

/* ── SINGLE PRODUCT: Dark nav + orange top band ── */
.single-product nav {
  background: var(--ink);
  border-bottom: 1px solid var(--mocha);
}
.single-product nav .nl-mi { color: var(--cream); }
.single-product nav .desktop-links a { color: var(--sand); }
.single-product nav .desktop-links a:hover,
.single-product nav .desktop-links a.active { color: var(--accent2); }
.single-product nav .icon-btn { color: var(--sand); }
.single-product nav .icon-btn:hover { color: var(--accent2); }
.single-product nav .ham span { background: var(--sand); }
.single-product .top-band { background: var(--accent); color: var(--white); }
.single-product .top-band span { color: var(--accent2); }

.cart-dot {
  position:absolute; top:2px; right:2px;
  width:7px; height:7px;
  background:var(--accent); border-radius:50%;
}

/* ── PRODUCT TOP ── */
.product-top {
  display: grid;
  grid-template-columns: 1fr;
}

/* Gallery */
.gallery {
  background: var(--cream);
  position: relative;
}
.gallery-main-wrap {
  position: relative;
  overflow: hidden;
}
.gallery-main {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
  transition: opacity .35s;
}
.gallery-badges {
  position: absolute;
  top: 14px; left: 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  z-index: 2;
}
.g-badge {
  padding: 5px 12px;
  font-family: var(--font-mono);
  font-size: .6rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  width: fit-content;
}
.badge-new { background: var(--ink); color: var(--accent2); }
.badge-hot { background: var(--accent); color: var(--white); }

.gallery-thumbs {
  display: flex;
  gap: 6px;
  padding: 10px 12px;
  overflow-x: auto;
  scrollbar-width: none;
  background: var(--cream);
  border-bottom: 1px solid #E8E0D6;
}
.gallery-thumbs::-webkit-scrollbar { display: none; }
.thumb {
  flex: 0 0 60px; height: 60px;
  object-fit: cover;
  cursor: pointer;
  opacity: .4;
  transition: opacity .2s;
  border: 2px solid transparent;
}
.thumb.on { opacity: 1; border-color: var(--accent); }

/* Product info */
.product-info {
  padding: 28px 20px 56px;
  background: var(--paper);
  border-left: none;
}

.pi-drop {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-mono);
  font-size: .62rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 12px;
}
.pi-drop::before {
  content: '';
  width: 20px; height: 1px;
  background: var(--accent);
}

.pi-name {
  font-family: var(--font-d);
  font-weight: 800;
  font-size: clamp(2rem, 9vw, 3.6rem);
  line-height: .95;
  letter-spacing: -.02em;
  color: var(--ink);
  margin-bottom: 4px;
}
.pi-name .italic { font-style: italic; color: var(--accent); font-weight: 700; }

.pi-subtitle {
  font-family: var(--font-ser);
  font-style: italic;
  font-size: .9rem;
  color: var(--bark);
  margin-bottom: 18px;
}

/* Rating */
.rating-row {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #E8E0D6;
}
.stars { color: var(--accent); font-size: .78rem; letter-spacing: 2px; }
.r-num { font-size: .78rem; font-weight: 600; color: var(--ink); }
.r-link { font-size: .72rem; color: var(--tan); text-decoration: none; font-family: var(--font-mono); }
.r-link:hover { color: var(--accent); }

/* Price */
.price-block {
  display: flex; align-items: baseline; gap: 10px;
  margin-bottom: 6px;
}
.price-now {
  font-family: var(--font-d);
  font-weight: 800;
  font-size: 2.4rem;
  color: var(--ink);
  letter-spacing: -.02em;
  line-height: 1;
}
.price-was {
  font-size: .9rem;
  color: var(--muted);
  text-decoration: line-through;
}
.price-pill {
  background: var(--accent2);
  color: var(--ink);
  font-family: var(--font-mono);
  font-size: .6rem;
  font-weight: 600;
  letter-spacing: .08em;
  padding: 3px 8px;
}
.tax-note {
  font-family: var(--font-mono);
  font-size: .62rem;
  letter-spacing: .1em;
  color: var(--muted);
  margin-bottom: 20px;
  text-transform: uppercase;
}

/* Stock */
.stock-wrap { margin-bottom: 22px; }
.stock-top {
  display: flex; justify-content: space-between;
  font-family: var(--font-mono);
  font-size: .62rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.stock-top .hot { color: var(--accent); }
.stock-top .pct { color: var(--muted); }
.stock-track {
  height: 3px; background: #E8E0D6; border-radius: 2px; overflow: hidden;
}
.stock-fill {
  height: 100%; background: var(--accent);
  border-radius: 2px; width: 0;
  animation: fill 1s .5s forwards;
}
@keyframes fill { to { width: 72%; } }

/* Picker label */
.pick-label {
  font-family: var(--font-mono);
  font-size: .62rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 10px;
}
.pick-label b { color: var(--ink); font-weight: 600; }

/* Colors */
.color-row { display:flex; gap:8px; margin-bottom:22px; flex-wrap:wrap; }
.sw {
  width: 30px; height: 30px;
  border-radius: 50%;
  cursor: pointer;
  border: 2px solid transparent;
  transition: border-color .2s, transform .2s;
  position: relative;
}
.sw:hover { transform: scale(1.15); }
.sw.on { border-color: var(--accent); }
.sw[data-tip]:hover::after {
  content: attr(data-tip);
  position: absolute;
  bottom: 40px; left: 50%;
  transform: translateX(-50%);
  background: var(--ink);
  color: var(--cream);
  font-family: var(--font-mono);
  font-size: .58rem;
  letter-spacing: .08em;
  white-space: nowrap;
  padding: 4px 8px;
  pointer-events: none;
  z-index: 10;
}

/* Sizes */
.size-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.size-guide {
  font-family: var(--font-mono);
  font-size: .6rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--accent);
  text-decoration: none;
  display: flex; align-items: center; gap: 4px;
}

.size-row { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:24px; }
.sz {
  height: 44px;
  padding: 0 14px;
  min-width: 44px;
  display:flex; align-items:center; justify-content:center;
  border: 1.5px solid #D4C9BE;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-d);
  font-size: .75rem;
  font-weight: 600;
  cursor: pointer;
  letter-spacing: .04em;
  transition: all .2s;
}
.sz:hover, .sz.on {
  background: var(--ink); color: var(--accent2);
  border-color: var(--ink);
}
.sz.sold {
  opacity: .3; cursor: not-allowed;
  text-decoration: line-through;
  background: #F0EAE2;
}

/* CTAs */
.cta-stack { display:flex; flex-direction:column; gap:10px; margin-bottom:24px; }

.btn-atb {
  width: 100%;
  background: var(--accent);
  color: var(--white);
  border: none;
  padding: 16px;
  font-family: var(--font-d);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .2s;
  display: flex; align-items: center; justify-content: center; gap: 10px;
}
.btn-atb:hover { background: var(--ink); }

.btn-buy-now {
  width: 100%;
  background: var(--ink);
  color: var(--cream);
  border: none;
  padding: 16px;
  font-family: var(--font-d);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .2s;
  display: flex; align-items: center; justify-content: center; gap: 10px;
}
.btn-buy-now:hover { background: var(--accent); }

.btn-wl {
  width: 100%;
  background: transparent;
  color: var(--ink);
  border: 1.5px solid #D4C9BE;
  padding: 14px;
  font-family: var(--font-d);
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: all .2s;
  display:flex; align-items:center; justify-content:center; gap:8px;
}
.btn-wl:hover { border-color: var(--ink); background: var(--ink); color: var(--cream); }
.btn-wl.active { border-color: var(--accent); color: var(--accent); }
.btn-wl.active svg { fill: var(--accent); stroke: var(--accent); }

/* Mini trust */
.mini-trust {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 1px;
  background: #E8E0D6;
  border: 1px solid #E8E0D6;
  margin-bottom: 22px;
}
.mt-item {
  background: var(--paper);
  display:flex; flex-direction:column;
  align-items:center; text-align:center;
  padding: 14px 8px; gap: 6px;
}
.mt-icon { color: var(--accent); }
.mt-label {
  font-family: var(--font-mono);
  font-size: .58rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--bark);
  line-height: 1.4;
}

/* Delivery */
.delivery-box {
  background: #F0EAE2;
  border: 1px solid #E0D5C8;
  padding: 14px 16px;
  display:flex; align-items:flex-start; gap:12px;
  margin-bottom: 20px;
}
.delivery-box svg { color: var(--green); flex-shrink:0; margin-top:2px; }
.di-title { font-size: .76rem; font-weight: 600; color: var(--ink); margin-bottom: 3px; }
.di-sub {
  font-family: var(--font-mono);
  font-size: .68rem;
  color: var(--muted);
  line-height: 1.5;
}
.di-sub span { color: var(--green); }

.pin-form { display:flex; gap:0; margin-top:10px; }
.pin-form input {
  flex:1;
  background: var(--paper);
  border: 1.5px solid #D4C9BE;
  border-right: none;
  color: var(--ink);
  padding: 9px 12px;
  font-family: var(--font-mono);
  font-size: .72rem;
  outline: none;
}
.pin-form input::placeholder { color: var(--muted); }
.pin-form button {
  background: var(--ink);
  color: var(--accent2);
  border: none;
  padding: 9px 14px;
  font-family: var(--font-mono);
  font-size: .65rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
}

/* ── DIVIDER ── */
.divider { height: 1px; background: #E8E0D6; }

/* ── BELOW-FOLD STACKING FIX ──
   The sticky .gallery is a positioned element painted at z-index:auto step (step 6)
   of the root stacking context. In-flow block sections (step 3) paint BEFORE it,
   so the gallery overlaps them. Adding position:relative promotes each section to
   the positioned-elements paint step and, since they follow .gallery in the DOM,
   they paint over it. Adding explicit backgrounds closes any transparent gaps. */
.type-product .divider,
.type-product .section,
.type-product .fab-strip,
.type-product .about-wrap,
.type-product .trust-section,
.type-product .reviews-section,
.type-product .related-section { position: relative; z-index: 1; }

.type-product .section        { background: var(--paper); }
.type-product .about-wrap     { background: var(--paper); }
.type-product .reviews-section{ background: var(--paper); }

/* ── SECTION BASE ── */
.section { padding: 60px 20px; }

.s-label {
  font-family: var(--font-mono);
  font-size: .62rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.s-label::after {
  content: '';
  flex: 1;
  height: 1px;
  background: #E8E0D6;
  max-width: 60px;
}

.s-title {
  font-family: var(--font-d);
  font-weight: 800;
  font-size: clamp(2rem, 8vw, 4rem);
  letter-spacing: -.02em;
  line-height: .95;
  color: var(--ink);
  margin-bottom: 8px;
}
.s-title .o { -webkit-text-stroke: 1.5px var(--ink); color: transparent; }
.s-title em { font-style: italic; color: var(--accent); }

/* ── VISUAL DESCRIPTIONS ── */
.vd-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  background: #E8E0D6;
  border: 1px solid #E8E0D6;
  margin-top: 32px;
}

.vd-card {
  background: var(--paper);
  padding: 24px 20px;
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 16px;
  align-items: start;
  transition: background .2s;
}
.vd-card:hover { background: var(--cream); }

.vd-num {
  font-family: var(--font-mono);
  font-size: .62rem;
  letter-spacing: .14em;
  color: var(--tan);
  margin-bottom: 6px;
}
.vd-icon {
  width: 52px; height: 52px;
  background: var(--cream);
  border: 1px solid #E0D5C8;
  display:flex; align-items:center; justify-content:center;
  flex-shrink: 0;
}
.vd-icon svg { color: var(--accent); }

.vd-h {
  font-family: var(--font-d);
  font-weight: 700;
  font-size: .9rem;
  letter-spacing: .02em;
  color: var(--ink);
  margin-bottom: 6px;
  text-transform: uppercase;
}
.vd-p {
  font-family: var(--font-ser);
  font-size: .82rem;
  line-height: 1.75;
  color: var(--bark);
}

/* Fabric numbers */
.fab-strip {
  background: var(--ink);
  padding: 40px 20px;
}
.fab-heading {
  font-family: var(--font-d);
  font-weight: 800;
  font-size: clamp(1.6rem, 7vw, 3rem);
  letter-spacing: -.01em;
  color: var(--cream);
  margin-bottom: 24px;
}
.fab-heading em { color: var(--accent); font-style: italic; }

.fab-stats {
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: 1px;
  background: var(--mocha);
}
.fab-cell {
  background: var(--espresso);
  padding: 20px 16px;
  text-align: center;
}
.fab-num {
  font-family: var(--font-d);
  font-weight: 800;
  font-size: 2.2rem;
  color: var(--accent2);
  letter-spacing: -.01em;
  line-height: 1;
  margin-bottom: 4px;
}
.fab-lbl {
  font-family: var(--font-mono);
  font-size: .58rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--tan);
}

/* ── BRAND ABOUT ── */
.about-wrap { overflow: hidden; }

.about-hero {
  position: relative;
  height: 65vw;
  min-height: 260px; max-height: 520px;
  overflow: hidden;
  background: var(--ink);
}
.about-hero img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: brightness(.4) saturate(.8);
  mix-blend-mode: luminosity;
}
.about-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, transparent 30%, var(--ink) 100%);
}
.about-over {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 28px 20px;
  z-index: 2;
}
.about-eyebrow {
  font-family: var(--font-mono);
  font-size: .62rem;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--accent2);
  margin-bottom: 8px;
}
.about-big {
  font-family: var(--font-d);
  font-weight: 800;
  font-size: clamp(2.6rem, 14vw, 7rem);
  letter-spacing: -.02em;
  line-height: .9;
  color: var(--cream);
}
.about-big .stroke {
  -webkit-text-stroke: 1.5px var(--cream);
  color: transparent;
}
.about-big .accent { color: var(--accent); }

/* About body */
.about-body {
  background: var(--ink);
  padding: 40px 20px 60px;
}

.manifesto {
  font-family: var(--font-d);
  font-weight: 700;
  font-size: clamp(1.3rem, 5.5vw, 2.4rem);
  letter-spacing: -.01em;
  line-height: 1.15;
  color: var(--cream);
  margin-bottom: 28px;
}
.manifesto .hl { color: var(--accent2); font-style: italic; }
.manifesto .dim { color: var(--bark); }

.about-para {
  font-family: var(--font-ser);
  font-size: .85rem;
  line-height: 1.9;
  color: var(--sand);
  margin-bottom: 18px;
}
.about-para b { color: var(--cream); font-weight: 500; font-style: italic; }

/* Values */
.values-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: var(--mocha);
  border: 1px solid var(--mocha);
  margin-top: 36px;
}
.val-card {
  background: var(--espresso);
  padding: 20px 16px;
}
.val-num {
  font-family: var(--font-d);
  font-weight: 800;
  font-size: 2rem;
  color: var(--accent2);
  letter-spacing: -.01em;
  line-height: 1;
  margin-bottom: 6px;
}
.val-title {
  font-family: var(--font-mono);
  font-size: .65rem;
  font-weight: 600;
  color: var(--cream);
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.val-desc {
  font-family: var(--font-ser);
  font-size: .72rem;
  color: var(--tan);
  line-height: 1.55;
  font-style: italic;
}

/* ── TRUST SIGNALS ── */
.trust-section {
  background: var(--cream);
  padding: 60px 20px;
}

.trust-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 32px;
}

.tc {
  background: var(--paper);
  border: 1px solid #E0D5C8;
  padding: 20px;
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 16px;
  align-items: start;
  transition: border-color .2s, transform .2s;
}
.tc:hover { border-color: var(--accent); transform: translateY(-2px); }

.tc-icon-w {
  width: 48px; height: 48px;
  background: var(--ink);
  display:flex; align-items:center; justify-content:center;
  flex-shrink: 0;
}
.tc-icon-w svg { color: var(--accent2); }
.tc-title {
  font-family: var(--font-d);
  font-weight: 700;
  font-size: .82rem;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: var(--ink);
  margin-bottom: 5px;
}
.tc-desc {
  font-family: var(--font-ser);
  font-size: .78rem;
  line-height: 1.65;
  color: var(--bark);
  font-style: italic;
}

/* Payment row */
.pay-row { margin-top: 32px; padding-top: 24px; border-top: 1px solid #E0D5C8; }
.pay-label {
  font-family: var(--font-mono);
  font-size: .6rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 14px;
}
.pay-logos { display:flex; flex-wrap:wrap; gap:8px; }
.p-logo {
  height: 32px;
  background: var(--paper);
  border: 1.5px solid #D4C9BE;
  padding: 0 12px;
  display:flex; align-items:center; justify-content:center;
  font-family: var(--font-mono);
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .1em;
  color: var(--bark);
  text-transform: uppercase;
}

/* ── REVIEWS ── */
.reviews-section { padding: 60px 20px; }

.review-summary {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 24px;
  align-items: center;
  margin: 28px 0 32px;
  padding-bottom: 28px;
  border-bottom: 1px solid #E8E0D6;
}
.rs-big { text-align:center; }
.rs-num {
  font-family: var(--font-d);
  font-weight: 800;
  font-size: 4.5rem;
  color: var(--ink);
  letter-spacing: -.03em;
  line-height: 1;
}
.rs-stars { color: var(--accent); font-size: .9rem; letter-spacing: 3px; margin: 4px 0; }
.rs-cnt {
  font-family: var(--font-mono);
  font-size: .62rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted);
}

.bar-row {
  display:grid; grid-template-columns: 14px 1fr 28px;
  align-items:center; gap:8px; margin-bottom: 6px;
}
.bar-n { font-family: var(--font-mono); font-size:.65rem; color:var(--muted); text-align:right; }
.bar-t { height: 4px; background: #E8E0D6; border-radius:2px; overflow:hidden; }
.bar-f { height:100%; background:var(--accent); border-radius:2px; }
.bar-p { font-family: var(--font-mono); font-size:.6rem; color:var(--muted); }

/* Review cards */
.review-list { display:flex; flex-direction:column; gap:14px; }
.r-card {
  background: var(--cream);
  border: 1px solid #E0D5C8;
  padding: 20px;
}
.r-top { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:8px; }
.r-name { font-weight: 700; font-size: .82rem; color: var(--ink); margin-bottom:2px; }
.r-date { font-family: var(--font-mono); font-size:.62rem; color:var(--muted); }
.r-stars { color: var(--accent); font-size:.72rem; letter-spacing:2px; }
.r-tag {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: .58rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  background: var(--paper);
  border: 1px solid #E0D5C8;
  color: var(--muted);
  padding: 3px 8px;
  margin-bottom: 10px;
}
.r-text {
  font-family: var(--font-ser);
  font-size: .82rem;
  line-height: 1.75;
  color: var(--bark);
  font-style: italic;
}
.r-verified {
  display:flex; align-items:center; gap:5px;
  margin-top: 10px;
  font-family: var(--font-mono);
  font-size: .6rem;
  color: var(--green);
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* ── RELATED ── */
.related-section { padding: 60px 20px; background: var(--cream); }
.related-scroll {
  display:flex; gap:12px;
  overflow-x:auto; scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none; margin-top:28px;
}
.related-scroll::-webkit-scrollbar { display:none; }
.rel-card {
  flex: 0 0 62vw; max-width:230px;
  scroll-snap-align:start;
  text-decoration:none; color:inherit;
}
.rel-img {
  aspect-ratio:3/4; overflow:hidden;
  background:var(--paper); margin-bottom:10px;
  border: 1px solid #E0D5C8;
}
.rel-img img { width:100%;height:100%;object-fit:cover;transition:transform .5s; }
.rel-card:hover .rel-img img { transform:scale(1.05); }
.rel-name { font-weight:700; font-size:.82rem; color:var(--ink); margin-bottom:3px; }
.rel-price { font-family:var(--font-mono); font-size:.78rem; color:var(--muted); }

/* ── STICKY BAR ── */
.sticky-bar {
  position:fixed; bottom:0; left:0; right:0;
  background: var(--ink);
  border-top: 2px solid var(--accent);
  padding: 12px 20px;
  display:flex; align-items:center; gap:12px;
  z-index:90;
  transform:translateY(100%);
  transition:transform .35s cubic-bezier(.23,1,.32,1);
}
.sticky-bar.show { transform:translateY(0); }
.sb-info { flex:1; min-width:0; }
.sb-name {
  font-family:var(--font-d);
  font-weight:800;
  font-size: 1rem;
  letter-spacing:-.01em;
  color:var(--cream);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.sb-price {
  font-family:var(--font-mono);
  font-size:.65rem;
  color:var(--tan);
  letter-spacing:.08em;
}
.sb-btn {
  background:var(--accent);
  color:var(--white);
  border:none;
  padding: 13px 22px;
  font-family:var(--font-d);
  font-weight:700;
  font-size:.74rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  cursor:pointer;
  white-space:nowrap;
  flex-shrink:0;
  transition:background .2s;
}
.sb-btn:hover { background:var(--accent2); color:var(--ink); }

/* ── REVEAL ── */
.reveal { opacity:0; transform:translateY(22px); transition:opacity .65s,transform .65s; }
.reveal.vis { opacity:1; transform:none; }

/* ── DESKTOP ── */
@media(min-width:768px){
  nav { padding:0 36px; }
  .product-top { grid-template-columns:1fr 1fr; min-height:calc(100vh - var(--nav-h)); }
  .gallery { position:sticky; top:var(--nav-h); height:calc(100vh - var(--nav-h)); }
  .gallery-main { height:calc(100vh - var(--nav-h) - 90px); aspect-ratio:auto; }
  .product-info { padding:44px 44px 60px; max-height:calc(100vh - var(--nav-h)); overflow-y:auto; }

  .section { padding:80px 36px; }
  .vd-grid { grid-template-columns:repeat(3,1fr); }
  .fab-strip { padding:60px 36px; }
  .fab-stats { grid-template-columns:repeat(4,1fr); }
  .about-body { padding:56px 36px 80px; }
  .values-grid { grid-template-columns:repeat(4,1fr); }
  .trust-section { padding:80px 36px; }
  .trust-grid { grid-template-columns:repeat(2,1fr); }
  .reviews-section { padding:80px 36px; }
  .related-section { padding:80px 36px; }
  .related-scroll { overflow:visible; flex-wrap:wrap; }
  .rel-card { flex:0 0 calc(25% - 9px); max-width:none; }
  .sticky-bar { padding:14px 36px; }
}
@media(max-width:767px){
  .desktop-links { display:none; }
}

/* WOOCOMMERCE ADD TO CART OVERRIDE */
.product-info form.cart { display: flex; flex-direction: column; gap: 15px; margin-bottom: 24px; padding-top: 15px; border-top: 1px solid #E8E0D6;}
.product-info form.cart .quantity { display: none; }
.product-info form.cart .button { width: 100%; background: var(--accent); color: var(--white); border: none; padding: 16px; font-family: var(--font-d); font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; transition: background .2s; border-radius: 0; }
.product-info form.cart .button:hover { background: var(--ink); color: var(--white); }
.product-info table.variations { width: 100%; margin-bottom: 15px; }
.product-info table.variations td.label { width: auto; text-align: left; padding: 0 10px 10px 0; font-family: var(--font-mono); font-size: .62rem; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
.product-info table.variations td.value { display: flex; flex-wrap: wrap; gap: 8px; }
.product-info table.variations select { width: 100%; padding: 10px; border: 1.5px solid #D4C9BE; font-family: var(--font-d); font-size: .8rem; color: var(--ink); background: var(--paper); cursor: pointer; }
.product-info table.variations .reset_variations { display: none !important; }
/* FORCE OVERRIDE WOOCOMMERCE DEFAULTS */
.woocommerce div.product {
    display: block !important;
}
.woocommerce div.product .product-top {
    display: grid !important;
    width: 100% !important;
}
@media (min-width: 768px) {
    .woocommerce div.product .product-top {
        grid-template-columns: 1fr 1fr !important;
    }
}
.woocommerce div.product .product-info {
    width: 100% !important;
    float: none !important;
    clear: none !important;
    padding: 44px 44px 60px !important;
    min-width: 0 !important;
}
.woocommerce div.product .gallery {
    width: 100% !important;
    float: none !important;
    clear: none !important;
    min-width: 0 !important;
}
/* Prevent grid blowout from intrinsic image sizes */
.product-top > * { min-width: 0; }
