:root {
  --bg: #faf9f6;
  --tint: #f3f2ee;
  --tile: #efefef;
  --ink: #1c1c1c;
  --muted: rgba(28, 28, 28, .64);
  --line: rgba(28, 28, 28, .14);
  --accent: #6f2626;
  --accent-dk: #471818;
  --on-dk: #f6f1ec;
  --f: 'Figtree', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --wrap: 1440px;
  --pad: 32px;
  --hdr: 64px;
  --ease: cubic-bezier(.2, .6, .2, 1);
}
@media (max-width: 799px) { :root { --pad: 16px; --hdr: 56px; } }
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--hdr) + 16px); }
body { margin: 0; background: var(--bg); color: var(--ink); font: 400 14px/1.7 var(--f); letter-spacing: .02em; -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; color: inherit; letter-spacing: inherit; }
button { background: none; border: 0; padding: 0; cursor: pointer; }
h1, h2, h3, p { margin: 0; font-weight: 400; }
ul { list-style: none; margin: 0; padding: 0; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: -9999px; top: 8px; z-index: 100; background: var(--ink); color: #fff; padding: 8px 14px; }
.skip:focus { left: 8px; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--pad); }
.wrap--narrow { max-width: 760px; }
.eyebrow { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.link { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; font-size: 13px; }
.lbl { font-size: 13px; margin-bottom: 10px; }
.lbl span { color: var(--muted); }
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 34px; font-size: 13px; letter-spacing: .08em; border: 1px solid transparent; transition: background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease); }
.btn--accent { background: var(--accent); color: #fff; }
.btn--accent:hover { background: var(--accent-dk); }
.btn--accent[disabled] { background: #b9adaa; cursor: not-allowed; }
.btn--line { border-color: currentColor; }
.btn--line:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.btn--light { background: var(--on-dk); color: var(--accent-dk); }
.btn--light:hover { background: #fff; }
.btn--ghost { border-color: var(--line); }
.btn--block { width: 100%; }
.concept { background: #ecebe6; color: var(--muted); font-size: 11px; letter-spacing: .03em; text-align: center; padding: 6px 16px; line-height: 1.4; }
.concept a { text-decoration: underline; text-underline-offset: 3px; color: var(--ink); white-space: nowrap; }
@media (max-width: 599px) { .concept span { display: none; } .concept::before { content: 'Concept by ODL · '; } }
.ann { background: var(--accent); color: #fff; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
@media (max-width: 599px) { .ann { font-size: 10px; letter-spacing: .08em; } }
.ann__in { position: relative; height: 34px; overflow: hidden; }
.ann__msg { position: absolute; inset: 0; display: grid; place-items: center; opacity: 0; transition: opacity .6s var(--ease); padding: 0 16px; text-align: center; }
.ann__msg.is-on { opacity: 1; }
.hdr { position: sticky; top: 0; z-index: 40; background: var(--bg); border-bottom: 1px solid transparent; transition: background .3s var(--ease), border-color .3s var(--ease); }
.hdr.is-solid { border-color: var(--line); }
.hdr--over { margin-bottom: calc(-1 * var(--hdr)); background: transparent; }
.hdr--over.is-solid, .hdr--over:hover, .hdr--over:focus-within { background: var(--bg); }
.hdr__in { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--pad); height: var(--hdr); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 40px; }
.hdr__logo img { width: 118px; height: auto; }
.hdr__burger { display: none; width: 28px; height: 28px; position: relative; }
.hdr__burger span { position: absolute; left: 3px; right: 3px; height: 1px; background: currentColor; }
.hdr__burger span:first-child { top: 10px; } .hdr__burger span:last-child { top: 17px; }
.hdr__icons { display: flex; align-items: center; gap: 18px; }
.hdr__icon { width: 22px; height: 22px; display: grid; place-items: center; }
.hdr__icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.3; }
.hdr__bag { font-size: 13px; white-space: nowrap; }
.nav__list { display: flex; gap: 30px; }
.nav__link { font-size: 13px; padding: 20px 0; display: inline-block; position: relative; }
.nav__link::after { content: ''; position: absolute; left: 0; right: 0; bottom: 14px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .3s var(--ease); }
.nav__link:hover::after, .nav__link[aria-current]::after, .nav__link[aria-expanded="true"]::after { transform: scaleX(1); }
.mega { position: absolute; left: 0; right: 0; top: 100%; background: var(--bg); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); opacity: 0; visibility: hidden; transition: opacity .25s var(--ease), visibility .25s; }
.has-mega.is-open .mega { opacity: 1; visibility: visible; }
.mega__in { max-width: var(--wrap); margin: 0 auto; padding: 28px var(--pad) 36px; display: grid; grid-template-columns: 220px 1fr; gap: 40px; }
.mega__list a { display: block; font-size: 14px; padding: 5px 0; }
.mega__list a:hover { text-decoration: underline; text-underline-offset: 4px; }
.mega__tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 220px)); gap: 6px; }
.mega__tile { background: var(--tile); }
.mega__tile img { aspect-ratio: 3/4; object-fit: cover; object-position: top; width: 100%; }
.mega__tile span { display: block; font-size: 13px; padding: 8px 0 0; background: var(--bg); }
@media (max-width: 999px) {
  .nav { display: none; }
  .hdr__in { grid-template-columns: 1fr auto 1fr; gap: 12px; }
  .hdr__burger { display: block; }
  .hdr__logo { justify-self: center; }
  .hdr__logo img { width: 104px; }
  .hdr__icons { justify-self: end; gap: 14px; }
  .hdr__acc { display: none; }
}
.menu { position: fixed; inset: 0; z-index: 70; background: rgba(28, 28, 28, .3); }
.menu__panel { position: absolute; inset: 0 auto 0 0; width: min(420px, 100%); background: var(--bg); padding: 16px 20px 28px; overflow-y: auto; transform: translateX(-100%); transition: transform .35s var(--ease); display: flex; flex-direction: column; }
.menu.is-open .menu__panel { transform: none; }
.menu__top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 28px; }
.menu__list a { display: block; font-size: 20px; padding: 7px 0; }
.menu__list--sub a { font-size: 16px; padding: 5px 0; color: var(--muted); }
.menu__h { margin-top: 24px; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.menu__foot { margin-top: auto; padding-top: 28px; display: grid; gap: 6px; font-size: 13px; color: var(--muted); }
.x { width: 40px; height: 40px; position: relative; flex: none; }
.x::before, .x::after { content: ''; position: absolute; left: 11px; right: 11px; top: 50%; height: 1px; background: currentColor; transform: rotate(45deg); }
.x::after { transform: rotate(-45deg); }
.hero { position: relative; }
.hero__media { display: grid; grid-template-columns: 1fr 1fr; height: calc(100svh - 60px); min-height: 560px; max-height: 1000px; }
.hero__media { grid-template-rows: minmax(0, 1fr); overflow: hidden; }
.hero__media > picture { display: block; height: 100%; min-height: 0; overflow: hidden; }
.hero__media img { width: 100%; height: 100%; object-fit: cover; }
.hero__a img { object-position: 50% 40%; }
.hero__b img { object-position: 50% 20%; }
.hero__txt { position: absolute; left: var(--pad); bottom: 48px; max-width: min(460px, 42vw); display: grid; gap: 14px; justify-items: start; padding: 26px 28px 28px; background: rgba(250, 249, 246, .9); backdrop-filter: blur(6px); }
.hero__h { font-size: clamp(24px, 2.4vw, 34px); line-height: 1.22; letter-spacing: 0; font-weight: 300; }
@media (max-width: 799px) {
  .hero__media { grid-template-columns: 1fr; height: 76svh; min-height: 480px; }
  .hero__media > .hero__b { display: none; }
  .hero__a img { object-position: 60% 35%; }
  .hero__txt { position: static; max-width: none; background: none; backdrop-filter: none; padding: 26px var(--pad) 6px; }
}
.sec { padding: 72px 0; }
.sec--tint { background: var(--tint); }
.sh { text-align: center; margin: 0 auto 34px; max-width: 640px; display: grid; gap: 10px; }
.sh__t { font-size: clamp(20px, 1.9vw, 26px); line-height: 1.3; letter-spacing: .01em; }
.sh__t--it { font-style: italic; font-weight: 300; }
.sh__t--c { text-align: center; margin-bottom: 26px; }
.sh__s { color: var(--muted); font-size: 14px; }
.va { display: flex; justify-content: center; margin-top: 36px; }
@media (max-width: 799px) { .sec { padding: 52px 0; } }
.grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 44px 6px; }
@media (max-width: 999px) { .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 4px; } }
.card { display: flex; flex-direction: column; }
.card[hidden] { display: none; }
.card__media { position: relative; display: block; background: var(--tile); aspect-ratio: 2/3; overflow: hidden; }
.card__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: opacity .5s var(--ease), transform 1.2s var(--ease); }
.card__img--2 { opacity: 0; }
@media (hover: hover) { .card:hover .card__img--2 { opacity: 1; } .card:hover .card__img:first-child { transform: scale(1.015); } }
.card__flag { position: absolute; left: 10px; top: 10px; font-size: 11px; letter-spacing: .06em; background: var(--bg); padding: 3px 9px; }
.card__sw { display: flex; align-items: center; gap: 4px; height: 14px; margin: 10px 0 6px; padding: 0 2px; }
.sw { width: 10px; height: 10px; background: var(--c); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12); position: relative; }
.sw.is-on { outline: 1px solid var(--ink); outline-offset: 2px; }
.sw-more { font-size: 11px; color: var(--muted); margin-left: 4px; }
.card__name { font-size: 13px; line-height: 1.45; padding: 0 2px; }
.card__price { font-size: 13px; padding: 2px 2px 0; }
.price--was { color: var(--muted); font-size: 12px; margin-left: 4px; }
.card[data-avail="0"] .card__img { filter: opacity(.72); }
.card[data-avail="0"] .card__img--2 { filter: sepia(.06) opacity(.72); }
.rail { display: grid; gap: 6px; position: relative; }
.rail > *, .card { position: relative; }
.rail--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.rail--6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
@media (max-width: 999px) {
  .rail { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--pad); margin: 0 calc(-1 * var(--pad)); padding: 0 var(--pad); scrollbar-width: none; }
  .rail::-webkit-scrollbar { display: none; }
  .rail > * { flex: 0 0 auto; scroll-snap-align: start; }
  .rail--4 > * { width: 78vw; } .rail--6 > * { width: 42vw; }
}
.story { display: grid; gap: 10px; align-content: start; }
.story__img { aspect-ratio: 4/5; object-fit: cover; width: 100%; background: var(--tile); margin-bottom: 8px; }
.story__p { color: var(--muted); font-size: 14px; }
.story .link { justify-self: start; }
.cat { display: block; }
.cat__img { aspect-ratio: 2/3; object-fit: cover; width: 100%; background: var(--tile); }
.cat__t { display: block; font-size: 13px; padding-top: 10px; }
.cat:hover .cat__t { text-decoration: underline; text-underline-offset: 4px; }
.feat { background: var(--accent-dk); color: var(--on-dk); }
.feat__in { display: grid; grid-template-columns: 1fr 1fr; gap: 0; padding: 0; max-width: none; }
.feat__img img { width: 100%; height: 100%; aspect-ratio: 4/5; object-fit: cover; }
.feat__txt { align-self: center; padding: 56px clamp(24px, 6vw, 96px); display: grid; gap: 16px; justify-items: start; }
.feat__txt .eyebrow { color: rgba(246, 241, 236, .7); }
.feat__h { font-size: clamp(26px, 2.6vw, 38px); font-weight: 300; line-height: 1.2; }
.feat__txt p { max-width: 380px; color: rgba(246, 241, 236, .82); }
.feat__price { font-size: 15px; color: var(--on-dk) !important; }
@media (max-width: 799px) { .feat__in { grid-template-columns: 1fr; padding: 0; } .feat__txt { padding: 36px var(--pad) 48px; } }
.duo { display: grid; grid-template-columns: 1fr 1fr; }
.duo__t { position: relative; display: block; overflow: hidden; background: var(--tile); }
.duo__t img { width: 100%; aspect-ratio: 4/5; object-fit: cover; transition: transform 1.4s var(--ease); }
.duo__t:hover img { transform: scale(1.02); }
.duo__t span { position: absolute; left: 24px; bottom: 24px; background: var(--bg); padding: 12px 20px; font-size: 14px; }
.duo__t:hover span { background: var(--ink); color: #fff; }
@media (max-width: 799px) { .duo { grid-template-columns: 1fr; } .duo__t span { left: 16px; bottom: 16px; } }
.usps { border-top: 1px solid var(--line); }
.usps__in { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; padding-top: 40px; padding-bottom: 44px; text-align: center; }
.usp svg { width: 22px; height: 22px; fill: none; stroke: var(--accent); stroke-width: 1.2; margin: 0 auto 10px; }
.usp__t { font-size: 13px; }
.usp__d { font-size: 12px; color: var(--muted); }
@media (max-width: 799px) { .usps__in { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 12px; } }
.acc details { border-bottom: 1px solid var(--line); }
.acc details:first-child { border-top: 1px solid var(--line); }
.acc summary { list-style: none; cursor: pointer; padding: 16px 28px 16px 0; font-size: 14px; position: relative; }
.acc summary::-webkit-details-marker { display: none; }
.acc summary::after { content: ''; position: absolute; right: 4px; top: 50%; width: 9px; height: 9px; border-right: 1px solid; border-bottom: 1px solid; transform: translateY(-70%) rotate(45deg); transition: transform .25s var(--ease); }
.acc details[open] summary::after { transform: translateY(-20%) rotate(-135deg); }
.acc details > div { padding: 0 0 20px; color: var(--muted); font-size: 14px; }
.acc a { text-decoration: underline; }
.ftr { background: var(--accent-dk); color: var(--on-dk); padding: 64px 0 28px; margin-bottom: 0; }
.ftr__in { display: grid; grid-template-columns: 1.1fr 1.4fr; gap: 64px; }
.ftr__h { font-size: 20px; font-weight: 300; margin-bottom: 8px; }
.ftr__p { color: rgba(246, 241, 236, .78); max-width: 420px; }
.ftr__form { display: flex; margin-top: 20px; max-width: 440px; border: 1px solid rgba(246, 241, 236, .5); }
.ftr__form input { flex: 1; min-width: 0; background: none; border: 0; padding: 0 14px; height: 48px; color: var(--on-dk); }
.ftr__form input::placeholder { color: rgba(246, 241, 236, .6); }
.ftr__form button { padding: 0 22px; background: var(--on-dk); color: var(--accent-dk); font-size: 13px; letter-spacing: .06em; }
.ftr__fine { font-size: 11px; color: rgba(246, 241, 236, .6); margin-top: 10px; }
.ftr__cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.fcol summary { list-style: none; font-size: 13px; letter-spacing: .06em; margin-bottom: 12px; pointer-events: none; }
.fcol summary::-webkit-details-marker { display: none; }
.fcol li a { display: inline-block; padding: 3px 0; font-size: 13px; color: rgba(246, 241, 236, .78); }
.fcol li a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.ftr__base { margin-top: 56px; padding-top: 22px; border-top: 1px solid rgba(246, 241, 236, .18); display: flex; flex-wrap: wrap; gap: 8px 28px; justify-content: space-between; font-size: 11px; color: rgba(246, 241, 236, .6); }
@media (max-width: 799px) {
  .ftr { padding-top: 44px; }
  .ftr__in { grid-template-columns: 1fr; gap: 36px; }
  .ftr__cols { grid-template-columns: 1fr; gap: 0; }
  .fcol { border-bottom: 1px solid rgba(246, 241, 236, .18); }
  .fcol summary { pointer-events: auto; padding: 14px 0; margin: 0; position: relative; }
  .fcol summary::after { content: '+'; position: absolute; right: 0; }
  .fcol[open] summary::after { content: '–'; }
  .fcol ul { padding-bottom: 14px; }
}
.col { padding: 26px 0 72px; }
.crumbs { font-size: 12px; color: var(--muted); }
.crumbs a:hover { text-decoration: underline; }
.col__head { margin: 18px 0 26px; display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; }
.col__h { font-size: clamp(22px, 2vw, 28px); font-weight: 300; }
.col__eb { font-size: 13px; color: var(--muted); }
.tools { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 10px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin-bottom: 22px; position: sticky; top: var(--hdr); background: var(--bg); z-index: 5; }
.tools__f { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; min-height: 36px; }
.tools__f svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.3; }
.tools__r { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.tools__l { color: var(--muted); }
.tools select { border: 0; background: transparent; padding: 6px 2px; font-size: 13px; }
.tools__n { color: var(--muted); white-space: nowrap; }
@media (max-width: 599px) { .tools__l, .tools__n { display: none; } }
.active { display: flex; flex-wrap: wrap; gap: 6px; margin: -8px 0 18px; }
.active:empty { display: none; }
.active button { font-size: 12px; border: 1px solid var(--line); padding: 5px 10px; }
.active button::after { content: ' ×'; }
.empty { text-align: center; padding: 60px 0; color: var(--muted); }
.scrim { position: fixed; inset: 0; z-index: 70; background: rgba(28, 28, 28, .32); opacity: 0; transition: opacity .3s var(--ease); }
.scrim.is-on { opacity: 1; }
.cart, .filters { position: fixed; top: 0; right: 0; bottom: 0; z-index: 80; width: min(440px, 100%); background: var(--bg); display: flex; flex-direction: column; transform: translateX(100%); transition: transform .35s var(--ease); }
.cart.is-open, .filters.is-open { transform: none; }
.cart__top { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px 10px 22px; border-bottom: 1px solid var(--line); }
.cart__top h2 { font-size: 16px; }
.cart__ship { font-size: 12px; color: var(--muted); padding: 10px 22px; border-bottom: 1px solid var(--line); }
.cart__body { flex: 1; overflow-y: auto; padding: 8px 22px; }
.cart__empty { padding: 40px 0; text-align: center; color: var(--muted); display: grid; gap: 18px; justify-items: center; }
.line { display: grid; grid-template-columns: 76px 1fr auto; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.line img { background: var(--tile); aspect-ratio: 2/3; object-fit: cover; }
.line__n { font-size: 13px; }
.line__m { font-size: 12px; color: var(--muted); }
.line__q { display: inline-flex; align-items: center; border: 1px solid var(--line); margin-top: 10px; }
.line__q button { width: 34px; height: 34px; }
.line__q span { min-width: 22px; text-align: center; font-size: 13px; }
.line__r { text-align: right; font-size: 13px; display: flex; flex-direction: column; justify-content: space-between; align-items: end; }
.line__x { font-size: 12px; color: var(--muted); text-decoration: underline; min-height: 24px; }
.up { padding: 18px 0 8px; }
.up__i { display: grid; grid-template-columns: 56px 1fr auto; gap: 12px; align-items: center; padding: 8px 0; }
.up__i img { background: var(--tile); aspect-ratio: 2/3; object-fit: cover; }
.up__n { font-size: 13px; }
.up__p { font-size: 12px; color: var(--muted); }
.cart__foot { padding: 16px 22px 22px; border-top: 1px solid var(--line); display: grid; gap: 12px; }
.cart__sub { display: flex; justify-content: space-between; font-size: 14px; }
.cart__note { font-size: 11px; color: var(--muted); text-align: center; }
.qs { display: flex; flex-wrap: wrap; gap: 4px; justify-content: end; max-width: 190px; }
.qs button { min-width: 38px; height: 34px; border: 1px solid var(--line); font-size: 12px; }
.qs button:hover { border-color: var(--ink); }
.qs button:disabled { opacity: .35; text-decoration: line-through; cursor: not-allowed; }
.add-s { font-size: 12px; border: 1px solid var(--ink); padding: 0 14px; min-height: 34px; }
.add-s:hover { background: var(--ink); color: #fff; }
.filters { left: 0; right: auto; transform: translateX(-100%); }
.filters__body { flex: 1; overflow-y: auto; padding: 8px 22px; }
.filters fieldset { border: 0; border-bottom: 1px solid var(--line); padding: 16px 0 20px; margin: 0; }
.filters legend { font-size: 13px; padding: 0 0 10px; float: left; width: 100%; }
.chips { clear: both; display: flex; flex-wrap: wrap; gap: 6px; }
.chip input { position: absolute; opacity: 0; }
.chip span { display: inline-block; border: 1px solid var(--line); padding: 7px 12px; font-size: 13px; cursor: pointer; }
.chip input:checked + span { background: var(--ink); color: #fff; border-color: var(--ink); }
.chip input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.filters__foot { display: grid; grid-template-columns: 1fr 2fr; gap: 8px; padding: 14px 22px 22px; border-top: 1px solid var(--line); }
.search { position: fixed; inset: 0 0 auto 0; z-index: 80; background: var(--bg); max-height: 88vh; overflow-y: auto; box-shadow: 0 30px 60px rgba(0, 0, 0, .08); transform: translateY(-100%); transition: transform .35s var(--ease); }
.search.is-open { transform: none; }
.search__bar { display: flex; align-items: center; gap: 12px; padding-top: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.search__bar input { flex: 1; border: 0; background: none; font-size: 20px; padding: 10px 0; outline: none; }
.search__res { padding-top: 24px; padding-bottom: 32px; }
.search__res .grid { gap: 28px 6px; }
.search__hint { color: var(--muted); font-size: 13px; }
.search__sugg { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.search__sugg button { border: 1px solid var(--line); padding: 6px 12px; font-size: 13px; }
.toast { position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, 20px); z-index: 90; background: var(--ink); color: #fff; padding: 12px 18px; font-size: 13px; opacity: 0; pointer-events: none; transition: opacity .3s, transform .3s var(--ease); max-width: calc(100% - 32px); }
.toast.is-on { opacity: 1; transform: translate(-50%, 0); }
body.is-locked { overflow: hidden; }
.pdp__in { max-width: var(--wrap); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 48px; padding: 0 var(--pad) 40px 0; }
.gal__track { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.gal__f { margin: 0; background: var(--tile); aspect-ratio: 2/3; }
.gal__img { width: 100%; height: 100%; object-fit: cover; }
.gal__n { display: none; }
.pi { position: sticky; top: calc(var(--hdr) + 24px); align-self: start; padding-top: 22px; max-width: 440px; }
.pi__t { font-size: 22px; font-weight: 300; margin-top: 18px; line-height: 1.3; }
.pi__c { color: var(--muted); font-size: 14px; }
.pi__p { font-size: 16px; margin-top: 14px; }
.pi__tax { font-size: 12px; color: var(--muted); margin-bottom: 22px; }
.pi__sw { margin-bottom: 20px; }
.csws { display: flex; flex-wrap: wrap; gap: 6px; }
.csw { display: block; width: 52px; background: var(--tile); outline: 1px solid transparent; outline-offset: 2px; position: relative; }
.csw img { aspect-ratio: 2/3; object-fit: cover; }
.csw.is-on { outline-color: var(--ink); }
.csw.is-out::after { content: ''; position: absolute; left: 50%; top: -2px; bottom: -2px; width: 1px; background: rgba(28, 28, 28, .45); transform: rotate(33deg); }
.csw:hover { outline-color: var(--line); }
.buy { display: grid; gap: 16px; }
.note { font-size: 12px; color: var(--muted); }
.szrow { border: 0; padding: 0; margin: 0; }
.szrow legend { font-size: 13px; padding: 0; margin-bottom: 10px; }
.szrow__sel { color: var(--muted); margin-left: 6px; }
.szs { display: grid; grid-template-columns: repeat(auto-fill, minmax(56px, 1fr)); gap: 6px; }
.sz { height: 46px; border: 1px solid var(--line); font-size: 13px; transition: border-color .2s, background .2s; }
@media (hover: hover) { .sz:hover:not(:disabled) { border-color: var(--ink); } }
.sz[aria-pressed="true"] { background: var(--ink); color: #fff; border-color: var(--ink); }
.sz:disabled { color: rgba(28, 28, 28, .35); background: linear-gradient(to top right, transparent calc(50% - .5px), rgba(28, 28, 28, .2) 50%, transparent calc(50% + .5px)); cursor: not-allowed; }
.szrow.is-err legend { color: var(--accent); }
.szrow.is-err .sz:not(:disabled) { border-color: rgba(111, 38, 38, .55); }
.buy__msg { font-size: 12px; color: var(--accent); min-height: 0; }
.buy__msg:empty { display: none; }
.setup { display: grid; gap: 2px; margin-top: 12px; padding: 14px 16px; border: 1px solid var(--line); font-size: 13px; }
.setup:hover { border-color: var(--ink); }
.setup__t { font-weight: 500; }
.setup span:last-child { color: var(--muted); }
.pi__usp { margin: 20px 0 24px; display: grid; gap: 6px; font-size: 12px; color: var(--muted); }
.pi__usp li { padding-left: 18px; position: relative; }
.pi__usp li::before { content: ''; position: absolute; left: 2px; top: 7px; width: 8px; height: 4px; border-left: 1px solid var(--accent); border-bottom: 1px solid var(--accent); transform: rotate(-45deg); }
.rte ul { padding-left: 18px; list-style: disc; margin: 10px 0; }
.rte p + p { margin-top: 8px; }
.rte em { font-style: normal; }
.look { margin-top: 28px; }
.look__i { display: grid; grid-template-columns: 64px 1fr auto; gap: 12px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--line); }
.look__img { background: var(--tile); aspect-ratio: 2/3; object-fit: cover; }
.look__txt { display: grid; font-size: 13px; }
.look__txt span { color: var(--muted); font-size: 12px; }
.look__add { font-size: 12px; border: 1px solid var(--ink); padding: 0 16px; min-height: 36px; }
.look__add:hover { background: var(--ink); color: #fff; }
.sbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; background: var(--bg); border-top: 1px solid var(--line); padding: 10px var(--pad) calc(10px + env(safe-area-inset-bottom)); transform: translateY(100%); visibility: hidden; transition: transform .3s var(--ease), visibility 0s .3s; }
.sbar.is-on { transform: none; visibility: visible; transition: transform .3s var(--ease), visibility 0s; }
.sbar__in { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.sbar__t { font-size: 13px; line-height: 1.35; }
.sbar__t small { color: var(--muted); font-size: 12px; }
.sbar .btn { padding: 0 22px; }
@media (min-width: 1000px) { .sbar { display: none; } }
@media (max-width: 999px) {
  .pdp__in { grid-template-columns: 1fr; gap: 0; padding: 0 0 20px; }
  .gal { position: relative; }
  .gal__track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 0; scrollbar-width: none; }
  .gal__track::-webkit-scrollbar { display: none; }
  .gal__f { flex: 0 0 100%; scroll-snap-align: start; }
  .gal__n { display: block; position: absolute; right: 12px; bottom: 12px; font-size: 12px; background: var(--bg); padding: 3px 9px; }
  .pi { position: static; padding: 18px var(--pad) 0; max-width: none; }
  .pi__t { margin-top: 12px; }
}
.about { padding: 56px 0 72px; }
.about .wrap { display: grid; gap: 16px; }
.about__h { font-size: clamp(26px, 3vw, 40px); font-weight: 300; line-height: 1.2; margin-bottom: 8px; }
.about__h2 { font-size: clamp(22px, 2vw, 28px); font-weight: 300; }
.about p { color: var(--muted); font-size: 15px; }
.about .duo { margin: 48px 0; }
.about #casa { margin-top: 12px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; } }
.eyebrow--light { color: rgba(255, 255, 255, .78); }
.btn--line-light { border-color: rgba(255, 255, 255, .85); color: #fff; }
.btn--line-light:hover { background: #fff; color: var(--ink); }
.sh__t--caps { text-transform: uppercase; letter-spacing: .14em; font-size: 18px; }
.sec--first { padding-top: 64px; }
.sec--dark { background: var(--accent-dk); color: var(--on-dk); }
.sec--dark .cat__img { background: var(--tile); }
.sec--dark .cat__t { color: var(--on-dk); }
.hero2 { position: relative; height: calc(100svh - 60px); min-height: 560px; max-height: 1080px; overflow: hidden; background: #efeeeb; }
.hero2 picture, .hero2 img { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero2 img { object-fit: cover; object-position: 50% 30%; }
.hero2__txt { position: absolute; left: clamp(24px, 4vw, 64px); top: 50%; transform: translateY(-30%); max-width: min(340px, 22vw); display: grid; gap: 16px; justify-items: start; }
.hero2__h { font-size: clamp(26px, 2.4vw, 38px); font-weight: 300; line-height: 1.18; letter-spacing: 0; }
@media (max-width: 799px) {
  .hero2 { height: 86svh; min-height: 520px; }
  .hero2 img { object-position: 58% 30%; }
  .hero2::after { content: ''; position: absolute; inset: auto 0 0 0; height: 46%; background: linear-gradient(to top, rgba(250, 249, 246, .96) 18%, rgba(250, 249, 246, 0)); }
  .hero2__txt { left: var(--pad); right: var(--pad); top: auto; bottom: 28px; transform: none; max-width: none; z-index: 1; gap: 12px; }
  .hero2__h { font-size: 26px; }
}
.card__media[data-badge]::after { content: attr(data-badge); position: absolute; right: 10px; top: 10px; font-size: 11px; letter-spacing: .06em; background: var(--accent); color: #fff; padding: 3px 9px; }
.story__t { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; }
.dots { display: none; justify-content: center; gap: 8px; margin-top: 22px; }
.dots span { width: 6px; height: 6px; border-radius: 50%; border: 1px solid var(--ink); }
.dots span.is-on { background: var(--ink); }
@media (max-width: 999px) { .dots { display: flex; } }
.help { position: relative; min-height: 560px; display: grid; place-items: center; text-align: center; color: #fff; overflow: hidden; }
.help__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 22% 40%; }
.help::before { content: ''; position: absolute; inset: 0; background: rgba(30, 16, 12, .52); z-index: 1; }
.help__txt { position: relative; z-index: 2; max-width: 560px; padding: 72px var(--pad); display: grid; gap: 14px; justify-items: center; }
.help__h { font-size: clamp(26px, 2.8vw, 40px); font-weight: 300; line-height: 1.2; }
.help__txt p { color: rgba(255, 255, 255, .86); }
.help__btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 8px; }
.frame { background: var(--accent-dk); padding: 40px var(--pad); }
.frame__in { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; background: var(--bg); }
.frame__img { background: var(--tile); }
.frame__img img { width: 100%; height: 100%; aspect-ratio: 4/5; object-fit: cover; }
.frame__card { align-self: center; padding: 48px clamp(28px, 5vw, 72px); display: grid; gap: 14px; justify-items: start; }
.frame__h { font-size: clamp(26px, 2.6vw, 38px); font-weight: 400; line-height: 1.15; }
.frame__lead { font-weight: 500; }
.frame__card p:not(.eyebrow):not(.frame__lead) { color: var(--muted); max-width: 400px; }
.frame__price { color: var(--ink) !important; font-size: 15px; }
@media (max-width: 799px) { .frame { padding: 16px; } .frame__in { grid-template-columns: 1fr; } .frame__card { padding: 28px 22px 34px; } }
.motion { background: var(--tint); }
.motion__in { display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 460px); gap: clamp(32px, 6vw, 96px); justify-content: center; align-items: center; }
.motion__vid { position: relative; background: #8c5f51; aspect-ratio: 9/16; max-height: 78svh; }
.motion__vid video { width: 100%; height: 100%; object-fit: cover; display: block; }
.motion__btn { position: absolute; right: 12px; bottom: 12px; width: 40px; height: 40px; background: rgba(250, 249, 246, .9); font-size: 11px; letter-spacing: -1px; }
.motion__txt { display: grid; gap: 16px; justify-items: start; }
.ticks { display: grid; gap: 8px; font-size: 14px; color: var(--muted); }
.ticks li { padding-left: 20px; position: relative; }
.ticks li::before { content: ''; position: absolute; left: 2px; top: 8px; width: 9px; height: 5px; border-left: 1px solid var(--accent); border-bottom: 1px solid var(--accent); transform: rotate(-45deg); }
.motion__price { font-size: 15px; }
.motion__price span { color: var(--muted); font-size: 13px; }
@media (max-width: 799px) { .motion__in { grid-template-columns: 1fr; } .motion__vid { max-width: 360px; width: 100%; margin: 0 auto; } }
.fit { position: relative; min-height: 520px; display: grid; place-items: center; text-align: center; color: #fff; overflow: hidden; }
.fit__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; }
.fit::before { content: ''; position: absolute; inset: 0; background: rgba(35, 10, 10, .38); z-index: 1; }
.fit__txt { position: relative; z-index: 2; max-width: 520px; padding: 64px var(--pad); display: grid; gap: 14px; justify-items: center; }
.fit__h { font-size: clamp(24px, 2.4vw, 34px); text-transform: uppercase; letter-spacing: .16em; font-weight: 400; }
.fit__txt p { color: rgba(255, 255, 255, .88); }
.acc--ic summary { display: flex; align-items: center; gap: 12px; }
.acc--ic summary svg { width: 20px; height: 20px; fill: none; stroke: var(--ink); stroke-width: 1.2; flex: none; }
:root {
  --bg: #fefcf7;
  --tint: #f7f3ec;
  --tile: #fffcf5;           
  --ink: #141212;
  --muted: rgba(20, 18, 18, .62);
  --line: rgba(20, 18, 18, .1);
  --accent: #5a1c1c;
  --accent-dk: #3f1414;
  --on-dk: #f7f1ea;
}
body { font-size: 15px; line-height: 1.8; letter-spacing: .03em; color: rgba(20, 18, 18, .82); }
h1, h2, h3, .pi__t, .card__name, .card__price, .price { color: var(--ink); }
.card__media, .gal__f, .csw, .mega__tile, .tile, .look__i > a, .line > a, .up__i > a { background: var(--tile); }
.card__img, .gal__img, .csw img, .mega__tile img, .tile img, .look__img, .line img, .up__i img, .search__res .card__img { mix-blend-mode: multiply; }
.tile { display: block; }
.cat__img { background: none; }
.ann { background: var(--bg); color: var(--muted); border-bottom: 1px solid var(--line); text-transform: none; letter-spacing: .04em; font-size: 12px; }
.ann__in { height: 32px; }
.concept { background: var(--tint); }
.btn { min-height: 47px; padding: 0 30px; font-size: 14px; letter-spacing: .06em; }
.btn--line { border-color: var(--ink); color: var(--ink); }
.btn--line:hover { background: var(--ink); color: var(--bg); }
.hero2__h { font-size: clamp(26px, 2.2vw, 34px); font-weight: 300; line-height: 1.25; color: var(--ink); }
.hero2__txt { gap: 26px; }
.sec { padding: 104px 0; }
.sec--first { padding-top: 96px; }
.sh { margin-bottom: 44px; gap: 8px; }
.sh__t { font-size: clamp(19px, 1.5vw, 22px); font-weight: 400; letter-spacing: .02em; }
.sh__s { font-size: 13px; }
.sh__t--caps { font-size: 15px; letter-spacing: .18em; }
.va { margin-top: 44px; }
@media (max-width: 799px) { .sec { padding: 68px 0; } .sec--first { padding-top: 60px; } }
.grid { gap: 48px 4px; }
@media (max-width: 999px) { .grid { gap: 36px 3px; } }
.card__name { font-size: 12px; letter-spacing: .05em; line-height: 1.4; }
.card__price { font-size: 13px; letter-spacing: .06em; }
.price--was { font-size: 12px; color: rgba(20, 18, 18, .6); }
.card__sw { margin: 12px 0 5px; }
.sw { width: 11px; height: 11px; }
.card__flag { background: var(--accent); color: var(--on-dk); border-radius: 20px; padding: 2px 10px; font-size: 11px; }
.sec--tint { background: var(--tint); }
.story__t { color: var(--ink); letter-spacing: .14em; }
.story__p { font-size: 13px; }
.help { min-height: 600px; }
.help::before { background: rgba(28, 16, 12, .42); }
.help__h { font-size: clamp(24px, 2.2vw, 32px); font-weight: 300; }
.help__txt { gap: 18px; }
.cat__t { font-size: 13px; padding-top: 12px; color: var(--ink); }
.rail--6 { gap: 4px; }
.frame { background: var(--bg); padding: 0; }
.frame__in { max-width: none; background: var(--tint); }
.frame__img img { aspect-ratio: 4/5; }
.frame__card { gap: 18px; padding: 64px clamp(28px, 8vw, 140px); }
.frame__h { font-size: clamp(26px, 2.2vw, 34px); font-weight: 300; }
.frame__card p:not(.eyebrow) { color: var(--muted); max-width: 360px; }
@media (max-width: 799px) { .frame__card { padding: 40px var(--pad) 48px; } }
.motion { background: var(--bg); }
.motion__txt { gap: 22px; }
.motion__p { color: var(--muted); max-width: 380px; font-size: 14px; }
.motion__vid { background: var(--tint); }
.fit { min-height: 560px; }
.fit::before { background: rgba(30, 8, 8, .28); }
.fit__h { text-transform: none; letter-spacing: .02em; font-weight: 300; font-size: clamp(28px, 2.6vw, 40px); }
.fit__txt { gap: 20px; }
.acc summary { font-size: 13px; letter-spacing: .04em; color: var(--ink); }
.acc--ic summary svg { stroke: var(--muted); }
.usp__t { font-size: 13px; color: var(--ink); }
.usp svg { stroke: var(--ink); stroke-width: 1; }
.ftr { background: var(--accent-dk); }
.ftr__h { font-weight: 300; }
.help .help__h, .fit .fit__h, .help__txt p, .fit__txt p { color: #fff; }
.ftr h2, .ftr h3, .ftr .ftr__h { color: var(--on-dk); }
.story__img, .help__img, .frame__img img, .duo__t img, .motion__vid video { filter: sepia(.06) saturate(.95); }
.about .duo img { filter: none; }
.fit__img { filter: saturate(.92); }
.card__img--2, .gal__img { filter: sepia(.06); }
.pi__t { font-size: 20px; font-weight: 400; letter-spacing: .02em; }
.pi__t .pi__c { display: block; color: var(--muted); font-size: 14px; margin-top: 2px; }
.pi__p { font-size: 15px; margin-top: 10px; letter-spacing: .04em; }
.pi__tax { font-size: 12px; margin-bottom: 26px; }
.lbl { font-size: 12px; letter-spacing: .06em; }
.lbl span { margin-left: 6px; }
.csw { width: 48px; }
.szrow { position: relative; }
.szrow legend { font-size: 12px; letter-spacing: .06em; }
.sg-open { position: absolute; right: 0; top: 0; font-size: 12px; }
.sz { height: 44px; font-size: 12px; letter-spacing: .06em; }
.fitline { font-size: 12px; color: var(--muted); margin-top: -4px; }
.pi__usp { margin: 22px 0 26px; gap: 8px; }
.pi__usp li { display: flex; align-items: center; gap: 10px; padding-left: 0; font-size: 12px; }
.pi__usp li::before { display: none; }
.pi__usp svg { width: 16px; height: 16px; fill: none; stroke: var(--ink); stroke-width: 1.1; flex: none; }
.acc--pi summary { font-size: 13px; }
.rte-ul { list-style: disc; padding-left: 18px; display: grid; gap: 4px; }
.sgt { overflow-x: auto; margin: 10px 0 6px; }
.sgt__c { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink); margin: 12px 0 6px; }
.sgt table { width: 100%; border-collapse: collapse; font-size: 12px; min-width: 320px; }
.sgt th, .sgt td { text-align: left; padding: 8px 8px 8px 0; border-bottom: 1px solid var(--line); white-space: nowrap; font-weight: 400; }
.sgt thead th { color: var(--muted); font-size: 11px; letter-spacing: .06em; }
.sgt tbody th { color: var(--ink); }
.sgt__n { font-size: 12px; color: var(--muted); margin-top: 8px; }
.sgt__n a { text-decoration: underline; }
.sg { left: auto; right: 0; transform: translateX(100%); width: min(520px, 100%); }
.sg.is-open { transform: none; }
.sg__m { font-size: 13px; margin: 8px 0 4px; }
.setup { background: var(--tint); border-color: transparent; }
.look__add, .add-s { border-color: var(--line); }
.szrow legend { float: left; margin: 0 0 10px; }
.sg-open { position: static; float: right; margin-bottom: 10px; line-height: inherit; }
.szs { clear: both; }
.info { padding: 40px 0 96px; }
.info .wrap { display: grid; gap: 14px; }
.info__h { font-size: clamp(26px, 2.4vw, 34px); font-weight: 300; margin-top: 14px; }
.info__lead { color: var(--muted); }
.info__lead a, .info p a { text-decoration: underline; text-underline-offset: 3px; }
.info__h2 { font-size: 15px; letter-spacing: .04em; color: var(--ink); margin-top: 28px; }
.info p { color: var(--muted); }
.info__small { font-size: 12px; }
.info .acc summary { padding-right: 36px; }
.contact { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
.cform { display: grid; gap: 14px; align-content: start; margin-top: 28px; }
.cform label { display: grid; gap: 6px; font-size: 12px; letter-spacing: .04em; color: var(--ink); }
.cform label span { color: var(--muted); }
.cform input, .cform textarea { border: 1px solid var(--line); background: #fff; padding: 12px; font-size: 14px; border-radius: 0; }
.cform input:focus, .cform textarea:focus { outline: 2px solid var(--accent); outline-offset: 1px; }
@media (max-width: 799px) { .contact { grid-template-columns: 1fr; gap: 8px; } }
.view { display: inline-flex; border: 1px solid var(--line); margin-right: 8px; }
.view button { font-size: 12px; padding: 5px 12px; letter-spacing: .04em; color: var(--muted); }
.view button[aria-pressed="true"] { background: var(--ink); color: var(--bg); }
html.is-worn .card__img--2 { opacity: 1; }
html.is-worn .card__media:has(.card__img--2) .card__img:first-child { opacity: 0; }
@media (max-width: 599px) { .view { margin-right: 0; } }
.pop { position: fixed; inset: 0; z-index: 85; background: rgba(20, 18, 18, .38); display: grid; place-items: center; padding: 16px; opacity: 0; transition: opacity .3s var(--ease); }
.pop.is-open { opacity: 1; }
.pop__card { background: var(--bg); width: min(760px, 100%); display: grid; grid-template-columns: 1fr 1.1fr; max-height: 92svh; overflow: auto; }
.pop__img img { width: 100%; height: 100%; object-fit: cover; object-position: 55% 30%; }
.pop__txt { position: relative; padding: 48px 36px 36px; display: grid; gap: 14px; align-content: center; }
.pop__x { position: absolute; right: 6px; top: 6px; }
.pop__h { font-size: 26px; font-weight: 300; line-height: 1.2; }
.pop__txt p:not(.eyebrow) { color: var(--muted); font-size: 14px; }
.pop__form { display: grid; gap: 8px; margin-top: 6px; }
.pop__form input { border: 1px solid var(--line); background: #fff; height: 47px; padding: 0 14px; font-size: 14px; }
.pop__no { justify-self: start; font-size: 12px; color: var(--muted); }
@media (max-width: 599px) { .pop__card { grid-template-columns: 1fr; } .pop__img { display: none; } .pop__txt { padding: 44px 22px 26px; } }
.teaser { position: fixed; left: 16px; bottom: 16px; z-index: 45; background: var(--accent); color: var(--on-dk); font-size: 12px; letter-spacing: .06em; padding: 10px 16px; }
.is-pdp .teaser { bottom: 84px; }
@media (min-width: 1000px) { .is-pdp .teaser { bottom: 16px; } }
.hero2__h, .help__h, .frame__h, .fit__h { font: 300 clamp(26px, 2vw, 30px)/1.2 var(--f); letter-spacing: .01em; }
.fit__h { text-transform: none; }
h1, h2 { text-wrap: balance; }
.hero2__txt { max-width: min(380px, 27vw); }
.sh__t--caps { text-transform: none; letter-spacing: .02em; font-size: clamp(19px, 1.5vw, 22px); }
.fit { min-height: 640px; }
.fit__img { object-position: 50% 58%; filter: none; }
.fit::before { background: rgba(30, 8, 8, .26); }
@media (max-width: 799px) { .fit { align-items: end; } .fit__txt { padding-bottom: 48px; } .fit__img { object-position: 50% 40%; } }
.help { min-height: 480px; }
.help__img { object-position: 50% 64%; }
.help::before { background: rgba(28, 16, 12, .5); }
:root { --tint: #f3eee6; }
.story__img { object-position: 50% 80%; }
.frame__in { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); background: var(--bg); }
.frame__img img { object-position: 50% 6%; }
@media (min-width: 800px) { .motion__vid { order: 2; } }
@media (max-width: 799px) { .frame__in { grid-template-columns: 1fr; } }
.sec:not(.sec--tint) + .sec:not(.sec--tint):not(.motion) { padding-top: 40px; }
@media (max-width: 799px) { .sec:not(.sec--tint) + .sec:not(.sec--tint):not(.motion) { padding-top: 28px; } }
.card .price--was, .look__txt .price--was, .up__p .price--was, .pi__p .price--was, .sbar .price--was { display: none; }
html.is-final .card .price--was { display: inline; }
.view { border: 0; gap: 14px; }
.view button { padding: 5px 0; }
.view button[aria-pressed="true"] { background: none; color: var(--ink); text-decoration: underline; text-underline-offset: 5px; }
.ann { border-bottom: 0; background: var(--tint); }
.concept { background: var(--tint); border-bottom: 1px solid var(--line); }
.card__flag { border-radius: 0; background: var(--bg); color: var(--ink); }
.pi { padding-bottom: 0; }
.pi__p .pi__tax { display: inline; margin: 0 0 0 10px; font-size: 12px; color: var(--muted); }
.pi__set { font-size: 12px; color: var(--muted); margin-top: 4px; }
.pi__p { margin-bottom: 22px; }
.buy__alt { font-size: 12px; color: var(--muted); }
.buy__alt a, .buy__msg a { text-decoration: underline; text-underline-offset: 3px; color: var(--ink); }
.buy__msg.is-alt { color: var(--muted); }
.sz.is-out { color: rgba(20, 18, 18, .35); background: linear-gradient(to top right, transparent calc(50% - .5px), rgba(20, 18, 18, .2) 50%, transparent calc(50% + .5px)); cursor: pointer; }
.sethint { display: grid; gap: 2px; margin: 12px 0 4px; padding: 12px 14px; background: var(--tint); font-size: 12px; }
.sethint strong { font-weight: 500; color: var(--ink); }
.sethint span { color: var(--muted); }
.cart__note { line-height: 1.7; }
.qs { max-width: 240px; flex-wrap: nowrap; }
.qs button { min-width: 34px; }
.up__n { display: block; }
.filters__foot .btn[disabled] { background: #b9adaa; }
.teaser { display: none !important; }
@media (max-width: 999px) {
  .pdp .crumbs { display: none; }
  .pi__t { margin-top: 4px; }
  .csws { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding: 3px 3px 4px; margin: -3px; }
  .csws::-webkit-scrollbar { display: none; }
  .csw { flex: 0 0 48px; }
  .search { inset: 0; max-height: none; }
}
.up__i:has(.qs) { grid-template-columns: 56px 1fr; }
.up__i:has(.qs) [data-qs-slot] { grid-column: 2 / -1; }
.up__i .qs { max-width: none; flex-wrap: wrap; justify-content: flex-start; }
@media (max-width: 999px) { .pdp__in { grid-template-columns: minmax(0, 1fr); } .pi, .gal { min-width: 0; } }
.scrim { z-index: 65; }
.sbar__t { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sbar .btn { flex: none; white-space: nowrap; padding: 0 18px; }
@media (max-width: 999px) { .is-pdp .ftr { padding-bottom: calc(28px + 68px + env(safe-area-inset-bottom)); } .is-pdp .toast { bottom: calc(84px + env(safe-area-inset-bottom)); } }
@media (min-width: 800px) and (max-width: 1099px) {
  .hero2 { height: 86svh; }
  .hero2 img { object-position: 58% 30%; }
  .hero2::after { content: ''; position: absolute; inset: auto 0 0 0; height: 40%; background: linear-gradient(to top, rgba(254, 252, 247, .96) 18%, rgba(254, 252, 247, 0)); }
  .hero2__txt { left: var(--pad); right: auto; top: auto; bottom: 40px; transform: none; max-width: 460px; z-index: 1; }
}
@media (max-width: 599px) { .gal__f { flex: 0 0 86%; } .gal__f + .gal__f { margin-left: 4px; } }
@media (min-width: 600px) and (max-width: 999px) { .gal__f { flex: 0 0 calc(50% - 2px); } .gal__f + .gal__f { margin-left: 4px; } }
.gal__n { background: none; font-size: 11px; letter-spacing: .06em; color: var(--muted); position: static; text-align: right; padding: 6px var(--pad) 0; }
@media (min-width: 700px) and (max-width: 999px) { .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .rail--4 > * { width: 44vw; } .rail--6 > * { width: 28vw; } }
@media (max-width: 999px) { input, textarea, select { font-size: 16px !important; } }
input[type=search]::-webkit-search-cancel-button { -webkit-appearance: none; display: none; }
.pop__h:focus { outline: none; }
@media (max-width: 999px) {
  .hdr__burger, .hdr__icon { width: 44px; height: 44px; margin: 0 -8px; display: grid; place-items: center; }
  .hdr__burger span { left: 11px; right: 11px; }
  .hdr__burger span:first-child { top: 18px; } .hdr__burger span:last-child { top: 25px; }
  .hdr__bag { min-height: 44px; }
  .menu__list--sub a { padding: 8px 0; }
  .menu__foot a { padding: 10px 0; }
}
.x { width: 44px; height: 44px; }
.line__q button { width: 44px; height: 44px; }
.sg-open, .line__x, .pop__no { padding: 11px 0; margin-top: -11px; margin-bottom: -11px; }
.chip span { padding: 12px 14px; }
.add-s, .look__add { min-height: 44px; }
@media (max-width: 599px) { .sgt thead th { white-space: normal; vertical-align: bottom; } .sgt th, .sgt td { padding-right: 6px; } .sgt table { min-width: 0; } .sgt tbody th { position: sticky; left: 0; background: var(--bg); } }
@media (max-width: 1099px) { .hero2__txt { max-width: 460px; } }
@media (max-width: 799px) { .hero2__txt { max-width: none; } .hero2__h { font-size: 26px; } }
@media (max-width: 999px) { .hdr__icon.hdr__acc { display: none; } }
.pi__set { margin: -12px 0 22px; }
.help__img { object-position: 50% 38%; }
@media (hover: hover) { .card:hover .card__media:has(> .card__img--2[src]) > .card__img:first-child { opacity: 0; transform: none; } }
@media (min-width: 1000px) { .gal__track:has(> .gal__f:only-child) { grid-template-columns: minmax(0, 1fr); max-width: 620px; } }
@media (max-width: 999px) { .gal__f:only-child { flex-basis: 100%; } .gal:has(.gal__f:only-child) .gal__n { display: none; } }
.fit::before { display: none; }
.fit .fit__h, .fit__txt p { color: var(--ink); }
.fit .btn--line-light { border-color: var(--ink); color: var(--ink); }
.fit .btn--line-light:hover { background: var(--ink); color: var(--bg); }
@media (min-width: 1100px) {
  .fit { min-height: min(52vw, 860px); justify-items: end; }
  .fit__img { object-position: 50% 22%; }
  .fit__txt { margin-right: clamp(40px, 6vw, 120px); max-width: 300px; padding-inline: 0; justify-items: start; text-align: left; }
}
@media (max-width: 1099px) {
  .fit { display: block; min-height: 0; }
  .fit__img { position: static; height: auto; aspect-ratio: 4/5; object-position: 50% 18%; }
  .fit__txt { max-width: 560px; margin: 0 auto; padding: 36px var(--pad) 8px; }
}
.up__n { white-space: normal; overflow: visible; max-width: none; }
@media (max-width: 999px) {
  .fcol li a { display: block; padding: 10px 0; }
  .tools__f, .view button, .tools select { min-height: 44px; }
  .hdr__logo { display: grid; align-items: center; min-height: 44px; }
  .crumbs a, .story .link, .contact .link, .buy__alt a { display: inline-block; padding: 12px 2px; margin: -12px -2px; }
  .motion__btn { width: 44px; height: 44px; }
}
.help::before { display: none; }
.help .help__h, .help__txt p { color: var(--ink); }
.help .btn--line-light { border-color: var(--ink); color: var(--ink); }
.help .btn--line-light:hover { background: var(--ink); color: var(--bg); }
@media (min-width: 1000px) {
  .help { min-height: min(44vw, 680px); justify-items: start; }
  .help__img { object-position: 50% 7%; }
  .help__txt { margin-left: clamp(32px, 8vw, 160px); max-width: 300px; padding-inline: 0; justify-items: start; text-align: left; }
  .help__btns { justify-content: flex-start; }
}
@media (max-width: 999px) {
  .help { display: block; min-height: 0; }
  .help__img { position: static; height: auto; aspect-ratio: 4/5; object-position: 50% 12%; }
  .help__txt { margin: 0 auto; padding: 36px var(--pad) 56px; }
}
@media (min-width: 800px) and (max-width: 1099px) {
  .hero2 { height: auto; min-height: 0; max-height: none; background: var(--bg); }
  .hero2 picture, .hero2 img { position: static; height: auto; aspect-ratio: 16/9; }
  .hero2 img { object-position: 50% 30%; }
  .hero2::after { display: none; }
  .hero2__txt { position: static; transform: none; max-width: 560px; padding: 36px var(--pad) 8px; }
}
@media (min-width: 700px) and (max-width: 999px) { .grid--row { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 36px 3px; } }
@media (min-width: 1100px) { .hero2__txt { left: max(var(--pad), calc((100vw - var(--wrap)) / 2 + var(--pad))); } }
@media (min-width: 1100px) and (max-width: 1199px) { .hero2__txt { max-width: 270px; } .hero2__h { font-size: 24px; } }
.view button { white-space: nowrap; }
.tools select { color: var(--muted); letter-spacing: 0; }
.tools__f { font-size: 14px; }
@media (max-width: 399px) { .view { gap: 10px; } .view button, .tools__f { font-size: 13px; } .tools { gap: 10px; } }
html.is-final .card[data-cat="sets"] .price--was { display: none; }
.motion__vid video { filter: sepia(.06) saturate(.8); }
@media (min-width: 600px) and (max-width: 999px) { .help__img { aspect-ratio: 1/1; object-position: 50% 6%; } }
@media (min-width: 600px) and (max-width: 1099px) { .fit__img { aspect-ratio: 1/1; object-position: 50% 12%; } }
@media (max-width: 399px) { .tools__r { min-width: 0; } .tools select { min-width: 0; padding-right: 0; } }
@media (min-width: 1000px) {
  .gal__f:nth-child(2n+3):last-child { grid-column: 1 / -1; aspect-ratio: 4/3; }
  .gal__f:nth-child(2n+3):last-child .gal__img { object-position: 50% 18%; }
}
.story:first-child .story__img { object-position: 50% 0%; }  
.story:last-child .story__img { object-position: 50% 0%; }
.nw { white-space: nowrap; }
@media (min-width: 1000px) {
  .pdp__in:has(.gal__f:only-child) { grid-template-columns: minmax(0, 620px) minmax(0, 440px); justify-content: center; column-gap: clamp(48px, 7vw, 140px); }
  .gal__track:has(> .gal__f:only-child) { max-width: none; }
}
@media (min-width: 600px) and (max-width: 999px) { .gal__f:only-child { flex: 0 0 62%; margin: 0 auto; } }
@media (min-width: 1000px) { .help__txt { margin-left: max(clamp(32px, 8vw, 160px), calc((100vw - var(--wrap)) / 2 + var(--pad))); } }
@media (min-width: 1100px) { .fit__txt { margin-right: max(clamp(40px, 6vw, 120px), calc((100vw - var(--wrap)) / 2 + var(--pad))); } }
.qs button { height: 44px; min-width: 44px; }
.active button { min-height: 44px; }
.search__sugg button { min-height: 44px; }
@media (max-width: 999px) { .menu__foot a, .fcol li a { padding: 11px 0; } }
@media (min-width: 1100px) { .hero2__txt { transform: translateY(-62%); } }