:root{
  --ink:#0A0A0A; --paper:#FFFFFF; --mute:#8C8C8C; --line:#242424; --panel:#131313;
  --max:1180px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--ink);color:var(--paper);font-family:'Archivo',system-ui,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased;}
.wrap{max-width:var(--max);margin:0 auto;padding:0 22px;}
h1,h2,h3,.anton{font-family:'Anton',sans-serif;font-weight:400;letter-spacing:.01em;text-transform:uppercase;line-height:.92;}
.mono{font-family:'Space Mono',monospace;}
a{color:inherit;}

/* TICKER */
.ticker{background:var(--paper);color:var(--ink);overflow:hidden;white-space:nowrap;padding:9px 0;font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;}
.ticker span{display:inline-block;padding-right:44px;}

/* HEADER */
header{position:sticky;top:0;z-index:50;background:rgba(10,10,10,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);overflow:visible;}
.hbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;}
.logo{display:block;line-height:0;text-decoration:none;}
.logo img{height:44px;width:auto;display:block;background:transparent;}
.logo{background:transparent;}
@media print{.logo img{filter:invert(1);}}
@media(min-width:900px){.logo img{height:54px;}}
nav{display:none;gap:26px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-family:'Space Mono',monospace;}
nav a{text-decoration:none;color:var(--mute);}
nav a:hover{color:var(--paper);}
@media(min-width:900px){nav{display:flex;}}
.hcta{background:var(--paper);color:var(--ink);font-family:'Anton',sans-serif;font-size:13px;letter-spacing:.08em;text-transform:uppercase;padding:11px 18px;text-decoration:none;white-space:nowrap;}

/* HERO */
.hero{padding:64px 0 44px;border-bottom:1px solid var(--line);}
.hero h1{font-size:clamp(46px,11vw,118px);}
.hero h1 .bar{background:var(--paper);color:var(--ink);padding:0 12px;display:inline-block;}
.hero .tag{margin-top:22px;font-family:'Space Mono',monospace;font-size:clamp(12px,2.4vw,15px);letter-spacing:.1em;text-transform:uppercase;color:var(--paper);}
.hero .sub{margin-top:14px;max-width:620px;color:var(--mute);font-size:15px;}
.heroCtas{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px;}
.btn{display:inline-block;background:var(--paper);color:var(--ink);font-family:'Anton',sans-serif;font-size:15px;letter-spacing:.08em;text-transform:uppercase;padding:15px 26px;text-decoration:none;border:1px solid var(--paper);cursor:pointer;}
.btn.ghost{background:transparent;color:var(--paper);}
.btn:hover{opacity:.85;}

/* COUNTDOWN */
.count{display:flex;gap:24px;flex-wrap:wrap;margin-top:34px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;}
.unit b{font-family:'Anton',sans-serif;font-size:clamp(26px,7vw,40px);display:block;line-height:1;}
.unit small{font-family:'Space Mono',monospace;font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);}

/* SECTION */
section{padding:58px 0;border-bottom:1px solid var(--line);}
.eyebrow{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--mute);margin-bottom:12px;}
.sechead{font-size:clamp(30px,6vw,54px);}
.secsub{color:var(--mute);margin-top:12px;max-width:640px;font-size:15px;}

/* PRODUCT GRID */
.grid{display:grid;grid-template-columns:1fr;gap:22px;margin-top:34px;}
@media(min-width:640px){.grid{grid-template-columns:1fr 1fr;}}
@media(min-width:1000px){.grid{grid-template-columns:1fr 1fr 1fr;}}
.card{border:1px solid var(--line);background:var(--panel);display:flex;flex-direction:column;}
.artwrap{aspect-ratio:4/5;position:relative;overflow:hidden;background:#000;}
.art{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;background:#000;transition:opacity .28s ease;}
.art img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;}
.art.light{background:#F2F2F2;}
.art.side-back{opacity:0;pointer-events:none;}
.artwrap.flipped .art.side-front{opacity:0;pointer-events:none;}
.artwrap.flipped .art.side-back{opacity:1;pointer-events:auto;}
.art .q{font-family:'Anton',sans-serif;text-transform:uppercase;line-height:.94;text-align:center;font-size:clamp(20px,3.4vw,30px);color:#fff;word-break:break-word;}
.art.light .q{color:#000;}
.art .q .hl{background:#fff;color:#000;padding:0 6px;display:inline-block;}
.art.light .q .hl{background:#000;color:#fff;}
.artwrap .qn{position:absolute;top:12px;left:12px;z-index:3;font-family:'Space Mono',monospace;font-size:9px;letter-spacing:.2em;color:#ccc;text-shadow:0 1px 3px rgba(0,0,0,.8);}
.art .ph{position:absolute;bottom:10px;right:12px;font-family:'Space Mono',monospace;font-size:8px;letter-spacing:.14em;color:#4a4a4a;}
.flip{position:absolute;bottom:10px;left:12px;z-index:3;display:flex;align-items:center;gap:7px;font-family:'Space Mono',monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:#999;cursor:pointer;background:rgba(0,0,0,.55);padding:5px 9px;border-radius:20px;}
.flip .flbl{opacity:.5;transition:opacity .2s;}
.flip .flbl.active{opacity:1;color:#fff;}
.flip .track{width:30px;height:15px;border:1px solid #666;border-radius:20px;position:relative;flex-shrink:0;}
.flip .thumb{position:absolute;top:1px;left:1px;width:11px;height:11px;border-radius:50%;background:#fff;transition:transform .2s ease;}
.artwrap.flipped .flip .thumb{transform:translateX(14px);}
.cbody{padding:16px 16px 18px;display:flex;flex-direction:column;gap:10px;flex:1;}
.cname{font-family:'Anton',sans-serif;font-size:17px;text-transform:uppercase;line-height:1.05;}
.cmeta{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);}
.price{font-family:'Anton',sans-serif;font-size:22px;}
.opts{display:flex;gap:8px;flex-wrap:wrap;}
select{background:#000;color:#fff;border:1px solid var(--line);font-family:'Space Mono',monospace;font-size:11px;padding:9px 10px;flex:1 1 46%;}
.buy{margin-top:auto;display:block;text-align:center;background:var(--paper);color:var(--ink);font-family:'Anton',sans-serif;font-size:14px;letter-spacing:.08em;text-transform:uppercase;padding:13px;text-decoration:none;}
.buy.soon{background:transparent;color:var(--mute);border:1px solid var(--line);cursor:not-allowed;}

/* BUNDLES */
.bundles{display:grid;grid-template-columns:1fr;gap:18px;margin-top:30px;}
@media(min-width:760px){.bundles{grid-template-columns:1fr 1fr 1fr;}}
.bundle{border:1px solid var(--line);padding:24px;background:var(--panel);}
.bundle h3{font-size:26px;}
.bundle .bp{font-family:'Anton',sans-serif;font-size:34px;margin:10px 0 6px;}
.bundle p{color:var(--mute);font-size:14px;}
.bundle.hero-b{border-color:var(--paper);}

/* CHAMBERS */
.chambers{background:var(--paper);color:var(--ink);}
.chambers .eyebrow{color:#666;}
.chambers .secsub{color:#444;}
.chamgrid{display:grid;grid-template-columns:1fr;gap:16px;margin-top:28px;}
@media(min-width:760px){.chamgrid{grid-template-columns:1fr 1fr 1fr 1fr;}}
.cham{border:1px solid #d9d9d9;padding:20px;}
.cham b{font-family:'Anton',sans-serif;font-size:20px;display:block;text-transform:uppercase;}
.cham span{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#666;display:block;margin:8px 0;}
.cham em{font-family:'Anton',sans-serif;font-size:24px;font-style:normal;}

/* CAPTURE */
.capture{max-width:560px;}
.row{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;}
input[type=email]{flex:1 1 240px;background:transparent;border:1px solid var(--line);color:var(--paper);font-family:'Space Mono',monospace;font-size:13px;padding:15px 14px;outline:none;}
input[type=email]:focus{border-color:var(--paper);}
input::placeholder{color:#5a5a5a;}
.msg{margin-top:12px;font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);min-height:16px;}

/* FAQ */
details{border-top:1px solid var(--line);padding:18px 0;}
details:last-of-type{border-bottom:1px solid var(--line);}
summary{cursor:pointer;font-family:'Anton',sans-serif;font-size:18px;text-transform:uppercase;list-style:none;display:flex;justify-content:space-between;gap:16px;}
summary::-webkit-details-marker{display:none;}
summary::after{content:"+";color:var(--mute);}
details[open] summary::after{content:"–";}
details p, details ul{color:var(--mute);font-size:14px;margin-top:12px;}
details ul{padding-left:18px;}
details li{margin-bottom:6px;}

/* FOOTER */
footer{padding:48px 0 60px;}
.fgrid{display:grid;grid-template-columns:1fr;gap:28px;}
@media(min-width:760px){.fgrid{grid-template-columns:2fr 1fr 1fr;}}
.fgrid h4{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);margin-bottom:12px;}
.fgrid a{display:block;text-decoration:none;font-size:14px;color:var(--paper);margin-bottom:8px;}
.fgrid a:hover{color:var(--mute);}
.disc{margin-top:36px;padding-top:22px;border-top:1px solid var(--line);font-size:11.5px;line-height:1.85;color:#9a9a9a;max-width:900px;}
.colophon{margin-top:16px;font-family:'Space Mono',monospace;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:#9a9a9a;}
.gap{background:#2a1a00;border:1px dashed #7a5a10;color:#e0b45c;font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding:8px 12px;margin:10px 0;}

/* ---------- CART DRAWER ---------- */
.cartbtn{position:relative;}
.cartbtn .badge{position:absolute;top:-7px;right:-9px;background:#fff;color:#000;font-family:'Space Mono',monospace;font-size:10px;min-width:19px;height:19px;border-radius:19px;display:flex;align-items:center;justify-content:center;font-weight:700;}
.scrim{position:fixed;inset:0;background:rgba(0,0,0,.7);opacity:0;pointer-events:none;transition:opacity .22s;z-index:80;}
.scrim.on{opacity:1;pointer-events:auto;}
.drawer{position:fixed;top:0;right:0;height:100%;width:100%;max-width:440px;background:var(--ink);border-left:1px solid var(--line);z-index:90;transform:translateX(102%);transition:transform .26s ease;display:flex;flex-direction:column;}
.drawer.on{transform:translateX(0);}
.dhead{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--line);}
.dhead h3{font-size:22px;}
.dclose{background:none;border:0;color:var(--mute);font-size:26px;line-height:1;cursor:pointer;}
.ditems{flex:1;overflow-y:auto;padding:6px 20px 20px;}
.ditem{display:flex;gap:12px;padding:16px 0;border-bottom:1px solid var(--line);}
.ditem .dn{font-family:'Anton',sans-serif;font-size:15px;text-transform:uppercase;line-height:1.1;}
.ditem .dm{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);margin-top:4px;}
.qtybox{display:flex;align-items:center;gap:10px;margin-top:8px;}
.qtybox button{background:transparent;border:1px solid var(--line);color:#fff;width:26px;height:26px;cursor:pointer;font-size:14px;line-height:1;}
.qtybox span{font-family:'Space Mono',monospace;font-size:12px;min-width:18px;text-align:center;}
.ditem .dp{margin-left:auto;font-family:'Anton',sans-serif;font-size:16px;white-space:nowrap;}
.dfoot{border-top:1px solid var(--line);padding:18px 20px 22px;}
.sumline{display:flex;justify-content:space-between;font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);margin-bottom:8px;}
.sumline.total{color:#fff;font-family:'Anton',sans-serif;font-size:22px;letter-spacing:.02em;margin:12px 0 4px;}
.sumline.save{color:#7ed957;}
.nudge{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:#e0b45c;border:1px dashed #6a5218;padding:8px 10px;margin-bottom:12px;}
.shiphead{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute);margin:16px 0 8px;}
.ship{display:flex;gap:8px;margin:0 0 14px;}
.ship label{flex:1;border:1px solid var(--line);padding:12px 10px;cursor:pointer;font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--mute);line-height:1.7;}
.ship label b{color:#fff;font-family:'Anton',sans-serif;font-size:13px;letter-spacing:.04em;font-weight:400;}
.ship label em{font-style:normal;color:#fff;font-family:'Anton',sans-serif;font-size:16px;}
.ship label:hover{border-color:#555;}
.ship input{display:none;}
.ship label.sel{border-color:#fff;color:#fff;background:#181818;}
button[disabled]{opacity:.4;cursor:not-allowed;}
.field{margin-bottom:10px;}
.field input{width:100%;background:transparent;border:1px solid var(--line);color:#fff;font-family:'Space Mono',monospace;font-size:12.5px;padding:12px;outline:none;}
.field input:focus{border-color:#fff;}
.err{color:#ff6b6b;font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.06em;text-transform:uppercase;min-height:14px;margin-top:6px;}
.empty{color:var(--mute);font-family:'Space Mono',monospace;font-size:12px;text-align:center;padding:50px 0;}
.paying{opacity:.5;pointer-events:none;}
.done{padding:40px 20px;text-align:center;}
.done h3{font-size:34px;margin-bottom:14px;}
.done p{color:var(--mute);font-size:14px;margin-bottom:10px;}
.done .ref{font-family:'Space Mono',monospace;font-size:16px;color:#fff;letter-spacing:.1em;margin:16px 0;}

/* ---------- VOUCHERS, MUG, EXTRAS (v2 merge) ---------- */
.vamt.sel-amt{background:#fff;color:#000;}

/* ---------- CODE FIELD (coupons and gift vouchers) ---------- */
.codebox{margin:14px 0;}
.coderow{display:flex;gap:8px;}
.coderow input{flex:1;background:transparent;border:1px solid var(--line);color:#fff;font-family:'Space Mono',monospace;font-size:12px;padding:11px 12px;outline:none;}
.coderow input:focus{border-color:#fff;}
.coderow .btn.ghost{padding:11px 16px;font-size:12px;white-space:nowrap;}
.codeok{border:1px solid #7ed957;color:#7ed957;font-family:'Space Mono',monospace;font-size:11px;padding:10px 12px;display:flex;justify-content:space-between;align-items:center;gap:10px;}
.codeok button{background:none;border:0;color:#7ed957;text-decoration:underline;font-family:'Space Mono',monospace;font-size:10px;cursor:pointer;padding:0;}

/* ---------- COLOUR SWATCHES ---------- */
.swatches{display:flex;gap:8px;margin-bottom:8px;}
.swatch{width:26px;height:26px;border-radius:50%;border:2px solid #333;cursor:pointer;padding:0;position:relative;transition:border-color .15s;}
.swatch.black{background:#0A0A0A;}
.swatch.white{background:#F2F2F2;}
.swatch.active{border-color:#fff;}
.swatch.active:after{content:'';position:absolute;inset:-5px;border:1px solid #fff;border-radius:50%;}

/* ---------- SOLD OUT / LOW STOCK ---------- */
.buy.soldout{background:transparent;color:#555;border:1px solid var(--line);cursor:not-allowed;}
.soldout-badge{position:absolute;top:12px;right:12px;z-index:3;background:#fff;color:#000;font-family:'Space Mono',monospace;font-size:9px;letter-spacing:.15em;text-transform:uppercase;padding:4px 9px;}
.art.dim{filter:grayscale(60%) brightness(.55);}
.card.is-soldout .cname{color:#777;}
.lowstock{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#e0b45c;margin-top:-4px;}

/* ---------- FIT SELECTOR ---------- */
.fit-opts{display:flex;gap:8px;margin-bottom:4px;}
.fit-label{flex:1;border:1px solid var(--line);padding:10px 10px 8px;cursor:pointer;display:flex;flex-direction:column;gap:2px;transition:border-color .15s,background .15s;}
.fit-label:hover{border-color:#555;}
.fit-label.sel{border-color:var(--paper);background:#181818;}
.fit-name{font-family:'Anton',sans-serif;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--paper);}
.fit-spec{font-family:'Space Mono',monospace;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);}
.fit-price{font-family:'Anton',sans-serif;font-size:16px;color:var(--paper);margin-top:4px;}

/* ---------- MOBILE NAV ---------- */
.burger{display:flex;flex-direction:column;justify-content:center;gap:5px;width:36px;height:36px;background:none;border:0;cursor:pointer;padding:4px;margin-right:4px;}
.burger span{display:block;height:2px;background:var(--paper);transition:transform .22s, opacity .22s;}
@media(min-width:900px){.burger{display:none;}}
.mob-nav{display:none;position:fixed;top:72px;left:0;right:0;background:var(--ink);border-bottom:1px solid var(--line);z-index:49;padding:0;}
.mob-nav.on{display:block;}
@media(min-width:900px){.mob-nav{display:none!important;}}
.mob-links{display:flex;flex-direction:column;}
.mob-link{display:block;padding:16px 22px;font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);text-decoration:none;border-bottom:1px solid var(--line);}
.mob-link:hover,.mob-link:active{color:var(--paper);}

/* ---------- MOBILE FIXES ---------- */
/* ship options stack on narrow screens */
@media(max-width:480px){
  .ship{flex-direction:column;}
  .fit-opts{flex-direction:column;}
  .hcta{font-size:12px;padding:9px 13px;}
  .drawer{max-width:100%;}
  .dfoot{padding:14px 16px 18px;}
  .bundle{padding:18px;}
  .cham{padding:16px;}
  section{padding:40px 0;}
  .hero{padding:44px 0 30px;}
  .hero h1{line-height:.88;}
  .opts select{flex:1 1 100%;}
}
/* prevent horizontal scroll site-wide */
body{overflow-x:hidden;}
img{max-width:100%;}

/* v2: checkout drawer scroll fix */
.drawer{overflow-y:auto;-webkit-overflow-scrolling:touch;max-height:100vh;max-height:100dvh}
.drawer .ditems{flex:0 0 auto;height:auto;overflow:visible}
.drawer .dfoot{flex-shrink:0;padding-bottom:max(16px,env(safe-area-inset-bottom))}

/* Fix Session 3: Worn layer hidden until requested, Worn button, black quote label */
.art.side-lifestyle { opacity: 0; pointer-events: none; transition: opacity .25s; }
.artwrap.worn .art.side-lifestyle { opacity: 1; pointer-events: auto; }
.artwrap.worn .art.side-front,
.artwrap.worn .art.side-back { opacity: 0; pointer-events: none; }
.artwrap.worn .flip .flbl.active { opacity: .5; }
.worn-btn { position: absolute; bottom: 8px; right: 12px; z-index: 3; font-family: "Space Mono", monospace; font-size: 9px; letter-spacing: .1em; text-transform: uppercase; background: rgba(0,0,0,.55); color: #fff; border: 1px solid #666; border-radius: 20px; padding: 3px 10px; cursor: pointer; }
.worn-btn.active { background: #fff; color: #000; border-color: #fff; }
.artwrap .qn { color: #000; text-shadow: 0 1px 2px rgba(255,255,255,.6); }

/* Fix Session 3: square card frame to match 1000 x 1000 mockups */
.artwrap { aspect-ratio: 1 / 1; }

/* Fix Session 3b: scrolling ticker on desktop and mobile */
#ticker { overflow: hidden; white-space: nowrap; }
#ticker .vv-track { display: inline-flex; align-items: center; animation: vvTicker 90s linear infinite; will-change: transform; }
#ticker:hover .vv-track { animation-play-state: paused; }
@keyframes vvTicker { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { #ticker .vv-track { animation: none; } }

/* Colour picker sits directly under the price, with a label */
.cbody { display: flex; flex-direction: column; }
.cbody .cname { order: 1; }
.cbody .cmeta { order: 2; }
.cbody .price { order: 3; }
.cbody .opts { order: 4; }
.cbody .fit-opts { order: 5; }
.cbody .buy { order: 6; }
.cbody .opts .swatches::before { content: "PICK YOUR COLOUR"; font-family: "Space Mono", monospace; font-size: 9px; letter-spacing: .12em; opacity: .7; align-self: center; margin-right: 8px; white-space: nowrap; }

/* Fix Session 3b: mobile header fit (logo, menu and cart were clipped) */
@media (max-width: 900px) {
  html, body { max-width: 100%; overflow-x: hidden; }
  .wrap { padding-left: 16px; padding-right: 16px; }
  .hbar { gap: 10px; }
  .logo img { height: 36px; }
  .hcta { padding: 9px 12px; font-size: 11px; letter-spacing: .05em; }
  .burger { margin-right: 0; width: 32px; }
  img, svg, video { max-width: 100%; }
  .drawer, .dhead, .ditems, .dfoot { max-width: 100vw; box-sizing: border-box; }
  .hero h1 { overflow-wrap: anywhere; }
}
@media (max-width: 400px) {
  .wrap { padding-left: 12px; padding-right: 12px; }
  .logo img { height: 32px; }
  .hcta { padding: 8px 10px; font-size: 10px; }
}

/* Fix Session 3b: cart remove and clear controls */
.vv-remove { background: none; border: 0; color: inherit; opacity: .6; font-family: "Space Mono", monospace; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; text-decoration: underline; cursor: pointer; padding: 4px 0 0; }
.vv-remove:hover { opacity: 1; }
.vv-clear { margin-left: auto; background: none; border: 1px solid currentColor; color: inherit; font-family: "Space Mono", monospace; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; border-radius: 20px; padding: 5px 12px; cursor: pointer; }
.vv-clear:hover { background: #fff; color: #000; }
.dhead { display: flex; align-items: center; gap: 10px; }

/* Fix Session 3b: delivery option bands */
.vv-band { font-family: "Space Mono", monospace; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; opacity: .7; margin: 12px 0 6px; }
.ship label { position: relative; padding-right: 76px; }
.ship .vv-price { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-weight: 700; }

/* Fix Session 3b: EFT button */
.vv-eft { width: 100%; margin-top: 8px; background: none; border: 1px solid currentColor; color: inherit; font-family: Anton, sans-serif; font-size: 15px; letter-spacing: .06em; text-transform: uppercase; padding: 12px 14px; cursor: pointer; }
.vv-eft:hover:not([disabled]) { background: #fff; color: #000; }
.vv-eft[disabled] { opacity: .45; cursor: not-allowed; }

/* Fix Session 3b: delivery list layout (vertical on all screens) */
.ship { display: flex; flex-direction: column; gap: 6px; margin: 0 0 14px; }
.ship .vv-band { margin: 10px 0 2px; }
.ship .vv-band:first-child { margin-top: 0; }
.ship label { flex: none; width: 100%; box-sizing: border-box; display: block; padding: 11px 92px 11px 14px; text-transform: none; letter-spacing: .02em; font-size: 11px; line-height: 1.45; color: #aaa; }
.ship label b { display: block; font-size: 15px; text-transform: uppercase; margin-bottom: 2px; }
.ship label br { display: none; }
.ship .vv-price { right: 14px; font-family: Anton, sans-serif; font-weight: 400; font-size: 16px; color: #fff; letter-spacing: .02em; }
@media (max-width: 480px) {
  .ship label { padding: 10px 80px 10px 12px; font-size: 11px; }
  .ship .vv-price { right: 12px; font-size: 15px; }
}

/* Fix Session 3b: Learned Friend landscape tiles, 3 / 2 / 1 per row */
.chamgrid { grid-template-columns: repeat(3, 1fr); }
.cham { aspect-ratio: 3 / 2; display: flex; flex-direction: column; box-sizing: border-box; }
.cham .btn { margin-top: auto !important; }
@media (max-width: 900px) { .chamgrid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .chamgrid { grid-template-columns: 1fr; } }

/* Fix Session 3b: Catalogue tiles with an uploaded landscape image */
.cham.has-img { position: relative; background-size: cover; background-position: center; color: #fff; border-color: transparent; overflow: hidden; }
.cham.has-img::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 30%, rgba(0,0,0,.78) 100%); pointer-events: none; }
.cham.has-img > * { position: relative; }
.cham.has-img span { color: #ddd; }
.cham.has-img b { margin-top: auto; }

/* Phase 2 (28 Sept 2026): Learned Friend and For the Office tabs, product cards, three-image sliders */
.mrange { display: grid; grid-template-columns: 1fr 1fr; border: 2px solid var(--ink); margin: 0 0 30px; }
.mrange-btn { background: transparent; color: var(--ink); border: 0; padding: 16px 12px; cursor: pointer; font-family: Anton, sans-serif; font-size: clamp(18px, 3.4vw, 28px); letter-spacing: .02em; text-transform: uppercase; line-height: 1; }
.mrange-btn + .mrange-btn { border-left: 2px solid var(--ink); }
.mrange-btn small { display: block; font-family: "Space Mono", monospace; font-size: 10px; letter-spacing: .14em; margin-top: 8px; opacity: .7; }
.mrange-btn.on { background: var(--ink); color: var(--paper); }
.mpanel[hidden] { display: none; }
.mgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 28px; }
@media (max-width: 900px) { .mgrid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .mgrid { grid-template-columns: 1fr; } }
.mcard { border: 1px solid #d9d9d9; display: flex; flex-direction: column; background: #fff; min-width: 0; }
.mslider { position: relative; }
.mtrack { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; aspect-ratio: 1 / 1; background: #f2f2f2; }
.mtrack::-webkit-scrollbar { display: none; }
.mslide { flex: 0 0 100%; scroll-snap-align: start; position: relative; }
.mslide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mslide.mph { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 20px; background: var(--ink); color: var(--paper); }
.mslide.mph b { font-family: Anton, sans-serif; font-size: clamp(22px, 3vw, 30px); text-transform: uppercase; line-height: 1; }
.mslide.mph small { font-family: "Space Mono", monospace; font-size: 9px; letter-spacing: .16em; text-transform: uppercase; opacity: .6; margin-top: 10px; }
.mtabs { position: absolute; left: 10px; bottom: 10px; display: flex; gap: 4px; background: rgba(0,0,0,.55); padding: 4px; border-radius: 20px; }
.mtab { background: none; border: 0; color: #bbb; font-family: "Space Mono", monospace; font-size: 9px; letter-spacing: .1em; text-transform: uppercase; padding: 4px 9px; border-radius: 20px; cursor: pointer; }
.mtab.on { background: #fff; color: #000; }
.mbody { padding: 16px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.mname { font-family: Anton, sans-serif; font-size: 20px; text-transform: uppercase; line-height: 1.05; }
.mmeta { font-family: "Space Mono", monospace; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: #666; }
.mprice { font-family: Anton, sans-serif; font-size: 24px; font-style: normal; }
.mopts { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.mopts label { flex: 1 1 45%; display: flex; flex-direction: column; gap: 4px; font-family: "Space Mono", monospace; font-size: 9px; letter-spacing: .14em; text-transform: uppercase; color: #666; }
.mopts select { background: #fff; color: var(--ink); border: 1px solid #bbb; flex: none; width: 100%; }
.mfixed { border: 1px solid #ddd; padding: 9px 10px; font-size: 11px; color: var(--ink); letter-spacing: .06em; }
.mbuy { display: block; text-align: center; margin-top: auto !important; background: var(--ink); color: #fff; border-color: var(--ink); font-size: 12px; padding: 12px; }
.mbody .mopts + .mbuy, .mbody .mprice + .mbuy { margin-top: 10px; }
.mcard.mbulk { background: #111; color: #fff; border-color: #111; padding: 20px; justify-content: flex-end; min-height: 200px; }
.mcard.mbulk b { font-family: Anton, sans-serif; font-size: 24px; text-transform: uppercase; }
.mcard.mbulk span { font-family: "Space Mono", monospace; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: #999; margin: 8px 0 14px; display: block; }
.mcard.mbulk a { font-family: Anton, sans-serif; font-size: 16px; color: #fff; text-decoration: underline; }