/** Shopify CDN: Minification failed

Line 856:0 Unexpected "}"

**/
/* artie — heavy on purpose.
   One stylesheet. Tokens first, then elements, then components in page order. */

/* ---------- tokens ---------- */
:root {
  --black: #000;
  --coal: #131312;
  --ash: #2b2a28;
  --smoke: #a09b91;
  --cotton: #f3efe6;
  --lamp: #3fb2f8;
  --err: #ff7a6b;

  /* the colour the visitor last picked; drives the light tube and the main button */
  --tint: var(--lamp);
  --tint-ui: var(--cotton);
  --tint-ink: #000;

  --display: "Anybody", "Arial Black", "Helvetica Neue", sans-serif;
  --body: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

  --gutter: clamp(16px, 4vw, 56px);
  --gap: clamp(12px, 1.6vw, 24px);
  --section: clamp(64px, 10vw, 144px);
  --header-h: 64px;
  --ease: cubic-bezier(.2, .7, .2, 1);
}

/* ---------- reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 16px); }
body {
  margin: 0;
  background: var(--black);
  color: var(--cotton);
  font-family: var(--body);
  font-size: 1rem;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
  text-rendering: optimizeLegibility;
}
img, video, svg { display: block; max-width: 100%; }
img { height: auto; }
h1, h2, h3, h4, p, ul, ol, figure, fieldset { margin: 0; padding: 0; }
fieldset { border: 0; min-width: 0; }
ul[role="list"], nav ul { list-style: none; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { background: none; border: 0; padding: 0; cursor: pointer; }
summary { cursor: pointer; list-style: none; }
summary::-webkit-details-marker { display: none; }
sup { font-size: .6em; vertical-align: super; line-height: 0; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--tint); outline-offset: 3px; border-radius: 4px; }
::selection { background: var(--cotton); color: #000; }
main:focus { outline: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

@view-transition { navigation: auto; }

/* ---------- utilities ---------- */
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip { position: absolute; left: 12px; top: -80px; z-index: 100; background: var(--cotton); color: #000; padding: 10px 16px; border-radius: 99px; }
.skip:focus { top: 12px; }
.muted { color: var(--smoke); }
.icon { width: 22px; height: 22px; flex: none; }

.display {
  font-family: var(--display);
  font-weight: 800;
  font-stretch: 112%;
  line-height: .95;
  letter-spacing: -.015em;
  text-transform: lowercase;
  text-wrap: balance;
}
.display--sm { font-size: clamp(1.25rem, 1.1rem + .8vw, 1.75rem); line-height: 1.05; }
.display--md { font-size: clamp(1.7rem, 1.2rem + 2.2vw, 3rem); }
.display--lg { font-size: clamp(2.2rem, 1.2rem + 4.6vw, 5rem); }
.display--xl { font-size: clamp(2.6rem, 1rem + 7.5vw, 7.5rem); line-height: .9; }

.lede:where(:not(.bf26 *, .bf26h *)) { font-size: clamp(1.05rem, 1rem + .4vw, 1.3rem); line-height: 1.45; color: var(--smoke); max-width: 46ch; }

.link {
  display: inline-flex; align-items: center; gap: 6px;
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px;
  text-decoration-color: color-mix(in srgb, currentColor 45%, transparent);
  transition: text-decoration-color .2s;
}
.link:hover { text-decoration-color: currentColor; }
.link .icon { width: 18px; height: 18px; }

.rte > * + * { margin-top: 1em; }
.rte h2, .rte h3, .rte h4 { font-family: var(--display); font-weight: 750; font-stretch: 108%; text-transform: lowercase; line-height: 1.1; margin-top: 1.8em; }
.rte h2 { font-size: 1.6rem; } .rte h3 { font-size: 1.25rem; } .rte h4 { font-size: 1.05rem; }
.rte a { text-decoration: underline; text-underline-offset: 3px; }
.rte ul, .rte ol { padding-left: 1.2em; }
.rte li + li { margin-top: .35em; }
.rte img { border-radius: 6px; }
.rte table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.rte th, .rte td { text-align: left; padding: 9px 6px; border-bottom: 1px solid var(--ash); }

/* ---------- buttons and fields ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 12px 26px;
  border-radius: 99px; border: 1.5px solid var(--cotton);
  background: var(--cotton); color: #000;
  font-weight: 600; font-size: .95rem; line-height: 1.1; text-align: center;
  transition: background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), transform .15s var(--ease);
}
.btn:active { transform: scale(.98); }
.btn[disabled] { opacity: .45; cursor: not-allowed; }
.btn--ghost { background: transparent; color: var(--cotton); border-color: color-mix(in srgb, var(--cotton) 45%, transparent); }
.btn--tint { background: var(--tint-ui); border-color: var(--tint-ui); color: var(--tint-ink); }
.btn--ink { background: #000; color: var(--cotton); border-color: #000; }
.btn { position: relative; overflow: hidden; isolation: isolate; }
.btn::before { content: ""; position: absolute; inset: -2px; z-index: -1; border-radius: inherit; background: #000; transform: translateY(103%); transition: transform .42s var(--ease); }
.btn--ghost::before, .btn--ink::before { background: var(--cotton); }
@media (hover: hover) {
  .btn:not([disabled]):hover::before { transform: none; }
  .btn:not([disabled]):hover { color: var(--cotton); }
  .btn--tint:not([disabled]):hover { border-color: var(--cotton); }
  .btn--ghost:not([disabled]):hover, .btn--ink:not([disabled]):hover { color: #000; border-color: var(--cotton); }
}
.btn--block { width: 100%; }
.btn--big { min-height: 58px; font-size: 1.05rem; }
.btn--small { min-height: 38px; padding: 8px 16px; font-size: .85rem; }
.btn .icon { width: 18px; height: 18px; }
.btn.is-loading { pointer-events: none; opacity: .7; }

.icon-btn {
  display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
  position: relative; transition: background .2s, color .2s, border-color .2s;
}
.icon-btn:hover { background: color-mix(in srgb, var(--cotton) 12%, transparent); }
.icon-btn--ring { border: 1.5px solid color-mix(in srgb, var(--cotton) 35%, transparent); }
.icon-btn--ring:hover { border-color: var(--cotton); }
.icon-btn[disabled] { opacity: .3; cursor: default; }

.field {
  width: 100%; min-height: 48px; padding: 12px 16px;
  background: transparent; color: var(--cotton);
  border: 1.5px solid color-mix(in srgb, var(--cotton) 30%, transparent); border-radius: 12px;
  transition: border-color .2s;
}
.field::placeholder { color: var(--smoke); }
.field:hover, .field:focus { border-color: var(--cotton); }
select.field { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--cotton) 50%), linear-gradient(135deg, var(--cotton) 50%, transparent 50%); background-position: calc(100% - 20px) 55%, calc(100% - 14px) 55%; background-size: 6px 6px; background-repeat: no-repeat; padding-right: 40px; }
select.field option { background: var(--coal); }
.field-row { display: flex; gap: 8px; flex-wrap: wrap; }
.field-row .field { flex: 1 1 220px; border-radius: 99px; padding-inline: 22px; }
.form-ok { color: var(--lamp); font-weight: 600; }
.form-err { color: var(--err); font-size: .9rem; margin-top: 8px; }
label { display: grid; gap: 6px; font-size: .9rem; }

.price { display: inline-flex; gap: 8px; align-items: baseline; font-variant-numeric: tabular-nums; }
.price__from { color: var(--smoke); font-size: .85em; }
.price__was { color: var(--smoke); }
.price--sale .price__now { color: var(--lamp); }

/* ---------- announcement ---------- */
.announce { display: grid; background: var(--cotton); color: #000; font-size: .82rem; font-weight: 600; text-align: center; overflow: hidden; }
.announce__item { grid-area: 1 / 1; padding: 8px var(--gutter); opacity: 0; transform: translateY(100%); transition: opacity .5s var(--ease), transform .5s var(--ease); visibility: hidden; }
.announce__item.is-on { opacity: 1; transform: none; visibility: visible; }
.announce__item a { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- header ---------- */
.shopify-section:has(> site-header) { position: sticky; top: 0; z-index: 50; }
.header { display: block; background: var(--black); transition: transform .35s var(--ease), background .3s; }
.header--over { margin-bottom: calc(var(--header-h) * -1); background: linear-gradient(#000a, #0000); }
.header--over.is-stuck, .header--over.is-open { background: var(--black); }
.header.is-hidden { transform: translateY(-110%); }
.header__bar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; height: var(--header-h); padding-inline: calc(var(--gutter) - 8px); }
.header__logo { display: flex; align-items: center; gap: 8px; grid-column: 2; }
.header__logo img { width: 40px; height: 40px; object-fit: contain; }
.header__word { font-family: var(--display); font-weight: 850; font-stretch: 118%; font-size: 1.45rem; letter-spacing: -.02em; line-height: 1; }
.header__nav { display: none; }
.header__tools { display: flex; justify-content: flex-end; grid-column: 3; }
.header__account { display: none; }
.header__count { position: absolute; top: 4px; right: 2px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 99px; background: var(--lamp); color: #000; font-size: .7rem; font-weight: 700; line-height: 18px; text-align: center; }

@media (min-width: 990px) {
  :root { --header-h: 76px; }
  .header__bar { grid-template-columns: auto 1fr auto; gap: 40px; padding-inline: var(--gutter); }
  .header__burger { display: none; }
  .header__logo { grid-column: 1; }
  .header__nav { display: block; grid-column: 2; }
  .header__nav > ul { display: flex; gap: 6px; }
  .header__link { display: inline-flex; align-items: center; height: 40px; padding: 0 14px; border-radius: 99px; font-weight: 500; transition: background .2s; }
  .header__link:hover, .header__link[aria-expanded="true"] { background: color-mix(in srgb, var(--cotton) 14%, transparent); }
  .header__link[aria-current="page"] { text-decoration: underline; text-underline-offset: 6px; }
  .header__account { display: inline-grid; }
}

.mega { position: absolute; left: 0; right: 0; top: 100%; background: var(--black); border-bottom: 1px solid var(--ash); animation: drop .3s var(--ease); }
@keyframes drop { from { opacity: 0; transform: translateY(-8px); } }
.mega__inner { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.1fr); gap: 40px; padding: 28px var(--gutter) 44px; max-width: 1500px; margin-inline: auto; }
.mega__head { display: inline-block; font-family: var(--display); font-weight: 800; font-stretch: 112%; font-size: 1.5rem; margin-bottom: 14px; }
.mega__col ul { display: grid; gap: 2px; }
.mega__col li a { display: inline-block; padding: 5px 0; color: var(--smoke); transition: color .2s, transform .2s var(--ease); }
.mega__col li a:hover { color: var(--cotton); transform: translateX(6px); }
.mega__feat { display: grid; grid-template-columns: 120px 1fr; column-gap: 18px; align-content: center; align-items: center; }
.mega__feat img { grid-row: span 2; width: 120px; aspect-ratio: 4/5; object-fit: contain; object-position: bottom; }
.mega__feat span { align-self: end; color: var(--smoke); font-size: .85rem; }
.mega__feat strong { align-self: start; font-family: var(--display); font-weight: 800; font-size: 1.2rem; line-height: 1.05; }

/* ---------- dialogs: drawers and sheets ---------- */
dialog { color: var(--cotton); border: 0; padding: 0; }
dialog::backdrop { background: rgb(0 0 0 / .62); backdrop-filter: blur(3px); opacity: 0; transition: opacity .35s, overlay .35s allow-discrete, display .35s allow-discrete; }
dialog[open]::backdrop { opacity: 1; }
@starting-style { dialog[open]::backdrop { opacity: 0; } }

.drawer {
  position: fixed; inset: 0 0 0 auto; margin: 0; width: min(460px, 94vw); height: 100dvh; max-height: none; max-width: none;
  background: var(--coal); overflow: hidden;
  transform: translateX(100%);
  transition: transform .4s var(--ease), overlay .4s allow-discrete, display .4s allow-discrete;
}
.drawer--left { inset: 0 auto 0 0; transform: translateX(-100%); }
.drawer--wide { width: min(560px, 96vw); }
.drawer[open] { transform: none; display: flex; flex-direction: column; }
@starting-style { .drawer[open] { transform: translateX(100%); } .drawer--left[open] { transform: translateX(-100%); } }
.drawer > cart-root { display: flex; flex-direction: column; height: 100%; min-height: 0; }
.drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 14px 12px 14px 22px; border-bottom: 1px solid var(--ash); flex: none; }
.drawer__title { font-family: var(--display); font-weight: 800; font-stretch: 112%; font-size: 1.35rem; text-transform: lowercase; }
.drawer__title sup { font-family: var(--body); font-weight: 600; color: var(--smoke); font-size: .8rem; margin-left: 2px; }
.drawer__body { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 18px 22px 28px; }
.drawer__foot { flex: none; padding: 16px 22px calc(18px + env(safe-area-inset-bottom)); border-top: 1px solid var(--ash); background: var(--coal); }

.sheet {
  position: fixed; margin: 0; max-width: none; max-height: none; background: var(--coal);
  transition: transform .4s var(--ease), opacity .3s, overlay .4s allow-discrete, display .4s allow-discrete;
}
.sheet--search { inset: 0 0 auto 0; width: 100%; max-height: 88dvh; overflow-y: auto; transform: translateY(-100%); }
.sheet--search[open] { transform: none; }
@starting-style { .sheet--search[open] { transform: translateY(-100%); } }
.sheet--quick { inset: auto 0 0 0; width: 100%; max-height: 90dvh; overflow-y: auto; border-radius: 22px 22px 0 0; transform: translateY(100%); }
.sheet--quick[open] { transform: none; }
@starting-style { .sheet--quick[open] { transform: translateY(100%); } }
.sheet__close { position: absolute; top: 10px; right: 10px; z-index: 2; }
.sheet__body { padding: 22px; min-height: 240px; }
@media (min-width: 750px) {
  .sheet--quick { inset: 0; margin: auto; width: min(820px, 92vw); height: fit-content; border-radius: 22px; transform: translateY(24px); opacity: 0; }
  .sheet--quick[open] { opacity: 1; }
  @starting-style { .sheet--quick[open] { transform: translateY(24px); opacity: 0; } }
}

/* nav drawer */
.navlist { display: grid; align-content: start; gap: 2px; }
.navlist__top { display: flex; align-items: center; justify-content: space-between; padding: 12px 0; font-family: var(--display); font-weight: 800; font-stretch: 112%; font-size: 1.9rem; line-height: 1; text-transform: lowercase; }
.navlist__top--quiet { font-family: var(--body); font-weight: 500; font-size: 1rem; color: var(--smoke); margin-top: 18px; text-transform: none; }
.navlist__group[open] .icon { transform: rotate(180deg); }
.navlist__label { color: var(--smoke); font-size: .85rem; margin: 14px 0 6px; }
.navlist__sub { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; padding-bottom: 8px; }
.navlist__sub a { display: block; padding: 9px 0; font-size: 1.02rem; }

/* search */
.psearch { display: block; max-width: 900px; margin-inline: auto; padding: 18px var(--gutter) 30px; }
.psearch__form { display: flex; align-items: center; gap: 12px; border-bottom: 1.5px solid var(--cotton); }
.psearch__form input[type="search"] { flex: 1; min-width: 0; background: none; border: 0; outline: 0; padding: 16px 0; font-family: var(--display); font-weight: 750; font-stretch: 108%; font-size: clamp(1.4rem, 1rem + 2vw, 2.2rem); }
.psearch__form input::-webkit-search-cancel-button { display: none; }
.psearch__form input::placeholder { color: color-mix(in srgb, var(--cotton) 35%, transparent); }
.psearch__results { padding-top: 18px; }
.psearch__label { color: var(--smoke); font-size: .85rem; margin-bottom: 8px; }
.psearch__links { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin-bottom: 18px; }
.psearch__links a { display: inline-block; padding: 8px 16px; border: 1.5px solid var(--ash); border-radius: 99px; transition: border-color .2s; }
.psearch__links a:hover { border-color: var(--cotton); }
.psearch__links mark { background: none; color: var(--smoke); }
.psearch__products { display: grid; gap: 4px; list-style: none; margin-bottom: 18px; }
@media (min-width: 750px) { .psearch__products { grid-template-columns: 1fr 1fr; } }
.psearch__product { display: flex; align-items: center; gap: 14px; padding: 8px; border-radius: 12px; transition: background .2s; }
.psearch__product:hover { background: color-mix(in srgb, var(--cotton) 8%, transparent); }
.psearch__product img { width: 64px; height: 80px; object-fit: contain; object-position: bottom; background: #000; border-radius: 8px; }
.psearch__product span { display: grid; gap: 2px; }
.psearch__product strong { font-weight: 600; }
.psearch__empty { color: var(--smoke); padding: 12px 0; }

/* ---------- cart ---------- */
.cartd { display: flex; }
.cartd__empty { display: grid; align-content: center; justify-items: start; gap: 14px; }
.lines { display: grid; list-style: none; }
.line { display: grid; grid-template-columns: 84px 1fr auto; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--ash); transition: opacity .2s; }
.line.is-busy { opacity: .45; pointer-events: none; }
.line__media img { width: 84px; height: 105px; object-fit: contain; object-position: bottom; background: #000; border-radius: 10px; }
.line__title { font-weight: 600; line-height: 1.25; }
.line__opts { color: var(--smoke); font-size: .88rem; }
.line__deal { color: var(--lamp); font-size: .82rem; }
.line__row { display: flex; align-items: center; gap: 14px; margin-top: 10px; }
.line__remove { color: var(--smoke); font-size: .85rem; text-decoration: underline; text-underline-offset: 3px; }
.line__remove:hover { color: var(--cotton); }
.line__price { display: grid; align-content: start; justify-items: end; font-variant-numeric: tabular-nums; font-weight: 600; }
.line__price s { color: var(--smoke); font-weight: 400; font-size: .88rem; }
.qty { display: inline-flex; align-items: center; border: 1.5px solid var(--ash); border-radius: 99px; }
.qty__btn { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; }
.qty__btn .icon { width: 14px; height: 14px; }
.qty__btn:hover { background: color-mix(in srgb, var(--cotton) 12%, transparent); }
.qty__n { min-width: 22px; text-align: center; font-variant-numeric: tabular-nums; font-size: .92rem; }

.shipbar { margin-bottom: 6px; }
.shipbar__text { font-size: .9rem; margin-bottom: 8px; }
.shipbar__text strong { color: var(--lamp); }
.shipbar__track, .more__track { height: 4px; border-radius: 4px; background: var(--ash); overflow: hidden; }
.shipbar__track span, .more__track span { display: block; height: 100%; width: 0; border-radius: 4px; background: var(--lamp); box-shadow: 0 0 10px var(--lamp); transition: width .6s var(--ease); }

.upsell { margin-top: 22px; }
.upsell__title, .pdp__with-title { font-family: var(--display); font-weight: 800; font-stretch: 110%; text-transform: lowercase; font-size: 1.05rem; margin-bottom: 10px; }
.upsell__list { display: grid; gap: 8px; }
.upsell__item { display: grid; grid-template-columns: 56px 1fr auto; align-items: center; gap: 12px; padding: 8px; border: 1px solid var(--ash); border-radius: 14px; }
.upsell__item img { width: 56px; height: 68px; object-fit: contain; object-position: bottom; }
.upsell__name { display: block; font-weight: 600; font-size: .92rem; line-height: 1.2; }
.upsell__item .price { font-size: .88rem; color: var(--smoke); }
.upsell__opts { font-size: .82rem; color: var(--smoke); line-height: 1.3; }
.upsell__opts .link { font-size: inherit; margin-left: 4px; }
.upsell__set { display: block; font-size: .8rem; font-weight: 600; color: var(--lamp); }
.upsell__set[hidden] { display: none; }
.upsell__item.has-pick .upsell__choose { display: none; }
.pdp__with .upsell__add, .pdp__with .upsell__opts { display: none; }
.pdp__with .upsell__item.has-pick .upsell__choose { display: inline-flex; }

.summary { display: grid; gap: 8px; }
.summary__row { display: flex; justify-content: space-between; gap: 16px; }
.summary__row--deal { color: var(--lamp); font-size: .9rem; }
.summary__row--total { font-size: 1.15rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.summary__note { color: var(--smoke); font-size: .82rem; margin-bottom: 6px; }

.cartp__grid { display: grid; gap: 32px; margin-top: 32px; }
.cartp__side { align-self: start; padding: 22px; border: 1px solid var(--ash); border-radius: 18px; }
@media (min-width: 990px) { .cartp__grid { grid-template-columns: 1fr 380px; gap: 64px; } .cartp__side { position: sticky; top: calc(var(--header-h) + 20px); } }

/* ---------- sections ---------- */
.section { padding: var(--section) var(--gutter) 0; max-width: 1680px; margin-inline: auto; }
main > .shopify-section:last-child .section { padding-bottom: var(--section); }

/* hero */
.hero:where(:not(.bf26 *, .bf26h *)) { position: relative; display: grid; align-items: end; min-height: min(100svh, 1100px); overflow: clip; background: #000; }
.hero__media { position: absolute; inset: 0; display: block; }
.hero__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, #0006 0%, #0000 26%, #0000 42%, #000b 78%, #000 100%); pointer-events: none; }
.hero__poster, .hero__media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero__media video { opacity: 0; transition: opacity .8s; }
.hero__media.is-playing video { opacity: 1; }
.hero__toggle { position: absolute; z-index: 3; right: calc(var(--gutter) - 8px); top: calc(var(--header-h) + 12px); border: 1.5px solid #fff6; color: #fff; background: #0005; backdrop-filter: blur(6px); }
.hero__toggle-play, .hero__toggle[aria-pressed="true"] .hero__toggle-pause { display: none; }
.hero__toggle[aria-pressed="true"] .hero__toggle-play { display: block; }
.hero__content { position: relative; z-index: 2; display: grid; gap: 22px; padding: calc(var(--header-h) + 40px) var(--gutter) clamp(28px, 5vw, 56px); width: 100%; max-width: 1680px; margin-inline: auto; }
.hero__title {
  font-family: var(--display); text-transform: lowercase; line-height: .86; letter-spacing: -.02em;
  font-size: clamp(2.6rem, 13.2vw, 6.4rem);
  font-weight: 900; font-stretch: 122%;
  max-width: 8.5ch; text-wrap: balance;
  animation: heavy 1.5s .15s var(--ease) both;
}
/* Black Friday pages bring their own stylesheet and reuse a few class names (card, chip, dot, hero, lede, note, pill):
   every rule on those names skips anything inside .bf26 / .bf26h so the two never mix. */
/* the one orchestrated moment: the headline puts on weight */
@keyframes heavy { from { font-weight: 100; font-stretch: 122%; opacity: .5; } to { font-weight: 900; font-stretch: 122%; opacity: 1; } }
.hero__side { display: grid; gap: 18px; }
.hero__text { font-size: clamp(1.05rem, 1rem + .5vw, 1.35rem); line-height: 1.4; max-width: 34ch; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 10px; }
@media (min-width: 990px) {
  .hero__content { grid-template-columns: minmax(0, 1fr) minmax(280px, 340px); align-items: end; gap: 48px; }
  .hero__title { font-size: min(9.4vw, 10.4rem); }
  .hero__side { padding-bottom: 14px; }
}

/* light tube: the lit accent that takes the colour the visitor picks */
.tube { display: block; width: min(46%, 300px); height: 3px; margin: 0 auto; border-radius: 3px; background: var(--tint); box-shadow: 0 0 10px var(--tint), 0 0 34px color-mix(in srgb, var(--tint) 65%, transparent), 0 14px 60px 6px color-mix(in srgb, var(--tint) 22%, transparent); transition: background .5s, box-shadow .5s; }
.tube.is-flick { animation: flick .42s steps(1, end); }
@keyframes flick { 0% { opacity: .2; } 18% { opacity: 1; } 34% { opacity: .35; } 52% { opacity: 1; } 70% { opacity: .6; } 100% { opacity: 1; } }

/* colour wall */
.wall__grid { display: grid; gap: 28px; }
.wall__copy { display: grid; gap: 18px; align-content: start; }
.wall__words { font-family: var(--display); font-weight: 800; font-stretch: 106%; text-transform: lowercase; font-size: clamp(1.7rem, 1rem + 3.4vw, 3.6rem); line-height: 1.12; letter-spacing: -.01em; color: color-mix(in srgb, var(--cotton) 30%, transparent); margin-top: 8px; }
.wall__word { font: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; transition: color .25s; border-radius: 6px; }
.wall__word:hover { color: var(--cotton); }
.wall__word.is-on { color: var(--tint-ui); text-decoration: underline; text-decoration-thickness: .06em; text-underline-offset: .12em; }
.wall__stage { position: relative; display: grid; gap: 14px; align-content: start; }
.wall__img { width: 100%; aspect-ratio: 1; object-fit: contain; object-position: bottom; transition: opacity .25s; }
.wall__img.is-swapping { opacity: .15; }
.wall__buy { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; }
.wall__name { font-weight: 600; }
@media (min-width: 990px) {
  .wall__grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 64px; align-items: start; }
  .wall__stage { position: sticky; top: calc(var(--header-h) + 24px); }
}
@media (max-width: 989px) {
  .wall__stage { order: -1; position: sticky; top: var(--header-h); z-index: 1; background: #000; padding-bottom: 12px; margin-inline: calc(-1 * var(--gutter)); padding-inline: var(--gutter); }
  .wall__stage::before, .wall__stage::after { content: ''; position: absolute; left: 0; right: 0; pointer-events: none; }
  .wall__stage::before { bottom: 100%; height: calc(var(--header-h) + 1px); background: #000; }
  .wall__stage::after { top: 100%; height: 36px; background: linear-gradient(#000, transparent); }
  .wall__img { aspect-ratio: 5/4; }
  .wall__copy > .display, .wall__copy > .lede:where(:not(.bf26 *, .bf26h *)) { display: none; }
}

/* fit builder: two big photos on one floor, controls underneath */
.fit__head { display: grid; gap: 14px; margin-bottom: clamp(20px, 3vw, 40px); }
.fit__note { margin: 2px 0 0 6%; }
.fit__grid { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); grid-template-areas: "tm plus bm" "ti ti ti" "bi bi bi" "bar bar bar"; column-gap: 6px; align-items: end; }
.fit__half { display: contents; }
.fit__half[hidden] { display: none; }
.fit__swap { display: inline-flex; justify-self: start; padding: 3px; border: 1px solid var(--ash); border-radius: 99px; }
.fit__swap button { padding: 5px 13px; border-radius: 99px; font-size: .8rem; font-weight: 600; line-height: 1.2; color: var(--smoke); transition: background .2s, color .2s; }
.fit__swap button[aria-pressed="true"] { background: var(--cotton); color: #000; }
.fit__media { display: grid; gap: 12px; }
.fit__half--top .fit__media { grid-area: tm; translate: calc((1 - var(--in, 1)) * -9vw) 0; opacity: calc(.15 + var(--in, 1) * .85); }
.fit__half--bottom .fit__media { grid-area: bm; translate: calc((1 - var(--in, 1)) * 9vw) 0; opacity: calc(.15 + var(--in, 1) * .85); }
.fit__media .tube { width: 56%; }
.fit__media img { width: 100%; aspect-ratio: 4 / 5; object-fit: contain; object-position: bottom; transition: opacity .2s; }
.fit__plus { grid-area: plus; align-self: center; position: relative; width: clamp(22px, 3.6vw, 56px); aspect-ratio: 1; scale: calc(.4 + var(--in, 1) * .6); }
.fit__plus::before, .fit__plus::after { content: ""; position: absolute; inset: 0; margin: auto; background: var(--lamp); border-radius: 3px; }
.fit__plus::before { height: 16%; }
.fit__plus::after { width: 16%; }
.fit__half--top .fit__info { grid-area: ti; }
.fit__half--bottom .fit__info { grid-area: bi; }
.fit__info { display: grid; gap: 12px; min-width: 0; padding: 16px 0 18px; border-top: 1px solid var(--ash); }
.fit__title { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; }
.fit__title h3 { font-family: var(--display); font-weight: 800; font-stretch: 110%; font-size: clamp(1.1rem, 1rem + .6vw, 1.5rem); line-height: 1.05; }
.fit .opt + .opt { margin-top: 0; }
.fit .opt__legend { margin-bottom: 2px; font-size: .86rem; }
.fit .opt__values { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding: 6px 28px 6px 6px; margin-left: -6px; -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 30px), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 30px), transparent); }
.fit .opt__values::-webkit-scrollbar { display: none; }
.fit .swatch, .fit .pill:where(:not(.bf26 *, .bf26h *)) { flex: none; }
.fit .swatch__dot { width: 30px; height: 30px; }
.fit .pill:where(:not(.bf26 *, .bf26h *)) span { min-width: 46px; min-height: 40px; padding: 6px 12px; }
.fit__bar { grid-area: bar; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; padding-top: 20px; border-top: 1px solid var(--ash); }
.fit__total { font-size: 1.1rem; }
.fit__total strong { font-variant-numeric: tabular-nums; }
.fit__total s { font-weight: 400; color: var(--smoke); margin-right: 4px; }
.fit__deal { flex: 1 1 100%; order: 3; font-size: .86rem; font-weight: 600; color: var(--lamp); }
@media (max-width: 989px) {
  .fit__bar .btn { flex: 1 1 100%; }
}
@media (min-width: 990px) {
  .fit__grid { grid-template-areas: "tm plus bm" "ti . bi" "bar bar bar"; column-gap: clamp(20px, 4vw, 72px); }
  .fit__media img { aspect-ratio: auto; height: min(56vh, 600px); }
  .fit__grid { position: relative; }
  .fit__swap { position: absolute; z-index: 2; left: 0; top: 30px; background: #000; }
  .fit__bar { justify-content: flex-end; margin-top: 6px; }
  .fit__bar .link { margin-right: auto; }
  .fit__deal { text-align: right; }
}

/* options: swatches and pills */
.opt + .opt { margin-top: 18px; }
.opt__legend { display: flex; justify-content: space-between; align-items: center; gap: 12px; width: 100%; margin-bottom: 10px; font-size: .92rem; color: var(--smoke); }
.opt__legend strong { color: var(--cotton); font-weight: 600; }
/* a size still to choose: the row says so when the customer tries to add */
.opt__ask { display: none; margin-left: 8px; font-style: normal; font-weight: 600; color: var(--lamp); }
.opt.is-wanted .opt__ask { display: inline; }
.opt.is-wanted .pill:where(:not(.bf26 *, .bf26h *)) span { border-color: var(--lamp); }
.opt.is-wanted .opt__values { animation: nudge .45s var(--ease); }
@keyframes nudge { 0%, 100% { translate: 0 0; } 25% { translate: -7px 0; } 60% { translate: 5px 0; } }
.opt__values { display: flex; flex-wrap: wrap; gap: 8px; }
.swatch, .pill:where(:not(.bf26 *, .bf26h *)) { position: relative; display: inline-block; cursor: pointer; }
.swatch input, .pill:where(:not(.bf26 *, .bf26h *)) input, .check input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.swatch__dot { display: block; width: 34px; height: 34px; border-radius: 50%; background: var(--dot); border: 1.5px solid color-mix(in srgb, var(--cotton) 28%, transparent); box-shadow: 0 0 0 3px #0000; transition: box-shadow .2s, transform .2s var(--ease); overflow: hidden; }
.swatch__dot--img img { width: 100%; height: 100%; object-fit: cover; }
.swatch:hover .swatch__dot { transform: scale(1.08); }
.swatch input:checked + .swatch__dot { box-shadow: 0 0 0 2.5px var(--black), 0 0 0 4.5px var(--cotton); }
.swatch input:focus-visible + .swatch__dot { outline: 2px solid var(--tint); outline-offset: 6px; }
.swatch.is-off .swatch__dot { opacity: .35; }
.pill:where(:not(.bf26 *, .bf26h *)) span { display: inline-grid; place-items: center; min-width: 50px; min-height: 46px; padding: 8px 14px; border: 1.5px solid color-mix(in srgb, var(--cotton) 28%, transparent); border-radius: 12px; font-weight: 600; font-size: .92rem; transition: background .2s, color .2s, border-color .2s; }
.pill:where(:not(.bf26 *, .bf26h *)):hover span { border-color: var(--cotton); }
.pill:where(:not(.bf26 *, .bf26h *)) input:checked + span { background: var(--cotton); color: #000; border-color: var(--cotton); }
.pill:where(:not(.bf26 *, .bf26h *)) input:focus-visible + span { outline: 2px solid var(--tint); outline-offset: 3px; }
.pill:where(:not(.bf26 *, .bf26h *)).is-off span { color: var(--smoke); text-decoration: line-through; border-style: dashed; }
.pill--small span { min-height: 36px; min-width: 0; font-size: .85rem; border-radius: 99px; }

/* rails */
product-recs, facet-results, colour-wall, fit-builder, predictive-search, size-finder, cart-root, hero-film, announce-bar, site-header { display: block; }
.rail { padding-inline: 0; max-width: none; }
.rail__head { display: flex; align-items: end; justify-content: space-between; gap: 16px; padding-inline: var(--gutter); margin-bottom: clamp(18px, 3vw, 36px); }
.rail__tools { display: flex; align-items: center; gap: 8px; flex: none; }
.rail__tools .link { margin-right: 10px; }
.rail__tools .icon-btn { display: none; }
.rail__prev .icon { transform: scaleX(-1); }
.rail__track { display: grid; grid-auto-flow: column; grid-auto-columns: min(62vw, 300px); gap: var(--gap); overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--gutter); padding-inline: var(--gutter); scrollbar-width: none; }
.rail__track::-webkit-scrollbar { display: none; }
.rail__item { scroll-snap-align: start; }
@media (min-width: 990px) {
  .rail__tools .icon-btn { display: inline-grid; }
  .rail__track { grid-auto-columns: calc((100% - var(--gap) * 3) / 4.3); }
}

/* product card */
.card:where(:not(.bf26 *, .bf26h *)) { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; align-content: start; min-width: 0; }
.card__media { position: relative; display: block; aspect-ratio: 4 / 5; background: #000; overflow: hidden; }
.card__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: bottom; transition: opacity .35s, transform .6s var(--ease); }
.card__img--alt { opacity: 0; }
.card__img--placeholder { fill: var(--ash); background: var(--coal); }
.card__badge { position: absolute; left: 0; top: 0; padding: 4px 10px; border-radius: 99px; background: var(--lamp); color: #000; font-size: .75rem; font-weight: 700; }
.card__info { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 5px; }
.card__title, .card__meta { padding-right: 46px; }
.card__quick { position: absolute; right: 0; top: -2px; width: 40px; height: 40px; }
.card__quick:hover { background: var(--cotton); color: #000; border-color: var(--cotton); }
.card__quick .icon { width: 17px; height: 17px; }
.card__title { font-size: .98rem; font-weight: 600; line-height: 1.25; }
.card__meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 10px; font-size: .92rem; color: var(--smoke); }
.card__meta .price__now { color: var(--cotton); }
.card__meta .price--sale .price__now { color: var(--lamp); }
.card__rating { display: inline-flex; align-items: center; gap: 3px; font-size: .82rem; font-variant-numeric: tabular-nums; }
.card__rating .icon { width: 13px; height: 13px; color: var(--lamp); }
.card__dots { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; margin-top: 2px; }
.dot:where(:not(.bf26 *, .bf26h *)) { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; }
.dot:where(:not(.bf26 *, .bf26h *))::before { content: ""; width: 14px; height: 14px; border-radius: 50%; background: var(--dot); border: 1px solid color-mix(in srgb, var(--cotton) 30%, transparent); transition: transform .2s var(--ease); }
.dot:where(:not(.bf26 *, .bf26h *)):hover::before, .dot:where(:not(.bf26 *, .bf26h *)).is-on::before { transform: scale(1.3); border-color: var(--cotton); }
.card__more { color: var(--smoke); font-size: .8rem; margin-left: 4px; }
.card--text { padding: 20px; border: 1px solid var(--ash); border-radius: 16px; }
@media (hover: hover) {
  .card:where(:not(.bf26 *, .bf26h *)):hover .card__img--alt { opacity: 1; }
  .card:where(:not(.bf26 *, .bf26h *)):has(.card__img--alt):hover .card__img:not(.card__img--alt) { opacity: 0; }
  .card:where(:not(.bf26 *, .bf26h *)).is-picked:hover .card__img--alt { opacity: 0; }
  .card:where(:not(.bf26 *, .bf26h *)).is-picked:hover .card__img:not(.card__img--alt) { opacity: 1; }
}

/* grids */
.grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(28px, 4vw, 56px) var(--gap); }
.grid[data-density="roomy"] { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 750px) { .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .grid[data-density="roomy"] { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } .grid[data-density="roomy"] { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* category index */
.index__head { margin-bottom: clamp(18px, 3vw, 36px); }
.index__list { display: block; border-top: 1px solid var(--ash); position: relative; }
.index__row { position: relative; display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: clamp(12px, 1.8vw, 22px) 0; border-bottom: 1px solid var(--ash); transition: padding .35s var(--ease), color .2s; }
.index__name { font-family: var(--display); font-weight: 800; font-stretch: 112%; font-size: clamp(1.9rem, 1rem + 4.6vw, 5.2rem); line-height: .95; letter-spacing: -.015em; transition: font-stretch .35s var(--ease), font-weight .35s var(--ease); }
.index__count { color: var(--smoke); font-size: .9rem; white-space: nowrap; }
.index__img { position: absolute; right: 12%; top: 50%; z-index: 2; width: clamp(140px, 17vw, 250px); aspect-ratio: 4/5; object-fit: contain; object-position: center; translate: 0 -50%; rotate: 4deg; opacity: 0; scale: .9; pointer-events: none; transition: opacity .25s, scale .35s var(--ease), rotate .35s var(--ease); filter: drop-shadow(0 20px 40px #000); }
@media (hover: hover) and (min-width: 750px) {
  .index__list:hover .index__row:not(:hover) { color: color-mix(in srgb, var(--cotton) 35%, transparent); }
  .index__row:hover { padding-left: 18px; }
  .index__row:hover .index__name { font-stretch: 126%; font-weight: 900; }
  .index__row:hover .index__img { opacity: 1; scale: 1; rotate: -3deg; }
}
@media not ((hover: hover) and (min-width: 750px)) {
  .index__row { align-items: center; }
  .index__name { min-width: 0; overflow-wrap: anywhere; font-size: clamp(1.5rem, 8.2vw, 3rem); }
  .index__img { position: static; order: -1; translate: none; rotate: none; opacity: 1; scale: 1; width: 56px; flex: none; filter: none; }
  .index__name { flex: 1 1 0; }
}

/* newsletter */
.news { max-width: none; padding-inline: 0; }
main > .shopify-section:last-child .news { padding-bottom: 0; }
.shopify-section:has(.news) + .shopify-section .footer, main:has(> .shopify-section:last-child .news) ~ .shopify-section .footer { margin-top: 0; border-top: 0; }
.news__inner { display: grid; gap: 28px; padding: clamp(48px, 8vw, 120px) var(--gutter); background: var(--lamp); color: #000; }
.news .lede:where(:not(.bf26 *, .bf26h *)) { color: #000; opacity: .78; }
.news .field { border-color: #000; color: #000; }
.news .field::placeholder { color: #0009; }
.news .form-ok, .news .note:where(:not(.bf26 *, .bf26h *)) { color: #000; }
.news :focus-visible { outline-color: #000; }
.news__side { display: grid; gap: 18px; align-content: start; }
.news__small { margin-top: 6px; }
@media (min-width: 990px) { .news__inner { grid-template-columns: 1.1fr 1fr; gap: 64px; align-items: center; } }

/* text + split */
.prose-block { display: grid; gap: 22px; justify-items: start; }
.prose-block--narrow { max-width: calc(760px + var(--gutter) * 2); }
.prose-block .rte { font-size: 1.1rem; color: color-mix(in srgb, var(--cotton) 85%, transparent); max-width: 68ch; }
.split { display: grid; gap: 28px; align-items: center; }
.split__media { position: relative; border-radius: 22px; overflow: hidden; background: var(--coal); }
.split__media img { width: 100%; }
.split__film { display: block; position: relative; aspect-ratio: 16/10; }
.split__film img, .split__film video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.split__film video { opacity: 0; transition: opacity .8s; }
.split__film.is-playing video { opacity: 1; }
.split__film .hero__toggle { top: auto; bottom: 12px; right: 12px; }
.split__copy { display: grid; gap: 20px; justify-items: start; }
.split__copy .rte { color: color-mix(in srgb, var(--cotton) 82%, transparent); max-width: 56ch; font-size: 1.05rem; }
@media (min-width: 990px) { .split { grid-template-columns: 1.15fr 1fr; gap: 72px; } .split--flip .split__media { order: 2; } }

/* accordions */
.acc { border-bottom: 1px solid var(--ash); }
.acc__q { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 0; font-weight: 600; font-size: 1.02rem; }
.acc__q .icon { width: 18px; height: 18px; transition: transform .3s var(--ease); }
.acc[open] > .acc__q .icon { transform: rotate(45deg); }
.acc__a { padding: 0 0 22px; color: color-mix(in srgb, var(--cotton) 82%, transparent); max-width: 70ch; }
.faq { max-width: calc(900px + var(--gutter) * 2); }
.faq .display { margin-bottom: 14px; }
.faq__list { border-top: 1px solid var(--ash); }

/* facts strip */
.facts { padding: var(--section) var(--gutter) 0; max-width: 1680px; margin-inline: auto; }
.facts__list { display: grid; gap: 14px; padding: 22px 0; border-block: 1px solid var(--ash); }
.facts__list li { display: flex; gap: 12px; align-items: center; color: var(--smoke); }
.facts__list strong { color: var(--cotton); font-weight: 600; }
.facts__list .icon { color: var(--lamp); }
@media (min-width: 990px) { .facts__list { grid-auto-flow: column; grid-auto-columns: 1fr; gap: 40px; } }

/* apps */
.apps--narrow { max-width: calc(900px + var(--gutter) * 2); }
.apps__head { margin-bottom: clamp(18px, 3vw, 36px); }
/* Judge.me prints its carousel header in black; on this site that is black on black */
.apps .jdgm-title, .apps .jdgm-rating-text, .apps .jdgm-reviews-count, .apps .jdgm-verified-text, .apps .jdgm-all-reviews-rating-wrapper, .apps .jdgm-carousel-title, .apps .jdgm-carousel-number-of-reviews { color: var(--cotton) !important; }
.apps .jdgm-card .jdgm-rating-text, .apps .jdgm-card .jdgm-verified-text { color: inherit !important; }
.apps--titled .jdgm-title { display: none !important; }
.apps .jdgm-average-rating .jdgm-star, .apps .jdgm-rating-star { color: var(--lamp) !important; }

/* ---------- product page ---------- */
.pdp { display: grid; gap: 22px; max-width: 1680px; margin-inline: auto; padding-bottom: 12px; }
.pdp__gallery { display: block; min-width: 0; padding-top: 10px; }
.gallery__stage { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-top: 6px; }
.gallery__stage::-webkit-scrollbar { display: none; }
.gallery__slide { flex: 0 0 100%; scroll-snap-align: center; display: grid; place-items: end center; aspect-ratio: 4 / 5; background: #000; }
.gallery__zoom { display: block; width: 100%; height: 100%; cursor: zoom-in; }
.gallery__slide img, .gallery__slide video, .gallery__slide iframe { width: 100%; height: 100%; object-fit: contain; object-position: bottom; }
.gallery__nav { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 10px; }
.gallery__count { font-variant-numeric: tabular-nums; font-size: .88rem; color: var(--smoke); min-width: 56px; text-align: center; }
.gallery__thumbs { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 12px var(--gutter) 4px; }
.gallery__thumbs::-webkit-scrollbar { display: none; }
.gallery__thumb { flex: none; width: 54px; aspect-ratio: 4/5; border-radius: 8px; border: 1.5px solid transparent; opacity: .55; overflow: hidden; transition: opacity .2s, border-color .2s; }
.gallery__thumb img { width: 100%; height: 100%; object-fit: contain; object-position: bottom; }
.gallery__thumb:hover { opacity: 1; }
.gallery__thumb.is-on { opacity: 1; border-color: var(--cotton); }
@media (max-width: 989px) {
  .gallery__slide { aspect-ratio: auto; height: min(125vw, 50svh); }
  .gallery__nav { display: none; }
  .gallery__thumbs { padding-top: 8px; }
  .gallery__thumb { width: 44px; }
}

.pdp__info { display: grid; gap: 18px; align-content: start; padding: 0 var(--gutter); min-width: 0; }
.pdp__title { line-height: 1; }
.pdp__price { font-size: 1.3rem; font-weight: 600; margin-top: -8px; }
.pdp__app:empty { display: none; }
.pform { display: grid; gap: 10px; }
.pform__express:empty { display: none; }
.pform__express { position: relative; }
.pform__guard { display: none; position: absolute; inset: 0; z-index: 2; }
.needs-size .pform__guard { display: block; }
.pdp__facts { display: grid; gap: 8px; font-size: .9rem; color: var(--smoke); }
.pdp__facts li { display: flex; gap: 10px; align-items: flex-start; }
.pdp__facts .icon { width: 18px; height: 18px; margin-top: 2px; color: var(--cotton); }
.pdp__desc { color: color-mix(in srgb, var(--cotton) 86%, transparent); padding-top: 6px; }
.pdp__desc img { display: inline-block; max-width: min(100%, 320px); }
.pdp__info .acc:first-of-type { border-top: 1px solid var(--ash); }
.pdp__info .acc + .acc { margin-top: -18px; }
.pdp__with { display: block; }

@media (min-width: 990px) {
  .pdp { grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 88px); padding: 12px var(--gutter) 0; align-items: start; }
  .pdp__gallery { position: sticky; top: calc(var(--header-h) + 8px); }
  .gallery__slide { aspect-ratio: auto; height: min(74svh, 860px); }
  .gallery__thumbs { padding-inline: 0; justify-content: safe center; }
  .pdp__info { padding: 28px 0 0; max-width: 560px; }
}

.buybar { position: fixed; z-index: 40; left: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom)); background: color-mix(in srgb, var(--coal) 92%, transparent); backdrop-filter: blur(14px); border-top: 1px solid var(--ash); animation: rise .35s var(--ease); }
@keyframes rise { from { transform: translateY(100%); } }
.buybar__info { display: grid; min-width: 0; line-height: 1.25; }
.buybar__info strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.buybar__info .price { font-size: .9rem; color: var(--smoke); }

/* size finder + guide */
.finder { display: grid; gap: 14px; padding: 18px; margin-bottom: 26px; border: 1px solid var(--ash); border-radius: 18px; background: radial-gradient(120% 100% at 50% -40%, color-mix(in srgb, var(--lamp) 14%, transparent), transparent 60%); }
.finder__title { font-family: var(--display); font-weight: 800; font-stretch: 110%; font-size: 1.25rem; text-transform: lowercase; }
.finder__units { display: flex; gap: 6px; }
.finder__fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.finder__input { display: flex; align-items: center; gap: 6px; color: var(--smoke); }
.finder__input .field { min-width: 0; }
.finder__result { display: grid; gap: 10px; justify-items: start; padding-top: 14px; border-top: 1px solid var(--ash); }
.finder__size { font-family: var(--display); font-weight: 900; font-stretch: 120%; font-size: 2rem; color: var(--lamp); margin-left: 4px; }
.guide table { font-size: .88rem; }
.guide h3:first-child { margin-top: 0; }

.zoom { width: 100vw; height: 100dvh; max-width: none; max-height: none; background: #000; }
.zoom__scroll { width: 100%; height: 100%; overflow: auto; display: grid; place-items: center; cursor: zoom-out; }
.zoom__scroll img { max-width: none; width: max(100vw, 130vh); height: auto; }
.zoom__close { position: fixed; top: 14px; right: 14px; z-index: 2; background: #000a; border: 1.5px solid #fff5; }

/* quick add */
.quick { display: grid; grid-template-columns: 110px 1fr; gap: 18px; align-items: start; }
.quick__media img { width: 100%; aspect-ratio: 4/5; object-fit: contain; object-position: bottom; }
.quick__info { display: grid; gap: 14px; min-width: 0; padding-right: 34px; }
.quick__title { font-family: var(--display); font-weight: 800; font-stretch: 110%; font-size: 1.35rem; line-height: 1.05; }
.quick__info .btn { margin-top: 4px; }
.quick__full { justify-self: start; color: var(--smoke); font-size: .9rem; }
@media (min-width: 750px) { .quick { grid-template-columns: 300px 1fr; gap: 28px; } .sheet--quick .sheet__body { padding: 28px; } }

/* ---------- collection / search ---------- */
.plp { padding: clamp(28px, 5vw, 64px) var(--gutter) var(--section); max-width: 1680px; margin-inline: auto; }
.plp__head { display: grid; gap: 16px; margin-bottom: clamp(20px, 3vw, 40px); }
.plp__desc { color: var(--smoke); max-width: 62ch; }
.plp__search { max-width: 620px; }
.plp__results { display: block; transition: opacity .2s; }
.plp__results.is-busy { opacity: .4; pointer-events: none; }
.toolbar { transition: top .35s var(--ease); }
html.header-hidden .toolbar { top: 0; }
.toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; margin-bottom: 18px; border-block: 1px solid var(--ash); position: sticky; top: var(--header-h); z-index: 5; background: #000; }
.toolbar__count { color: var(--smoke); font-size: .9rem; }
.toolbar__tools { display: flex; align-items: center; gap: 10px; }
.density { display: flex; }
.density .icon-btn { width: 38px; height: 38px; color: var(--smoke); }
.density .icon-btn[aria-pressed="true"] { color: var(--cotton); }
.density .icon { width: 19px; height: 19px; }
.chips:where(:not(.bf26 *, .bf26h *)) { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 22px; }
.chip:where(:not(.bf26 *, .bf26h *)) { display: inline-flex; align-items: center; gap: 6px; padding: 6px 8px 6px 14px; border-radius: 99px; background: var(--cotton); color: #000; font-size: .85rem; font-weight: 600; }
.chip:where(:not(.bf26 *, .bf26h *)) .icon { width: 14px; height: 14px; }
.chips:where(:not(.bf26 *, .bf26h *)) .link { font-size: .85rem; color: var(--smoke); margin-left: 6px; }
.facets { display: block; }
.facets .acc:first-child { border-top: 0; }
.facets__list { display: grid; gap: 2px; }
.facets__list--pills { display: flex; flex-wrap: wrap; gap: 8px; }
.check { position: relative; display: flex; align-items: center; gap: 12px; padding: 8px 0; font-size: .98rem; cursor: pointer; }
.check span::before { content: ""; display: inline-block; vertical-align: -3px; width: 18px; height: 18px; margin-right: 12px; border: 1.5px solid color-mix(in srgb, var(--cotton) 45%, transparent); border-radius: 5px; transition: background .15s, border-color .15s; }
.check input[type="radio"] + span::before { border-radius: 50%; }
.check input:checked + span::before { background: var(--cotton); border-color: var(--cotton); box-shadow: inset 0 0 0 3.5px var(--coal); }
.check input:focus-visible + span { outline: 2px solid var(--tint); outline-offset: 3px; }
.check small { color: var(--smoke); margin-left: 4px; }
.check[data-empty] { opacity: .35; }
.facets__price { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.empty { display: grid; gap: 14px; justify-items: start; padding: clamp(40px, 8vw, 96px) 0; }
.more { display: grid; justify-items: center; gap: 14px; margin-top: clamp(40px, 6vw, 80px); }
.more__count { color: var(--smoke); font-size: .9rem; }
.more__track { width: min(260px, 60%); }
.more__prev { color: var(--smoke); font-size: .88rem; }

/* ---------- pages ---------- */
.page { max-width: calc(900px + var(--gutter) * 2); }
.page__body { margin-top: clamp(24px, 4vw, 48px); font-size: 1.05rem; color: color-mix(in srgb, var(--cotton) 88%, transparent); }
.page__hero { border-radius: 22px; margin-top: 28px; }
.index--page { padding-bottom: var(--section); }
.contact { display: grid; gap: 32px; max-width: calc(1100px + var(--gutter) * 2); }
.contact__copy { display: grid; gap: 16px; align-content: start; }
.contact__copy .rte { color: var(--smoke); }
.contact__form { display: grid; gap: 16px; justify-items: stretch; }
.contact__form .btn { justify-self: start; }
@media (min-width: 990px) { .contact { grid-template-columns: 1fr 1.2fr; gap: 72px; } }
.lost { display: grid; gap: 18px; justify-items: start; min-height: 70svh; align-content: center; }
.lost__code { font-family: var(--display); font-weight: 100; font-stretch: 150%; font-size: clamp(5rem, 24vw, 20rem); line-height: .8; color: var(--ash); animation: heavy 2.4s var(--ease) both; }
.posts { display: grid; gap: 40px var(--gap); margin-top: 32px; }
.post { display: grid; gap: 8px; align-content: start; }
.post img { border-radius: 14px; aspect-ratio: 3/2; object-fit: cover; }
@media (min-width: 750px) { .posts { grid-template-columns: 1fr 1fr; } }

/* ---------- footer ---------- */
.footer { margin-top: var(--section); border-top: 1px solid var(--ash); padding: clamp(36px, 6vw, 80px) var(--gutter) 28px; }
.footer__big { font-family: var(--display); font-weight: 900; font-stretch: 118%; text-transform: lowercase; font-size: clamp(2rem, 1rem + 5.4vw, 6rem); line-height: .92; letter-spacing: -.02em; max-width: 16ch; text-wrap: balance; }
.footer__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 36px 24px; margin-top: clamp(36px, 6vw, 72px); }
.footer__col--text { grid-column: 1 / -1; }
.footer__title { color: var(--smoke); font-size: .88rem; margin-bottom: 12px; }
.footer__col ul { display: grid; gap: 8px; }
.footer__col a:hover { text-decoration: underline; text-underline-offset: 4px; }
.footer__col .rte { max-width: 44ch; color: color-mix(in srgb, var(--cotton) 80%, transparent); }
.locale .field { min-height: 44px; font-size: .9rem; }
.footer__base { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 28px; margin-top: clamp(36px, 6vw, 72px); padding-top: 22px; border-top: 1px solid var(--ash); color: var(--smoke); font-size: .85rem; }
.footer__small { max-width: 62ch; flex: 1 1 320px; }
.footer__pay { display: flex; flex-wrap: wrap; gap: 6px; }
.pay { width: 38px; height: 24px; }
@media (min-width: 990px) { .footer__grid { grid-template-columns: 1.6fr 1fr 1fr 1.1fr; } .footer__col--text { grid-column: auto; } }

/* ---------- toast ---------- */
.toast { position: fixed; z-index: 90; left: 50%; bottom: 24px; translate: -50% 0; max-width: min(92vw, 440px); padding: 12px 20px; border-radius: 99px; background: var(--cotton); color: #000; font-weight: 600; font-size: .92rem; box-shadow: 0 10px 40px #000a; animation: rise .3s var(--ease); }

/* product pages get room at the bottom for the buy bar */
.t-product main { padding-bottom: 8px; }


/* =====================================================================
   v2: motion and hand-made details.
   Everything below degrades to a still page: no JavaScript, or a visitor
   who asks for less motion, simply gets the final state.
   ===================================================================== */
:root { --hand: "Artie Hand", "Bradley Hand", "Segoe Print", cursive; interpolate-size: allow-keywords; }

/* marker notes */
.note:where(:not(.bf26 *, .bf26h *)) { display: inline-flex; align-items: flex-start; gap: 8px; font-family: var(--hand); font-size: clamp(1.5rem, 1.15rem + 1.1vw, 2.1rem); line-height: .95; color: var(--lamp); rotate: -3deg; }
.note--down-left, .note--down-right, .note--down { flex-direction: column; }
.note--down .note__arrow { margin-left: 22%; }
.note--down-left .note__arrow { margin-left: 8%; }
.note--down-right .note__arrow { align-self: flex-end; margin-right: -6%; }
.note--right { align-items: center; }
.note--up-left { flex-direction: row-reverse; align-items: flex-end; rotate: 2deg; }
.note__text { transition: opacity .45s, translate .45s var(--ease); }
.note__arrow { flex: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.note__arrow path { stroke-dasharray: 1; stroke-dashoffset: 0; transition: stroke-dashoffset .6s .3s ease-out; }
.note__arrow path + path { transition-duration: .3s; transition-delay: .85s; }
.js .note:where(:not(.bf26 *, .bf26h *)):not(.is-seen) .note__text { opacity: 0; translate: 0 8px; }
.js .note:where(:not(.bf26 *, .bf26h *)):not(.is-seen) .note__arrow path { stroke-dashoffset: 1; }

/* headings put on weight as they scroll in, line by line */
[data-weigh] .ln { display: block; white-space: nowrap; }
.is-weighing .ln { font-weight: calc(180 + var(--k, 1) * 620); opacity: calc(.25 + var(--k, 1) * .75); }

/* hero: the film shrinks into a frame while the headline drifts up */
.hero__media { transform-origin: 50% 38%; transform: scale(calc(1 - var(--p, 0) * .05)); clip-path: inset(calc(var(--p, 0) * 10%) calc(var(--p, 0) * 5%) calc(var(--p, 0) * 2%) round calc(var(--p, 0) * 64px)); }
.hero__title { translate: 0 calc(var(--p, 0) * -16vh); }
.hero__side { translate: 0 calc(var(--p, 0) * -6vh); opacity: calc(1 - var(--p, 0) * 2); }
.sticker { position: absolute; z-index: 3; right: var(--gutter); top: calc(var(--header-h) + 78px); width: clamp(94px, 11vw, 160px); aspect-ratio: 1; rotate: calc(-12deg + var(--p, 0) * 240deg); animation: slap .55s 1.5s cubic-bezier(.2, 1.5, .4, 1) both; filter: drop-shadow(0 10px 24px #0008); }
.sticker__ring { width: 100%; height: 100%; animation: spin 24s linear infinite; }
.sticker__star { position: absolute; inset: 0; margin: auto; width: 26%; height: 26%; animation: spin 24s linear infinite reverse; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes slap { from { transform: scale(1.9) rotate(-25deg); opacity: 0; } }

/* tape band */
.tape-wrap { overflow: clip; margin-top: var(--section); padding: clamp(20px, 3vw, 44px) 0; }
.tape { display: block; width: 106vw; margin-left: -3vw; padding: clamp(11px, 1.5vw, 20px) 0; background: var(--lamp); color: #000; overflow: hidden; }
.tape--left { rotate: -1.7deg; }
.tape--right { rotate: 1.7deg; }
.tape__track { display: flex; width: max-content; will-change: transform; }
.tape__group { display: flex; flex: none; align-items: center; gap: clamp(18px, 3vw, 44px); padding-right: clamp(18px, 3vw, 44px); }
.tape__item { font-family: var(--display); font-weight: 850; font-stretch: 116%; font-size: clamp(1.2rem, .8rem + 2.3vw, 2.6rem); line-height: 1; text-transform: lowercase; white-space: nowrap; }
.tape__star { flex: none; width: clamp(15px, 2.2vw, 30px); height: auto; }

/* the line-up */
html.is-driven { scroll-behavior: auto !important; }
.lineup { position: relative; margin-top: clamp(24px, 4vw, 56px); }
.lineup__stage { position: relative; height: min(92svh, 940px); overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
.lineup__stage::-webkit-scrollbar { display: none; }
.lineup.is-pinned .lineup__stage { position: sticky; top: 0; height: 100svh; overflow: hidden; touch-action: pan-y; }
.lineup__wall { position: absolute; inset: 0; background: repeating-linear-gradient(to bottom, transparent 0 calc(8.5svh - 1px), color-mix(in srgb, var(--cotton) 14%, transparent) calc(8.5svh - 1px) 8.5svh); -webkit-mask-image: linear-gradient(to bottom, transparent 4%, #000 20%, #000 80%, transparent 80.5%); mask-image: linear-gradient(to bottom, transparent 4%, #000 20%, #000 80%, transparent 80.5%); }
.lineup__title { position: absolute; left: var(--gutter); top: 13svh; margin: 0; font-family: var(--display); font-weight: 900; font-stretch: 125%; font-size: clamp(5.5rem, 31svh, 23rem); line-height: .8; letter-spacing: -.02em; text-transform: lowercase; white-space: nowrap; will-change: transform; }
.lineup__hint { position: absolute; z-index: 3; left: var(--gutter); top: 50svh; max-width: 56vw; opacity: calc(1 - var(--p, 0) * 6); pointer-events: none; }
.lineup__hint .note:where(:not(.bf26 *, .bf26h *)) { flex-wrap: wrap; }
.lineup__track { position: relative; z-index: 2; display: flex; align-items: flex-end; gap: clamp(20px, 6vw, 120px); width: max-content; height: 100%; padding: 0 22vw 5svh 64vw; will-change: transform; }
.suspect { position: relative; display: grid; justify-items: center; flex: none; }
.suspect__img { height: 61svh; width: auto; max-width: none; transition: translate .5s var(--ease), scale .5s var(--ease); transform-origin: 50% 100%; }
.suspect__card { position: relative; z-index: 2; display: grid; gap: 3px; width: max-content; max-width: min(280px, 72vw); margin-top: -3.5svh; padding: 11px 16px 12px; background: var(--cotton); color: #000; border-radius: 3px; rotate: -2.2deg; box-shadow: 0 12px 30px #000a; transition: rotate .4s var(--ease), translate .4s var(--ease); }
.suspect:nth-child(even) .suspect__card { rotate: 1.8deg; }
.suspect:nth-child(3n) .suspect__card { rotate: -1deg; }
.suspect__no { font-family: var(--hand); font-size: 1.15rem; line-height: 1; opacity: .7; }
.suspect__name { font-family: var(--display); font-weight: 850; font-stretch: 110%; font-size: 1rem; line-height: 1.05; }
.suspect__charge { font-family: var(--hand); font-size: 1.4rem; line-height: .95; }
.suspect__price { font-weight: 700; font-size: .92rem; font-variant-numeric: tabular-nums; }
@media (hover: hover) {
  .suspect:hover .suspect__img { translate: 0 -1.4svh; scale: 1.025; }
  .suspect:hover .suspect__card { rotate: 0deg; translate: 0 -4px; }
}
.lineup__end { align-self: flex-end; display: grid; gap: 16px; justify-items: start; margin-bottom: 22svh; }
.lineup__end .icon { width: 64px; height: 64px; padding: 16px; border: 1.5px solid var(--cotton); border-radius: 50%; transition: background .25s, color .25s, translate .35s var(--ease); }
.lineup__end:hover .icon { background: var(--cotton); color: #000; translate: 10px 0; }
.lineup__bar { position: absolute; z-index: 3; left: var(--gutter); right: var(--gutter); bottom: 16px; height: 2px; background: var(--ash); display: none; }
.lineup.is-pinned .lineup__bar { display: block; }
.lineup__bar span { display: block; height: 100%; background: var(--lamp); transform-origin: left; transform: scaleX(var(--p, 0)); }
@media (max-width: 749px) {
  .suspect__img { height: 54svh; }
  .lineup__track { padding-left: 52vw; gap: 14px; }
  /* the film ends at the fold even with the announcement bar above it, and its buttons stop above the chat bubble */
  .hero:where(:not(.bf26 *, .bf26h *)) { min-height: calc(100svh - 36px); }
  .hero__content { padding-bottom: 88px; }
}

/* colour wall + fit builder notes */
.wall__note { margin: 4px 0 -6px 4%; }
}

/* product cards: figures stand up from the floor the first time they are seen */
.card__img { transition-delay: calc(var(--n, 0) * 75ms); }
.js .card:where(:not(.bf26 *, .bf26h *)):not(.is-in) .card__media .card__img { transform: translateY(16%); opacity: 0; }
.js .card:where(:not(.bf26 *, .bf26h *)):not(.is-in) .card__info { opacity: 0; }
.card__info { transition: opacity .5s calc(var(--n, 0) * 75ms + 150ms); }

/* category index: the photo follows the pointer on desktop, the centred row lights up on touch */
@media (hover: hover) and (min-width: 750px) {
  .index__img { right: auto; left: 0; top: 0; translate: calc(var(--x, 60vw) + 30px) calc(var(--y, 0px) - 50%); transition: opacity .25s, scale .35s var(--ease), rotate .35s var(--ease), translate .2s ease-out; }
}
@media not ((hover: hover) and (min-width: 750px)) {
  .index__list.is-live .index__row { color: color-mix(in srgb, var(--cotton) 42%, transparent); transition: color .3s; }
  .index__list.is-live .index__row.is-active { color: var(--cotton); }
  .index__row.is-active .index__name { font-weight: 900; }
  .index__count { display: none; }
  .index__name { overflow-wrap: normal; font-size: clamp(1.5rem, 7.6vw, 3rem); font-weight: 700; transition: font-weight .35s var(--ease); }
  .index__img { transition: scale .4s var(--ease), rotate .4s var(--ease); }
  .index__row.is-active .index__img { scale: 1.5; rotate: -5deg; }
}

/* product page: fabric weight read-out */
.weighin { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 20px; padding-top: 8px; }
.weighin__num { font-family: var(--display); font-weight: var(--w, 900); font-stretch: 122%; font-size: clamp(3.6rem, 9vw, 6.2rem); line-height: .78; letter-spacing: -.02em; font-variant-numeric: tabular-nums; color: var(--tint); transition: color .5s; }
.weighin__unit { font-size: .42em; margin-left: .05em; }
.weighin__note .note:where(:not(.bf26 *, .bf26h *)) { font-size: 1.5rem; }
.weighin__note .note__arrow { width: 54px; height: auto; }

/* fold-outs open smoothly where the browser can do it */
.acc::details-content { block-size: 0; overflow: clip; transition: block-size .4s var(--ease), content-visibility .4s allow-discrete; }
.acc[open]::details-content { block-size: auto; }

/* small reactions */
.header__logo img { transition: rotate .9s var(--ease); }
.header__logo:hover img { rotate: 360deg; }
.header__cart.is-bump { animation: bump .5s var(--ease); }
.header__cart.is-bump .header__count { animation: bump .5s .1s var(--ease); }
@keyframes bump { 35% { transform: scale(1.35) rotate(-8deg); } 70% { transform: scale(.94); } }
.wall__img { transition: opacity .2s; }
.wall__img.is-swapping { opacity: .6; }

/* the photo you clicked travels to the product page (browsers with cross-page view transitions) */
.t-product .gallery__slide:first-child img { view-transition-name: product-media; }
::view-transition-group(product-media) { animation-duration: .45s; animation-timing-function: cubic-bezier(.2, .7, .2, 1); }

@media (prefers-reduced-motion: reduce) {
  .sticker, .sticker__ring, .sticker__star { animation: none; }
  .hero__media { transform: none; clip-path: none; }
}

/* ---------- pages: help desk, contact, bulk, about ---------- */
.page__lede { margin-top: 18px; max-width: 56ch; }
.page--medium { max-width: calc(1100px + var(--gutter) * 2); }
.page--wide { max-width: 1680px; }
faq-desk, recent-rail, contact-topics { display: block; }

/* help desk */
.desk { max-width: calc(900px + var(--gutter) * 2); padding-top: clamp(20px, 3vw, 36px); }
.desk__top { display: grid; gap: 18px; justify-items: start; }
.desk__search { display: flex; align-items: center; gap: 12px; width: min(100%, 560px); padding: 2px 22px; border: 1.5px solid color-mix(in srgb, var(--cotton) 30%, transparent); border-radius: 99px; transition: border-color .2s; }
.desk__search:focus-within { border-color: var(--lamp); }
.desk__search .icon { flex: none; width: 20px; height: 20px; color: var(--smoke); }
.desk__search input { flex: 1; min-width: 0; padding: 15px 0; background: none; border: 0; outline: 0; color: inherit; font: inherit; font-size: 1.05rem; }
.desk__search input::placeholder { color: var(--smoke); }
.desk__search input::-webkit-search-cancel-button { filter: invert(1); }
.desk__note { margin: -4px 0 0 12%; }
.desk__group { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px; margin: clamp(40px, 7vw, 84px) 0 8px; font-family: var(--display); font-weight: 900; font-stretch: 122%; font-size: clamp(1.9rem, 1rem + 4vw, 4rem); line-height: .92; letter-spacing: -.02em; text-transform: lowercase; }
.desk__group small { font-family: var(--hand); font-weight: 400; font-stretch: 100%; font-size: clamp(1.4rem, 1.1rem + 1vw, 1.9rem); line-height: 1; letter-spacing: 0; text-transform: none; color: var(--lamp); rotate: -2deg; }
.desk__q { border-bottom: 1px solid var(--ash); }
.desk__q summary { display: grid; grid-template-columns: 2.2em minmax(0, 1fr) auto; align-items: baseline; gap: 10px; padding: 20px 0; cursor: pointer; list-style: none; }
.desk__q summary::-webkit-details-marker { display: none; }
.desk__n { font-size: .8rem; font-variant-numeric: tabular-nums; color: var(--smoke); }
.desk__ask { font-weight: 600; font-size: clamp(1.05rem, 1rem + .45vw, 1.3rem); line-height: 1.25; }
.desk__q summary .icon { align-self: center; width: 18px; height: 18px; transition: transform .3s var(--ease); }
.desk__q[open] summary .icon { transform: rotate(45deg); }
.desk__a { display: grid; gap: 14px; padding: 2px 0 30px calc(2.2em + 10px); max-width: 74ch; }
.desk__short { font-family: var(--display); font-weight: 850; font-stretch: 114%; font-size: clamp(1.5rem, 1rem + 2.3vw, 2.7rem); line-height: 1; letter-spacing: -.015em; text-transform: lowercase; text-wrap: balance; color: var(--lamp); }
.desk__q[open] .desk__short { animation: gain .7s var(--ease) both; }
@keyframes gain { from { font-weight: 150; opacity: .35; } to { font-weight: 850; opacity: 1; } }
.desk__a .rte { color: color-mix(in srgb, var(--cotton) 84%, transparent); }
.desk__q::details-content { block-size: 0; overflow: clip; transition: block-size .4s var(--ease), content-visibility .4s allow-discrete; }
.desk__q[open]::details-content { block-size: auto; }
.desk__none { margin-top: 28px; font-size: 1.1rem; color: var(--smoke); }
.desk__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 28px; margin-top: clamp(40px, 7vw, 84px); padding: clamp(24px, 4vw, 44px); background: var(--lamp); color: #000; rotate: -.6deg; }
.desk__foot-title { font-family: var(--display); font-weight: 900; font-stretch: 120%; font-size: clamp(1.6rem, 1rem + 3vw, 3.2rem); line-height: .95; letter-spacing: -.02em; text-transform: lowercase; }
@media (max-width: 749px) {
  .desk__q summary { grid-template-columns: minmax(0, 1fr) auto; }
  .desk__n { display: none; }
  .desk__a { padding-left: 0; }
}

/* contact */
.contact__ways { display: grid; gap: 0; margin: 6px 0 0; border-top: 1px solid var(--ash); }
.contact__ways > div { display: grid; grid-template-columns: 7.5em minmax(0, 1fr); gap: 12px; align-items: baseline; padding: 14px 0; border-bottom: 1px solid var(--ash); }
.contact__ways dt { font-family: var(--hand); font-size: 1.35rem; line-height: 1; color: var(--lamp); }
.contact__ways dd { margin: 0; overflow-wrap: anywhere; }
.contact__ways a { text-decoration: underline; text-underline-offset: 3px; }
.contact__shorts { display: grid; gap: 0; margin-top: 18px; }
.contact__shorts-title { margin-bottom: 6px; font-size: .86rem; color: var(--smoke); }
.contact__short { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--ash); transition: padding .3s var(--ease), color .2s; }
.contact__short span { display: grid; gap: 2px; color: var(--smoke); font-size: .95rem; }
.contact__short strong { color: var(--cotton); font-weight: 600; font-size: 1.02rem; }
.contact__short .icon { flex: none; width: 20px; height: 20px; transition: translate .3s var(--ease); }
@media (hover: hover) { .contact__short:hover { padding-left: 10px; } .contact__short:hover .icon { translate: 6px 0; } }
.contact__form fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.contact__form legend, .contact__form label { display: grid; gap: 8px; font-size: .9rem; color: var(--smoke); }
.contact__form legend { padding: 0; margin-bottom: 8px; }
.contact__form label.pill:where(:not(.bf26 *, .bf26h *)) { display: inline-block; color: inherit; }
.contact__pills { display: flex; flex-wrap: wrap; gap: 8px; }
.contact__row { display: grid; gap: 16px; }
.contact__send { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; }
.contact__send .note:where(:not(.bf26 *, .bf26h *)) { font-size: clamp(1.3rem, 1.1rem + .6vw, 1.6rem); }
.contact__form [hidden] { display: none; }
@media (min-width: 750px) { .contact__row { grid-template-columns: 1fr 1fr; } }

/* doors */
.doors { display: grid; gap: clamp(18px, 3vw, 32px); }
.doors__grid { display: grid; gap: var(--gap); }
.door { display: grid; gap: 12px; align-content: start; padding: clamp(22px, 3vw, 38px); border: 1px solid var(--ash); background: var(--coal); transition: border-color .25s, translate .35s var(--ease); }
.door__tag { font-family: var(--hand); font-size: 1.5rem; line-height: 1; color: var(--lamp); rotate: -2deg; justify-self: start; }
.door__title { font-family: var(--display); font-weight: 850; font-stretch: 116%; font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.3rem); line-height: .98; letter-spacing: -.015em; text-transform: lowercase; text-wrap: balance; }
.door__text { color: color-mix(in srgb, var(--cotton) 78%, transparent); }
.door__link { justify-self: start; margin-top: 6px; }
@media (hover: hover) { .door:hover { border-color: color-mix(in srgb, var(--cotton) 60%, transparent); translate: 0 -4px; } }
@media (min-width: 990px) { .doors__grid { grid-auto-flow: column; grid-auto-columns: 1fr; } }

/* big list */
.biglist__head { display: grid; gap: 10px; margin-bottom: clamp(16px, 3vw, 36px); }
.biglist__note { margin-left: 6%; }
.biglist__list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--ash); }
.biglist__row { display: grid; grid-template-columns: 2.4em minmax(0, 1fr); gap: 6px 12px; align-items: baseline; padding: clamp(18px, 2.6vw, 34px) 0; border-bottom: 1px solid var(--ash); }
.biglist__n { font-size: .8rem; font-variant-numeric: tabular-nums; color: var(--smoke); }
.biglist__title { font-family: var(--display); font-weight: 850; font-stretch: 116%; font-size: clamp(1.7rem, 1rem + 3.6vw, 4rem); line-height: .96; letter-spacing: -.02em; text-transform: lowercase; }
.biglist__text { grid-column: 2; max-width: 54ch; color: var(--smoke); font-size: 1.02rem; }
.biglist--strike .biglist__title span { background: linear-gradient(var(--lamp), var(--lamp)) no-repeat 0 58% / 0% .11em; transition: background-size .8s var(--ease) .15s; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.biglist--strike .biglist__row.is-seen .biglist__title span, html:not(.js) .biglist--strike .biglist__title span { background-size: 100% .11em; }
@media (min-width: 990px) {
  .biglist__row { grid-template-columns: 3em minmax(0, 1.25fr) minmax(0, 1fr); column-gap: 28px; }
  .biglist__text { grid-column: 3; align-self: center; }
}

/* figures */
.numbers { display: grid; gap: clamp(18px, 3vw, 32px); }
.numbers__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px var(--gap); margin: 0; padding: clamp(22px, 3vw, 40px) 0; list-style: none; border-block: 1px solid var(--ash); }
.numbers__n { font-family: var(--display); font-weight: var(--w, 900); font-stretch: 122%; font-size: clamp(2.5rem, 1rem + 4.6vw, 5.4rem); line-height: .8; letter-spacing: -.03em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.numbers__n small { font-size: .36em; margin-left: .06em; letter-spacing: 0; }
.numbers__label { margin-top: 12px; max-width: 22ch; color: var(--smoke); }
@media (min-width: 990px) { .numbers__list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* signature */
.sign { font-family: var(--hand); font-size: clamp(2rem, 1.4rem + 2vw, 3.2rem); line-height: 1; color: var(--lamp); rotate: -4deg; margin: 6px 0 4px 8px; }
.sign .note__text { display: inline-block; transition: opacity .5s, translate .5s var(--ease); }
.js .sign:not(.is-seen) .note__text { opacity: 0; translate: 0 8px; }

/* product page: delivery window + size finder small print */
.pdp__facts [data-eta] { color: var(--cotton); }
.summary__eta { font-size: .9rem; color: var(--cotton); }

/* Black Friday pages: same letters as the rest of the site, the lamp light stays theirs */
.bf26 h1, .bf26 h2, .bf26h h2, .bf26h h3 { font-family: var(--display); font-weight: 850; font-stretch: 114%; letter-spacing: -.02em; }

/* ---------- order tracking: the ParcelPanel app page, dressed like the rest ---------- */
.track-head__note { margin: 14px 0 0 8%; }
.track-foot { max-width: calc(1100px + var(--gutter) * 2); margin: 28px auto 0; padding-inline: var(--gutter); color: var(--smoke); }
.track-foot a { color: var(--cotton); text-decoration: underline; text-underline-offset: 3px; }
#pp-tracking-page-app { max-width: calc(1100px + var(--gutter) * 2) !important; margin: clamp(20px, 3vw, 36px) auto 0 !important; padding-inline: var(--gutter) !important; color: var(--cotton) !important; font-family: var(--body) !important; }
#pp-tracking-page-app :is(div, span, b, p, li, label, a, h1, h2, h3, input, button) { font-family: inherit !important; }
#pp-tracking-page-app :is(div, span, b, p, li, label, h1, h2, h3) { color: inherit; }
#pp-tracking-page-app .pp_tracking_title { display: none !important; }
#pp-tracking-page-app, #pp-tracking-page-app * { box-sizing: border-box; }
#pp-tracking-page-app .pp_tracking_content { width: 100% !important; max-width: 100% !important; padding: 0 !important; }
#pp-tracking-page-app button.pp-button-enter { max-width: 100%; }
#pp-tracking-page-app .pp_tracking_form_in { padding: clamp(18px, 3vw, 36px) !important; border: 1px solid var(--ash) !important; border-radius: 18px !important; background: var(--coal) !important; }
#pp-tracking-page-app .pp_tracking_form_in span { color: var(--smoke) !important; font-size: .9rem; }
#pp-tracking-page-app input { min-height: 48px; padding: 0 14px !important; background: transparent !important; color: var(--cotton) !important; border: 1.5px solid color-mix(in srgb, var(--cotton) 28%, transparent) !important; border-radius: 12px !important; box-shadow: none !important; font-size: 1rem !important; }
#pp-tracking-page-app input:focus { border-color: var(--cotton) !important; outline: 0; }
#pp-tracking-page-app button.pp-button-enter { min-height: 46px; padding: 0 26px !important; background: var(--cotton) !important; border: 0 !important; border-radius: 99px !important; text-transform: none !important; letter-spacing: 0 !important; }
#pp-tracking-page-app button.pp-button-enter, #pp-tracking-page-app button.pp-button-enter span { color: #000 !important; font-weight: 600 !important; font-size: .95rem !important; }
#pp-tracking-page-app .pp_tracking_line_center { border-color: var(--ash) !important; }
#pp-tracking-page-app .pp_tracking_word { background: var(--coal) !important; color: var(--smoke) !important; }
#pp-tracking-page-app .pp_tracking_tab_left span { color: var(--smoke) !important; }
#pp-tracking-page-app .pp_tracking_tab_left.pp_active { border-color: var(--lamp) !important; }
#pp-tracking-page-app .pp_tracking_tab_left.pp_active span { color: var(--cotton) !important; }
#pp-tracking-page-app :is(.pp_tracking_result_title, .pp_num_status_show) { font-family: var(--display) !important; font-weight: 850 !important; font-stretch: 114%; font-size: clamp(1.6rem, 1.1rem + 2vw, 2.8rem) !important; line-height: 1 !important; letter-spacing: -.02em; text-transform: lowercase; text-align: left !important; }
#pp-tracking-page-app :is(.pp_tracking_result_title, .pp_num_status_show) span { font-family: inherit !important; }
#pp-tracking-page-app :is(.line-back, .progress-bar-mobile-left) { background: var(--ash) !important; }
#pp-tracking-page-app :is(.line-front, .progress-bar-node--active, .progress-bar-mobile-node--active .progress-bar-mobile-node) { background: var(--lamp) !important; }
#pp-tracking-page-app .progress-bar-node:not(.progress-bar-node--active) { background: var(--ash) !important; }
#pp-tracking-page-app .text-wrapper span, #pp-tracking-page-app .timeline-item__timestamp, #pp-tracking-page-app .pp_tracking_info_title { color: var(--smoke) !important; }
#pp-tracking-page-app .timeline-item__wrapper { background: var(--coal) !important; border: 1px solid var(--ash) !important; border-radius: 12px !important; }
#pp-tracking-page-app .timeline-item__wrapper::before, #pp-tracking-page-app .timeline-item__wrapper::after { border-right-color: var(--ash) !important; }
#pp-tracking-page-app .timeline-item__content { color: var(--cotton) !important; }
#pp-tracking-page-app .timeline-item__badge { background-color: #000 !important; border-color: var(--smoke) !important; }
#pp-tracking-page-app .pp_timeline::before, #pp-tracking-page-app .timeline-item::before { background: var(--ash) !important; border-color: var(--ash) !important; }
#pp-tracking-page-app a { color: var(--cotton) !important; }
#pp-tracking-page-app .pp_tracking_carrier_img { background: var(--cotton) !important; border-radius: 8px; }
#pp-tracking-page-app .pp_tracking_product_picture { border-color: var(--ash) !important; }

/* ---------- policies (Shopify renders these itself) ---------- */
.shopify-policy__container { max-width: calc(760px + var(--gutter) * 2) !important; margin-inline: auto !important; padding: var(--section) var(--gutter) 0 !important; }
.shopify-policy__title { text-align: left !important; }
.shopify-policy__title h1 { font-family: var(--display); font-weight: 900; font-stretch: 118%; font-size: clamp(2.2rem, 1.2rem + 4.6vw, 5rem); line-height: .92; letter-spacing: -.02em; text-transform: lowercase; text-wrap: balance; }
.shopify-policy__body { margin-top: clamp(24px, 4vw, 48px); font-size: 1.05rem; color: color-mix(in srgb, var(--cotton) 88%, transparent); }

/* ---------- collab page: the Shopify Collabs block becomes the "apply" card ---------- */
.collabs-page { margin-top: clamp(8px, 2vw, 24px); }
.collabs-page :is(.collabs-page__header-logo, .collabs-page__images, .collabs-page__partnership) { display: none !important; }
.collabs-page .collabs-page__main { display: grid !important; justify-items: start; gap: 18px; max-width: none !important; padding: clamp(24px, 4vw, 48px) !important; background: var(--lamp) !important; color: #000 !important; rotate: -.6deg; text-align: left !important; }
.collabs-page .collabs-page__intro, .collabs-page .collabs-page__header, .collabs-page .collabs-page__cta { display: grid !important; justify-items: start !important; gap: 16px; margin: 0 !important; padding: 0 !important; text-align: left !important; }
.collabs-page h1 { margin: 0 !important; font-family: var(--display) !important; font-weight: 900 !important; font-stretch: 120%; font-size: clamp(1.8rem, 1rem + 3.4vw, 3.6rem) !important; line-height: .95 !important; letter-spacing: -.02em; text-transform: lowercase; color: #000 !important; text-align: left !important; }
.collabs-page .collabs-page__intro > p:empty { display: none; }
.collabs-page a.collabs-page__cta-main { display: inline-flex !important; align-items: center; min-height: 52px; padding: 0 30px !important; background: #000 !important; color: var(--cotton) !important; border-radius: 99px !important; font-weight: 600 !important; font-size: 1rem !important; text-decoration: none !important; }
.collabs-page .collabs-page__cta-login-section { display: flex !important; gap: 8px; align-items: baseline; margin: 0 !important; }
.collabs-page .collabs-page__cta-login-section p { margin: 0 !important; color: #000 !important; }
.collabs-page a.collabs-page__cta-login-link { color: #000 !important; text-decoration: underline !important; text-underline-offset: 3px; }
@media (max-width: 749px) { #pp-tracking-page-app .progress-bar-node .icon-svg, #pp-tracking-page-app .progress-bar-mobile-style .icon-svg { display: none !important; } }
.collabs-page .collabs-page__header, .collabs-page .collabs-page__intro { width: 100% !important; max-width: 100% !important; min-width: 0 !important; }
.collabs-page h1 { width: auto !important; max-width: 100% !important; white-space: normal !important; overflow-wrap: anywhere; }
