/* Homeaste site, written phone first: the base rules are for phones, @media (min-width) adds tablet (720px) and desktop (1024px).
   Each page sets --light --dark --acc --hf --tf from catalog/brands.json. Tap targets are 44px or more; no text under 13px. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;background:var(--light);color:var(--dark);font:16px/1.6 var(--tf);text-rendering:optimizeLegibility;-webkit-tap-highlight-color:transparent;overflow-x:hidden}
img,video,svg{max-width:100%;display:block}
a{color:inherit;text-underline-offset:3px}
button,select,input{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--hf);font-weight:400;line-height:1.15;margin:0 0 .5em;text-wrap:balance}
h1{font-size:clamp(2rem,8vw,3.6rem)}h2{font-size:clamp(1.55rem,6vw,2.2rem)}h3{font-size:1.2rem}
p{margin:0 0 1em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--dark);color:var(--light);padding:12px 16px;z-index:30}.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.wrap{max-width:1180px;margin:0 auto;padding:40px 16px}
.kicker{font:500 .8125rem/1.2 'Jost',sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--acc);margin-bottom:12px}
.lede{font-size:1.08rem;max-width:58ch}
.muted{opacity:.78;font-size:.9375rem}
.deskonly{display:none}.phoneonly{display:block}
mark.fill{background:#FFE58A;color:#262626;padding:0 3px;border-radius:3px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;background:var(--dark);color:var(--light);border:1px solid var(--dark);padding:14px 24px;font:500 .8125rem/1 'Jost',sans-serif;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;cursor:pointer;border-radius:0}
.btn:hover{background:var(--acc);border-color:var(--acc)}.btn:disabled{opacity:.4;cursor:not-allowed}
.btn.ghost{background:transparent;color:var(--dark)}.btn.ghost:hover{background:var(--dark);color:var(--light)}
.btn.light{background:#fff;color:#1d1b18;border-color:#fff}.btn.light:hover{background:transparent;color:#fff}

/* header: one slim row on phones (menu, wordmark, cart); the brand menu opens below it */
.top{position:sticky;top:0;z-index:10;display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:4px;padding:4px 8px 4px 4px;padding-top:max(4px,env(safe-area-inset-top));
  background:color-mix(in srgb,var(--light) 94%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid color-mix(in srgb,var(--dark) 12%,transparent)}
.menubtn{width:48px;height:48px;border:0;background:none;padding:0;cursor:pointer;display:grid;place-items:center}
.menubtn i,.menubtn i::before,.menubtn i::after{display:block;width:22px;height:1.5px;background:currentColor;transition:transform .2s,opacity .2s;content:"";position:relative}
.menubtn i::before{position:absolute;top:-7px}.menubtn i::after{position:absolute;top:7px}
.menu-open .menubtn i{background:transparent}.menu-open .menubtn i::before{transform:translateY(7px) rotate(45deg)}.menu-open .menubtn i::after{transform:translateY(-7px) rotate(-45deg)}
.wordmark{font:500 1.2rem/1 'Cormorant Garamond',serif;letter-spacing:.3em;text-decoration:none;white-space:nowrap;justify-self:center;padding:14px 0}
.wordmark.small{font-size:1.1rem;padding:0;margin-bottom:12px}
.brandnav{display:none;grid-column:1/-1;flex-direction:column;padding:4px 12px 16px;font:400 .9375rem/1 'Jost',sans-serif;letter-spacing:.14em;text-transform:uppercase;max-height:calc(100dvh - 60px);overflow-y:auto}
.menu-open .brandnav{display:flex}
.brandnav a{text-decoration:none;padding:15px 4px;border-bottom:1px solid color-mix(in srgb,var(--dark) 10%,transparent)}
.brandnav a[aria-current]{color:var(--acc)}
.deliver{display:grid;gap:8px;padding:16px 4px 0;font-size:.8125rem;letter-spacing:.18em}
.market{min-height:48px;background:transparent;border:1px solid color-mix(in srgb,var(--dark) 25%,transparent);border-radius:999px;padding:8px 14px;text-transform:none;letter-spacing:0;font-size:1rem}
.tools{display:flex;align-items:center;gap:12px;font:400 .9375rem 'Jost',sans-serif;grid-row:1;grid-column:3}
.brandnav{grid-row:2}
.cartlink{display:inline-flex;align-items:center;gap:6px;min-height:48px;padding:0 8px;text-decoration:none;white-space:nowrap}
.count{display:inline-grid;place-items:center;min-width:1.6em;height:1.6em;border-radius:999px;background:var(--dark);color:var(--light);font-size:.8125rem;padding:0 6px}

/* full-bleed photo hero; svh keeps it steady while the phone's address bar moves */
.fullhero{position:relative;min-height:min(82svh,820px);display:grid;align-items:end;overflow:hidden;background:#2a2622;color:#fff}
.fullhero .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:drift 24s ease-out both}
.fullhero::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.72) 0%,rgba(0,0,0,.35) 45%,rgba(0,0,0,.05) 75%)}
.fullhero .inner{position:relative;z-index:1;max-width:640px;padding:0 16px 32px}
.fullhero h1{color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.3)}
.fullhero .kicker{color:#fff;opacity:.9}
.fullhero .logo{width:min(300px,82%);margin-bottom:20px}
.fullhero .btn{width:100%}
/* phones: brand pages stack the photo above the words, so a logo never sits on a face */
.fullhero:not(.cycle){display:block;min-height:0;padding-top:58svh;background:var(--dark)}
.fullhero:not(.cycle) .bg,.fullhero:not(.cycle) .bgv{height:58svh}
.fullhero:not(.cycle)::after{bottom:auto;height:58svh;background:linear-gradient(to bottom,rgba(0,0,0,0) 70%,var(--dark))}
.fullhero:not(.cycle) .inner{padding:4px 16px 32px}
.fullhero:not(.cycle) .logo{width:min(250px,72%)}
@keyframes drift{from{transform:scale(1.08)}to{transform:scale(1)}}
.bgv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1s ease}.bgv.on{opacity:1}
.nowplaying{display:inline-flex;align-items:center;min-height:44px;margin-top:6px;color:#fff;font:400 .9375rem 'Jost',sans-serif;letter-spacing:.04em;text-decoration:underline;text-decoration-color:rgba(255,255,255,.5)}

/* brand tiles: a swipe row on phones, a mosaic on desktop */
.ptiles{display:grid;grid-auto-flow:column;grid-auto-columns:82%;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 16px 8px;scroll-padding:0 16px;scrollbar-width:none;overscroll-behavior-x:contain}
.ptiles::-webkit-scrollbar{display:none}
.ptile{position:relative;aspect-ratio:4/5;overflow:hidden;color:#fff;text-decoration:none;background:#2a2622;scroll-snap-align:start}
.ptile>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:72% 50%;transition:transform .8s ease} /* brand photos keep their subject on the right */
.ptile[href^="zelune"]>img{object-position:52% 50%} /* the Zelune photo has her face near the middle */
.ptile .tv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s ease}.ptile.playing .tv{opacity:1}
.ptile .ov{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;padding:20px;background:linear-gradient(to top,rgba(0,0,0,.7),rgba(0,0,0,0) 60%)}
.ptile .lw{height:36px;width:auto;max-width:72%;object-fit:contain;object-position:left}
.ptile .tl{font:italic 1.25rem/1.2 'Cormorant Garamond',serif}
.ptile .go{font:500 .8125rem 'Jost',sans-serif;letter-spacing:.18em;text-transform:uppercase}

/* shop the room: on phones the photo is twice the screen wide, so the dots spread out; drag to look around */
.roomscroll{overflow-x:auto;margin:0 -16px;scrollbar-width:none;overscroll-behavior-x:contain}.roomscroll::-webkit-scrollbar{display:none}
.roomimg{position:relative;width:200%}.roomimg>img{width:100%;aspect-ratio:16/9;object-fit:cover}
.dot{position:absolute;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;border:2px solid #fff;background:rgba(0,0,0,.35);color:#fff;font:600 .9375rem 'Jost',sans-serif;cursor:pointer;
  backdrop-filter:blur(2px);box-shadow:0 0 0 0 rgba(255,255,255,.7);animation:pulse 2.2s infinite}
.dot[aria-expanded=true]{animation:none;background:var(--acc);border-color:var(--acc)}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,255,255,.7)}70%{box-shadow:0 0 0 14px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
.pop{position:fixed;z-index:15;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));background:var(--light);color:var(--dark);padding:16px 52px 16px 16px;box-shadow:0 12px 40px rgba(0,0,0,.3);font-size:1rem;display:grid;gap:4px}
.pop a{display:inline-flex;align-items:center;min-height:44px;font:500 .8125rem 'Jost',sans-serif;letter-spacing:.16em;text-transform:uppercase}
.popx{position:absolute;top:4px;right:4px;width:44px;height:44px;border:0;background:none;font-size:1.1rem;cursor:pointer}
.pop[hidden]{display:none}

/* slide to unbox */
.unbox{display:grid;gap:10px}
.ustage{position:relative;aspect-ratio:1;overflow:hidden;background:#ddd}
.ustage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}.ustage img.on{opacity:1}
.unbox input[type=range]{width:100%;height:44px;accent-color:var(--acc);cursor:grab;margin:0}
.steps{display:grid;grid-template-columns:repeat(3,1fr);list-style:none;padding:0;margin:0;font:400 .8125rem/1.3 'Jost',sans-serif;letter-spacing:.06em;text-transform:uppercase}
.steps li{cursor:pointer;opacity:.55;transition:opacity .2s;padding:8px 2px;min-height:44px}.steps li:nth-child(2){text-align:center}.steps li:last-child{text-align:right}.steps li.on{opacity:1;color:var(--acc)}

/* product cards: two per row on phones; the in-use photo shows on hover where there is a mouse */
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px;margin-bottom:20px}
.card{text-decoration:none;display:flex;flex-direction:column;gap:6px}
.cm{position:relative;display:block;overflow:hidden}
.cm .alt{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .45s ease}
@media (hover:hover){.card:hover .cm .alt{opacity:1}}
.card:focus-visible .cm .alt{opacity:1}
.card img,.card .ph{aspect-ratio:1;width:100%;object-fit:cover}
.ct{font-family:var(--hf);font-size:1.02rem;line-height:1.3}
.price{font-weight:500}.price.na{font-weight:400;opacity:.7;font-size:.9375rem}
.ph{position:relative;background:color-mix(in srgb,var(--acc) 10%,var(--light));display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--dark) 8%,transparent)}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ph span{position:absolute;bottom:0;left:0;right:0;padding:8px 0;text-align:center;font:500 .8125rem 'Jost',sans-serif;letter-spacing:.14em;text-transform:uppercase;background:color-mix(in srgb,var(--light) 90%,transparent);color:var(--dark)}

/* product families: size buttons on the brand page, size and finish links on product pages */
.famh{font-size:1.35rem;margin:28px 0 12px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.chip{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid color-mix(in srgb,var(--dark) 25%,transparent);background:transparent;color:inherit;text-decoration:none;font:400 .9375rem 'Jost',sans-serif;cursor:pointer;border-radius:999px}
.chip[aria-pressed=true],.chip[aria-current]{background:var(--dark);color:var(--light);border-color:var(--dark)}
.card[hidden]{display:none}
.options{margin:18px 0 6px}.olabel{font:500 .8125rem 'Jost',sans-serif;letter-spacing:.14em;text-transform:uppercase;margin:0 0 8px}.olabel b{font-weight:500;letter-spacing:.04em;text-transform:none;font-size:.9375rem}
.swatches{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}
.sw{width:44px;height:44px;border-radius:50%;background:var(--c);border:3px solid var(--light);box-shadow:0 0 0 1px color-mix(in srgb,var(--dark) 30%,transparent)}
.sw[aria-current]{box-shadow:0 0 0 2px var(--dark)}

/* reveal on scroll */
.rv{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.rv.in{opacity:1;transform:none}

/* cart drawer: full screen on phones */
.drawer{position:fixed;inset:0;z-index:20;background:rgba(0,0,0,0);transition:background .25s}
.drawer.open{background:rgba(0,0,0,.35)}
.dpanel{position:absolute;top:0;right:0;bottom:0;width:100%;background:var(--light);color:var(--dark);padding:16px 16px max(16px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:16px;transform:translateX(100%);transition:transform .25s ease;box-shadow:-12px 0 40px rgba(0,0,0,.2);overflow-y:auto}
.drawer.open .dpanel{transform:none}
.dhead{display:flex;justify-content:space-between;align-items:center}.dhead h2{margin:0}
.dclose{background:none;border:0;font-size:1.3rem;cursor:pointer;color:inherit;width:48px;height:48px}
.dline{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid color-mix(in srgb,var(--dark) 12%,transparent);font-size:.9375rem}
.dline a{min-height:24px}
.dtotal{text-align:right;font-size:1.1rem}

/* sections */
.split{display:grid;gap:24px;align-items:center}
.split>img{width:100%;aspect-ratio:4/3;object-fit:cover}
.split ul.promise{grid-template-columns:1fr;gap:14px;margin-top:24px}
.big{font-size:1.08rem}
.pv{width:100%;border-radius:4px;background:color-mix(in srgb,var(--dark) 6%,var(--light));box-shadow:0 30px 60px -30px color-mix(in srgb,var(--dark) 45%,transparent)}
.pv.wide{aspect-ratio:16/9}.pv.square{aspect-ratio:1}
.pv.missing{display:grid;place-items:center;font-size:.875rem;opacity:.6}
.band{background:color-mix(in srgb,var(--dark) 5%,var(--light))}
.two{display:grid;gap:28px;align-items:center}
.three{display:grid;gap:24px}
.promise h3{color:var(--acc)}
.story .big{font:400 1.2rem/1.55 var(--hf);max-width:60ch}
ul.promise{list-style:none;padding:0;display:grid;gap:18px;margin:28px 0 0}
ul.promise li{border-top:1px solid var(--acc);padding-top:12px}
.mnote{font-size:.9375rem;opacity:.85}
.tiers{display:grid;gap:22px;margin:8px 0 24px}
.tier h3{margin-bottom:2px}.tier ol{padding-left:1.2em;margin:10px 0 0;font-size:.9375rem}.tier li{margin-bottom:4px}
.band .logo{width:min(280px,100%);margin-bottom:20px}

/* product: photos, then buying, then the packing film; a buy bar sits at the bottom of the screen on phones */
.crumbs{padding-top:16px;padding-bottom:0;font-size:.875rem;opacity:.8}.crumbs a{display:inline-block;padding:10px 0;text-decoration:none}
.product{display:grid;grid-template-areas:"gallery" "buy" "film";gap:28px;padding-top:8px}
.gallery{grid-area:gallery;display:grid;gap:10px;min-width:0}
.gallery .main{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 -16px;overscroll-behavior-x:contain}
.gallery .main::-webkit-scrollbar{display:none}
.gallery .main img,.gallery>img,.gallery .ph{flex:0 0 100%;width:100%;aspect-ratio:1;object-fit:cover;scroll-snap-align:start;transition:transform .3s ease}
@media (hover:hover){.gallery .main{cursor:zoom-in}.gallery .main img:hover{transform:scale(1.8)}}
.thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.thumbs button{padding:0;border:2px solid transparent;background:none;cursor:pointer;aspect-ratio:1;overflow:hidden;min-height:44px}
.thumbs button[aria-current]{border-color:var(--dark)}
.thumbs img{width:100%;height:100%;object-fit:cover}
.film{grid-area:film;margin:0}.film figcaption{font-size:.875rem;opacity:.75;margin-top:8px}
.buy{grid-area:buy;min-width:0}
.buy .logo.small{height:36px;width:auto;margin-bottom:16px}
.buy h1{font-size:clamp(1.75rem,7vw,2.6rem)}
.pp{font-size:1.5rem;margin-bottom:4px}
fieldset{border:0;padding:0;margin:18px 0}legend{font:500 .8125rem 'Jost',sans-serif;letter-spacing:.18em;text-transform:uppercase;margin-bottom:8px}
.opt{display:flex;gap:12px;align-items:center;min-height:52px;padding:10px 14px;border:1px solid color-mix(in srgb,var(--dark) 18%,transparent);margin-bottom:8px;cursor:pointer}
.opt input{width:22px;height:22px;accent-color:var(--dark);margin:0;flex:none}
.opt:has(input:checked){border-color:var(--dark);background:color-mix(in srgb,var(--acc) 8%,var(--light))}
.upcharge{opacity:.75;font-size:.9375rem}
.field{display:grid;gap:6px;margin:14px 0;font-size:.9375rem}
.field input{font-size:16px;min-height:48px;padding:11px 12px;border:1px solid color-mix(in srgb,var(--dark) 30%,transparent);background:#fff;color:#222;border-radius:0} /* 16px stops iPhones zooming in */
.field.qty input{width:100px}
.addform .add{width:100%}
.added{min-height:1.4em;font-size:.9375rem;margin-top:10px}
.specs{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;font-size:.9375rem}.specs dt{opacity:.7}.specs dd{margin:0}
.buybar{position:fixed;z-index:9;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px max(10px,env(safe-area-inset-bottom));
  background:var(--light);border-top:1px solid color-mix(in srgb,var(--dark) 15%,transparent);box-shadow:0 -8px 24px rgba(0,0,0,.08);transform:translateY(110%);transition:transform .25s ease}
.buybar.show{transform:none}.buybar .price{font-size:1.15rem}.buybar .btn{flex:1;max-width:220px}

/* cart and legal pages */
.cart table,.legal table{width:100%;border-collapse:collapse;margin:16px 0 24px}
.cart th,.cart td,.legal th,.legal td{text-align:left;padding:12px 10px;border-bottom:1px solid color-mix(in srgb,var(--dark) 14%,transparent);vertical-align:top}
.cart thead{display:none}
.cart tr{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 12px;padding:12px 0;border-bottom:1px solid color-mix(in srgb,var(--dark) 14%,transparent)}
.cart td{border:0;padding:2px 0}.cart td:first-child{grid-column:1/-1}.cart td>a{display:inline-block;padding:10px 0}
.cart input{width:72px;min-height:44px;font-size:16px;padding:6px 8px}
.cart .x{background:none;border:0;color:inherit;text-decoration:underline;cursor:pointer;min-height:44px;padding:0 4px}
.cart .total{font-size:1.3rem;text-align:right}
.cart .warn{color:#9E3B30}
.cart .btn{width:100%}
.legal{max-width:880px}.legal th{font-weight:500;width:32%}
.legal table{display:block;overflow-x:auto} /* wide tables scroll sideways inside the page on phones */
.legal li{margin-bottom:8px}

/* footer */
.foot{background:var(--dark);color:var(--light);padding:40px 16px max(28px,env(safe-area-inset-bottom));margin-top:32px}
.foot .cols{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:28px 20px}
.foot .cols>div:first-child{grid-column:1/-1}
.foot h3{font:500 .8125rem 'Jost',sans-serif;letter-spacing:.2em;text-transform:uppercase;opacity:.75}
.foot a{display:flex;align-items:center;min-height:44px;text-decoration:none;opacity:.9;font-size:.9375rem}.foot a:hover{opacity:1}
.foot .seller{max-width:1180px;margin:28px auto 0;font-size:.8125rem;opacity:.7;border-top:1px solid color-mix(in srgb,var(--light) 20%,transparent);padding-top:20px}

/* ---------- tablet: 720px and up ---------- */
@media (min-width:720px){
  .wrap{padding:56px 24px}
  .phoneonly{display:none}
  .fullhero .inner,.fullhero:not(.cycle) .inner{padding:0 24px 56px}.fullhero .btn{width:auto}
  .fullhero:not(.cycle){display:grid;min-height:min(82svh,820px);padding-top:0;background:#2a2622}
  .fullhero:not(.cycle) .bg,.fullhero:not(.cycle) .bgv{height:100%}
  .fullhero:not(.cycle)::after{bottom:0;height:auto}
  .fullhero::after{background:linear-gradient(100deg,rgba(0,0,0,.62) 0%,rgba(0,0,0,.28) 45%,rgba(0,0,0,0) 70%),linear-gradient(to top,rgba(0,0,0,.45),rgba(0,0,0,0) 45%)}
  .nowplaying{margin:0 0 0 14px}
  .ptiles{grid-auto-flow:row;grid-template-columns:1fr 1fr;grid-auto-columns:auto;overflow:visible;padding:0 6px;gap:6px}
  .ptile{scroll-snap-align:none}.ptile:nth-child(1){grid-column:1/-1;aspect-ratio:16/9}
  .roomscroll{overflow:visible;margin:0}.roomimg{width:100%}
  .pop{position:absolute;left:var(--x);top:var(--y);right:auto;bottom:auto;transform:translate(-50%,calc(-100% - 24px));width:max-content;max-width:260px;padding:14px 48px 14px 14px;font-size:.9375rem}
  .grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
  .two{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
  .three,ul.promise{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tiers{grid-template-columns:1fr 1fr}
  .gallery .main{margin:0}
  .dpanel{width:min(420px,92vw);padding:24px}
  .cart thead{display:table-header-group}.cart tr{display:table-row}.cart td{padding:12px 10px;border-bottom:1px solid color-mix(in srgb,var(--dark) 14%,transparent)}
  .cart .btn{width:auto}
  .legal table{display:table}
  .foot{padding:56px 24px 32px}.foot .cols{grid-template-columns:2fr 1fr 1fr;gap:36px}.foot .cols>div:first-child{grid-column:auto}
}

/* ---------- desktop: 1024px and up ---------- */
@media (min-width:1024px){
  html{scroll-padding-top:80px}
  .deskonly{display:block}
  .top{display:flex;gap:24px;padding:14px 24px}
  .menubtn,.menuonly{display:none}
  .wordmark{font-size:1.35rem;padding:0}
  .brandnav{display:flex;flex-direction:row;gap:20px;flex:1;padding:0;max-height:none;overflow-x:auto;scrollbar-width:none;font-size:.8125rem;letter-spacing:.16em}
  .brandnav::-webkit-scrollbar{display:none}
  .brandnav a{padding:10px 0;border:0;opacity:.75;white-space:nowrap}.brandnav a:hover,.brandnav a[aria-current]{opacity:1;color:inherit;border-bottom:1px solid var(--acc)}
  .market{min-height:40px;padding:6px 12px;font-size:.875rem}
  .cartlink{min-height:40px}
  .fullhero{min-height:min(86vh,820px)}
  .fullhero .inner{padding:0 24px 72px max(24px,calc((100vw - 1180px)/2 + 24px))}
  .fullhero .logo{width:min(440px,100%);margin-bottom:26px}
  .ptiles{grid-template-columns:repeat(6,minmax(0,1fr))}
  .ptile{grid-column:span 2;aspect-ratio:4/5}
  .ptile:nth-child(1){grid-column:span 4;aspect-ratio:auto}.ptile:nth-child(6),.ptile:nth-child(7){grid-column:span 3;aspect-ratio:16/10}
  .ptile:hover>img{transform:scale(1.05)}
  .ptile .ov{padding:28px}.ptile .lw{height:46px}
  .split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px}
  .story .big{font-size:1.55rem}
  .two{gap:56px}
  .grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
  .product{grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-areas:"gallery buy" "film buy";gap:28px 56px;align-items:start}
  .buy{position:sticky;top:90px}
  .addform .add{width:auto}
  .buybar{display:none}
  .dot{width:36px;height:36px;margin:-18px 0 0 -18px;font-size:.875rem} /* mouse-sized only on desktop; tablets keep 44px */
  .foot a{min-height:0;margin-bottom:8px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.fullhero .bg{animation:none}.ptile>img{transition:none}.dot{animation:none}.buybar{transition:none}}
