/** Shopify CDN: Minification failed

Line 1390:21 Unexpected "@keyframes"

**/

/* Bevanda site rebuild v1. Direction: Nike (light store mechanics) x Ferrari (dark cinematic bands).
   Tokens: brand/design-system.md. Display Teko + body Work Sans per Cameron 2026-09-30. */
:root{
  --orange:#F1542D;--radius:8px;--orange-strong:#C64525;--orange-stronger:#A4391F;
  --asphalt:#202020;--night:#161616;--chalk:#ECEBE9;--cloud:#F5F4F2;--dust:#B5AF9F;--warm:#6C645D;--slate:#424951;--white:#FFFFFF;
  --success:#4C7A5E;
  --display:'Teko','Arial Narrow',sans-serif;--body:'Work Sans',system-ui,sans-serif;
  --wrap:1360px;--pad:clamp(16px,4.5vw,48px);--sec:clamp(64px,9vw,128px);--ease:cubic-bezier(.2,.8,.2,1);
  --line:rgba(32,32,32,.14);--line-d:rgba(181,175,159,.28);
  --hdr:64px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hdr) + 12px)}
body{margin:0;background:var(--white);color:var(--asphalt);font:400 1rem/1.6 var(--body);overflow-x:hidden}
img,video{max-width:100%;display:block}
img{height:auto}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
[hidden]{display:none!important}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}
.sec{padding:var(--sec) 0;position:relative}
.cloud{background:var(--cloud)}
.chalk{background:var(--chalk)}
.dark{background:var(--night);color:var(--chalk)}
.dark2{background:var(--asphalt);color:var(--chalk)}
h1,h2,h3{font-family:var(--display);text-transform:uppercase;font-weight:600;margin:0;text-wrap:balance;letter-spacing:.01em}
h2{font-size:clamp(2.8rem,7vw,5.6rem);line-height:.86}
h3{font-size:clamp(1.7rem,3vw,2.3rem);line-height:.92}
p{margin:0}
.muted{color:var(--warm)}
.dark .muted,.dark2 .muted{color:var(--dust)}
.micro{font:600 .72rem/1.3 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--warm)}
.dark .micro,.dark2 .micro{color:var(--dust)}
.on-media .micro{color:var(--chalk)}
.ftr .muted,.formsec .muted,.crewband .muted{color:var(--dust)}
.hl{color:var(--orange)}
.light-hl{color:var(--orange-strong)}
h2.bar::after{content:"";display:block;width:72px;height:6px;margin-top:20px;background:var(--orange);transform-origin:left}
.stack>*+*{margin-top:var(--gap,20px)}
.lede{font-size:clamp(1.05rem,1.6vw,1.2rem);line-height:1.55;max-width:46ch}
.body{max-width:60ch}
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:clamp(28px,4vw,48px)}
.textlink{font:600 .82rem/1 var(--body);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-bottom:2px solid currentColor;padding-bottom:5px}
.textlink:hover{color:var(--orange-strong)}
.dark .textlink:hover,.dark2 .textlink:hover{color:var(--orange)}

/* ---------- buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:6px 30px 0;border-radius:var(--radius);font:700 1.35rem/1 var(--display);letter-spacing:.07em;text-transform:uppercase;text-decoration:none;white-space:nowrap;border:2px solid transparent;cursor:pointer;overflow:hidden;isolation:isolate;transition:transform .25s var(--ease),color .25s,border-color .25s}
.btn .arr{display:inline-block;transition:transform .3s var(--ease);margin-top:-5px}
.btn:hover .arr{transform:translateX(5px)}
.btn:active{transform:translateY(1px) scale(.98)}
.btn-primary{background:var(--orange);color:var(--white)}
/* orange buttons darken in place on hover, no sliding fill (Josh, Nov 4) */
.btn-primary{transition:background .2s}
.btn-primary:hover{background:var(--orange-stronger)}
.btn-primary[disabled]{background:var(--warm);cursor:not-allowed}

.btn-ink{background:var(--asphalt);color:var(--white)}
.btn-ink::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--orange-stronger);transform:translateX(-101%);transition:transform .35s var(--ease)}
.btn-ink:hover::before{transform:none}
.btn-ghost{background:transparent;color:var(--asphalt);border-color:var(--asphalt)}
.btn-ghost::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--asphalt);transform:translateY(101%);transition:transform .35s var(--ease)}
.btn-ghost:hover{color:var(--chalk)}
.btn-ghost:hover::before{transform:none}
.dark .btn-ghost,.dark2 .btn-ghost,.on-media .btn-ghost{color:var(--chalk);border-color:var(--chalk)}
.dark .btn-ghost::before,.dark2 .btn-ghost::before,.on-media .btn-ghost::before{background:var(--chalk)}
.dark .btn-ghost:hover,.dark2 .btn-ghost:hover,.on-media .btn-ghost:hover{color:var(--asphalt)}
.btns{display:flex;flex-wrap:wrap;gap:12px}

/* ---------- header ---------- */
.topbar{background:var(--asphalt);color:var(--chalk);font:500 .78rem/1.3 var(--body);letter-spacing:.04em;text-align:center;padding:9px var(--pad)}
.topbar b{font-weight:600}
.hdr{position:sticky;top:env(safe-area-inset-top,0px);z-index:80;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.hdr .in{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad);height:var(--hdr);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px}
.logo img{height:20px;width:auto}
.nav{display:none;justify-content:center;gap:clamp(14px,2vw,28px)}
.nav a{font:600 .92rem/1 var(--body);white-space:nowrap;text-decoration:none;padding:10px 2px;border-bottom:2px solid transparent;transition:border-color .2s}
.nav a:hover,.nav a[aria-current="page"]{border-color:var(--asphalt)}
.util{display:flex;gap:4px;justify-content:end}
.icon-btn{position:relative;display:grid;place-items:center;width:44px;height:44px;border:0;background:none;border-radius:999px;cursor:pointer;text-decoration:none;transition:background .2s}
.icon-btn:hover{background:var(--cloud)}
.icon-btn svg{width:22px;height:22px}
.cart-count{position:absolute;top:4px;right:2px;min-width:18px;height:18px;padding:0 4px;border-radius:99px;background:var(--orange-strong);color:var(--white);font:600 .68rem/18px var(--body);text-align:center}
.menu-btn{justify-self:start}
@media (min-width:1080px){.nav{display:flex}.menu-btn{display:none}.hdr .in{grid-template-columns:200px 1fr 200px}}
/* five shop links: keep them on one line on small laptops */
@media (min-width:1080px) and (max-width:1279px){.nav{gap:16px}.nav a{font-size:.86rem}.hdr .in{grid-template-columns:170px 1fr auto}}
@media (max-width:1079px){.hdr .in{grid-template-columns:1fr auto 1fr}.logo{justify-self:center}}
@media (min-width:1080px) and (max-width:1199px){.nav{gap:9px}.nav a{font-size:.8rem}.hdr .in{grid-template-columns:128px 1fr auto;gap:10px}.util .hdr-cta{margin-right:0;padding:3px 10px 0;font-size:.95rem}.util .icon-btn{width:36px}}
.drawer{position:fixed;inset:0;z-index:90;display:grid;grid-template-columns:min(380px,88vw) 1fr;visibility:hidden;transition:visibility 0s .35s}
.drawer.on{visibility:visible;transition:none}
.drawer .panel{background:var(--white);padding:20px var(--pad) 40px;overflow:auto;transform:translateX(-100%);transition:transform .35s var(--ease)}
.drawer.on .panel{transform:none}
.drawer .scrim{background:rgba(22,22,22,.5);opacity:0;transition:opacity .35s;border:0}
.drawer.on .scrim{opacity:1}
.drawer nav{display:grid;margin-top:24px}
.drawer nav a{font:600 2.4rem/1 var(--display);text-transform:uppercase;text-decoration:none;padding:14px 0 8px;border-bottom:1px solid var(--line)}
.drawer nav a.sm{font:500 1rem/1 var(--body);text-transform:none;padding:16px 0}

/* ---------- media bands (Ferrari cinema) ---------- */
.media{position:relative;overflow:hidden;display:grid;background:var(--night);color:var(--chalk)}
.media .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.media::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(22,22,22,.94) 0%,rgba(22,22,22,.4) 45%,rgba(22,22,22,.08) 75%)}
.media .inner{position:relative;z-index:2;align-self:end;width:100%;display:grid;gap:24px;padding-top:120px;padding-bottom:clamp(36px,6vw,80px)}
@media (min-width:900px){
  .media::after{background:linear-gradient(90deg,rgba(22,22,22,.86) 0%,rgba(22,22,22,.3) 46%,transparent 66%),linear-gradient(0deg,rgba(22,22,22,.85) 0%,transparent 45%)}
  .media .inner{grid-template-columns:1fr auto;align-items:end;gap:48px}
}
.hero-home{min-height:min(calc(100svh - var(--hdr) - 34px),900px)}
.hero-home h1{font-size:clamp(3.6rem,13vw,9.6rem);line-height:.84;font-weight:700}
.hero-home h1 .line{display:block;animation:rise 1s var(--ease) both}
.hero-home h1 .line:nth-child(2){animation-delay:.12s}
.hero-home .side{display:grid;gap:22px;max-width:400px}
.vid-toggle{position:absolute;z-index:3;right:var(--pad);top:18px;width:44px;height:44px;border-radius:999px;border:1px solid rgba(236,235,233,.5);background:rgba(22,22,22,.4);color:var(--chalk);cursor:pointer;display:grid;place-items:center}
.vid-toggle svg{width:16px;height:16px}

/* ---------- category tiles (Nike) ---------- */
.cats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (min-width:900px){.cats{grid-template-columns:repeat(4,1fr);gap:14px}}
.cat{display:grid;gap:12px;text-decoration:none}
.cat .ph{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--cloud)}
.cat .ph img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.cat:hover .ph img{transform:scale(1.05)}
.cat h3{font-size:clamp(1.6rem,2.6vw,2.2rem)}
.cat p{font-size:.88rem;color:var(--warm);line-height:1.45}

/* ---------- product cards ---------- */
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 10px}
@media (min-width:760px){.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 14px}}
@media (min-width:1180px){.grid.g4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.card{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;text-decoration:none;align-content:start}
.card .ph{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--white);border:1px solid var(--line)}
.cloud .card .ph{border-color:transparent}
.card .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:6%;transition:opacity .45s var(--ease),transform .7s var(--ease)}
.card .ph-tk{position:absolute;inset:0;display:grid;place-items:center;padding:12px;background:var(--cloud);color:var(--warm);font:600 .8rem/1.3 var(--body);text-align:center}
.card .ph img+img{opacity:0;object-fit:cover;padding:0}
.card:hover .ph img+img{opacity:1}
.card:hover .ph img:first-child{transform:scale(1.04)}
.card .ph.topo{border-color:var(--line);background:#fff}
.card .ph.topo img{object-fit:cover;padding:0}
.v50-hold{background:var(--asphalt);color:var(--chalk);min-height:clamp(320px,34vw,490px);display:grid;align-items:center}
.v50-hold .wrap{width:100%;box-sizing:border-box}
.v50-hold .micro{font:600 .72rem/1.3 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--dust);margin:0 0 12px}
.v50-hold .tk{font:600 clamp(1.6rem,3vw,2.4rem)/1.05 var(--display);text-transform:uppercase;max-width:28ch;margin:0}
/* Nov 6 (Cam + Josh call): faint topo behind the home category and bundle rows, product tiles stay white */
.topo-sec{background:#fff url(/cdn/shop/files/bvs-img-topo-section.jpg) center/cover no-repeat}
.topo-sec .cat .ph{background:#fff}
.card:hover .ph.topo img+img{transform:scale(1.04)}
.bt-pick{align-items:center;margin:-8px 0 18px}.bt-pick .pill{min-height:34px;font-size:.8rem}.bt-lab{flex:none;font:600 .7rem/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--warm);margin-right:4px}
.card .flag{position:absolute;z-index:2;left:10px;top:10px;font:600 .66rem/1 var(--body);letter-spacing:.12em;text-transform:uppercase;background:var(--asphalt);color:var(--white);padding:7px 10px;border-radius:4px}
.card .flag.soon,.card .flag.sale{background:var(--orange-strong)}
.card .flag.cust{background:var(--orange-strong)}
/* Kickflip custom products (Nov 6): Custom tag by the title, no colors or qty, Customize opens the live Kickflip page */
.ctag{display:inline-block;vertical-align:top;margin:.08em 0 0 .25em;font:600 .78rem/1 var(--body);letter-spacing:.14em;text-transform:uppercase;background:var(--orange-strong);color:var(--white);padding:7px 10px 6px;border-radius:4px}
.csteps .spec .v{color:var(--orange-strong)}
.card .nm{font:600 1rem/1.3 var(--body)}
.card .meta{font-size:.88rem;color:var(--warm)}
.price-line{display:flex;gap:10px;align-items:baseline;font-weight:600}
.price-line s{font-weight:400;color:var(--warm)}
/* on sale: price in orange, crossed-out compare-at stays muted */
.price-line.sale,.price-big.sale{color:var(--orange)}
.addon .p.sale{color:var(--orange)}
.cd-item .pr.sale{color:var(--orange-strong)}
/* home feature tiles (.fcard): sale price stays white, not orange (Josh, Nov 4) */

.crew-tile{display:grid;align-content:space-between;gap:24px;padding:clamp(22px,3vw,32px);background:var(--asphalt);color:var(--chalk);text-decoration:none;aspect-ratio:1/1}
.crew-tile h3{font-size:clamp(1.8rem,3vw,2.8rem);line-height:.86}
.crew-tile:hover .go{transform:translateX(6px)}
.crew-tile .go{font:700 2rem/1 var(--display);color:var(--orange);transition:transform .3s var(--ease)}

/* ---------- livery ticker ---------- */
.livery{background:var(--orange);color:var(--asphalt);overflow:hidden;padding:16px 0 8px;border-block:2px solid var(--asphalt)}
.ticker{display:flex;width:max-content;animation:marquee 38s linear infinite}
.livery:hover .ticker{animation-play-state:paused}
.ticker span{font:700 clamp(2.2rem,4.6vw,3.6rem)/1 var(--display);text-transform:uppercase;letter-spacing:.02em;white-space:nowrap;padding-right:.55em}
.ticker span::after{content:"/";padding-left:.55em;color:var(--white)}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---------- home: verge 50 banner ---------- */
.v50{min-height:min(70svh,640px)}
.v50 .bg{object-position:40% 50%}
.badge-soon{justify-self:start;font:600 .72rem/1 var(--body);letter-spacing:.16em;text-transform:uppercase;padding:9px 13px;border-radius:var(--radius);border:1px solid var(--orange);color:var(--chalk);background:rgba(241,84,45,.25)}
.v50 h2{font-size:clamp(3.4rem,9vw,7.5rem);line-height:.84}
.v50-buy{display:grid;gap:18px;justify-items:start;padding:22px 24px;border:1px solid rgba(236,235,233,.28);border-radius:var(--radius);background:rgba(22,22,22,.45);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.v50-price{font:700 clamp(2.8rem,5vw,4rem)/.85 var(--display);letter-spacing:.01em;padding-top:6px}
.v50-price span{display:block;margin-top:8px;font:600 .72rem/1.2 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--dust)}

/* ---------- reviews ---------- */
.rev-grid{display:grid;gap:48px}
@media (min-width:900px){.rev-grid{grid-template-columns:1.3fr 1fr;gap:96px}}
.bigquote{margin:0}
.bigquote blockquote{margin:0;font:600 clamp(2.2rem,5vw,4.2rem)/.94 var(--display);text-transform:uppercase}
.bigquote em{font-style:normal;color:var(--orange-strong)}
.dark .bigquote em{color:var(--orange)}
.bigquote cite,.quote cite{display:block;margin-top:18px;font:500 .9rem/1.4 var(--body);font-style:normal;color:var(--warm)}
.dark .bigquote cite,.dark .quote cite,.dark2 .quote cite{color:var(--dust)}
.quote{margin:0;padding-top:22px;border-top:1px solid var(--line)}
.dark .quote,.dark2 .quote{border-color:var(--line-d)}
.quote blockquote{margin:0;font-size:1.06rem;line-height:1.55}
.side-quotes{display:grid;gap:32px;align-content:end}

.rev-grid .bigquote,.rev-grid .quote{padding:clamp(22px,2.6vw,34px);border:1px solid var(--line);border-radius:var(--radius);background:var(--white)}
.dark .rev-grid .bigquote,.dark .rev-grid .quote,.dark2 .rev-grid .quote{background:rgba(255,255,255,.045);border-color:var(--line-d)}
@media (min-width:900px){.rev-grid{gap:20px!important}}
.rev-grid .bigquote{align-self:stretch;display:flex;flex-direction:column;justify-content:space-between}
.side-quotes{gap:16px!important}
.stars{display:block;margin-bottom:14px;color:var(--orange);font-size:1.1rem;letter-spacing:.18em;line-height:1}
.rev-grid .bigquote .stars{font-size:1.5rem}
/* ---------- welcome home ---------- */
.wh{display:grid;grid-template-columns:minmax(0,1fr);gap:36px;align-items:center}
@media (min-width:900px){.wh{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:80px}}
@media (max-width:599px){.wh .btn{white-space:normal;max-width:100%;text-align:left;line-height:1.15}}
.wh-photos{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:10px;align-items:end}
.wh-photos img{width:100%;height:auto;object-fit:cover}
.wh-photos img:first-child{aspect-ratio:1/1}
.wh-photos img:last-child{aspect-ratio:4/5}
.wh-photos.one{grid-template-columns:1fr}.wh-photos.one img{aspect-ratio:5/4;border-radius:var(--radius);object-position:50% 8%}
.wh h2{font-size:clamp(2.8rem,6vw,5rem)}
.pledge{display:grid;gap:10px;padding:22px;background:var(--white);border:1px solid var(--line)}
.pledge .row{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.pledge .amt{font:700 2.6rem/1 var(--display)}
.meter{position:relative;height:12px;border-radius:99px;background:var(--chalk);overflow:hidden}
.meter i{position:absolute;inset:0;background:repeating-linear-gradient(-45deg,var(--orange) 0 14px,var(--orange-strong) 14px 28px);background-size:40px 40px;animation:climb 1.6s linear infinite}
@keyframes climb{to{background-position:40px 0}}

/* ---------- makers band ---------- */
.makers-band{min-height:min(80svh,760px)}
.script{width:min(320px,60vw);height:auto}

/* ---------- collection ---------- */
.coll-hd{padding-top:clamp(28px,4vw,56px);padding-bottom:clamp(20px,3vw,32px);display:grid;gap:10px}
.coll-hd h1{font-size:clamp(3.4rem,9vw,7rem);line-height:.84;font-weight:700}
.crumbs{font:500 .8rem/1 var(--body);color:var(--warm)}
.crumbs a{text-decoration:none}.crumbs a:hover{color:var(--asphalt)}
.toolbar{position:sticky;top:var(--hdr);z-index:20;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line);margin-bottom:28px}
.toolbar .in{display:flex;gap:14px;align-items:center;justify-content:space-between;padding-block:10px}
.pills{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px}
.pills::-webkit-scrollbar{display:none}
.pill{flex:none;min-height:40px;padding:0 16px;border-radius:var(--radius);border:1px solid var(--line);background:var(--white);font:500 .88rem/1 var(--body);cursor:pointer;transition:background .2s,border-color .2s}
.pill:hover{border-color:var(--asphalt)}
.pill[aria-pressed="true"]{background:var(--asphalt);color:var(--white);border-color:var(--asphalt)}
.sort{flex:none;display:flex;align-items:center;gap:8px;font-size:.86rem}
.sort select{min-height:40px;border:1px solid var(--line);border-radius:var(--radius);padding:0 12px;background:var(--white);font:500 .86rem var(--body)}
.count{font-size:.86rem;color:var(--warm);margin-bottom:16px}
@media (max-width:640px){.toolbar .in{flex-wrap:wrap}.sort label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}

/* ---------- PDP (Verge 10) ---------- */
.buy{padding:clamp(16px,2.5vw,32px) 0 clamp(56px,7vw,96px)}
.buy-grid{display:grid;gap:32px}
@media (min-width:980px){.buy-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:64px;align-items:stretch}}  /* stretch: the buy column runs the full height of the photos, so its button stays pinned while you look through them */
.gallery{display:grid;gap:10px;align-self:start;align-content:start}
@media (min-width:980px){.gallery{position:sticky;top:calc(var(--hdr) + 16px)}}
.stage{position:relative;aspect-ratio:1/1;background:var(--white);border:1px solid var(--line);overflow:hidden}
.stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .35s var(--ease),transform .6s var(--ease)}
.stage img.fade{opacity:0;transform:scale(1.02)}
.stage .badge{position:absolute;left:14px;top:14px;z-index:2;font:700 1.05rem/1 var(--display);letter-spacing:.08em;text-transform:uppercase;background:var(--asphalt);color:var(--chalk);padding:9px 14px 5px;border-radius:999px}
.gnav{position:absolute;top:50%;z-index:2;width:44px;height:44px;margin-top:-22px;display:grid;place-items:center;border:0;border-radius:999px;background:rgba(255,255,255,.88);color:var(--asphalt);cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.18);transition:background .2s}
.gnav:hover{background:#fff}.gnav.prev{left:12px}.gnav.next{right:12px}
.gnav svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.gcount{position:absolute;right:14px;bottom:14px;z-index:2;font:600 .8rem/1 var(--body);background:rgba(27,26,23,.72);color:#fff;padding:6px 10px;border-radius:999px}
.thumbs{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.thumbs button{padding:0;border:2px solid transparent;overflow:hidden;background:var(--white);aspect-ratio:1/1;cursor:pointer;transition:border-color .2s}
.thumbs button[aria-current="true"]{border-color:var(--asphalt)}
.thumbs img{width:100%;height:100%;object-fit:cover}
.info{display:grid;gap:20px}
.info h1{font-size:clamp(4.6rem,10vw,8rem);line-height:.8;font-weight:700}
.info h1 .hl{margin-left:.06em}
.subtitle{font:600 .8rem/1.3 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--warm)}
.price-row{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.price-big{font:700 2.8rem/1 var(--display);letter-spacing:.01em}
.price-big s{font-size:.6em;color:var(--warm);font-weight:500;margin-left:10px}
.stock{font:600 .78rem/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--success)}
.stock.out{color:var(--asphalt)}
.stock.out::before{content:"";display:inline-block;width:8px;height:8px;border-radius:99px;background:var(--orange);margin-right:8px;vertical-align:1px}
.pitch{font-size:1.06rem;line-height:1.6;max-width:50ch;color:var(--warm)}
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.chips li{font:600 .74rem/1 var(--body);letter-spacing:.1em;text-transform:uppercase;padding:10px 13px;border:1px solid var(--line);border-radius:999px}
.opt-label{display:flex;justify-content:space-between;gap:12px;font:600 .78rem/1.3 var(--body);letter-spacing:.12em;text-transform:uppercase;margin-bottom:12px}
.opt-label span:last-child{letter-spacing:.02em;text-transform:none;font-weight:500;color:var(--warm)}
.swatches{display:flex;flex-wrap:wrap;gap:10px}
.sw{position:relative;width:56px;height:56px;padding:0;border-radius:999px;border:1px solid var(--line);background:var(--white);overflow:hidden;cursor:pointer;transition:transform .2s var(--ease)}
.sw img{width:100%;height:100%;object-fit:cover;transform:scale(1.9) translateY(4%)}
.sw:hover{transform:translateY(-2px)}
.sw[aria-checked="true"]{box-shadow:0 0 0 3px var(--white),0 0 0 5px var(--asphalt)}
.sw.sold::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 47%,var(--orange-strong) 47% 53%,transparent 53%),rgba(255,255,255,.35)}
.addon{display:flex;gap:14px;align-items:center;padding:14px;border:1px solid var(--line);cursor:pointer;transition:border-color .2s,background .2s}
.addon:has(input:checked){border-color:var(--asphalt);background:var(--cloud)}
.addon img{width:60px;height:60px;object-fit:cover;background:var(--white)}
.addon input{accent-color:var(--orange-strong);width:20px;height:20px;flex:none}
.addon .t{display:grid;gap:2px;flex:1}
.addon .t strong{font-weight:600}
.addon .t span{font-size:.88rem;color:var(--warm)}
.addon .p{font:700 1.6rem/1 var(--display)}
.cart-row{display:grid;grid-template-columns:auto 1fr;gap:12px}
.qty{display:flex;align-items:center;border:1px solid var(--line);border-radius:var(--radius);min-height:54px}
.qty button{width:46px;height:52px;background:none;border:0;font:600 1.4rem/1 var(--body);cursor:pointer}
.qty output{min-width:28px;text-align:center;font-weight:600}
.cart-row .btn{width:100%}
/* One buy button (Josh, Nov 6): while the buy box is on screen, the real Add to cart pins to the bottom of the screen on a white fade.
   Once you scroll past the buy box, the white bar (#sticky) takes over. Never two buttons at once. */
.buy-grid>.info{align-content:start}
.buy-grid>*,.buy-grid>.info>*{min-width:0}
.buy-grid .cart-row{position:sticky;bottom:0;z-index:5;background:var(--white);padding:10px 0 calc(10px + env(safe-area-inset-bottom,0px));margin:-10px 0}
.buy-grid .cart-row::before{content:"";position:absolute;left:-16px;right:-16px;bottom:100%;height:40px;background:linear-gradient(to bottom,rgba(255,255,255,0),var(--white));opacity:0;transition:opacity .25s;pointer-events:none}
.buy-grid .cart-row.stuck::before{opacity:1}
.cart-row:has(>.qty[hidden]){grid-template-columns:1fr}
.assure{display:flex;align-items:center;gap:8px;font-size:.85rem;color:var(--warm);text-decoration:none;justify-self:start}
.assure svg{flex:none;width:16px;height:16px}
.assure:hover span{text-decoration:underline}
.mission{font-size:.9rem;color:var(--warm);border-top:1px solid var(--line);padding-top:16px}
.mission a{font-weight:600}
.crew-link{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:18px 20px;background:var(--asphalt);color:var(--chalk);text-decoration:none}
.crew-link strong{font:700 1.5rem/1 var(--display);text-transform:uppercase;letter-spacing:.03em}
.crew-link span span{font-size:.88rem;color:var(--dust)}
.crew-link .go{font:700 1.8rem/1 var(--display);color:var(--orange);transition:transform .3s var(--ease)}
.crew-link:hover .go{transform:translateX(6px)}
.cust-link{display:flex;align-items:center;gap:14px;padding:14px 20px 14px 14px;border:1.5px solid var(--asphalt);border-radius:var(--radius);color:var(--asphalt);text-decoration:none;transition:background .2s}
.cust-link:hover{background:var(--cloud)}
.cust-link img{width:44px;height:44px;flex:none}
.cust-link>span:not(.go){flex:1}
.cust-link strong{font:700 1.5rem/1 var(--display);text-transform:uppercase;letter-spacing:.03em}
.cust-link span span{font-size:.88rem;color:var(--warm)}
.cust-link .go{font:700 1.8rem/1 var(--display);color:var(--orange-strong);transition:transform .3s var(--ease)}
.cust-link:hover .go{transform:translateX(6px)}
.addons{display:grid;gap:10px}
.addon select{font:500 .88rem/1 var(--body);padding:8px 10px;border:1px solid var(--line);border-radius:var(--radius);background:var(--white)}

.addon .p s{font-size:.6em;color:var(--warm);font-weight:500;margin-left:4px}
.addon label.t{cursor:pointer}
.addon.sold{opacity:.55;cursor:not-allowed}.addon.sold .p::after{content:"Sold out";display:block;font:600 .72rem/1 var(--body);text-transform:uppercase;letter-spacing:.06em;color:var(--warm);margin-top:6px;text-align:right}
.addon .p.tk{font:600 .78rem/1.25 var(--body);color:var(--warm);max-width:90px;text-align:right}
@media (max-width:600px){.addon{flex-wrap:wrap}.addon select{order:9;flex:1 0 100%}}
.cinema{min-height:min(92svh,860px)}
.cinema .bg{inset:-10% 0 auto;height:120%}
.cinema h2{font-size:clamp(3.8rem,11vw,10rem);line-height:.82}
.cinema h2 span{display:block}
.cinema p{font-size:clamp(1.05rem,1.6vw,1.25rem);max-width:40ch}
.specs{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line)}
.dark .specs{border-color:var(--line-d)}
.spec{padding:26px 18px 8px 0;display:grid;gap:10px;align-content:start}
.spec .v{display:block;overflow:hidden;font:700 clamp(3.2rem,7vw,6rem)/.8 var(--display);letter-spacing:-.01em;padding-top:.08em}
.spec .v b{display:inline-block;font-weight:700}
.spec .v small{font-size:.42em;color:var(--orange-strong);margin-left:.08em;letter-spacing:.04em}
.dark .spec .v small,.dark .spec .v i{color:var(--orange)}
.spec .v i{font-style:normal;color:var(--orange-strong)}
.spec .k{font:600 .72rem/1.35 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--warm)}
.dark .spec .k{color:var(--dust)}
@media (min-width:900px){.specs{grid-template-columns:repeat(4,1fr)}.spec+.spec{padding-left:24px;border-left:1px solid var(--line)}.dark .spec+.spec{border-color:var(--line-d)}}
@media (max-width:899px){.spec:nth-child(even){padding-left:18px;border-left:1px solid var(--line)}.dark .spec:nth-child(even){border-color:var(--line-d)}}
.spec-intro{display:grid;gap:22px;margin-bottom:clamp(36px,5vw,64px)}
@media (min-width:900px){.spec-intro{grid-template-columns:1fr 1fr;align-items:end;gap:80px}}
.bento{display:grid;gap:12px;margin-top:clamp(36px,5vw,64px)}
.tile{position:relative;overflow:hidden;min-height:400px;display:grid;background:var(--asphalt);color:var(--chalk)}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.tile:hover img{transform:scale(1.05)}
.tile::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(22,22,22,.94) 0%,rgba(22,22,22,.45) 38%,transparent 65%)}
.tile .t{position:relative;z-index:2;align-self:end;padding:clamp(22px,3vw,34px);display:grid;gap:10px;max-width:46ch}
.tile .t h3{font-size:clamp(2.1rem,3.4vw,3rem);line-height:.88}
.tile.studio{background:var(--white);color:var(--asphalt);border:1px solid var(--line)}
.tile.studio img{object-fit:contain;inset:0 0 34% 0;height:66%}
.tile.studio::after{display:none}
.tile.studio .t p{color:var(--warm)}
.tile.studio .hl{color:var(--orange-strong)}
@media (min-width:900px){.tile.studio.side img{inset:0 0 0 auto;width:52%;height:100%;object-fit:contain;object-position:center}.tile.studio.side .t{max-width:46%;align-self:center}}
.tile.carry img{object-position:50% 58%}
@media (min-width:900px){
  .bento{grid-template-columns:repeat(12,1fr);grid-auto-rows:350px}
  .tile{min-height:0}
  .b1{grid-column:span 5;grid-row:span 2}.b2{grid-column:span 7}.b3{grid-column:span 4}.b4{grid-column:span 3}
  .b3 .t,.b4 .t{padding:22px}.b3 .t h3,.b4 .t h3{font-size:clamp(1.8rem,2.5vw,2.4rem)}.b4 .t p{font-size:.92rem}
  .tile.studio img{inset:0 0 30% 0;height:70%}
}
.compare-img{width:100%;aspect-ratio:16/9;object-fit:cover;max-height:76vh}
.compare-cols{display:grid;gap:2px;background:var(--line-d)}
.ccol{background:var(--night);padding:clamp(24px,3.5vw,44px);display:grid;gap:16px}
.ccol.on{background:var(--asphalt)}
.ccol h3{font-size:clamp(3rem,5vw,4.6rem);line-height:.82}
.ccol dl{display:grid;grid-template-columns:auto 1fr;gap:8px 18px;margin:0;font-size:.95rem}
.ccol dt{font:600 .72rem/1.9 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--dust)}
.ccol dd{margin:0;font-variant-numeric:tabular-nums}
@media (min-width:760px){.compare-cols{grid-template-columns:1fr 1fr}}
.trades{overflow:hidden;padding:clamp(18px,3vw,30px) 0;border-block:1px solid var(--line)}
.trades .track{display:flex;width:max-content;animation:marquee 44s linear infinite}
.trades span{font:700 clamp(3.2rem,7.5vw,6.5rem)/1 var(--display);text-transform:uppercase;white-space:nowrap;padding-right:.4em;color:var(--white);-webkit-text-stroke:4px var(--asphalt);paint-order:stroke fill}
/* outline drawn under a white fill: hides the seams where the display font's letter shapes overlap */
.trades span.hot{color:var(--orange-strong);-webkit-text-stroke:0}  /* fixed per word, so both loop copies match and nothing changes color at the seam (Josh, Nov 5) */
.carry-grid{display:grid;gap:12px;margin-top:clamp(32px,5vw,52px)}
.carry-grid .carry{display:block;color:inherit;text-decoration:none}
.carry-grid figure{margin:0;position:relative;overflow:hidden;aspect-ratio:4/5}
.carry-grid .carry:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.carry-grid img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.carry-grid .carry:hover img{transform:scale(1.04)}
.carry-grid figcaption{position:absolute;left:14px;bottom:14px;font:600 .74rem/1.3 var(--body);letter-spacing:.14em;text-transform:uppercase;background:rgba(22,22,22,.82);color:var(--chalk);padding:8px 12px;border-radius:999px}
@media (min-width:760px){.carry-grid{grid-template-columns:repeat(3,1fr)}}

/* ---------- FAQ ---------- */
.faq-grid{display:grid;gap:32px}
@media (min-width:900px){.faq-grid{grid-template-columns:.8fr 1.2fr;gap:96px}}
.faq details{border-top:1px solid var(--dust)}
.faq details:last-child{border-bottom:1px solid var(--dust)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:24px;align-items:center;min-height:66px;padding:16px 0;font:600 1.06rem/1.35 var(--body);transition:color .2s}
.faq summary:hover{color:var(--orange-stronger)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:999px;border:2px solid var(--asphalt);font:600 1.6rem/1 var(--display);padding-top:4px;transition:transform .3s var(--ease),background .3s,color .3s}
.faq details[open] summary::after{transform:rotate(45deg);background:var(--orange);border-color:var(--orange);color:var(--white)}
.faq .a{padding:0 0 24px;max-width:62ch;display:grid;gap:14px}
.tiers{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;margin:0;padding:0;list-style:none;background:var(--dust)}
.tiers li{padding:16px;background:var(--chalk);display:grid;gap:4px}
.tiers b{font:700 2rem/1 var(--display);text-transform:uppercase}
.tiers li:nth-child(n+2) b{color:var(--orange-stronger)}
.tiers span{font-size:.85rem;color:var(--warm)}
@media (min-width:640px){.tiers{grid-template-columns:repeat(4,1fr)}}

/* ---------- crew band ---------- */
.crewband{background:radial-gradient(ellipse 60% 80% at 0% 100%,rgba(241,84,45,.4),transparent 70%),var(--asphalt);color:var(--chalk)}
.crewband .wrap{display:grid;gap:28px;align-items:end}
@media (min-width:900px){.crewband .wrap:not(.crew-pick):not(.crew-grid){grid-template-columns:1fr auto;gap:64px}}
.crewband{padding-block:clamp(48px,7vw,88px)}
.wrap-exit{margin:14px 0 0;font-size:.88rem;color:var(--dust)}.wrap-exit a{color:var(--chalk);font-weight:600}
/* ---------- bulk: Wrap Showroom slide (section two, Nov 6 call) ---------- */
.wslide{background:#0E0F14;color:var(--chalk);padding:clamp(56px,7vw,96px) 0;overflow:hidden;transition:background .4s}
.wsl-grid{display:grid;gap:clamp(28px,4vw,48px);align-items:center}
@media (min-width:960px){.wsl-grid{grid-template-columns:minmax(0,5fr) minmax(0,6fr) auto}}
.wsl-copy{display:grid;gap:18px;align-content:start;min-width:0}
.wsl-eye{margin:0;font:600 1.15rem/1 var(--display);letter-spacing:.12em;text-transform:uppercase;color:rgba(242,239,233,.7)}
.wsl-eye span{margin-left:10px}.wsl-eye b{color:var(--orange);font-weight:600}
.wsl-name{margin:0;font:600 clamp(2.8rem,5.4vw,4.6rem)/.86 var(--display);text-transform:uppercase;text-wrap:balance}
.wsl-desc{margin:0;max-width:46ch;color:rgba(242,239,233,.82);line-height:1.6}
.wsl-specs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 28px;margin:4px 0 0;max-width:460px}
.wsl-specs div{display:grid;gap:3px;border-top:1px solid rgba(242,239,233,.16);padding-top:9px}
.wsl-specs dt{font:600 .64rem/1 var(--body);letter-spacing:.16em;text-transform:uppercase;color:rgba(242,239,233,.55)}
.wsl-specs dd{margin:0;font-weight:600}
.wsl-act{display:grid;gap:10px;justify-items:start;margin-top:6px}
.wsl-fine{margin:0;font-size:.82rem;color:rgba(242,239,233,.6)}
.wsl-nav{display:flex;align-items:center;gap:10px;margin-top:8px}
.wsl-arrow{width:42px;height:42px;border-radius:999px;border:1px solid rgba(242,239,233,.3);background:none;color:var(--chalk);display:grid;place-items:center;cursor:pointer}
.wsl-arrow svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
.wsl-arrow:hover{border-color:var(--chalk)}
.wsl-count{font:600 1.05rem/1 var(--display);letter-spacing:.06em;margin-left:6px;font-variant-numeric:tabular-nums}
.wsl-bar{width:70px;height:2px;background:rgba(242,239,233,.2)}.wsl-bar i{display:block;height:100%;background:var(--chalk);width:33%;transition:width .3s}
.wsl-stage{position:relative;display:grid;place-items:center;min-height:clamp(360px,40vw,560px);color:inherit}
/* the print behind the cup repeats sideways like it does round the tumbler, faint, fading out at the edges (showroom look) */
.wsl-art{position:absolute;inset:-8% -20%;background-repeat:repeat-x;background-size:auto 100%;background-position:50% 50%;opacity:.15;filter:grayscale(.2);transition:opacity .5s;
  -webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 45%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 45%,transparent 100%);pointer-events:none}
.wsl-art.fade{opacity:0}
.wsl-frame{position:relative;width:min(86%,420px);aspect-ratio:872/1120}
.wsl-frame .shot{position:absolute;inset:0}
.wsl-frame .shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity .3s linear;pointer-events:none;user-select:none;-webkit-user-drag:none}
.wsl-frame .shot img.fade{opacity:0}
.wsl-frame .shot canvas{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab;touch-action:pan-y;opacity:0;transition:opacity .4s linear}
.wsl-frame .shot canvas.drag{cursor:grabbing}
.wsl-frame .shot.live canvas{opacity:1}
.wsl-frame .shot.live img{opacity:0}
.wsl-hint{position:absolute;bottom:4px;left:0;right:0;text-align:center;font:600 .64rem/1 var(--body);letter-spacing:.16em;text-transform:uppercase;color:rgba(242,239,233,.55);pointer-events:none}
/* close-up studio (from the showroom's spinner): the tumbler alone on a lit seamless */
.spin-studio{position:fixed;inset:0;z-index:200;background:#CED2D5;color:var(--asphalt);opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility 0s linear .35s;touch-action:none;overscroll-behavior:contain}
.spin-studio.on{opacity:1;visibility:visible;transition:opacity .35s var(--ease)}
.spin-studio canvas{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab;touch-action:none}
.spin-studio canvas.drag{cursor:grabbing}
.studio-x{position:absolute;top:calc(14px + env(safe-area-inset-top,0px));right:14px;width:48px;height:48px;border-radius:999px;border:1px solid rgba(32,32,32,.18);background:rgba(255,255,255,.7);display:grid;place-items:center;cursor:pointer;z-index:1}
.studio-x svg{width:22px;height:22px}
.studio-bar{position:absolute;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);display:flex;align-items:center;gap:8px;z-index:1;max-width:calc(100% - 32px)}
.studio-bar button{min-width:44px;height:44px;padding:0 14px;border-radius:999px;border:1px solid rgba(32,32,32,.18);background:rgba(255,255,255,.7);cursor:pointer;font:600 .8rem/1 var(--body);letter-spacing:.12em;text-transform:uppercase}
.studio-bar button[aria-label]{font:500 1.4rem/1 var(--body);letter-spacing:0}
.studio-bar span{font:600 .68rem/1.3 var(--body);letter-spacing:.16em;text-transform:uppercase;color:#47423D;margin-left:4px;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.7)}
@media (max-width:719px){.studio-bar span{display:none}}
html.studio-open{overflow:hidden}
.wsl-index{list-style:none;margin:0;padding:0;display:grid;gap:10px;align-self:center}
.wsl-index button{all:unset;cursor:pointer;display:flex;align-items:center;gap:10px;justify-content:flex-end;font:500 .78rem/1 var(--body);color:rgba(242,239,233,.45);white-space:nowrap}
.wsl-index button b{font:600 .95rem/1 var(--display);letter-spacing:.06em}
.wsl-index button i{width:16px;height:1px;background:currentColor}
.wsl-index button[aria-current="true"]{color:var(--chalk)}.wsl-index button[aria-current="true"] i{width:28px;background:var(--orange)}
.wsl-index button:focus-visible{outline:2px solid var(--chalk);outline-offset:3px}
.wslide .fade{opacity:0}
.wsl-cup,.wsl-art{transition:opacity .3s,transform .4s var(--ease)}
@media (max-width:959px){.wsl-index{display:none}.wsl-act .btn{justify-self:stretch;text-align:center}}
@media (prefers-reduced-motion:reduce){.wsl-cup,.wsl-art,.wsl-bar i,.wslide{transition:none}}
.wrapshow .ws-grid{display:grid;gap:clamp(28px,4vw,56px);align-items:center}
@media (min-width:900px){.wrapshow .ws-grid{grid-template-columns:5fr 7fr}}
.wrapshow .tag{justify-self:start;font:600 .7rem/1 var(--body);letter-spacing:.16em;text-transform:uppercase;padding:9px 13px;border-radius:999px;border:1px solid var(--orange);color:var(--orange)}
.ws-picks{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:6px 0 4px}
.ws-pick{all:unset;cursor:pointer;display:grid;gap:7px;font:600 .64rem/1.25 var(--body);letter-spacing:.1em;text-transform:uppercase;color:rgba(242,239,233,.6);text-align:center}
.ws-pick img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:10px;border:2px solid transparent;opacity:.7;transition:opacity .25s,border-color .25s}
.ws-pick:hover img,.ws-pick:focus-visible img{opacity:1}
.ws-pick:focus-visible img{outline:2px solid var(--chalk);outline-offset:2px}
.ws-pick.on{color:var(--chalk)}.ws-pick.on img{opacity:1;border-color:var(--orange)}
.ws-stage{position:relative;padding-bottom:clamp(40px,7vw,72px)}
.ws-flat{margin:0;position:relative;border-radius:var(--radius);overflow:hidden;background:#fff;aspect-ratio:1400/879;width:88%}
.ws-flat img,.ws-cup img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .35s var(--ease)}
.ws-cup{margin:0;position:absolute;right:0;bottom:0;width:40%;aspect-ratio:4/5;border-radius:var(--radius);overflow:hidden;background:#141414;box-shadow:0 24px 50px rgba(0,0,0,.55);border:3px solid #1f1f1f}
.ws-stage figcaption{position:absolute;left:12px;top:12px;font:600 .66rem/1 var(--body);letter-spacing:.14em;text-transform:uppercase;background:rgba(22,22,22,.85);color:var(--chalk);padding:7px 11px;border-radius:999px}
.ws-stage .fade{opacity:0}
@media (max-width:899px){.wrapshow .ws-copy .btn{justify-self:stretch;text-align:center}.ws-cup{width:44%}.ws-stage figcaption{font-size:.56rem;padding:6px 9px;left:8px;top:8px;white-space:nowrap}}
.crew-grid{display:grid;gap:clamp(24px,4vw,56px);align-items:center}
@media (min-width:900px){.crew-grid{grid-template-columns:1.05fr .95fr}}
.crew-photo{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;border-radius:var(--radius)}
.crew-photo img{width:100%;height:100%;object-fit:cover;object-position:60% 50%;transition:transform .8s var(--ease)}
.crew-photo:hover img{transform:scale(1.03)}
.crew-photo span{position:absolute;left:14px;bottom:14px;font:600 .72rem/1.3 var(--body);letter-spacing:.12em;text-transform:uppercase;background:rgba(22,22,22,.82);color:var(--chalk);padding:8px 12px;border-radius:999px}
.crew-pick{display:grid;gap:12px;margin-top:clamp(28px,4vw,44px)}
@media (min-width:760px){.crew-pick{grid-template-columns:repeat(3,1fr)}}
.crew-pick .cp{display:grid;gap:8px;align-content:start;padding:20px;border:1px solid var(--line-d);border-radius:var(--radius);color:var(--chalk);text-decoration:none;background:rgba(236,235,233,.03);transition:border-color .2s,background .2s}
.crew-pick .cp:hover{border-color:var(--chalk);background:rgba(236,235,233,.07)}
.crew-pick .cp strong{font:700 1.5rem/1 var(--display);text-transform:uppercase;letter-spacing:.03em;padding-top:4px}
.crew-pick .cp span:last-child{color:var(--dust);font-size:.92rem;line-height:1.5}
.crew-pick .ftag{justify-self:start}

/* ---------- sticky ATC ---------- */
.sticky{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--white);color:var(--asphalt);padding:10px var(--pad) calc(10px + env(safe-area-inset-bottom,0px));transform:translateY(calc(100% + 24px));transition:transform .35s var(--ease)}
.sticky{border-top:1px solid var(--line);box-shadow:0 -6px 20px rgba(0,0,0,.08)}  /* solid bar, no fade (Josh, Nov 6) */
.sticky.on{transform:none}
.sticky .in{max-width:var(--wrap);margin:0 auto;display:flex;align-items:center;gap:14px}
.sticky img{width:50px;height:50px;background:var(--white);object-fit:cover}
.sticky .nm{flex:1;min-width:0;display:grid;gap:2px}
.sticky .nm strong{font:700 1.5rem/1 var(--display);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sticky .nm span{font-size:.85rem;color:var(--warm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sticky .btn{min-height:48px;padding:6px 22px 0;font-size:1.25rem}
.toast{position:fixed;left:50%;bottom:92px;z-index:95;transform:translate(-50%,30px);opacity:0;pointer-events:none;background:var(--asphalt);color:var(--chalk);padding:14px 20px;border-radius:999px;font-weight:600;max-width:calc(100vw - 32px);text-align:center;transition:all .35s var(--ease)}
.toast.on{opacity:1;transform:translate(-50%,0)}


/* ---------- cart drawer (preview of the UpCart reskin, see upcart/). 3 options: data-v a|b|c ---------- */
.cd-scrim{position:fixed;inset:0;z-index:120;background:rgba(22,22,22,.42);opacity:0;pointer-events:none;transition:opacity .3s var(--ease)}
.cd{position:fixed;top:0;right:0;bottom:0;z-index:121;width:min(420px,100vw);display:flex;flex-direction:column;background:var(--white);color:var(--asphalt);transform:translateX(100%);visibility:hidden;transition:transform .4s var(--ease),visibility 0s .4s;box-shadow:-10px 0 36px rgba(0,0,0,.14)}
.cd-open .cd-scrim{opacity:1;pointer-events:auto}.cd-open .cd{transform:none;visibility:visible;transition:transform .4s var(--ease)}
.cd-hd{order:1;display:flex;align-items:center;gap:14px;padding:16px 16px 16px 20px;border-bottom:1px solid var(--line)}
.cd-title{margin-left:auto;font:600 .9rem/1 var(--body);color:var(--asphalt)}
.cd-title span{color:var(--warm);font-weight:500}
.cd-logo{order:-1;height:18px;width:auto;display:block}
.cd-x{width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:var(--radius);background:none;color:var(--asphalt);cursor:pointer}
.cd-x:hover{background:var(--cloud)}.cd-x:focus-visible{outline:2px solid var(--asphalt);outline-offset:0}.cd-x svg{width:18px;height:18px}
.cd-ship{order:2;padding:12px 20px 14px;border-bottom:1px solid var(--line)}
.cd-ship p{margin:0 0 8px;font-size:.85rem;color:var(--warm)}.cd-ship b{color:var(--asphalt);font-weight:600}
.cd-bar{height:4px;border-radius:99px;background:var(--chalk);overflow:hidden}
.cd-bar i{display:block;height:100%;width:0;background:var(--orange);border-radius:99px;transition:width .5s var(--ease)}
.cd-body{order:3;flex:1;overflow:auto;overscroll-behavior:contain}
.cd-items{list-style:none;margin:0;padding:0 20px}
.cd-item{display:grid;grid-template-columns:72px 1fr auto;gap:14px;padding:16px 0;border-bottom:1px solid var(--line)}
.cd-item:last-child{border-bottom:0}
.cd-item img{width:72px;height:72px;object-fit:cover;background:var(--cloud)}
.cd-item .nm{font:700 1.2rem/1 var(--display);text-transform:uppercase;letter-spacing:.03em;padding-top:3px}
.cd-item .sub{font-size:.82rem;color:var(--warm);margin-top:3px}
.cd-item .pr{text-align:right;font-weight:600;font-size:.95rem}
.cd-item .pr s{display:block;font-weight:400;font-size:.78rem;color:var(--warm)}

.cd-row{display:flex;align-items:center;gap:14px;margin-top:10px}
.cd-q{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:var(--radius)}
.cd-q button{width:30px;height:30px;border:0;background:transparent;font:500 1rem/1 var(--body);cursor:pointer;color:var(--asphalt)}
.cd-q output{min-width:20px;text-align:center;font-size:.88rem}
.cd-rm{border:0;background:none;padding:0;font-size:.8rem;color:var(--warm);text-decoration:underline;cursor:pointer}
.cd-empty{padding:56px 20px;text-align:center;display:grid;gap:16px;justify-items:center}
.cd-empty p{margin:0;font:700 1.6rem/1 var(--display);text-transform:uppercase}
.cd-empty .links{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.cd-empty .links a{font-weight:600;font-size:.9rem;color:var(--asphalt);border:1px solid var(--line);border-radius:var(--radius);padding:10px 14px;text-decoration:none}
/* add-ons: base = plain rows */
.cd-ups{padding:16px 20px 18px;border-top:1px solid var(--line)}
.cd-ups h3{margin:0 0 12px;font:700 1.1rem/1 var(--display);text-transform:uppercase;letter-spacing:.06em}
.cd-tiles{display:grid;gap:12px}
.cd-tile{display:grid;grid-template-columns:52px 1fr auto;gap:12px;align-items:center}
.cd-tile img{width:52px;height:52px;object-fit:cover;background:var(--cloud)}
.cd-tile .nm{font-weight:600;font-size:.88rem;line-height:1.25}
.cd-tile .pr{font-size:.84rem;font-weight:600;color:var(--orange-strong);margin-top:2px}.cd-tile .pr s{color:var(--warm);font-weight:400;margin-left:4px}
.cd-tile .act{display:flex;gap:6px;align-items:center}
.cd-tile select{height:32px;max-width:84px;padding:0 4px;font:500 .8rem/1 var(--body);border:1px solid var(--line);border-radius:var(--radius);background:var(--white);color:var(--asphalt)}
.cd-tile button{height:32px;padding:0 14px;border:1px solid var(--asphalt);border-radius:var(--radius);background:transparent;color:var(--asphalt);font:600 .82rem/1 var(--body);cursor:pointer;transition:background .2s,color .2s}
.cd-tile button:hover{background:var(--asphalt);color:var(--white)}
.cd-ft{order:4;padding:14px 20px calc(16px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);display:grid;gap:10px}
.cd-sub{display:flex;justify-content:space-between;align-items:baseline}
.cd-sub span{font-weight:600}.cd-sub strong{font:700 1.6rem/1 var(--display)}
.cd-note{margin:-4px 0 0;font-size:.78rem;color:var(--warm)}
.cd-ft .btn{width:100%;min-height:52px}
.cd-ft .assure{justify-self:center;font-size:.78rem}

.cd-track{position:relative;margin:2px 9px 0 0}
.cd-ms{position:absolute;top:50%;width:20px;height:20px;margin:-10px 0 0 -10px;display:grid;place-items:center;border-radius:99px;background:var(--white);border:1.5px solid var(--dust);color:var(--warm);transition:background .3s,border-color .3s,color .3s}
.cd-ms svg{width:11px;height:11px}
.cd-ms.done{background:var(--orange);border-color:var(--orange);color:var(--white)}
.cd-ml{position:relative;height:14px;margin:7px 0 0}
.cd-ml span{position:absolute;top:0;font-size:.7rem;font-weight:600;color:var(--warm);white-space:nowrap;transform:translateX(-50%)}
.cd-ml span:last-child{transform:none;right:0}
.cd-ship{padding-bottom:10px}
.cd-uph{display:flex;align-items:center;justify-content:space-between;margin:0 20px 12px}
.cd-uph h3{margin:0!important}
.cd-arr{display:flex;gap:6px}
.cd-arr button{width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--line);border-radius:99px;background:var(--white);color:var(--asphalt);cursor:pointer}
.cd-arr button:hover{border-color:var(--asphalt)}
.cd-arr button[disabled]{opacity:.35;cursor:default}
.cd-arr svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.cd-tile.sold img{opacity:.5}
/* add-on card: fixed rows so every card lines up; dropdown + Add on one row */
.cd .cd-tiles .cd-tile{grid-template-rows:auto 1fr auto}
.cd .cd-tiles .cd-tile .nm{min-height:2.5em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cd .cd-tiles .cd-tile .act{display:flex;flex-wrap:nowrap;gap:6px}
.cd .cd-tiles .cd-tile select{flex:1 1 auto;min-width:0;max-width:none;height:30px}
.cd .cd-tiles .cd-tile button.add{flex:0 0 auto;height:30px;padding:0 12px;margin-left:auto}
/* one-line messages and footer, no wrapping on phones */
.cd-ship p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cd-ft .assure{font-size:min(.7rem,2.75vw);white-space:nowrap;gap:5px;color:var(--warm);text-decoration:none}
.cd-ft .assure svg{width:12px;height:12px}
.cd-ft{gap:8px}
.cd-item .nm{font-size:clamp(1rem,4.3vw,1.2rem)}
.cd-item{gap:12px}

.cd-tile .pr.reg{color:var(--asphalt)}
.cd .cd-tile .act{flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:8px}
.cd-tile .dots{display:flex;gap:5px}
.cd-tile .dot{width:16px;height:16px;padding:0;border-radius:99px;border:1px solid rgba(32,32,32,.25);background:var(--c);cursor:pointer;box-shadow:0 0 0 2px var(--white)}
.cd .cd-tile .dot{flex:none}.cd-tile .dot:hover{background:var(--c)}
.cd-tile .dot[aria-checked="true"]{box-shadow:0 0 0 2px var(--white),0 0 0 3.5px var(--asphalt)}
.cd .cd-tile button.add{flex:0 0 auto;height:30px;padding:0 14px;margin-left:auto}
.cd .cd-tile{flex-basis:164px}
.cd .cd-tile img{height:104px;aspect-ratio:auto;object-fit:contain}

.cd-tile.sold .pr{color:var(--warm)}
.cd-tile.sold button{border-color:var(--line);color:var(--warm);cursor:not-allowed;background:transparent}
.cd-item.gift .pr{color:var(--success)}
.cd-gtag{display:inline-block;margin-top:5px;padding:3px 7px 2px;border-radius:4px;background:var(--chalk);font-size:.7rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--asphalt)}
.cd-sub strong s{font:500 .95rem/1 var(--body);color:var(--warm);margin-right:8px}
.cd-code{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:-2px}
.cd-code-t{border:0;background:none;padding:0;font-size:.8rem;font-weight:600;color:var(--asphalt);text-decoration:underline;cursor:pointer}
.cd-code form{display:flex;gap:6px;flex:1 0 100%}
.cd-code input{flex:1;min-width:0;height:36px;padding:0 10px;border:1px solid var(--line);border-radius:var(--radius);font:500 .85rem var(--body);text-transform:uppercase}
.cd-code form button{height:36px;padding:0 14px;border:1px solid var(--asphalt);border-radius:var(--radius);background:var(--asphalt);color:var(--white);font:600 .82rem var(--body);cursor:pointer}
.cd-chip{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 6px 0 9px;border:1px dashed var(--dust);border-radius:var(--radius);background:var(--cloud);font-size:.78rem;font-weight:600;letter-spacing:.04em}
.cd-chip svg{width:13px;height:13px}
.cd-chip button{width:20px;height:20px;border:0;background:none;color:var(--warm);cursor:pointer;font-size:1rem;line-height:1}
.cd-chip + small{font-size:.75rem;color:var(--warm)}
/* add-on cards, MKC-style, inside the drawer (option A, picked Nov 4) */
.cd .cd-ups{background:var(--cloud);border-top:0;padding:18px 0 20px}
.cd .cd-ups h3{margin:0 20px 12px}
.cd .cd-tiles{display:flex;gap:10px;overflow-x:auto;padding:0 20px 2px;scroll-padding-inline:20px;scroll-snap-type:x mandatory;scrollbar-width:none}
.cd .cd-tile{flex:0 0 152px;scroll-snap-align:start;grid-template-columns:1fr;align-items:start;gap:8px;padding:10px;background:var(--white);border-radius:var(--radius)}
.cd .cd-tile img{width:100%;height:auto;aspect-ratio:1/1;background:var(--white)}
.cd .cd-tile .act{flex-wrap:wrap}
.cd .cd-tile select{max-width:none;flex:1 0 100%}
.cd .cd-tile button{flex:1}

/* size cards (Cam's PDP, Nov 5): white card, cloud band; picked = black band + orange ring */
.szc{display:grid;gap:8px}
@media (min-width:600px){.szc{grid-template-columns:1fr 1fr}}
.sz{display:grid;align-content:start;padding:0;text-align:left;background:var(--white);color:var(--asphalt);border:1px solid var(--line);border-radius:12px;overflow:hidden;cursor:pointer;transition:border-color .2s,box-shadow .2s,transform .2s var(--ease)}
.sz:hover{transform:translateY(-2px)}
.sz .band{display:block;padding:6px 14px;background:var(--cloud);font:600 .68rem/1.3 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--warm)}
.sz .row{display:flex;align-items:center;gap:10px;padding:10px 14px 6px}
.sz .radio{flex:none;width:18px;height:18px;border-radius:99px;border:2px solid var(--warm);display:grid;place-items:center}
.sz .nm{flex:1;display:grid;gap:2px;min-width:0}
.sz .nm b{font:700 1.45rem/1 var(--display);text-transform:uppercase}
.sz .nm small{font-size:.76rem;color:var(--warm);line-height:1.3}
.sz .pr{font:700 1.7rem/1 var(--display)}
.sz .perks{display:grid;gap:4px;padding:2px 14px 12px 42px}
.sz .perks span{position:relative;font-size:.82rem;line-height:1.3}
.sz .perks span::before{content:"";position:absolute;left:-18px;top:.35em;width:8px;height:4px;border-left:2px solid var(--success,#4C7A5E);border-bottom:2px solid var(--success,#4C7A5E);transform:rotate(-45deg)}
.sz[aria-checked="true"]{border-color:var(--orange);box-shadow:0 0 0 1px var(--orange)}
.sz[aria-checked="true"] .band{background:var(--asphalt);color:var(--white)}
.sz[aria-checked="true"] .radio{border-color:var(--orange-strong)}
.sz[aria-checked="true"] .radio::after{content:"";width:8px;height:8px;border-radius:99px;background:var(--orange-strong)}
@media (max-width:599px){.sz .perks{display:none}}
/* bundle switcher (Nov 5): hot-swap between the four bundles from the buy box */
.bsw{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.bsw a{display:grid;gap:4px;justify-items:center;padding:6px 4px 8px;border:1px solid var(--line);border-radius:10px;background:var(--white);text-decoration:none;text-align:center;transition:border-color .2s,transform .2s var(--ease)}
.bsw a:hover{transform:translateY(-2px);border-color:var(--asphalt)}
.bsw img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:6px}
.bsw b{font:600 1.05rem/1 var(--display);text-transform:uppercase;letter-spacing:.02em}
.bsw span{font-size:.74rem;color:var(--warm)}
.bsw a[aria-current="true"]{border:2px solid var(--orange);padding:5px 3px 7px}
/* "What's inside": color swatches like the product pages instead of dropdowns (Josh, Nov 5 pm) */
#bInside{list-style:none;margin:0;padding:0;display:grid;gap:0;background:none;align-content:start}
#bInside li{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:66px;box-sizing:border-box;padding:10px 0;background:none;border-bottom:1px solid var(--line)}  /* one height for every row, so switching bundles never moves anything */
#bInside li:last-child{border-bottom:0}
#bInside .bi-h{display:grid;gap:5px;min-width:0}
#bInside .swatches{display:flex;flex-wrap:nowrap;gap:6px;justify-content:flex-end;flex:none}
#bInside .bi-h b{font:700 1.15rem/1 var(--display);text-transform:uppercase}
#bInside .bi-h span{font-size:.85rem;color:var(--warm)}
#bInside .sw{width:40px;height:40px}

/* ---------- bundle ---------- */
.inside{list-style:none;margin:0;padding:0;display:grid;gap:2px;background:var(--line)}
.inside li{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:14px 16px;background:var(--white)}
.inside li b{font:600 1.5rem/1 var(--display);text-transform:uppercase;letter-spacing:.02em}
.inside select{min-height:44px;border:1px solid var(--line);border-radius:var(--radius);padding:0 12px;background:var(--white);font:500 .9rem var(--body);max-width:52%}
.bundle-others{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (min-width:900px){.bundle-others{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}}
.bundle-others .card[aria-current="true"] .ph{border:2px solid var(--asphalt)}

/* ---------- bulk ---------- */
.hero-bulk{min-height:min(calc(100svh - var(--hdr)),920px)}
.hero-bulk h1{font-size:clamp(3.4rem,14vw,8rem);line-height:.84;font-weight:700}
.hero-bulk h1 .line{display:block;white-space:nowrap}
@media (min-width:900px){.hero-bulk h1{font-size:clamp(6rem,9vw,10rem)}}
.hero-bulk .side{display:grid;gap:22px;max-width:400px}
.promo-grid{display:grid;gap:44px}
.points{list-style:none;margin:0;padding:0}
.points li{padding:24px 0;border-top:1px solid var(--line);display:grid;gap:6px}
.points li:last-child{border-bottom:1px solid var(--line)}
.points strong{font:600 1.1rem/1.3 var(--body)}
@media (min-width:900px){.promo-grid{grid-template-columns:1.1fr .9fr;gap:96px;align-items:end}}
.methods{display:grid;gap:2px;margin:clamp(36px,5vw,64px) 0;background:var(--line-d)}
.method{position:relative;padding:clamp(26px,4vw,46px);background:var(--asphalt);display:grid;gap:12px;overflow:hidden}
.method h3{font-size:clamp(2.6rem,5vw,4.2rem);line-height:.85}
.method .tag{justify-self:start;font:600 .7rem/1 var(--body);letter-spacing:.16em;text-transform:uppercase;padding:9px 13px;border-radius:999px;border:1px solid var(--dust);color:var(--dust)}
.method .tag.hot{border-color:var(--orange);color:var(--orange)}
.method.wrapm::before{content:"";position:absolute;inset:-40%;background:conic-gradient(from 0deg,transparent 0 70%,rgba(241,84,45,.22) 80%,transparent 90%);animation:spin 14s linear infinite;pointer-events:none}
.method>*{position:relative}
@keyframes spin{to{transform:rotate(1turn)}}
@media (min-width:760px){.methods{grid-template-columns:1fr 1fr}}
.bproducts{display:grid;gap:36px 14px}
.bproduct{display:grid;gap:8px}
.bproduct .frame{position:relative;overflow:hidden;background:var(--white);aspect-ratio:1/1}
.bproduct .frame img{width:100%;height:100%;object-fit:contain;padding:6%;transition:transform .6s var(--ease)}
.bproduct:hover .frame img{transform:scale(1.04)}
.bproduct .frame::after{content:"";position:absolute;left:0;bottom:0;height:5px;width:100%;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.bproduct:hover .frame::after{transform:none}
.bproduct h3{font-size:clamp(2.1rem,3.4vw,2.8rem);line-height:.88;margin-top:8px}
.bproduct .n{color:var(--orange)}
.bproduct .kind{font:600 .72rem/1.3 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--dust)}
.bproduct .price{font:600 .8rem/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--orange)}
@media (min-width:640px){.bproducts{grid-template-columns:1fr 1fr}}
@media (min-width:1080px){.bproducts{grid-template-columns:repeat(4,1fr)}}
.work-strip{display:grid;grid-auto-flow:column;grid-auto-columns:78%;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;scrollbar-width:thin}
.work-strip>*{scroll-snap-align:start}
.work-ph{margin:0;aspect-ratio:1/1;border-radius:var(--radius);overflow:hidden;background:#3a4047}.work-ph img{width:100%;height:100%;object-fit:cover;display:block}
.work-strip .who{margin-top:12px;font:600 .78rem/1.3 var(--body);letter-spacing:.14em;text-transform:uppercase}
@media (min-width:760px){.work-strip{grid-auto-columns:calc((100% - 42px)/4);overflow:visible}}
.img-slot{position:relative;margin:0;width:100%;background:repeating-linear-gradient(45deg,#3a4047 0 14px,#40464e 14px 28px);display:grid;place-items:center;overflow:hidden}
.img-slot figcaption{position:relative;z-index:2;display:grid;gap:4px;max-width:34ch;margin:12px;padding:10px 12px;font:500 12px/1.4 ui-monospace,Menlo,monospace;text-align:center;background:rgba(236,235,233,.94);color:#111;border-radius:6px}
.img-slot figcaption strong{font-size:13px}
.r-4x5{aspect-ratio:4/5}
.steps{list-style:none;margin:52px 0 0;padding:0;display:grid;gap:40px;counter-reset:s}
.steps li{position:relative;display:grid;gap:12px;counter-increment:s;padding-top:26px}
.steps li::before{content:counter(s);font:700 clamp(6rem,11vw,9rem)/.75 var(--display);color:var(--step-bg,var(--white));-webkit-text-stroke:4px var(--orange-strong);paint-order:stroke fill;margin-bottom:6px}
.steps li::after{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--line)}
.steps .fill{position:absolute;top:0;left:0;height:3px;width:100%;background:var(--orange);transform-origin:left;z-index:1}
@media (min-width:900px){.steps{grid-template-columns:repeat(3,1fr)}}
.partners{margin-top:64px;padding-top:30px;border-top:1px solid var(--line);display:grid;gap:22px}
.logo-marquee{overflow:hidden;margin-top:18px;background:var(--white);border-radius:var(--radius);padding:24px 0;}
.lm-track{display:flex;width:max-content;animation:lm 46s linear infinite}
.logo-marquee:hover .lm-track{animation-play-state:paused}
.lm-set{display:flex;align-items:center;gap:clamp(40px,5vw,72px);padding-right:clamp(40px,5vw,72px)}
.lm-set img{width:auto;filter:grayscale(1);opacity:.7;transition:opacity .25s,filter .25s}
.lm-set img:hover{filter:none;opacity:1}
@keyframes lm{to{transform:translateX(-50%)}}
@media (max-width:600px){.lm-set{zoom:.7}.logo-marquee{padding:18px 0}}
@media (prefers-reduced-motion:reduce){.lm-track{animation:none;width:auto}.lm-set{flex-wrap:wrap;justify-content:center;row-gap:24px}.lm-set[aria-hidden]{display:none}}
.logo-row{display:flex;flex-wrap:wrap;gap:clamp(20px,4vw,56px);align-items:center}
.logo-row img{height:clamp(26px,3.4vw,40px);width:auto}
.crew-v{min-height:min(88svh,820px)}
.crew-v h2{font-size:clamp(3.8rem,10vw,9rem);line-height:.84}
.copy-wrap{position:relative}
.copy-status{position:absolute;left:0;top:100%;width:max-content;max-width:min(320px,80vw);min-height:0;margin-top:10px;font-size:.9rem;color:var(--dust)}
@media (min-width:900px){.copy-status{left:auto;right:0;text-align:right}}
.small-grid{display:grid;gap:40px;align-items:center}
.options{display:grid;gap:2px;margin-top:32px;background:var(--dust)}
.option{padding:30px;background:var(--chalk);display:grid;gap:14px}
.option .btn{justify-self:start}
.small-grid .ph{aspect-ratio:1/1;background:var(--white);overflow:hidden}
.small-grid .ph img{width:100%;height:100%;object-fit:cover}
@media (min-width:900px){.small-grid{grid-template-columns:1fr 1fr;gap:72px}}

/* ---------- forms ---------- */
.formsec{background:radial-gradient(ellipse 60% 70% at 100% 0%,rgba(241,84,45,.4),transparent 70%),var(--asphalt);color:var(--chalk)}
.form-grid{display:grid;gap:40px}
@media (min-width:900px){.form-grid{grid-template-columns:.85fr 1.15fr;gap:96px}}
form.card-form{background:var(--white);color:var(--asphalt);padding:clamp(22px,4vw,44px);display:grid;gap:20px;border:1px solid var(--line)}
.formsec form.card-form{background:var(--chalk);border:0}
.row2{display:grid;gap:20px;align-items:start}
@media (min-width:640px){.row2{grid-template-columns:1fr 1fr}}
.field{display:grid;gap:8px}
.field label,.field legend{font:600 .78rem/1.3 var(--body);letter-spacing:.08em;text-transform:uppercase}
.field .opt{font-weight:400;text-transform:none;letter-spacing:0;color:var(--warm)}
input[type=text],input[type=email],input[type=tel],input[type=date],textarea,select.in{width:100%;min-height:50px;padding:12px 14px;font:400 1rem/1.4 var(--body);color:var(--asphalt);background:var(--white);border:1px solid var(--warm);border-radius:8px;transition:border-color .2s,box-shadow .2s}
textarea{min-height:120px;resize:vertical}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--asphalt);box-shadow:0 0 0 3px var(--orange)}
fieldset{border:0;margin:0;padding:0;min-width:0}
/* bulk form: product tiles (same pattern as Dirt World + 360 wrap quote forms) */
.formsec form.card-form{border-radius:16px}
.qtile-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:8px}
.card-form .field .qtile{position:relative;display:grid;justify-items:center;align-content:start;gap:6px;padding:10px 4px;border:1.5px solid var(--line);border-radius:12px;background:var(--white);cursor:pointer;font:600 .74rem/1.2 var(--body);letter-spacing:0;text-transform:none;color:var(--warm);text-align:center;transition:border-color .2s,box-shadow .2s}
.card-form .field .qtile:hover{border-color:rgba(32,32,32,.32)}
.qtile img,.qtile .qt-q{width:56px;height:56px;object-fit:contain;border-radius:8px;mix-blend-mode:multiply}
.qtile .qt-q{display:grid;place-items:center;font:700 1.5rem/1 var(--display);font-style:normal;color:var(--warm);border:1.5px dashed rgba(32,32,32,.25)}
.qtile input{position:absolute;opacity:0;pointer-events:none}
.card-form .field .qtile:has(input:checked){border-color:var(--orange-strong);color:var(--asphalt);background:#fdeee9;box-shadow:0 0 0 3px rgba(198,69,37,.14)}
.qtile:has(input:focus-visible){outline:3px solid var(--orange);outline-offset:2px}
.qtile-picked{font-size:.85rem;color:#3A3632;margin-top:8px}
.card-form .flbl{font:600 .78rem/1.3 var(--body);letter-spacing:.08em;text-transform:uppercase}
.card-form .field .qlogo{position:relative;display:flex;align-items:center;justify-content:center;min-height:56px;padding:10px 14px;border:1.5px dashed var(--warm);border-radius:12px;background:var(--white);font:400 .92rem/1.3 var(--body);letter-spacing:0;text-transform:none;color:var(--warm);cursor:pointer;text-align:center;transition:border-color .2s}
.qlogo:hover,.qlogo:focus-within{border-color:var(--orange-strong)}
.qlogo b{color:var(--orange-strong);font-weight:600}
.qlogo input{position:absolute;inset:0;opacity:0;cursor:pointer}
.card-form small.hint{font-size:.8rem;color:var(--warm)}
.checks{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.checks label{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1px solid var(--warm);border-radius:var(--radius);background:var(--white);font:500 .9rem/1 var(--body);text-transform:none;letter-spacing:0;cursor:pointer}
.checks label:has(input:checked){border-color:var(--orange-strong);background:#fdeee9}
.checks input{accent-color:var(--orange-strong);width:18px;height:18px}
.form-success{display:none;padding:22px;background:var(--asphalt);color:var(--chalk);font-weight:500}
form.sent .form-success{display:block}
form.sent .form-body{display:none}
.error{color:#B23A2E;font-size:.85rem;min-height:1em}
.hint{font-size:.88rem;color:var(--warm)}

/* ---------- about ---------- */
.about-hero{min-height:min(80svh,760px)}
.about-hero h1{font-size:clamp(3.4rem,10vw,8rem);line-height:.84;font-weight:700;max-width:12ch}
.story{display:grid;gap:clamp(48px,7vw,96px)}
.story-row{display:grid;gap:24px}
@media (min-width:900px){.story-row{grid-template-columns:.8fr 1.2fr;gap:80px}}
.story-row h2{font-size:clamp(2.6rem,5.5vw,4.6rem)}
.story-row .body p+p{margin-top:16px}
.feat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px 12px}
@media (min-width:900px){.feat-grid{grid-template-columns:repeat(5,1fr)}}
.feat{display:grid;gap:10px;align-content:start}
.feat img{aspect-ratio:1/1;object-fit:cover;width:100%;background:var(--cloud)}
.feat h3{font-size:1.7rem}
.feat p{font-size:.9rem;color:var(--warm);line-height:1.5}
.group-img{width:100%;aspect-ratio:3/2;object-fit:cover}

/* ---------- makers ---------- */
.makers-hero{min-height:min(84svh,780px)}
.makers-hero h1{font-size:clamp(3.4rem,10vw,8rem);line-height:.84;font-weight:700}
.mk-presents{display:flex;align-items:flex-end;gap:10px;margin-bottom:-6px}.mk-presents img{height:clamp(12px,1.1vw,15px);width:auto}.mk-presents span{font:600 clamp(.56rem,.7vw,.66rem)/1 var(--body);letter-spacing:.2em;text-transform:uppercase;color:#fff;padding-bottom:1px}
.makers-hero .lede{color:#fff;font-weight:500;text-shadow:0 1px 12px rgba(0,0,0,.65)}
.makers-hero::after{background:linear-gradient(0deg,rgba(22,22,22,.95) 0%,rgba(22,22,22,.55) 50%,rgba(22,22,22,.2) 80%)}
@media (min-width:900px){.makers-hero::after{background:linear-gradient(90deg,rgba(22,22,22,.8) 0%,rgba(22,22,22,.25) 40%,rgba(22,22,22,.25) 55%,rgba(22,22,22,.82) 100%),linear-gradient(0deg,rgba(22,22,22,.85) 0%,transparent 50%)}}
.eps{display:grid;gap:28px 14px}
@media (min-width:760px){.eps{grid-template-columns:1fr 1fr}}
.ep{display:grid;gap:12px}
.ep .player{position:relative;aspect-ratio:16/9;background:var(--night);overflow:hidden}
.ep .player img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.ep .player .play{position:absolute;inset:0;width:100%;border:0;background:linear-gradient(0deg,rgba(22,22,22,.55),transparent 60%);cursor:pointer;display:grid;place-items:center}
.ep .player .play span{display:grid;place-items:center;width:76px;height:76px;border-radius:999px;background:var(--orange);color:var(--white);transition:transform .3s var(--ease)}
.ep .player:hover .play span{transform:scale(1.08)}
.ep .player:hover img{transform:scale(1.04)}
.ep .player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ep .num{font:600 .72rem/1 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--dust)}
.ep h3{font-size:clamp(1.8rem,2.8vw,2.4rem)}
.steps-ind{display:flex;gap:6px;margin-bottom:6px}
.steps-ind i{height:4px;flex:1;background:var(--line)}
.steps-ind i.on{background:var(--orange)}
.example{padding:16px;background:var(--cloud);font-size:.92rem;line-height:1.55}
.example summary{cursor:pointer;font-weight:600}
.charcount{font-size:.82rem;color:var(--warm);text-align:right}

/* ---------- contact ---------- */
.contact-grid{display:grid;gap:40px}
@media (min-width:900px){.contact-grid{grid-template-columns:.8fr 1.2fr;gap:96px}}
.contact-grid h1{font-size:clamp(3.4rem,8vw,6.5rem);line-height:.84;font-weight:700}
.reach{display:grid;gap:18px;margin-top:12px}
.reach a{font:600 1.6rem/1 var(--display);letter-spacing:.03em;text-decoration:none;text-transform:uppercase}
.reach a:hover{color:var(--orange-strong)}
.route{padding:16px 18px;background:var(--cloud);font-size:.95rem}
.route a{font-weight:600}

/* ---------- footer ---------- */
.ftr{background:var(--night);color:var(--chalk);padding:clamp(56px,7vw,96px) 0 calc(28px + env(safe-area-inset-bottom,0px))}
.ftr-top{display:grid;gap:44px;padding-bottom:48px;border-bottom:1px solid var(--line-d)}
@media (min-width:980px){.ftr-top{grid-template-columns:1.2fr 1fr;gap:96px}}
.ftr h2{font-size:clamp(2.6rem,5vw,4.4rem)}
.signup{display:grid;gap:14px}
.signup form{display:flex;gap:8px;flex-wrap:wrap}
.signup input{flex:1 1 220px;min-height:54px;border-radius:var(--radius);border:1px solid var(--dust);background:transparent;color:var(--chalk);padding:0 20px;font:400 1rem var(--body)}
.signup input::placeholder{color:var(--dust)}
.signup .ok{display:none;color:var(--chalk);font-weight:600}
.signup.sent form{display:none}
.signup.sent .ok{display:block}
.fcols{display:grid;grid-template-columns:repeat(2,1fr);gap:32px}
@media (min-width:640px){.fcols{grid-template-columns:repeat(4,1fr)}}
.fcols h3{font:600 .74rem/1.3 var(--body);letter-spacing:.16em;color:var(--dust);margin-bottom:14px}
.fcols ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.fcols a{text-decoration:none;font-size:.95rem}
.fcols a:hover{color:var(--orange)}
.ftr-bot{display:flex;flex-wrap:wrap;gap:20px 40px;justify-content:space-between;align-items:center;padding-top:28px;font-size:.85rem;color:var(--dust)}
.ftr-bot .contact{display:flex;gap:24px;flex-wrap:wrap}
.ftr-bot a{text-decoration:none}
.ftr-bot a:hover{color:var(--chalk)}
.socials{display:flex;gap:6px}
.socials a{display:grid;place-items:center;width:42px;height:42px;border-radius:999px;border:1px solid var(--line-d)}
.socials a:hover{border-color:var(--orange)}
.socials svg{width:18px;height:18px;fill:currentColor}

/* ---------- motion ---------- */
@keyframes rise{from{clip-path:inset(0 0 100% 0);transform:translateY(40%)}to{clip-path:inset(0 0 0 0);transform:none}}
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion:no-preference){
    .rv{animation:rv linear both;animation-timeline:view();animation-range:entry 0% cover 26%}
    .rv-2{animation-range:entry 8% cover 32%}.rv-3{animation-range:entry 16% cover 38%}.rv-4{animation-range:entry 24% cover 44%}
    @keyframes rv{from{transform:translateY(44px)}to{transform:none}}
    h2.bar::after{animation:bar linear both;animation-timeline:view();animation-range:entry 10% cover 35%}
    @keyframes bar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
    .spec .v b{animation:roll linear both;animation-timeline:view();animation-range:entry 20% cover 45%}
    @keyframes roll{from{transform:translateY(95%)}to{transform:none}}
    .steps .fill{animation:fillx linear both;animation-timeline:view();animation-range:entry 30% cover 60%}
    @keyframes fillx{from{transform:scaleX(0)}to{transform:scaleX(1)}}
    .para{animation:para linear both;animation-timeline:view()}
    @keyframes para{from{transform:translateY(-8%)}to{transform:translateY(8%)}}
    .cinema h2 span{animation:slide linear both;animation-timeline:view();animation-range:entry 20% cover 45%}
    /* headline lines slide in together, so they always sit level (Josh, Nov 6; was staggered) */
    @keyframes slide{from{transform:translateX(-12%)}to{transform:none}}
    .compare-img{animation:zoomout linear both;animation-timeline:view();animation-range:entry 0% cover 50%}
    @keyframes zoomout{from{transform:scale(1.15)}to{transform:scale(1)}}
  }
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .ticker,.trades .track{flex-wrap:wrap;width:auto}
}
/* ---------- Fresh off the line (home, new designs): full-bleed buy tiles ---------- */
.fcards{display:grid;gap:12px}
@media (min-width:760px){.fcards{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}}
.fcard{position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:space-between;aspect-ratio:4/5;padding:clamp(20px,2.4vw,30px);overflow:hidden;border-radius:var(--radius);text-decoration:none;color:var(--chalk);background:var(--asphalt)}
.fcard .bgart{position:absolute;inset:0;z-index:-1}
.fcard .bgart img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.fcard:hover .bgart img{transform:scale(1.05)}
.fcard::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(22,22,22,.7) 0%,rgba(22,22,22,0) 32%,rgba(22,22,22,0) 58%,rgba(22,22,22,.85) 100%)}
.fcard .topo-bg{background:var(--chalk)}
.fcard .topo-bg img.tex{position:absolute;inset:0;opacity:.3;mix-blend-mode:multiply}
.fcard .topo-bg img.cut{position:absolute;right:9%;top:29%;width:auto;height:56%;object-fit:contain;filter:drop-shadow(0 18px 22px rgba(22,22,22,.28))}
.fcard:hover .topo-bg img.tex{transform:none}
.fcard.light{color:var(--asphalt)}
.fcard.light::after{display:none}
.fcard.light .bot{position:relative}
.fcard .top{display:grid;gap:12px;justify-items:start}
.ftag{font:600 .68rem/1 var(--body);letter-spacing:.16em;text-transform:uppercase;padding:7px 10px 6px;border-radius:var(--radius);background:var(--orange);color:var(--white)}
.fcard h3{font:700 clamp(2.2rem,3.2vw,3rem)/.86 var(--display);text-transform:uppercase;max-width:12ch}
.fcard .bot{display:flex;align-items:end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.fcard .price{font:700 1.7rem/1 var(--display);letter-spacing:.02em}
.fcard .price s{font-size:.8em;opacity:.6;margin-left:4px}
.fcard .price span{display:block;margin-top:6px;font:500 .8rem/1.2 var(--body);letter-spacing:0;opacity:.85}
.fcard .btn{min-height:48px;padding:6px 22px 0;font-size:1.15rem}
.fcard:hover .btn-primary{background:var(--orange-stronger)}  /* whole tile hover darkens Shop now */
.tk{display:inline-block;padding:2px 8px;border:1px dashed currentColor;border-radius:6px;font:600 .82rem/1.4 ui-monospace,Menlo,monospace;color:var(--orange-stronger);background:rgba(241,84,45,.08)}
.cloud{--step-bg:var(--cloud)}.chalk{--step-bg:var(--chalk)}.dark{--step-bg:var(--night)}
/* ---------- dealer: steps inside the form section + sticky apply ---------- */
[data-view="dealer"] .msteps{list-style:none;margin:0;padding:0;display:grid;gap:18px;counter-reset:m}
[data-view="dealer"] .msteps li{display:grid;grid-template-columns:46px 1fr;gap:2px 14px;counter-increment:m}
[data-view="dealer"] .msteps li::before{content:counter(m);grid-row:span 2;font:700 2.6rem/.8 var(--display);color:var(--orange);padding-top:2px}
[data-view="dealer"] .msteps h3{font-size:1.5rem;line-height:1}
[data-view="dealer"] .msteps p{font-size:.95rem}
.dl-sticky{position:fixed;z-index:70;right:clamp(16px,3vw,32px);bottom:calc(16px + env(safe-area-inset-bottom,0px));box-shadow:0 10px 30px rgba(22,22,22,.3);opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity .25s,transform .3s var(--ease)}
.dl-sticky.on{opacity:1;transform:none;pointer-events:auto}
@media (max-width:640px){.dl-sticky{left:16px;right:16px}}
/* ---------- product cards: display name, price + buy button ---------- */
.card{text-decoration:none}
.card .ph{display:block}
.card .info{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;min-width:0}
.card .nm{font:600 clamp(1.35rem,1.7vw,1.6rem)/1 var(--display);text-transform:uppercase;letter-spacing:.01em;text-decoration:none;padding-top:4px}
.card .nm:hover{color:var(--orange-strong)}
.card .meta{font-size:.82rem;letter-spacing:.04em}
.card .buyrow{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:6px}
.card .price-line{font:700 1.45rem/1 var(--display);letter-spacing:.02em;padding-top:3px}
.card .price-line s{font-size:.8em}
.cbtn{display:inline-flex;align-items:center;min-height:40px;padding:2px 14px 0;border:0;border-radius:var(--radius);background:var(--asphalt);color:var(--white);font:600 1.02rem/1 var(--display);letter-spacing:.08em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background .2s}
.cbtn:hover{background:var(--orange-strong)}
.cbtn.ghost{background:transparent;color:var(--warm);border:1px solid var(--line)}
.dark .cbtn{background:var(--chalk);color:var(--asphalt)}
.card .vrow{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.card .vrow .price-line{flex:none}
.card .vrow.sub{font-size:.9rem;color:var(--warm);margin-top:-2px}
.card .vrow.sub .more{flex:none;font-size:.82rem}
.card .vrow+.buyrow .cbtn{width:100%;justify-content:center}
/* cards line up in every row, whatever the name length: 2-line name slot, 1-line color line, button pinned to the bottom */
.grid .card{display:flex;flex-direction:column;height:100%}
.grid .card .info{flex:1;display:flex;flex-direction:column;gap:6px}
.grid .card .nm,.card .nm{line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;padding-top:4px}
.card .cls{font-size:.88rem;color:var(--warm);margin-top:-2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card .sw-dot{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:7px;vertical-align:-1px;box-shadow:inset 0 0 0 1px rgba(32,32,32,.25)}
.card .on-col{color:var(--warm);opacity:.8}
.card .vrow.sub .vl{color:var(--asphalt)}
.card .buyrow .cbtn{width:100%;justify-content:center}
.grid .card .vrow{align-items:flex-start}
.grid .card .vrow .price-line{padding-top:5px}
.grid .card .vrow.sub .vl,.grid .card .meta{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.grid .card .buyrow{margin-top:auto;padding-top:6px}
/* tags (Preorder, Sold out, New print, badges) are a little squared: 4px, a notch under the 8px buttons */
.card .flag,.ftag,.badge-soon{border-radius:4px!important}
.crew-card:hover .crew-ph::before{transform:scale(1.04)}
/* crew tile in the shop grid: original dark tile, stretched to the full height of the product cards in its row */
.grid .crew-tile.full{aspect-ratio:auto;height:100%;min-height:100%}
.grid .crew-tile.full{position:relative;overflow:hidden;isolation:isolate}
.grid .crew-tile.full::before{content:"";position:absolute;inset:-10%;z-index:-1;background:url(/cdn/shop/files/bvs-img-topo-tan.jpg) center/cover no-repeat;mix-blend-mode:screen;opacity:.4;-webkit-mask-image:radial-gradient(ellipse 75% 50% at 40% 50%,transparent 18%,#000 80%);mask-image:radial-gradient(ellipse 75% 50% at 40% 50%,transparent 18%,#000 80%);transition:transform 1.2s var(--ease)}
.grid .crew-tile.full:hover::before{transform:translate(-12px,-8px)}
/* ---------- shop: left filters + 3-up grid ---------- */
.shop-body{display:grid;gap:20px}
@media (min-width:980px){.shop-body{grid-template-columns:220px minmax(0,1fr);gap:40px;align-items:start}}
@media (min-width:900px){.grid.g3{grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 16px}}
.fside{border:1px solid var(--line);border-radius:var(--radius);padding:4px 16px}
.fside summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;min-height:46px;font:600 .9rem/1 var(--body)}
.fside summary::-webkit-details-marker{display:none}
.fside summary::after{content:"+";font:600 1.4rem/1 var(--display)}
.fside[open] summary::after{content:"‘2"}
.fcount{margin-left:auto;margin-right:10px;color:var(--orange-strong)}
@media (min-width:980px){
  .fside{position:sticky;top:calc(var(--hdr) + 80px);border:0;border-radius:0;padding:0;max-height:calc(100svh - var(--hdr) - 100px);overflow:auto}
  .fside summary{pointer-events:none;min-height:0;padding:8px 0 4px;font:600 .72rem/1.3 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--warm)}
  .fside summary::after{display:none}
}
.fgroup{border-top:1px solid var(--line);padding:14px 0 12px}
.fgroup h4{margin:0 0 10px;font:600 .95rem/1.2 var(--body)}
.fgroup label{display:flex;align-items:center;gap:10px;min-height:34px;font-size:.92rem;cursor:pointer}
.fgroup input{width:18px;height:18px;accent-color:var(--asphalt);margin:0}
.fgroup label span{margin-left:auto;color:var(--warm);font-size:.82rem}
.fclear{margin:6px 0 14px;padding:0;border:0;background:none;font:600 .82rem/1 var(--body);letter-spacing:.12em;text-transform:uppercase;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.shop-main .count{margin-top:0}
/* ---------- about (rebuilt): headline/body split, captioned team photo, numbered how-we-build cards, giving-back pair ---------- */
.about-hero .inner{align-items:end}
.ab-split{display:grid;gap:24px}
@media (min-width:900px){.ab-split{grid-template-columns:1fr 1fr;gap:96px;align-items:start}}
.ab-split h2{font-size:clamp(2.6rem,5.5vw,4.6rem)}
/* Welcome Home Initiative (story-first, rebuilt 2026-11-04) */
.wh-hero{min-height:min(84svh,780px)}
.wh-hero .bg{object-position:50% 12%}@media (min-width:900px){.wh-hero .bg{object-position:50% 30%}}
.wh-hero h1{font-size:clamp(3.2rem,9vw,7.4rem);line-height:.86;font-weight:700;max-width:13ch}
.wh-hero .side{max-width:420px}
.wh-k{color:var(--orange-strong)!important;margin-bottom:14px}
.dark .wh-k{color:var(--orange)!important}
.wh-card-in{aspect-ratio:4/5;display:grid;align-content:center;justify-items:start;gap:6px;padding:28px 26px;background:var(--chalk)}
.wh-card-in b{font:700 clamp(4.4rem,8vw,6.4rem)/.8 var(--display);color:var(--orange-strong)}
.wh-card-in span{font:600 .8rem/1.2 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--asphalt)}
.wh-card-in i{display:block;width:100%;height:1px;background:var(--line);margin:18px 0}
.wh-story-chap{align-items:center}
.wh-story-chap .wh-text h2{margin-bottom:8px}
.wh-story-chap .wh-print{width:min(340px,80%);justify-self:center}
@media (min-width:900px){.wh-story-chap{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr)}.wh-story-chap.flip{grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)}.wh-story-chap .wh-print{width:min(360px,100%)}}
@media (max-width:899px){.wh-story-chap .wh-print{order:-1}}
.wh-print.tilt-r{transform:rotate(2.5deg)}
.wh-journal{max-width:1080px}
.wh-jhead{display:grid;gap:28px;align-items:end;margin-bottom:clamp(36px,5vw,64px)}
@media (min-width:800px){.wh-jhead{grid-template-columns:1fr 300px;gap:64px}}
.wh-print{margin:0;justify-self:start;width:min(260px,70%);background:var(--white);padding:12px 12px 14px;box-shadow:0 14px 34px rgba(0,0,0,.16),0 2px 6px rgba(0,0,0,.08);transform:rotate(-2.5deg)}
@media (min-width:800px){.wh-print{width:100%;justify-self:end}}
.wh-print img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 0;display:block}
.wh-print figcaption{margin-top:10px;font:600 .72rem/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--warm);text-align:center}
.wh-rows{display:grid;border-top:2px solid var(--asphalt)}
.wh-row{display:grid;gap:10px;padding:26px 0;border-bottom:1px solid var(--line)}
@media (min-width:800px){.wh-row{grid-template-columns:200px minmax(0,1fr);gap:48px}}
.wh-when{font:700 clamp(2rem,3.4vw,2.8rem)/.9 var(--display);text-transform:uppercase;color:var(--orange-strong)}
.wh-row .wh-text{gap:16px}
.wh-jbeat{margin:0;padding:34px 0;border-bottom:1px solid var(--line);font:700 clamp(2.2rem,5vw,4rem)/.92 var(--display);text-transform:uppercase;color:var(--asphalt)}
@media (min-width:800px){.wh-jbeat{padding-left:248px}}
.wh-read{max-width:760px}
.wh-intro{display:grid;grid-template-areas:"k" "h" "ph" "t";gap:0}
.wh-intro>.wh-k{grid-area:k}.wh-intro>h2{grid-area:h}.wh-intro>.wh-side{grid-area:ph;margin-top:28px}.wh-intro>.wh-text{grid-area:t;margin-top:clamp(24px,3vw,36px)}
.wh-side img{aspect-ratio:4/5;object-position:50% 0}
@media (min-width:1000px){.wh-intro{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);grid-template-areas:"k ph" "h ph" "t ph";column-gap:88px;align-items:start}.wh-intro>.wh-side{margin-top:0;position:sticky;top:calc(var(--hdr,72px) + 32px);grid-row:1/4}}
.wh-text{display:grid;gap:20px;max-width:64ch}
.wh-read .wh-text{margin-top:clamp(24px,3vw,36px)}
.wh-text p{font-size:1.1rem;line-height:1.8;color:#3A3632}
.wh-text p.wh-first{font-size:1.3rem;line-height:1.6;color:var(--asphalt)}
.wh-text p.wh-beat{font:700 clamp(1.8rem,3vw,2.5rem)/1 var(--display);text-transform:uppercase;color:var(--asphalt);margin:22px 0;padding-left:20px;border-left:4px solid var(--orange)}
.wh-h{font:700 clamp(2.2rem,4vw,3.2rem)/.9 var(--display);text-transform:uppercase;margin-bottom:4px}
.wh-chap{display:grid;gap:clamp(28px,4vw,40px);align-items:center}
@media (min-width:900px){.wh-chap{grid-template-columns:1fr 1fr;gap:80px}.wh-chap.rev .wh-ph{order:2}}
.wh-ph{margin:0;display:grid;gap:12px}
.wh-ph img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--radius);display:block}
.wh-ph.tall img{aspect-ratio:4/5}
.wh-ph figcaption{font-size:.92rem;line-height:1.5;color:var(--warm)}
.wh-ph figcaption b{display:block;font:700 1.15rem/1 var(--display);text-transform:uppercase;letter-spacing:.03em;color:var(--asphalt);margin-bottom:4px}
.wh-pull{margin:18px 0 0;padding-top:22px;border-top:4px solid var(--orange);font:700 clamp(1.9rem,3.2vw,2.8rem)/.98 var(--display);text-transform:uppercase;color:var(--asphalt);max-width:22ch}
.wh-pledge{display:grid;gap:28px}
.dark .wh-text p{color:var(--dust)}
.dark .wh-text p.wh-lead{font-size:1.2rem;color:var(--chalk)}
.dark .wh-text p.wh-strat{margin-top:20px;padding-left:24px;border-left:4px solid var(--orange);font:700 clamp(1.6rem,2.6vw,2.2rem)/1.05 var(--display);text-transform:uppercase;color:var(--chalk)}
/* Returns & warranty */
.rt-hero h1{font:700 clamp(3.2rem,9vw,7rem)/.86 var(--display);text-transform:uppercase}
.rt-hd{display:grid;gap:24px}
@media (min-width:900px){.rt-hd{grid-template-columns:1.1fr .9fr;align-items:end;gap:64px}}
.rt-hero .lede{color:var(--dust);max-width:52ch}
.rt-facts{display:grid;gap:10px;margin-top:clamp(36px,5vw,56px)}
@media (min-width:700px){.rt-facts{grid-template-columns:repeat(3,1fr)}}
.rt-fact{display:grid;gap:8px;padding:22px 24px;border:1px solid rgba(236,235,233,.18);border-radius:var(--radius);text-decoration:none;color:var(--chalk);transition:border-color .2s,background .2s}
.rt-fact:hover{border-color:var(--orange);background:rgba(241,84,45,.08)}
.rt-fact b{font:700 clamp(2.2rem,3.6vw,3rem)/.9 var(--display);text-transform:uppercase;color:var(--orange)}
.rt-fact span{font-size:.92rem;color:var(--dust)}
.rt-split{display:grid;gap:28px}
@media (min-width:900px){.rt-split{grid-template-columns:.8fr 1.2fr;gap:88px;align-items:start}}
.rt-body{max-width:64ch}
.rt-body a:not(.btn){color:var(--orange-stronger);font-weight:600}
.rt-two{display:grid;gap:12px}
@media (min-width:640px){.rt-two{grid-template-columns:1fr 1fr}}
.rt-card{padding:22px;border:1px solid var(--line);border-radius:var(--radius);background:var(--cloud);display:grid;gap:8px;align-content:start}
.rt-card h3{font:700 1.5rem/1 var(--display);text-transform:uppercase;display:flex;gap:10px;align-items:center}
.rt-card h3::before{content:"";width:10px;height:10px;border-radius:99px;background:#3E8E5A}
.rt-card.no h3::before{background:var(--orange-strong)}
.rt-steps{list-style:none;margin:0;padding:0;display:grid;border-top:2px solid var(--asphalt)}
.rt-steps li{display:grid;gap:8px;padding:20px 0;border-bottom:1px solid var(--line)}
@media (min-width:700px){.rt-steps li{grid-template-columns:200px 1fr;gap:24px}}
.rt-when{font:700 1.25rem/1.05 var(--display);text-transform:uppercase;letter-spacing:.02em}
.rt-fine{font-size:.88rem}
.rt-contact{display:flex;flex-wrap:wrap;gap:18px;align-items:center}
.rt-body a.rt-tel{font:700 1.8rem/1 var(--display);letter-spacing:.03em;color:var(--asphalt);text-decoration:none}
.rt-body a.rt-tel:hover{color:var(--orange-stronger)}
.ab-team{margin:0}
.ab-team img{width:100%;aspect-ratio:3/2;object-fit:cover;object-position:50% 25%}
@media (min-width:900px){.ab-team img{aspect-ratio:16/9}}
.ab-team figcaption{padding-top:14px;padding-bottom:14px;font-size:.9rem;color:var(--warm)}
.ab-two{display:grid;gap:14px}
@media (min-width:900px){.ab-two{grid-template-columns:1fr 1fr;gap:20px}}
.ab-card{display:grid;gap:14px;align-content:start;padding:clamp(24px,3vw,40px);background:var(--white);border:1px solid var(--line);border-radius:var(--radius)}
.ab-num{font:700 1.1rem/1 var(--display);letter-spacing:.08em;color:var(--orange-strong)}
.ab-card h3{font-size:clamp(2rem,3vw,2.8rem);line-height:.9}
.ab-feat-hd{margin:clamp(56px,7vw,88px) 0 24px;font-size:clamp(1.9rem,3vw,2.6rem)}
@media (min-width:900px){.ab-feats{grid-template-columns:repeat(5,1fr)!important}}
.ab-give{display:grid;gap:14px}
@media (min-width:900px){.ab-give{grid-template-columns:1.5fr 1fr;gap:20px}}
.ab-wh,.ab-faith{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.ab-wh{display:grid}
.ab-wh img{width:100%;aspect-ratio:16/9;object-fit:cover}
.ab-wh .stack{padding:clamp(22px,3vw,34px)}
.ab-faith{display:grid;align-content:start}.ab-faith img{width:100%;aspect-ratio:16/10;object-fit:cover}.ab-faith .stack{padding:clamp(22px,3vw,34px)}
.ab-faith{background:var(--asphalt);border-color:var(--asphalt);color:var(--chalk)}
.ab-faith .muted{color:var(--dust)}
.ab-faith .textlink{justify-self:start;color:var(--chalk)}
.ab-faith .textlink:hover{color:var(--orange)}
.ab-wh h3,.ab-faith h3{font-size:clamp(1.9rem,2.6vw,2.4rem);line-height:.92}
/* ---------- header v2: Shop / Customize / Business / About / Support ---------- */
.nav .dd>button{display:inline-flex;align-items:center;gap:6px}
.nav .dd.here>button{border-color:var(--asphalt)}
.nav .shop-panel{width:620px;display:grid;grid-template-columns:1fr 1fr;gap:4px}
.nav .shop-panel .sp{display:grid;grid-template-columns:64px 1fr;grid-template-rows:auto auto;gap:2px 14px;align-items:center;padding:10px}
.nav .shop-panel .sp img{grid-row:1/span 2;width:64px;height:64px;object-fit:cover;border-radius:6px;background:var(--cloud)}
.nav .shop-panel .sp strong{font-size:1.3rem;align-self:end}
.nav .shop-panel .sp span{grid-column:2;align-self:start}
.nav .shop-panel .quote-row{grid-column:1/-1}
.nav .shop-panel{left:-12px;transform:translate(0,-6px)}
.nav .dd>button[aria-expanded="true"]+.shop-panel{transform:translate(0,0)}
@media (hover:hover){.nav .dd:hover .shop-panel{transform:translate(0,0)}}
.nav .nav-cta{padding:9px 14px 7px!important;border:1.5px solid var(--asphalt)!important;border-radius:var(--radius);font:700 1.02rem/1 var(--display)!important;letter-spacing:.08em;text-transform:uppercase;transition:background .2s,color .2s}
.nav .nav-cta:hover{background:var(--orange);border-color:var(--orange)!important;color:var(--white)}
.drawer nav a.m-cta{display:block;margin:4px 0 12px;padding:16px 0 12px;text-align:center;background:var(--orange);color:var(--white);border:0!important;border-radius:var(--radius);font:700 1.5rem/1 var(--display)!important;letter-spacing:.06em}
.drawer .mgroup{border-bottom:1px solid var(--line)}
.drawer .mgroup summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;font:600 2.4rem/1 var(--display);text-transform:uppercase;padding:14px 0 8px}
.drawer .mgroup summary::-webkit-details-marker{display:none}
.drawer .mgroup a[aria-current="page"]{border-left-color:var(--orange)}
.drawer .mgroup a[aria-current="page"]::before{content:"You're here";justify-self:start;margin-bottom:4px;white-space:nowrap;font:600 .56rem/1 var(--body);letter-spacing:.14em;text-transform:uppercase;padding:4px 7px;border-radius:999px;background:var(--asphalt);color:var(--white)}
.drawer .mgroup summary::after{content:"+";font-size:1.8rem;transition:transform .25s var(--ease)}
.drawer .mgroup[open] summary::after{transform:rotate(45deg)}
.drawer .mgroup a{display:grid;gap:2px;padding:10px 0 10px 16px;margin:0 0 6px;border-left:3px solid var(--line);border-bottom:0!important;text-decoration:none;font:400 1rem/1.4 var(--body)!important;text-transform:none!important}
.drawer .mgroup a strong{font:600 1.4rem/1 var(--display);text-transform:uppercase}
.drawer .mgroup a span{font-size:.88rem;color:var(--warm)}
.drawer .m-reach{display:grid;gap:8px;padding:20px 0 0}
.drawer .m-reach a{font:500 1rem/1.4 var(--body)!important;text-transform:none!important;border:0!important;padding:0!important}
/* ---------- header v3: utility row (phone | callouts | company menus) + shop row ---------- */
:root{--urow:36px}
.urow{display:none}
@media (min-width:1080px){
  .urow{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;height:var(--urow);padding:0 var(--pad);background:var(--asphalt);color:var(--chalk);font:500 .78rem/1 var(--body);letter-spacing:.04em}
  .urow .u-phone{justify-self:start;color:var(--chalk);text-decoration:none}
  .urow .u-phone:hover{color:var(--white);text-decoration:underline;text-underline-offset:4px}
  .urow .u-call{margin:0;text-align:center;white-space:nowrap}
  .urow .u-call b{font-weight:600}
  .urow .u-nav{justify-self:end;display:flex;gap:2px}
  .urow .dd>button{color:var(--chalk);font:500 .78rem/1 var(--body);letter-spacing:.04em;padding:11px 10px;border:0;background:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
  .urow .dd>button svg{width:10px;height:10px}
  .urow .dd>button:hover,.urow .dd>button[aria-expanded="true"],.urow .dd.here>button{color:var(--white);text-decoration:underline;text-underline-offset:4px}
  .urow .biz-panel{left:auto;right:0;top:calc(100% + 1px);transform:translate(0,-6px);color:var(--asphalt);z-index:95}
  .urow .dd>button[aria-expanded="true"]+.biz-panel{transform:translate(0,0)}
  .urow .biz-panel::before{top:-8px;height:8px}
}
@media (min-width:1080px) and (hover:hover){.urow .dd:hover .biz-panel{transform:translate(0,0)}}
.util{align-items:center}
.util .hdr-cta{margin-right:8px;display:inline-flex;align-items:center;min-height:38px;padding:3px 14px 0;border:0;border-radius:var(--radius);background:var(--orange);color:var(--white);font:700 1.05rem/1 var(--display);letter-spacing:.08em;text-transform:uppercase;text-decoration:none;transition:background .2s}
.util .hdr-cta:hover{background:var(--orange-stronger)}
@media (min-width:1080px){.hdr .in{grid-template-columns:200px 1fr auto}}
@media (max-width:1079px){.util .hdr-cta{display:none}}
/* ---------- bulk: pick what you need ---------- */
.pick{padding-bottom:clamp(48px,6vw,80px)}
@media (min-width:900px){.logo-a .btn{min-width:330px}}
.logo-a{align-content:space-between}
.logo-panels{display:grid}.logo-panels>.logo-a{grid-area:1/1}.logo-a.off{visibility:hidden}
.la-act{display:grid;gap:12px;justify-items:center}.logo-wrapline{margin:0;font-size:.88rem;color:var(--warm);text-align:center}.logo-wrapline.spacer{visibility:hidden}@media (max-width:899px){.la-act{justify-items:stretch}}.logo-wrapline a,.logo-wrapline b{color:var(--asphalt);font-weight:600}
.logo-q{display:inline-flex;gap:4px;padding:4px;border:1px solid var(--line);border-radius:var(--radius);background:var(--white);margin-bottom:16px}
.logo-q button{border:0;background:transparent;padding:12px 18px;border-radius:6px;font:600 .95rem/1 var(--body);color:var(--asphalt);cursor:pointer}
.logo-q button[aria-selected="true"]{background:var(--asphalt);color:var(--white)}
.logo-a{display:grid;gap:24px;align-items:end;padding:clamp(22px,3vw,36px);border:1px solid var(--line);border-radius:var(--radius);background:var(--white)}
@media (min-width:900px){.logo-a{grid-template-columns:1fr auto;gap:48px}}
.logo-a h3{font:700 clamp(1.8rem,3vw,2.4rem)/1 var(--display);text-transform:uppercase}
.logo-a .tiers{max-width:560px}
@media (min-width:600px){.logo-a .tiers{grid-template-columns:repeat(4,1fr)}}
.pick-grid{display:grid;gap:12px}
@media (min-width:760px){.pick-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}}
.pick-card{display:grid;gap:12px;align-content:start;justify-items:start;padding:clamp(22px,2.6vw,32px);border:1px solid var(--line);border-radius:var(--radius);text-decoration:none;background:var(--white);transition:border-color .2s,transform .25s var(--ease)}
.pick-card:hover{border-color:var(--orange);transform:translateY(-2px)}
.pick-card h3{font:600 clamp(1.8rem,2.4vw,2.2rem)/.9 var(--display);text-transform:uppercase}
/* ---------- For Business menu (from builds/dealer) ---------- */
.nav{align-items:center}
.biz{position:relative}
.biz>button{display:inline-flex;align-items:center;gap:6px}
.biz>button svg{width:12px;height:12px;transition:transform .25s var(--ease)}
.biz>button[aria-expanded="true"] svg{transform:rotate(180deg)}
.biz-panel{position:absolute;left:50%;top:calc(100% + 13px);width:440px;transform:translate(-50%,-6px);opacity:0;visibility:hidden;transition:opacity .2s,transform .25s var(--ease),visibility 0s .25s;background:var(--white);border:1px solid var(--line);padding:10px}
.biz-panel::before{content:"";position:absolute;left:0;right:0;top:-17px;height:17px}
.biz>button[aria-expanded="true"]+.biz-panel{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .2s,transform .25s var(--ease)}
.biz-panel a{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 16px;padding:14px 14px 12px;text-decoration:none;border-radius:6px;transition:background .2s}
.biz-panel a:hover,.biz-panel a:focus-visible{background:var(--cloud)}
.biz-panel strong{font:600 1.55rem/1 var(--display);text-transform:uppercase;letter-spacing:.02em}
.biz-panel span{grid-column:1;font-size:.88rem;line-height:1.35;color:var(--warm)}
.biz-panel i{grid-column:2;grid-row:1/span 2;font:700 1.5rem/1 var(--display);font-style:normal;color:var(--orange-strong);transition:transform .3s var(--ease)}
.biz-panel a:hover i{transform:translateX(4px)}
.biz-panel a[aria-current="page"]{background:var(--cloud);box-shadow:inset 3px 0 0 var(--orange)}
.biz-panel a[aria-current="page"] i{display:none}
.biz-panel a[aria-current="page"]::after{content:"You're here";grid-column:2;grid-row:1/span 2;align-self:center;white-space:nowrap;font:600 .6rem/1 var(--body);letter-spacing:.14em;text-transform:uppercase;padding:5px 9px;border-radius:999px;background:var(--asphalt);color:var(--white)}
.biz-panel .quote-row{margin-top:6px;border-top:1px solid var(--line);border-radius:0;padding-top:16px}
.biz-panel .quote-row strong{font-size:1.25rem}
.drawer .group{padding:16px 0 10px;border-bottom:1px solid var(--line)}
.drawer .group p{font:600 2.4rem/1 var(--display);text-transform:uppercase}
.drawer .group a{display:grid;gap:2px;padding:12px 0 10px 16px;margin-top:6px;border-left:3px solid var(--line);text-decoration:none}
.drawer .group a[aria-current="page"]{border-color:var(--orange)}
.drawer .group strong{font:600 1.5rem/1 var(--display);text-transform:uppercase}
.drawer .group span{font-size:.88rem;color:var(--warm)}
.nav .biz-panel a{border-bottom:0;font:inherit}
.nav .biz-panel .quote-row{border-top:1px solid var(--line)}
.drawer .group a{border-bottom:0;font:400 1rem/1.4 var(--body);text-transform:none}
.biz>button{font:600 .92rem/1 var(--body);padding:10px 2px;border:0;border-bottom:2px solid transparent;background:none;cursor:pointer;transition:border-color .2s}
.biz:hover>button,.biz>button[aria-expanded="true"],.biz.here>button{border-color:var(--asphalt)}
/* ---------- Become a Dealer view (from builds/dealer, scoped) ---------- */
[data-view="dealer"] h1,[data-view="dealer"] h2,[data-view="dealer"] h3{font-family:var(--display);text-transform:uppercase;font-weight:600;margin:0;text-wrap:balance;letter-spacing:.01em}
[data-view="dealer"] h2{font-size:clamp(2.8rem,7vw,5.6rem);line-height:.86}
[data-view="dealer"] h3{font-size:clamp(1.7rem,3vw,2.3rem);line-height:.92}
[data-view="dealer"] p{margin:0}
[data-view="dealer"] .muted{color:var(--warm)}
[data-view="dealer"] .dark .muted{color:var(--dust)}
[data-view="dealer"] .micro{font:600 .72rem/1.3 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--warm)}
[data-view="dealer"] .on-media .micro{color:var(--chalk)}
[data-view="dealer"] .formsec .muted,[data-view="dealer"] .ftr .muted{color:var(--dust)}
[data-view="dealer"] .hl{color:var(--orange)}
[data-view="dealer"] h2.bar::after{content:"";display:block;width:72px;height:6px;margin-top:20px;background:var(--orange);transform-origin:left}
[data-view="dealer"] .stack>*+*{margin-top:var(--gap,20px)}
[data-view="dealer"] .lede{font-size:clamp(1.05rem,1.6vw,1.2rem);line-height:1.55;max-width:44ch}
[data-view="dealer"] .body{max-width:58ch}
[data-view="dealer"] .tk{display:inline-block;padding:2px 8px;border:1px dashed currentColor;border-radius:6px;font:600 .82rem/1.4 ui-monospace,Menlo,monospace;color:var(--orange-stronger);background:rgba(241,84,45,.08)}
[data-view="dealer"] .dark .tk,[data-view="dealer"] .formsec .tk{color:var(--orange)}

/* ---------- hero ---------- */
[data-view="dealer"] .media{position:relative;overflow:hidden;display:grid;background:var(--night);color:var(--chalk)}
[data-view="dealer"] .media .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
[data-view="dealer"] .media::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(22,22,22,.94) 0%,rgba(22,22,22,.45) 48%,rgba(22,22,22,.1) 78%)}
[data-view="dealer"] .media .inner{position:relative;z-index:2;align-self:end;width:100%;display:grid;gap:24px;padding-top:120px;padding-bottom:clamp(36px,6vw,80px)}
[data-view="dealer"] .hero{min-height:min(calc(100svh - var(--hdr) - 34px),860px)}
[data-view="dealer"] .hero .bg{object-position:34% 62%}
[data-view="dealer"] .hero h1{font-size:clamp(3.6rem,13vw,9rem);line-height:.84;font-weight:700}
[data-view="dealer"] .hero h1 .line{display:block;white-space:nowrap;animation:rise 1s var(--ease) both}
[data-view="dealer"] .hero h1 .line:nth-child(2){animation-delay:.12s}
[data-view="dealer"] .hero .side{display:grid;gap:22px;max-width:410px}
@media (min-width:900px){
  [data-view="dealer"] .media::after{background:linear-gradient(90deg,rgba(22,22,22,.88) 0%,rgba(22,22,22,.35) 48%,transparent 68%),linear-gradient(0deg,rgba(22,22,22,.85) 0%,transparent 45%)}
  [data-view="dealer"] .media .inner{grid-template-columns:1fr auto;align-items:end;gap:48px}
  [data-view="dealer"] .hero .bg{object-position:50% 70%}
  [data-view="dealer"] .hero h1{font-size:clamp(5.4rem,7.6vw,8.6rem)}
}

/* ---------- who we're looking for ---------- */
[data-view="dealer"] .fit{display:grid;gap:40px}
@media (min-width:900px){[data-view="dealer"] .fit{grid-template-columns:.9fr 1.1fr;gap:96px;align-items:start}}
[data-view="dealer"] .stores{list-style:none;margin:0;padding:0;border-top:2px solid var(--asphalt)}
[data-view="dealer"] .stores li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:18px 0 10px;border-bottom:1px solid var(--line);font:600 clamp(2rem,4vw,3.2rem)/.95 var(--display);text-transform:uppercase;transition:padding .3s var(--ease),color .3s}
[data-view="dealer"] .stores li:hover{padding-left:12px;color:var(--orange-stronger)}
[data-view="dealer"] .stores li small{font:500 .82rem/1.3 var(--body);text-transform:none;color:var(--warm);text-align:right;max-width:20ch}
[data-view="dealer"] .stores li.other{display:block;padding:20px 0 16px;font:400 1rem/1.5 var(--body);text-transform:none;color:var(--warm)}
[data-view="dealer"] .stores li.other:hover{padding-left:0;color:var(--warm)}
[data-view="dealer"] .stores li.other b{font-weight:600;color:var(--asphalt)}

/* ---------- lineup ---------- */
[data-view="dealer"] .lineup-hd{display:grid;gap:14px;margin-bottom:clamp(32px,4vw,52px)}
[data-view="dealer"] .lineup{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;margin:0;padding:0;list-style:none;background:var(--line)}
[data-view="dealer"] .lineup .item:last-child{grid-column:1/-1;grid-template-columns:1fr 1fr;grid-template-rows:1fr auto auto 1fr;padding-bottom:0}
[data-view="dealer"] .lineup .item:last-child img{grid-column:1;grid-row:1/-1}
[data-view="dealer"] .lineup .item:last-child span{grid-column:2;grid-row:2;padding-top:0}
[data-view="dealer"] .lineup .item:last-child small{grid-column:2;grid-row:3}
@media (min-width:900px){[data-view="dealer"] .lineup{grid-template-columns:repeat(5,minmax(0,1fr))}[data-view="dealer"] .lineup .item:last-child{grid-column:auto;grid-template-columns:none;grid-template-rows:none;padding-bottom:20px}[data-view="dealer"] .lineup .item:last-child img,[data-view="dealer"] .lineup .item:last-child span,[data-view="dealer"] .lineup .item:last-child small{grid-column:auto;grid-row:auto}[data-view="dealer"] .lineup .item:last-child span{padding-top:12px}}
[data-view="dealer"] .item{position:relative;display:grid;gap:4px;align-content:start;padding:0 0 20px;background:var(--white)}
[data-view="dealer"] .item img{width:100%;aspect-ratio:1/1;object-fit:cover}
[data-view="dealer"] .item span{padding:12px 16px 0;font:600 clamp(1.6rem,2.2vw,2rem)/.95 var(--display);text-transform:uppercase;letter-spacing:.02em}
[data-view="dealer"] .item small{padding:0 16px;font-size:.88rem;color:var(--warm)}
[data-view="dealer"] .item .soon{position:absolute;z-index:2;left:12px;top:12px;font:600 .66rem/1 var(--body);letter-spacing:.12em;text-transform:uppercase;background:var(--asphalt);color:var(--white);padding:7px 10px;border-radius:999px}
[data-view="dealer"] .fullline{margin-top:22px}
[data-view="dealer"] .textlink{font:600 .82rem/1 var(--body);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-bottom:2px solid currentColor;padding-bottom:5px}
[data-view="dealer"] .textlink:hover{color:var(--orange-stronger)}
[data-view="dealer"] .specs{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line);margin-top:clamp(56px,8vw,96px)}
[data-view="dealer"] .spec{padding:26px 18px 8px 0;display:grid;gap:10px;align-content:start}
[data-view="dealer"] .spec .v{display:block;overflow:hidden;font:700 clamp(3.2rem,7vw,6rem)/.8 var(--display);letter-spacing:-.01em;padding-top:.08em}
[data-view="dealer"] .spec .v b{display:inline-block;font-weight:700}
[data-view="dealer"] .spec .v small{font-size:.42em;color:var(--orange-stronger);margin-left:.08em;letter-spacing:.04em}
[data-view="dealer"] .spec .k{font:600 .72rem/1.35 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--warm)}
@media (min-width:900px){[data-view="dealer"] .specs{grid-template-columns:repeat(4,1fr)}[data-view="dealer"] .spec+.spec{padding-left:24px;border-left:1px solid var(--line)}}
@media (max-width:899px){[data-view="dealer"] .spec:nth-child(even){padding-left:18px;border-left:1px solid var(--line)}}

/* ---------- what you get (bento) ---------- */
[data-view="dealer"] .bento{display:grid;gap:12px;margin-top:clamp(36px,5vw,56px)}
[data-view="dealer"] .tile{position:relative;overflow:hidden;min-height:300px;display:grid;background:var(--asphalt);color:var(--chalk)}
[data-view="dealer"] .tile.slate{background:var(--slate)}
[data-view="dealer"] .tile.slate .muted,[data-view="dealer"] .tile.slate .tk{color:var(--chalk)}
[data-view="dealer"] .tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
[data-view="dealer"] .tile:hover img{transform:scale(1.04)}
[data-view="dealer"] .tile.photo::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(22,22,22,.94) 0%,rgba(22,22,22,.4) 40%,transparent 66%)}
[data-view="dealer"] .tile .t{position:relative;z-index:2;align-self:end;padding:clamp(22px,3vw,34px);display:grid;gap:12px;max-width:48ch}
[data-view="dealer"] .tile .t h3{font-size:clamp(2.1rem,3.4vw,3rem);line-height:.88}
[data-view="dealer"] .tile .big{font:700 clamp(4.4rem,8vw,7rem)/.8 var(--display);color:var(--orange);align-self:start;padding:clamp(22px,3vw,34px) clamp(22px,3vw,34px) 0;position:relative;z-index:2}
[data-view="dealer"] .tile .tel{font:700 clamp(1.9rem,2.8vw,2.4rem)/1 var(--display);letter-spacing:.03em;text-decoration:none;color:var(--white);justify-self:start;border-bottom:3px solid var(--orange);padding-top:4px}
[data-view="dealer"] .tile .tel:hover{color:var(--orange)}
@media (min-width:900px){
  [data-view="dealer"] .bento{grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:310px}
  [data-view="dealer"] .tile{min-height:0}
  [data-view="dealer"] .g1{grid-column:span 5;grid-row:span 2}[data-view="dealer"] .g2{grid-column:span 7}[data-view="dealer"] .g3{grid-column:span 4}[data-view="dealer"] .g4{grid-column:span 3}
  [data-view="dealer"] .g3 .t,[data-view="dealer"] .g4 .t{padding:24px}[data-view="dealer"] .g3 .t h3,[data-view="dealer"] .g4 .t h3{font-size:clamp(1.8rem,2.4vw,2.3rem)}
}

/* ---------- proof ---------- */
[data-view="dealer"] .proof{display:grid;gap:44px;align-items:center}
@media (min-width:900px){[data-view="dealer"] .proof{grid-template-columns:1.15fr .85fr;gap:88px}}
[data-view="dealer"] .bigquote{margin:0}
[data-view="dealer"] .bigquote blockquote{margin:0;font:600 clamp(2.2rem,4.6vw,3.9rem)/.95 var(--display);text-transform:uppercase}
[data-view="dealer"] .bigquote em{font-style:normal;color:var(--orange-strong)}
[data-view="dealer"] .bigquote cite,[data-view="dealer"] .quote cite{display:block;margin-top:18px;font:500 .9rem/1.4 var(--body);font-style:normal;color:var(--warm)}
[data-view="dealer"] .quote{margin:36px 0 0;padding-top:22px;border-top:1px solid var(--line);max-width:52ch}
[data-view="dealer"] .quote blockquote{margin:0;font-size:1.06rem;line-height:1.55}
[data-view="dealer"] .team{margin:0;display:grid;gap:12px}
[data-view="dealer"] .team img{width:100%;aspect-ratio:4/3;object-fit:cover}
[data-view="dealer"] .team figcaption{font-size:.88rem;color:var(--warm)}
[data-view="dealer"] .stockists{margin-top:clamp(48px,6vw,72px);padding-top:26px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center}

/* ---------- steps ---------- */
[data-view="dealer"] .steps{list-style:none;margin:52px 0 0;padding:0;display:grid;gap:40px;counter-reset:s}
[data-view="dealer"] .steps li{position:relative;display:grid;gap:12px;counter-increment:s;padding-top:26px;align-content:start}
[data-view="dealer"] .steps li::before{content:counter(s);font:700 clamp(6rem,11vw,9rem)/.75 var(--display);color:var(--step-bg,var(--white));-webkit-text-stroke:4px var(--orange-strong);paint-order:stroke fill;margin-bottom:6px}
[data-view="dealer"] .steps li::after{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--line)}
[data-view="dealer"] .steps .fill{position:absolute;top:0;left:0;height:3px;width:100%;background:var(--orange);transform-origin:left;z-index:1}
[data-view="dealer"] .steps p{max-width:40ch}
@media (min-width:900px){[data-view="dealer"] .steps{grid-template-columns:repeat(3,1fr)}}

/* ---------- form ---------- */
[data-view="dealer"] .formsec{background:radial-gradient(ellipse 60% 70% at 100% 0%,rgba(241,84,45,.38),transparent 70%),var(--asphalt);color:var(--chalk)}
[data-view="dealer"] .form-grid{display:grid;gap:40px}
@media (min-width:900px){[data-view="dealer"] .form-grid{grid-template-columns:.8fr 1.2fr;gap:96px}}
[data-view="dealer"] .callbox{display:grid;gap:8px;padding:24px;border:1px solid var(--line-d);border-radius:var(--radius)}
[data-view="dealer"] .callbox a{font:700 clamp(2.2rem,4vw,3rem)/1 var(--display);letter-spacing:.03em;text-decoration:none;padding-top:6px}
[data-view="dealer"] .callbox a:hover{color:var(--orange)}
[data-view="dealer"] form.card-form{background:var(--chalk);color:var(--asphalt);padding:clamp(22px,4vw,44px);display:grid;gap:20px}
[data-view="dealer"] .row2{display:grid;gap:20px;align-items:start}
@media (min-width:640px){[data-view="dealer"] .row2{grid-template-columns:1fr 1fr}}
[data-view="dealer"] .row3{display:grid;gap:20px;align-items:start}
@media (min-width:640px){[data-view="dealer"] .row3{grid-template-columns:2fr 1.2fr .8fr}}
[data-view="dealer"] .field{display:grid;gap:8px}
[data-view="dealer"] .field label{font:600 .78rem/1.3 var(--body);letter-spacing:.08em;text-transform:uppercase}
[data-view="dealer"] .field .opt{font-weight:400;text-transform:none;letter-spacing:0;color:var(--warm)}
[data-view="dealer"] .field .req{color:var(--orange-stronger)}
[data-view="dealer"] input[type=text],[data-view="dealer"] input[type=email],[data-view="dealer"] input[type=tel],[data-view="dealer"] input[type=url],[data-view="dealer"] textarea,[data-view="dealer"] select{width:100%;min-height:50px;padding:12px 14px;font:400 1rem/1.4 var(--body);color:var(--asphalt);background:var(--white);border:1px solid var(--warm);border-radius:8px;transition:border-color .2s,box-shadow .2s}
[data-view="dealer"] select{appearance:none;background:var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23202020' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center/16px;padding-right:40px}
[data-view="dealer"] textarea{min-height:120px;resize:vertical}
[data-view="dealer"] input:focus,[data-view="dealer"] textarea:focus,[data-view="dealer"] select:focus{outline:none;border-color:var(--asphalt);box-shadow:0 0 0 3px var(--orange)}
[data-view="dealer"] [aria-invalid="true"]{border-color:#B23A2E}
[data-view="dealer"] .error{color:#B23A2E;font-size:.85rem;min-height:1em}
[data-view="dealer"] .fine{font-size:.88rem;color:var(--warm)}
[data-view="dealer"] .form-success{display:none;padding:26px;background:var(--asphalt);color:var(--chalk);display:none;gap:8px}
[data-view="dealer"] .form-success strong{font:600 2.2rem/1 var(--display);text-transform:uppercase}
[data-view="dealer"] form.sent .form-success{display:grid}
[data-view="dealer"] form.sent .form-body{display:none}

/* ---------- FAQ ---------- */
[data-view="dealer"] .faq-grid{display:grid;gap:32px}
@media (min-width:900px){[data-view="dealer"] .faq-grid{grid-template-columns:.8fr 1.2fr;gap:96px}}
[data-view="dealer"] .faq details{border-top:1px solid var(--dust)}
[data-view="dealer"] .faq details:last-child{border-bottom:1px solid var(--dust)}
[data-view="dealer"] .faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:24px;align-items:center;min-height:66px;padding:16px 0;font:600 1.06rem/1.35 var(--body);transition:color .2s}
[data-view="dealer"] .faq summary:hover{color:var(--orange-stronger)}
[data-view="dealer"] .faq summary::-webkit-details-marker{display:none}
[data-view="dealer"] .faq summary::after{content:"+";flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:999px;border:2px solid var(--asphalt);font:600 1.6rem/1 var(--display);padding-top:4px;transition:transform .3s var(--ease),background .3s,color .3s}
[data-view="dealer"] .faq details[open] summary::after{transform:rotate(45deg);background:var(--orange);border-color:var(--orange);color:var(--white)}
[data-view="dealer"] .faq .a{padding:0 0 24px;max-width:62ch;display:grid;gap:12px}

/* ---------- not what you need ---------- */
[data-view="dealer"] .xl-hd{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:28px}
[data-view="dealer"] .xlinks{list-style:none;margin:0;padding:0;border-top:2px solid var(--asphalt)}
[data-view="dealer"] .xlinks a{display:grid;grid-template-columns:1fr auto;align-items:center;gap:6px 24px;padding:26px 0 20px;border-bottom:1px solid var(--line);text-decoration:none;position:relative;isolation:isolate}
[data-view="dealer"] .xlinks a::before{content:"";position:absolute;inset:0 calc(var(--pad) * -1);z-index:-1;background:var(--cloud);transform:scaleY(0);transform-origin:bottom;transition:transform .35s var(--ease)}
[data-view="dealer"] .xlinks a:hover::before{transform:none}
[data-view="dealer"] .xlinks strong{font:600 clamp(2.4rem,5.4vw,4.4rem)/.86 var(--display);text-transform:uppercase}
[data-view="dealer"] .xlinks span{grid-column:1;color:var(--warm);max-width:52ch}
[data-view="dealer"] .xlinks i{grid-column:2;grid-row:1/span 2;font:700 clamp(2rem,4vw,3rem)/1 var(--display);font-style:normal;color:var(--orange-strong);transition:transform .3s var(--ease)}
[data-view="dealer"] .xlinks a:hover i{transform:translateX(8px)}
@media (min-width:900px){[data-view="dealer"] .xlinks a{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto}[data-view="dealer"] .xlinks span{grid-column:2;grid-row:1}[data-view="dealer"] .xlinks i{grid-column:3;grid-row:1}}

/* ---------- motion ---------- */
[data-view="dealer"] @keyframes rise{from{clip-path:inset(0 0 100% 0);transform:translateY(40%)}to{clip-path:inset(0 0 0 0);transform:none}}
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion:no-preference){
    [data-view="dealer"] .rv{animation:rv linear both;animation-timeline:view();animation-range:entry 0% cover 26%}
    [data-view="dealer"] .rv-2{animation-range:entry 8% cover 32%}[data-view="dealer"] .rv-3{animation-range:entry 16% cover 38%}
    @keyframes rv{from{transform:translateY(44px)}to{transform:none}}
    [data-view="dealer"] h2.bar::after{animation:bar linear both;animation-timeline:view();animation-range:entry 10% cover 35%}
    @keyframes bar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
    [data-view="dealer"] .spec .v b{animation:roll linear both;animation-timeline:view();animation-range:entry 20% cover 45%}
    @keyframes roll{from{transform:translateY(95%)}to{transform:none}}
    [data-view="dealer"] .steps .fill{animation:fillx linear both;animation-timeline:view();animation-range:entry 30% cover 60%}
    @keyframes fillx{from{transform:scaleX(0)}to{transform:scaleX(1)}}
    [data-view="dealer"] .stores li{animation:slidein linear both;animation-timeline:view();animation-range:entry 10% cover 30%}
    @keyframes slidein{from{transform:translateX(-24px)}to{transform:none}}
  }
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* ---------- PDP families + buy box layouts (Nov 5 pm) ---------- */
.sz .szi{display:none}
[data-fam="tumbler"] #pTitle,[data-fam="jug"] #pTitle,[data-fam="sperse"] #pTitle{font-size:clamp(3.4rem,6.4vw,6rem)}
[data-view="product"] [data-only][hidden],[data-view="product"] .cust-link[hidden],[data-view="product"] [data-fam][hidden]{display:none!important}
.setc{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}  /* fixed quarter width, so 2 options on the 20 qt stay the same size as 4 on the 10 qt */
#pSetWrap .opt-label span:first-child{flex:none}#pSetNote{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st{display:grid;grid-template-rows:auto auto auto;justify-items:center;align-content:start;gap:4px;padding:8px 6px 10px;text-align:center;background:var(--white);color:var(--asphalt);border:1px solid var(--line);border-radius:10px;cursor:pointer;transition:border-color .2s,box-shadow .2s,transform .2s var(--ease)}
.st:hover{transform:translateY(-2px)}
.st .radio{display:none}
.st img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px;background:var(--cloud)}
.st .nm b{font:700 1.02rem/1 var(--display);text-transform:uppercase}.st .nm small{display:none}
.st .pr{font:700 1rem/1 var(--display)}.st .pr s{margin-left:4px;font:500 .72rem/1 var(--body);color:var(--warm)}.st .pr.sale{color:var(--orange)}
.st[aria-checked="true"]{border-color:var(--orange);box-shadow:0 0 0 1px var(--orange)}
#pSetNote a{color:inherit}
.bld{margin-top:10px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;display:grid;gap:10px;background:var(--cloud)}
.bld-h{font:600 .7rem/1.2 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--warm)}
.bld-row{display:grid;grid-template-columns:150px 1fr;align-items:center;gap:8px}
.bld-row .bl{display:grid;gap:1px}.bld-row .bl b{font:700 1rem/1 var(--display);text-transform:uppercase}.bld-row .bl small{font-size:.72rem;line-height:1.25;color:var(--warm)}
.bld-row .swatches{gap:6px}.bld-row .sw{width:34px;height:34px}
.bld-row.verge .bl small{color:var(--asphalt)}
.set-note{font-size:.8rem;color:var(--warm);margin-top:8px}
/* A: compact. Size as a two-way switch, small swatches, tighter text */
[data-lay="a"] .info{gap:14px}
[data-lay="a"] #pTitle{font-size:clamp(3.2rem,5.4vw,5.4rem)}
[data-lay="a"] .price-big{font-size:2.4rem}
[data-lay="a"] .pitch{font-size:.92rem;line-height:1.5}
[data-lay="a"] .opt-label{margin-bottom:8px}
[data-lay="a"] .szc{grid-template-columns:1fr 1fr;gap:8px}
[data-lay="a"] .sz{border-radius:10px;grid-template-rows:1fr auto;align-content:stretch}
[data-lay="a"] .sz .perks,[data-lay="a"] .sz .radio{display:none}
[data-lay="a"] .sz .row{order:1;padding:9px 12px 8px;gap:6px}
[data-lay="a"] .sz .band{order:2;padding:4px 12px 3px;font-size:.6rem;letter-spacing:.12em;text-align:center;border-top:1px solid var(--line)}
[data-lay="a"] .sz .nm b{font-size:1.1rem}[data-lay="a"] .sz .nm small{font-size:.68rem}[data-lay="a"] .sz .pr{font-size:1.15rem}
[data-lay="a"] .sw{width:46px;height:46px}[data-lay="a"] .swatches{gap:8px}
[data-lay="a"] .st{padding:6px 5px 8px;gap:3px}[data-lay="a"] .st .nm b{font-size:.95rem}[data-lay="a"] .st .pr{font-size:.95rem}
/* B: thumbnail cards. Small photo of each size, no perk lists */
/* single-size products: no size block */
.compare-cols.c3{gap:2px}
@media (min-width:760px){.compare-cols.c3{grid-template-columns:1fr 1fr 1fr}}
.ccol .cimg{width:100%;max-width:240px;aspect-ratio:1;object-fit:contain;background:var(--white);border-radius:10px}

/* Verge 50 page (Nov 5 pm): cinema band lines move together, cooler clears the text; use-case comparison */
.c50 .bg{object-position:33% 50%}
.sp-band .bg{object-position:50% 40%}
@media (max-width:700px){.sp-band .bg{object-position:62% 50%}}
.sp-band h2 span{animation:none!important;transform:none!important}
.c50 h2 span{animation:none!important;transform:none!important}
.cinema h2 span{animation:none!important;transform:none!important}  /* every photo-band headline sits flush, no stagger (Josh, Nov 6) */
.c50-copy{display:grid;gap:22px;justify-items:start;max-width:46ch}
.c50-copy p{max-width:none}
.pick-sec{padding:clamp(56px,7vw,96px) 0}
.pick-head{display:grid;gap:18px;margin-bottom:clamp(24px,3.5vw,40px)}
.pick-head p{max-width:60ch;font-size:1.05rem}
.pick3{display:grid;gap:14px}
@media (min-width:900px){.pick3{grid-template-columns:repeat(3,1fr)}}
.pk{background:var(--night);border:1px solid var(--line-d);border-radius:12px;padding:clamp(18px,2vw,26px);display:grid;gap:18px;grid-template-rows:auto 1fr auto auto}
.pk.on{background:var(--asphalt);border-color:var(--orange)}
.pk-top{display:flex;gap:16px;align-items:center}
.pk-top img{width:92px;height:92px;flex:none;object-fit:contain;background:var(--white);border-radius:8px}
.pk h3{font-size:clamp(2.4rem,3.2vw,3rem);line-height:.82}
.pk-for{margin:6px 0 0;font:600 .78rem/1.3 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--orange)}
.pk-uses{margin:0;padding-left:18px;display:grid;gap:8px;align-content:start;font-size:.95rem;line-height:1.45}
.pk-uses li::marker{color:var(--orange)}
.pk dl{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:0;font-size:.88rem;padding-top:14px;border-top:1px solid var(--line-d)}
.pk dt{font:600 .68rem/1.9 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--dust)}
.pk dd{margin:0;font-variant-numeric:tabular-nums}
.pk .btn{justify-self:stretch;text-align:center;justify-content:center}

/* Verge 50 comparison v2 (Josh, Nov 5 pm): the 50 first, then a side-by-side table against the 20 and 10 */
.pk50{display:grid;gap:22px;background:var(--asphalt);border:1px solid var(--orange);border-radius:12px;padding:clamp(18px,2.4vw,30px);align-items:center}
.pk50 img{width:100%;max-width:300px;aspect-ratio:1;object-fit:contain;background:var(--white);border-radius:10px}
.pk50-body{display:grid;gap:18px;justify-items:start}
.pk50 h3{font-size:clamp(2.8rem,4vw,3.8rem);line-height:.82}
@media (min-width:760px){.pk50{grid-template-columns:minmax(200px,300px) 1fr;gap:36px}}
.cmp-h{font:600 .8rem/1.3 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--dust);margin:clamp(32px,4vw,48px) 0 14px}
.cmp-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line-d);border-radius:12px}
.cmp{width:100%;min-width:520px;border-collapse:collapse;font-size:.92rem;font-variant-numeric:tabular-nums}
.cmp th,.cmp td{padding:12px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line-d)}
.cmp thead th{font:600 1.5rem/1 var(--display);text-transform:uppercase;letter-spacing:.02em;padding-top:16px}
.cmp tbody th{font:600 .68rem/1.9 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--dust);white-space:nowrap}
.cmp .on{background:rgba(241,84,45,.08)}
.cmp thead th.on span{color:var(--orange)}
.cmp thead th.on{color:var(--orange)}
.cmp tr:last-child th,.cmp tr:last-child td{border-bottom:0}
.cmp-go .btn{padding:10px 16px;font-size:.95rem}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (max-width:600px){.cmp{min-width:0;font-size:.8rem}.cmp th,.cmp td{padding:10px 7px}.cmp thead th{font-size:1.15rem}.cmp tbody th{font-size:.58rem;letter-spacing:.08em;white-space:normal}.cmp-go .btn{padding:8px 8px;font-size:.8rem}}

/* comparisons v3 (Josh, Nov 5 pm): 50 big with 10/20 as small hop cards; tumbler 20 vs 40 as one tight table */
.pk-row{display:grid;gap:14px}
@media (min-width:960px){.pk-row{grid-template-columns:1fr 340px;align-items:stretch}.pk-mini{grid-template-rows:1fr 1fr}}
.pk-mini{display:grid;gap:14px;align-content:start}
@media (min-width:600px) and (max-width:959px){.pk-mini{grid-template-columns:1fr 1fr}}
.pkm{display:grid;grid-template-columns:76px 1fr auto;gap:14px;align-items:center;padding:12px;background:var(--night);border:1px solid var(--line-d);border-radius:12px;color:var(--chalk);text-decoration:none;transition:border-color .2s}
.pkm:hover{border-color:var(--chalk)}
.pkm img{width:76px;height:76px;object-fit:contain;background:var(--white);border-radius:8px}
.pkm span{display:grid;gap:3px}
.pkm b{font:600 1.5rem/1 var(--display);text-transform:uppercase}
.pkm small{font-size:.82rem;color:var(--dust)}
.pkm em{font-style:normal;font-size:.9rem;font-variant-numeric:tabular-nums}
.pkm i{font-style:normal;color:var(--orange);font-size:1.2rem;padding-right:4px}
.tcmp-sec{padding:clamp(56px,7vw,96px) 0}
.tcmp{display:grid;gap:clamp(24px,3vw,40px)}
@media (min-width:960px){.tcmp{grid-template-columns:minmax(260px,380px) 1fr;align-items:center}}
.tcmp-head{display:grid;gap:18px}
.tcmp-head p{font-size:1.05rem;max-width:44ch}
.tcmp-t{min-width:0}
.tcmp-t thead th img{display:block;width:64px;height:64px;object-fit:contain;background:var(--white);border-radius:8px;margin-bottom:10px}
.tcmp-t thead th{vertical-align:bottom}
[data-size="t20"] .tcmp-t [data-col="t20"],[data-size="t40"] .tcmp-t [data-col="t40"]{background:rgba(241,84,45,.08)}
[data-size="t20"] .tcmp-t thead [data-col="t20"] span,[data-size="t40"] .tcmp-t thead [data-col="t40"] span{color:var(--orange)}
@media (max-width:600px){.tcmp-t thead th img{width:48px;height:48px}}

/* Sperse page review: one real review, paired with a photo so the row isn't half empty */
.sp-quote{align-self:center}
.sp-quote blockquote{font-size:clamp(1.15rem,1.6vw,1.4rem);line-height:1.45}
.sp-revimg{border-radius:12px;overflow:hidden;background:var(--white);aspect-ratio:4/3}
.sp-revimg img{width:100%;height:100%;object-fit:cover;object-position:50% 8%}

/* size switch never moves the buy box (Josh, Nov 5 pm) */
.pitch{display:grid}.pitch>span{grid-area:1/1}.pitch .pitch-ghost{visibility:hidden}

/* spare parts page (Nov 5 pm) */
.pt-sw a.sold{opacity:.55}
.pt-sw .pt-noimg{display:grid;place-items:center;width:100%;aspect-ratio:1/1;border-radius:6px;background:var(--cloud);font:600 .62rem/1.2 var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--warm);text-align:center}
.pt-sw a span:last-child{font-size:.82rem;font-variant-numeric:tabular-nums}
#ptStage .ph-tk{position:absolute;inset:0;display:grid;place-items:center;font:600 .9rem/1.2 var(--body);color:var(--warm);background:var(--cloud)}
#ptStage{position:relative}
.pt-about-sec{padding:clamp(48px,6vw,80px) 0}
.pt-about{display:grid;gap:28px;align-items:center}
@media (min-width:760px){.pt-about{grid-template-columns:minmax(200px,320px) 1fr;gap:48px}}
.pt-about img{width:100%;max-width:320px;aspect-ratio:1;object-fit:contain;background:var(--white);border-radius:12px;border:1px solid var(--line)}
.pt-about-t{display:grid;gap:16px;justify-items:start;max-width:56ch}
.pt-about-t .eyebrow{font:600 .75rem/1 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--warm);margin:0}

/* spare parts v2: one part per page, facts row + reviews (Josh, Nov 5 pm) */
.pt-facts-sec{padding:clamp(28px,4vw,48px) 0 clamp(40px,5vw,64px)}
@media (max-width:599px){#ptSpecs{grid-template-columns:1fr 1fr!important}}
.pt-revs{display:grid;gap:14px}
@media (min-width:760px){.pt-revs{grid-template-columns:1fr 1fr}}

/* Sperse 5 vs 3 table follows the size you're on, like the tumbler table */
[data-size="s5"] .tcmp-t [data-col="s5"],[data-size="s3"] .tcmp-t [data-col="s3"]{background:rgba(241,84,45,.08)}
[data-size="s5"] .tcmp-t thead [data-col="s5"] span,[data-size="s3"] .tcmp-t thead [data-col="s3"] span{color:var(--orange)}
.cmp-soon{display:inline-block;font:600 .8rem/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--dust);padding:12px 0}

.bsw.two{grid-template-columns:repeat(2,minmax(0,1fr));max-width:50%}
@media (max-width:600px){.bsw.two{max-width:none}}

/* ===== SEC2 v1 (Nov 10): section 2 on every product + bundle page. Full-width photo, then the claim shown against a real day ===== */
.d2{background:var(--night);color:var(--chalk)}
.d2-ph{margin:0;width:100%;aspect-ratio:16/7;overflow:hidden}
.d2-ph img{width:100%;height:100%;object-fit:cover}
@media (max-width:700px){.d2-ph{aspect-ratio:4/3}}
.d2-in{padding-block:clamp(36px,5vw,64px) clamp(56px,8vw,104px);display:grid;gap:clamp(24px,3.5vw,40px)}
.d2-head{display:grid;gap:14px}
@media (min-width:900px){.d2.v .d2-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);column-gap:72px;row-gap:28px;align-items:start}
  .d2.v .d2-head{grid-template-columns:1fr;gap:18px}.d2.v .clock-note{grid-column:1}
  .d2.v .ds{grid-column:2;grid-row:1 / span 2;grid-template-columns:1fr;border-top:0;border-left:2px solid var(--chalk);padding-left:30px}
  .d2.v .ds li{padding:0 0 30px}.d2.v .ds li:last-child{padding-bottom:4px}.d2.v .ds li::before{left:-39px;top:6px}}
@media (min-width:900px){.d2-head{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:end}}
.d2-head h2{font-size:clamp(3rem,7vw,6.4rem);line-height:.86}.d2-head h2 span{display:block}
.d2-sub{font-size:clamp(1.02rem,1.5vw,1.2rem);color:var(--chalk);max-width:58ch}
.d2 .clock-note{font-size:.84rem;color:var(--dust);max-width:76ch}
.d2 .ctl{display:grid;gap:8px}.d2 .ctl .top{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.d2 .ctl .label{font:600 .72rem/1.3 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--dust)}
.d2 .ctl output{font:600 1.7rem/1 var(--display);color:var(--chalk);font-variant-numeric:tabular-nums}
.d2 .ctl input[type=range]{width:100%;accent-color:var(--orange);height:28px;margin:0}
.d2 .tk{color:#5a4500;background:#FFF1C2;border:1px dashed #b38f00;font-family:var(--body)}
/* Verge shift clock */
.ck-head{display:grid;gap:24px}
@media (min-width:980px){.ck-head{grid-template-columns:minmax(0,1fr) minmax(0,.9fr);align-items:end}}
.ck-h{font-size:clamp(2.2rem,4.6vw,3.6rem)}
.ck-ctl{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.clock{position:relative}
.ck-track{position:relative;height:84px;border-bottom:2px solid var(--chalk)}
.ck-track:focus-within{outline:3px solid var(--orange);outline-offset:6px}
.ck-band{position:absolute;bottom:0;height:56px;background:var(--orange);display:flex;align-items:center;padding:4px 14px 0;overflow:hidden}
.ck-band-label{font:700 clamp(1rem,2.2vw,1.55rem)/1 var(--display);text-transform:uppercase;letter-spacing:.04em;color:var(--asphalt);white-space:nowrap}
.ck-ext{position:absolute;bottom:0;height:56px;background:repeating-linear-gradient(-45deg,var(--orange) 0 8px,rgba(241,84,45,.32) 8px 16px)}
.ck-line{position:absolute;top:0;bottom:-2px;width:3px;margin-left:-1.5px;background:var(--chalk);pointer-events:none;z-index:2}
.ck-line::after{content:"";position:absolute;left:50%;bottom:44px;width:20px;height:20px;margin-left:-10px;border-radius:50%;background:var(--chalk);box-shadow:0 0 0 5px rgba(236,235,233,.25)}
.ck-tip{position:absolute;top:-30px;left:50%;transform:translateX(-50%);font:600 .8rem/1 var(--body);background:var(--chalk);color:var(--asphalt);padding:6px 8px;border-radius:5px;white-space:nowrap;font-variant-numeric:tabular-nums}
.ck-track input{position:absolute;inset:-34px 0 0 0;width:100%;height:calc(100% + 34px);margin:0;opacity:0;cursor:ew-resize;z-index:3}
.ck-ticks,.tl-ticks{position:relative;height:30px}
.ck-ticks span,.tl-ticks span{position:absolute;top:8px;transform:translateX(-50%);font:500 .74rem/1 var(--body);color:var(--dust);font-variant-numeric:tabular-nums;white-space:nowrap}
.ck-ticks span:first-child,.tl-ticks span:first-child{transform:none}.ck-ticks span:last-child,.tl-ticks span:last-child{transform:translateX(-100%)}
.ck-marks{position:relative;height:84px;margin-top:10px}
.ck-mark{position:absolute;top:0;display:grid;gap:4px;max-width:220px;transform:translateX(-50%);text-align:center}
.ck-mark.l{transform:none;text-align:left}.ck-mark.r{transform:translateX(-100%);text-align:right}
.ck-mark b{font:700 1.6rem/1 var(--display);text-transform:uppercase;color:var(--chalk);font-variant-numeric:tabular-nums}
.ck-mark span{font-size:.88rem;color:var(--dust);line-height:1.35}
.ck-foot{display:grid;gap:16px}
.ck-verdict{font-size:1.05rem;color:var(--chalk);max-width:64ch}.ck-verdict b{font-weight:600;color:var(--white)}
.ck-spare{display:flex;align-items:center;gap:14px;padding:12px 16px;border:1px solid var(--line-d);border-radius:10px;background:rgba(255,255,255,.05);max-width:560px;text-decoration:none;color:var(--chalk)}
.ck-spare img{width:52px;height:52px;object-fit:cover;border-radius:6px}
.ck-spare>span:not(.go){flex:1;display:grid;gap:2px;min-width:0}
.ck-spare b{font:700 1.15rem/1 var(--display);text-transform:uppercase}.ck-spare span span{font-size:.82rem;color:var(--dust)}
.ck-spare .go{font:700 1.6rem/1 var(--display);color:var(--orange)}
@media (max-width:700px){.ck-mark span{display:none}.ck-marks{height:40px}.ck-mark b{font-size:1.2rem}}
/* tumbler day bars */
.tl{display:grid;gap:12px}
.tl-row{display:grid;grid-template-columns:110px minmax(0,1fr);gap:14px;align-items:center}
.tl-k{font:700 1.3rem/1 var(--display);text-transform:uppercase}
.tl-track{position:relative;height:56px;border-bottom:2px solid var(--chalk)}
.tl-bar{position:absolute;bottom:0;height:46px;display:flex;align-items:center;padding:4px 12px 0;overflow:hidden}
.tl-bar span{font:700 clamp(.85rem,1.6vw,1.15rem)/1.05 var(--display);text-transform:uppercase;letter-spacing:.03em;color:var(--asphalt)}
.tl-bar.hot{background:var(--orange)}.tl-bar.cold{background:#7FA8BC}
.tl-ticks{margin-left:124px}
@media (max-width:700px){.tl-row{grid-template-columns:1fr}.tl-ticks{margin-left:0}}
/* jug + sperse calculators */
.calc{display:grid;gap:clamp(20px,3vw,40px)}
@media (min-width:980px){.calc{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center}}
.calc-ctl{display:grid;gap:18px}
.calc-out{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.calc-out div{display:grid;gap:6px;padding:4px 0 4px 14px;border-left:3px solid var(--line-d)}
.calc-out div.on{border-left-color:var(--orange)}
.calc-out b{font:600 clamp(2.4rem,5vw,4.4rem)/.86 var(--display);font-variant-numeric:tabular-nums}
.calc-out div.on b{color:var(--orange)}
.calc-out span{font:600 .7rem/1.3 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--dust)}
.seg-d{display:inline-flex;border:1px solid var(--line-d);border-radius:8px;overflow:hidden}
.seg-d button{border:0;background:none;color:var(--chalk);padding:9px 14px;cursor:pointer;font:600 .8rem/1 var(--body);letter-spacing:.08em;text-transform:uppercase}
.seg-d button[aria-checked="true"]{background:var(--orange);color:var(--asphalt)}
/* bundle + Verge 50 day strip */
.ds{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:2px solid var(--chalk)}
@media (min-width:860px){.ds{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ds li{position:relative;display:grid;gap:6px;padding:26px 24px 8px 0}
.ds li::before{content:"";position:absolute;left:0;top:-9px;width:16px;height:16px;border-radius:50%;background:var(--orange)}
.ds-t{font:700 clamp(1.8rem,3vw,2.4rem)/1 var(--display);text-transform:uppercase;color:var(--chalk)}
.ds b{font:600 .72rem/1.3 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--orange)}
.ds p{color:var(--chalk);opacity:.9;max-width:36ch}

/* ===== V5 layout (Nov 10): reviews up, spotlight, Cam's photo cards, founder strip, 10/20/50 ===== */
.rv2{background:#101010;color:var(--chalk)}
.proof-head{display:flex;flex-wrap:wrap;gap:16px 40px;align-items:end;justify-content:space-between;margin-bottom:clamp(28px,4vw,48px)}
.proof-head .score{display:flex;align-items:center;gap:14px}.proof-head .score b{font:600 3.6rem/.8 var(--display)}
.rv2 .score span{color:var(--dust);font-size:.85rem}.rv2 .stars{color:var(--orange);letter-spacing:.12em}
.rv2-grid{display:grid;gap:20px}@media (min-width:960px){.rv2-grid{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}}
.rv2-big,.rv2-q{margin:0;display:grid;gap:14px;align-content:start;padding:clamp(22px,2.6vw,36px);border:1px solid var(--line-d);border-radius:var(--radius);background:rgba(255,255,255,.04)}
.rv2-big{align-content:center}.rv2-big blockquote{margin:0;font:600 clamp(2.4rem,5vw,4.4rem)/.94 var(--display);text-transform:uppercase}
.rv2-q blockquote{margin:0;font:500 clamp(1.25rem,1.7vw,1.5rem)/1.15 var(--display)}
.rv2 em{font-style:normal;color:var(--orange)}.rv2 cite{font:500 .9rem/1.4 var(--body);font-style:normal;color:var(--dust)}
.rv2-side{display:grid;gap:20px;align-content:start}
.ipk{display:grid;gap:clamp(28px,5vw,72px);align-items:center}@media (min-width:960px){.ipk{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}}
.ipk-media{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}
.ipk-media img{width:100%;aspect-ratio:1/1;height:auto;object-fit:cover;border-radius:var(--radius);background:var(--cloud)}
.ipk-copy{display:grid;gap:18px;align-content:start}.ipk-copy .lede{max-width:52ch}
.ipk-box{margin:6px 0 0;border-top:1px solid var(--line)}
.ipk-box div{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}
.ipk-box dt{font:600 1.3rem/1.05 var(--display);text-transform:uppercase}.ipk-box dd{margin:0;color:var(--warm)}
.hd{display:grid;gap:12px;margin-top:clamp(32px,5vw,52px)}
@media (min-width:860px){.hd.n3{grid-template-columns:repeat(3,minmax(0,1fr))}.hd.n4{grid-template-columns:repeat(4,minmax(0,1fr))}.hd.n2{grid-template-columns:1fr 1fr}}
@media (min-width:600px) and (max-width:859px){.hd.n4{grid-template-columns:1fr 1fr}}
.hd-c{position:relative;overflow:hidden;aspect-ratio:1/1;display:grid;background:var(--asphalt);color:var(--chalk);border-radius:var(--radius)}
.hd-c img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hd-c::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(22,22,22,.94) 0%,rgba(22,22,22,.4) 40%,transparent 64%)}
.hd-c .t{position:relative;z-index:2;align-self:end;padding:22px;display:grid;gap:8px}
.hd-c h3{font-size:clamp(1.7rem,2.4vw,2.4rem)}.hd-c p{color:var(--chalk);opacity:.92;max-width:40ch;font-size:.95rem}
.fd{display:grid;gap:clamp(24px,4vw,64px);align-items:center}@media (min-width:860px){.fd{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr)}}
.fd-ph{margin:0;border-radius:var(--radius);overflow:hidden;aspect-ratio:4/5;background:var(--cloud)}
.fd-ph img{width:100%;height:100%;object-fit:cover;object-position:37% 50%}
.fd-copy{display:grid;gap:18px;align-content:start}
.fd-copy blockquote{margin:0;font:600 clamp(2rem,4vw,3.4rem)/.95 var(--display);text-transform:uppercase;max-width:22ch}
.cmp3{display:grid;gap:14px}@media (min-width:860px){.cmp3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.cm{display:grid;grid-template-rows:auto auto 1fr auto;border:1px solid var(--line-d);border-radius:12px;overflow:hidden;background:rgba(255,255,255,.045)}
[data-size="10"] .cm[data-c="10"],[data-size="20"] .cm[data-c="20"]{border-color:var(--orange);box-shadow:0 0 0 1px var(--orange)}
.cm .band{display:block;padding:7px 16px;background:rgba(255,255,255,.07);font:600 .68rem/1.3 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--dust)}
[data-size="10"] .cm[data-c="10"] .band,[data-size="20"] .cm[data-c="20"] .band{background:var(--orange);color:var(--asphalt)}
.cm .ph{position:relative;aspect-ratio:4/3;background:var(--white);overflow:hidden}.cm .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:14px}
.cm .body{padding:18px 18px 6px;display:grid;gap:14px;align-content:start;max-width:none}
.cm .top{display:flex;justify-content:space-between;align-items:baseline;gap:12px}.cm h3{font-size:2.3rem}.cm .pr{font:700 1.7rem/1 var(--display)}
.cm dl{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px 14px;font-size:.9rem}
.cm dt{font:600 .66rem/1.6 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--dust)}.cm dd{margin:0;color:var(--chalk)}
.cm .go{padding:12px 18px 18px}.cm .go .btn{width:100%;justify-content:center}
.trade-list{list-style:none;margin:clamp(24px,4vw,40px) 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.trade-list li{font:600 clamp(1.3rem,2.2vw,1.75rem)/1 var(--display);text-transform:uppercase;letter-spacing:.02em;padding:11px 16px 7px;border:1px solid var(--line);border-radius:99px}
/* Verge 50 cards: feature callouts only, photo stays visible (Josh, Nov 10) */
.hd.callouts .hd-c{background:var(--white);border:1px solid var(--line)}
.hd.callouts .hd-c img{object-fit:contain;background:var(--white)}
.hd.callouts .hd-c::after{display:none}
.hd.callouts .hd-c img[src*="v50-wide"]{object-fit:cover}
.hd.callouts .hd-c .t{align-self:end;justify-self:start;margin:14px;padding:9px 14px 6px;background:var(--asphalt);border-radius:8px}
.hd.callouts .hd-c h3{font-size:clamp(1.15rem,1.5vw,1.45rem);line-height:1}

/* Verge section 2 headers from Cam's landing page (Josh, Nov 10): problem headline left, the why on the right */
.d2-split{align-items:end}
@media (min-width:980px){.d2-split{grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:48px}}
.d2-split + .ck-head .ck-h{font-size:clamp(1.6rem,3vw,2.4rem)}

/* Verge section 2, simple (Josh, Nov 10): headline + subhead left, only the controls right, the clock below */
.ck-top{display:grid;gap:24px;align-items:end}
@media (min-width:980px){.ck-top{grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:56px}}
.ck-titles{display:grid;gap:14px}
.ck-titles h2{font-size:clamp(3rem,7vw,6.4rem);line-height:.86}.ck-titles h2 span{display:block}
.ck-titles .ck-h{font-size:clamp(1.5rem,2.6vw,2.2rem)}

.ck-top.solo{grid-template-columns:1fr}
.d2-in>.calc{display:block}.d2-in>.calc .calc-out{margin-top:4px}

/* tumbler: stacked Leak spec, bundle upsell (Josh, Nov 10) */
.spec .v.v-stack{display:grid;justify-items:start;line-height:.9}
.spec .v.v-stack small{display:block;margin:4px 0 0;font-size:.36em;letter-spacing:.06em;text-transform:uppercase}
.up-sec{padding-block:0 clamp(48px,7vw,88px)}
.up{display:grid;gap:18px 32px;align-items:center;padding:18px;border:1px solid var(--line);border-radius:12px;background:var(--cloud);text-decoration:none;color:inherit;transition:border-color .2s}
@media (min-width:860px){.up{grid-template-columns:200px minmax(0,1fr) auto}}
.up:hover{border-color:var(--asphalt)}
.up-ph{display:block;aspect-ratio:1/1;max-width:200px;background:var(--white);border-radius:8px;overflow:hidden}
.up-ph img{width:100%;height:100%;object-fit:contain}
.up-copy{display:grid;gap:6px}
.up-copy b{font:700 clamp(1.8rem,3vw,2.6rem)/.95 var(--display);text-transform:uppercase}
.up-in{font-weight:600}.up-why{color:var(--warm);max-width:52ch}
.up-go{display:grid;gap:10px;justify-items:start}
.up-pr{font:700 2rem/1 var(--display)}

/* round 3 (Josh, review board): whole photo where a crop cut products, bigger Sperse cards */
.d2-ph.fit{aspect-ratio:16/7;background:#0d0d0c}.d2-ph.fit img{object-fit:contain}
@media (max-width:700px){.d2-ph.fit{aspect-ratio:4/3}}
@media (min-width:860px){.hd.n4.big2{grid-template-columns:1fr 1fr}}

.up-pr s{margin-left:6px;font:500 1rem/1 var(--body);color:var(--warm)}
.up-pr{color:var(--orange-strong)}
/* tumbler size section, to scale (Josh, Nov 10) */
.tsz{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,3vw,40px);margin-top:clamp(28px,4vw,48px);align-items:end}
.tsz-c{margin:0;display:grid;gap:16px;padding:clamp(16px,2.4vw,28px);background:var(--white);border:1px solid var(--line);border-radius:12px}
[data-size="t20"] .tsz-c[data-c="t20"],[data-size="t40"] .tsz-c[data-c="t40"]{border-color:var(--orange);box-shadow:0 0 0 1px var(--orange)}
.tsz-ph{position:relative;height:clamp(220px,32vw,380px);display:flex;align-items:flex-end;justify-content:center;border-bottom:2px solid var(--asphalt)}
.tsz-ph img{width:auto;max-width:80%;object-fit:contain;display:block}
.tsz-h{position:absolute;left:0;top:0;font:500 .8rem/1 var(--body);color:var(--warm)}
.tsz-h b{font:700 1.6rem/1 var(--display);color:var(--asphalt)}
.tsz-c figcaption{display:grid;gap:10px}
.tsz-c figcaption>b{font:700 clamp(1.8rem,3vw,2.4rem)/1 var(--display);text-transform:uppercase}
.tsz-tag{justify-self:start;font:600 .64rem/1.2 var(--body);letter-spacing:.12em;text-transform:uppercase;background:var(--orange);color:var(--asphalt);padding:5px 9px;border-radius:99px}
.tsz-c dl{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 14px;font-size:.9rem}
.tsz-c dt{font:600 .66rem/1.7 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--warm)}.tsz-c dd{margin:0}
.tsz-chips{margin-top:20px}
@media (max-width:560px){.tsz-c dl{grid-template-columns:1fr}.tsz-c dt{line-height:1}}

/* round 4: one big spotlight photo, jug-anchored kit card */
.ipk-media.one{grid-template-columns:1fr}.ipk-media.one img{aspect-ratio:4/5!important;max-height:640px;object-fit:cover;object-position:50% 40%}
.up-list{display:grid;gap:6px;margin:4px 0}
.up-list span{display:flex;gap:10px;align-items:baseline;font-size:.95rem}
.up-list i{font:600 .62rem/1.4 var(--body);font-style:normal;letter-spacing:.12em;text-transform:uppercase;padding:2px 7px;border-radius:99px;background:var(--white);border:1px solid var(--line);flex:none}
.up-list span:first-child i{background:var(--asphalt);color:var(--white);border-color:var(--asphalt)}

/* v50 callouts: real photos fill the card */
.callouts .hd-c img.ph{object-fit:cover}
/* 20 oz spotlight: one real photo */
[data-size="t20"] .ipk-media.t20one,[data-size="t40"] .ipk-media.t20one{grid-template-columns:1fr}[data-size="t20"] .ipk-media.t20one img,[data-size="t40"] .ipk-media.t20one img{aspect-ratio:4/5!important;max-height:640px;object-fit:cover;object-position:50% 50%}
/* compare tables: product pictures big enough to read (Josh, Nov 10) */
.tcmp-t thead th img,.tcmp-t thead th img{display:block;width:100%!important;max-width:200px;height:170px!important;object-fit:contain;padding:8px;margin-bottom:12px}
@media (max-width:560px){.tcmp-t thead th img{height:110px!important}}
/* Cam 11-10: magnetic ice pack animation (from his Verge listicle, Reason 3), timed not scroll-scrubbed */
.ipg{margin:0;aspect-ratio:1/1;display:grid;place-items:center;background:var(--cloud);border:1px solid var(--line);border-radius:var(--radius);padding:clamp(10px,2.4vw,18px)}
.ipg svg{display:block;width:100%;height:auto;overflow:visible}
.ipg text{font-family:var(--body);font-size:13px;font-weight:500;fill:var(--asphalt)}
.ipg .t-b{font-weight:600}.ipg .t-m{fill:var(--warm)}
.ipg .ln{fill:none;stroke:var(--asphalt);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.ipg .ln.body{fill:var(--white)}.ipg .ln.cav{fill:var(--chalk);stroke-width:1.5}
.ipg .lead{fill:none;stroke:var(--warm);stroke-width:1.25}
.ipg .dash{fill:none;stroke:var(--warm);stroke-width:1.5;stroke-dasharray:4 4}
.ipg .pack{fill:var(--orange)}
.ipg .gk{fill:none;stroke:var(--orange);stroke-width:2.5;stroke-linecap:round}
.ipg .pack,.ipg .clk,.ipg .floor{transform-box:fill-box;transform-origin:center;transition:transform .8s cubic-bezier(.22,1,.36,1),opacity .5s ease-out}
.ipg.wait .pk-l{transform:translateX(46px);opacity:0}
.ipg.wait .pk-r{transform:translateX(-46px);opacity:0}
.ipg.wait .clk{transform:scale(.6);opacity:0}
.ipg.wait .floor{opacity:0}
.ipg .pk-r{transition-delay:.08s}.ipg .clk{transition-delay:.55s}.ipg .floor{transition-delay:.3s}
@media (prefers-reduced-motion:reduce){.ipg .pack,.ipg .clk,.ipg .floor{transition:none}}
.ipk-media.solo{grid-template-columns:1fr}.ipk-media.solo .ipg{aspect-ratio:auto;padding:clamp(22px,4vw,48px) clamp(12px,3vw,40px);background:var(--white)}
/* phones: the drawing loops (fade in, packs grow, snap to the walls, fade out) */
.ipg.loop .pack,.ipg.loop .clk,.ipg.loop .floor{transition:none}
.ipg.loop .pk-l{animation:ipgL 3.8s cubic-bezier(.22,1,.36,1) infinite}
.ipg.loop .pk-r{animation:ipgR 3.8s cubic-bezier(.22,1,.36,1) infinite}
.ipg.loop .clk{animation:ipgC 3.8s ease-out infinite}
.ipg.loop .floor{animation:ipgF 3.8s ease-out infinite}
@keyframes ipgL{0%{transform:translateX(46px) scale(.5);opacity:0}14%{transform:translateX(46px) scale(1);opacity:1}40%,82%{transform:none;opacity:1}96%,100%{transform:none;opacity:0}}
@keyframes ipgR{0%{transform:translateX(-46px) scale(.5);opacity:0}14%{transform:translateX(-46px) scale(1);opacity:1}40%,82%{transform:none;opacity:1}96%,100%{transform:none;opacity:0}}
@keyframes ipgC{0%,38%{transform:scale(.6);opacity:0}48%,82%{transform:none;opacity:1}96%,100%{opacity:0}}
@keyframes ipgF{0%,22%{opacity:0}36%,82%{opacity:1}96%,100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.ipg.loop .pack,.ipg.loop .clk,.ipg.loop .floor{animation:none}}
.tcmp-t thead th img[src$="-cut.png"]{background:none!important;object-fit:contain}
.d2-ph:has(.t40-sahd:not([hidden])){aspect-ratio:2/1}
@media (max-width:700px){.d2-ph:has(.t40-sahd:not([hidden])){aspect-ratio:4/3}}
.clock-note.d2-copy{font-size:clamp(1.05rem,1.6vw,1.2rem);line-height:1.55;max-width:56ch;margin:0}
.pill.ltd{border-color:var(--orange);color:var(--orange-strong)}.pill.ltd[aria-pressed="true"]{background:var(--orange-strong);border-color:var(--orange-strong);color:var(--white)}
.flag.ltd{background:var(--orange-strong)}.flag.new{background:var(--orange-strong)}
.ipk-media.one.wide img{aspect-ratio:3/2!important;object-position:50% 60%!important}
/* category tiles: hover shows the product on the job (Josh, Nov 10) */
.cat .ph img.life{position:absolute;inset:0;opacity:0;transition:opacity .45s var(--ease)}
.cat:hover .ph img,.cat:focus-visible .ph img{transform:none}
.cat:hover .ph img.life,.cat:focus-visible .ph img.life{opacity:1}
@media (hover:none){.cat .ph img.life{display:none}}
/* header v4 (Nov 10): two rows on desktop. Callout moves into the top row, so the separate strip hides there. */
@media (min-width:1080px){
  .topbar{display:none}
  .urow{grid-template-columns:1fr auto}
  .urow .u-call{text-align:left}
  .toolbar{top:calc(var(--hdr) + var(--urow))}
  html{scroll-padding-top:calc(var(--hdr) + var(--urow) + 12px)}
  .gallery{top:calc(var(--hdr) + var(--urow) + 16px)}
}
/* sticky bar: second, white button for bulk orders (Cam + Josh, Nov 10) */
.sticky .sticky-bulk{background:var(--white);color:var(--asphalt);border:1px solid var(--asphalt)}
.sticky .sticky-bulk:hover{background:var(--asphalt);color:var(--white)}
.sticky .sb-short{display:none}
@media (max-width:600px){.sticky .sb-long{display:none}.sticky .sb-short{display:inline}.sticky img{display:none}.sticky .btn{padding:6px 14px 0;font-size:1.1rem}.sticky .in{gap:10px}}