:root {
  --black: #090909;
  --black-soft: #11100f;
  --ink: #f0e9da;
  --muted: #9b958b;
  --purple: #351047;
  --purple-bright: #4e1966;
  --orange: #ff4f00;
  --bone: #d7d0c1;
  --line: rgba(240, 233, 218, 0.22);
  --gutter: clamp(1rem, 2.1vw, 2rem);
  --section-space: clamp(5.5rem, 11vw, 11rem);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { background: var(--black); scroll-behavior: smooth; }
body { background: var(--black); color: var(--ink); font-family: Arial, Helvetica, sans-serif; font-size: .875rem; line-height: 1.35; margin: 0; overflow-x: clip; -webkit-font-smoothing: antialiased; }
body:has(dialog[open]) { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input { border: 0; border-radius: 0; color: inherit; font: inherit; }
button { background: transparent; cursor: pointer; padding: 0; text-transform: uppercase; }
img { display: block; height: auto; max-width: 100%; }
p, h1, h2, h3 { margin: 0; }
:focus-visible { outline: 2px solid var(--orange); outline-offset: 4px; }

.skip-link { background: var(--orange); color: var(--black); left: 1rem; padding: .8rem 1rem; position: fixed; top: 1rem; transform: translateY(-200%); transition: transform 180ms ease; z-index: 100; }
.skip-link:focus { transform: translateY(0); }
.prototype-flag, .announcement, .site-header, .section-index, .catalogue-controls, .product-meta, .footer-bottom { letter-spacing: .075em; text-transform: uppercase; }
.prototype-flag { align-items: center; background: var(--orange); color: var(--black); display: flex; font-size: .625rem; font-weight: 700; gap: .65rem; justify-content: center; min-height: 1.7rem; padding: .25rem var(--gutter); }
.announcement { align-items: center; background: var(--purple); display: flex; font-size: .64rem; justify-content: center; min-height: 2rem; padding: .45rem var(--gutter); position: relative; }
.announcement-code { position: absolute; right: var(--gutter); }

.site-header { align-items: center; background: rgba(9, 9, 9, .96); border-bottom: 1px solid var(--line); display: grid; grid-template-columns: auto 1fr auto; min-height: 3.5rem; padding: 0 var(--gutter); position: sticky; top: 0; z-index: 40; }
.brand-lockup { display: block; font-size: .72rem; font-weight: 900; letter-spacing: -.055em; line-height: .78; text-transform: uppercase; width: fit-content; }
.brand-lockup img { display: none; }
.desktop-nav, .utility-nav { align-items: center; display: flex; font-size: .65rem; gap: clamp(.9rem, 1.7vw, 1.8rem); }
.desktop-nav { justify-self: center; }
.utility-nav { justify-self: end; }
.desktop-nav a, .utility-nav a, .utility-nav button, .footer-links a { position: relative; }
.desktop-nav a::after, .utility-nav a::after, .utility-nav button::after, .footer-links a::after { background: var(--orange); bottom: -.35rem; content: ""; height: 2px; left: 0; position: absolute; transform: scaleX(0); transform-origin: left; transition: transform 280ms var(--ease-out); width: 100%; }
.desktop-nav a:hover::after, .utility-nav a:hover::after, .utility-nav button:hover::after, .footer-links a:hover::after { transform: scaleX(1); transform-origin: left; }
.mobile-menu { display: none; }

.section-pad { padding-left: var(--gutter); padding-right: var(--gutter); }
.eyebrow { font-size: .64rem; letter-spacing: .11em; text-transform: uppercase; }
.text-link { align-items: center; border-bottom: 1px solid currentColor; display: inline-flex; font-size: .7rem; gap: 2.5rem; justify-content: space-between; letter-spacing: .08em; padding-bottom: .5rem; text-transform: uppercase; transition: color 200ms ease, gap 300ms var(--ease-out); }
.text-link:hover { color: var(--orange); gap: 3.25rem; }
.text-link--orange { color: var(--orange); }

.hero { display: grid; grid-template-areas: "copy art"; grid-template-columns: minmax(22rem, .78fr) minmax(0, 1.22fr); min-height: clamp(32rem, 65svh, 48rem); overflow: hidden; position: relative; }
.hero-logo-wrap { align-items: center; background: var(--purple); display: flex; justify-content: center; overflow: hidden; padding: clamp(2rem, 5vw, 5rem); position: relative; }
.hero-logo-wrap, .hero-copy { min-width: 0; }
.hero-logo-wrap { grid-area: art; }
.hero-logo-wrap::before, .hero-logo-wrap::after { background: var(--orange); content: ""; height: 140%; opacity: .16; position: absolute; transform: rotate(19deg); width: 1px; }
.hero-logo-wrap::before { left: 25%; }
.hero-logo-wrap::after { right: 22%; }
.hero-logo { position: relative; transform: rotate(3deg); width: min(31vw, 31rem); z-index: 2; }
.hero-logo-wrap > p { bottom: var(--gutter); font-size: .6rem; left: var(--gutter); letter-spacing: .1em; position: absolute; text-transform: uppercase; z-index: 3; }
.hero-copy { align-items: flex-start; background: var(--black-soft); display: flex; flex-direction: column; grid-area: copy; justify-content: center; padding: clamp(2rem, 5vw, 5rem) var(--gutter) clamp(5rem, 8vw, 8rem); }
.hero-copy h1 { font-size: clamp(4.5rem, 7vw, 7.25rem); font-weight: 900; letter-spacing: -.085em; line-height: .76; margin: 1rem 0 2rem; max-width: 100%; text-transform: uppercase; }
.hero-copy h1 em { color: var(--orange); font-style: normal; }
.hero-stamp { background: var(--orange); color: var(--black); font-size: .58rem; font-weight: 700; letter-spacing: .08em; padding: .3rem .45rem; text-transform: uppercase; transform: rotate(-2deg); }
.hero-lede { color: var(--muted); font-size: clamp(.86rem, 1.2vw, 1.05rem); max-width: 23rem; }
.hero-actions { align-items: flex-end; display: flex; justify-content: space-between; width: 100%; }
.hero-actions > p { color: var(--muted); font-size: .76rem; letter-spacing: .05em; text-transform: uppercase; }
.hero-button { align-items: center; background: var(--orange); color: var(--black); display: inline-flex; font-size: .68rem; font-weight: 700; gap: 2.6rem; letter-spacing: .08em; margin-top: clamp(2rem, 4vw, 4rem); padding: 1rem 1.1rem; text-transform: uppercase; transition: background 180ms ease, color 180ms ease; }
.hero-button:hover { background: var(--ink); }
.hero-ticker { align-items: center; background: var(--orange); bottom: 0; color: var(--black); display: flex; font-size: .64rem; font-weight: 700; gap: 5rem; height: 2.35rem; justify-content: space-around; left: 0; letter-spacing: .12em; overflow: hidden; position: absolute; right: 0; text-transform: uppercase; white-space: nowrap; z-index: 4; }

.drop-intro { background: var(--purple); padding-bottom: clamp(5rem, 8vw, 8rem); padding-top: clamp(5rem, 8vw, 8rem); }
.section-index { border-top: 1px solid var(--line); display: flex; font-size: .63rem; justify-content: space-between; padding-top: .8rem; }
.drop-grid { align-items: end; display: grid; gap: 3rem; grid-template-columns: minmax(0, 2fr) minmax(17rem, .78fr); margin-top: clamp(4.5rem, 10vw, 9rem); }
.drop-grid h2 { font-size: clamp(4rem, 8.5vw, 8.5rem); font-weight: 900; letter-spacing: -.085em; line-height: .78; text-transform: uppercase; }
.drop-copy { font-size: clamp(1rem, 1.45vw, 1.25rem); max-width: 30rem; }
.drop-facts { border-bottom: 1px solid var(--line); border-top: 1px solid var(--line); display: grid; font-size: .6rem; grid-template-columns: repeat(3, 1fr); letter-spacing: .08em; margin: 2rem 0; text-transform: uppercase; }
.drop-facts div { padding: .8rem 0; }
.drop-facts dt { color: #b9a9bf; }
.drop-facts dd { margin: .3rem 0 0; }
.prototype-copy { color: #b9a9bf; font-size: .63rem; letter-spacing: .08em; margin: 0 0 2rem; text-transform: uppercase; }

.collection-browser { background: var(--black-soft); padding: clamp(4rem, 7vw, 7rem) 0 1px; }
.collection-browser-head { align-items: end; display: flex; justify-content: space-between; margin-bottom: 2.5rem; }
.collection-browser-head h2 { font-size: clamp(2.6rem, 5vw, 5rem); font-weight: 900; letter-spacing: -.07em; line-height: .82; margin-top: 1.5rem; text-transform: uppercase; }
.collection-rail { display: grid; gap: 1px; grid-template-columns: repeat(5, minmax(0, 1fr)); overflow-x: auto; scrollbar-color: var(--orange) var(--black); }
.collection-tile { aspect-ratio: 3 / 4; min-width: 0; overflow: hidden; position: relative; }
.collection-tile--ash { background: #3b3937; }
.collection-tile--purple { background: var(--purple-bright); }
.collection-tile--bone { background: var(--bone); color: var(--black); }
.collection-tile--steel { background: #68645f; }
.collection-tile--orange { background: var(--orange); color: var(--black); }
.tile-index, .tile-name { font-size: .59rem; letter-spacing: .08em; position: absolute; text-transform: uppercase; z-index: 2; }
.tile-index { right: .8rem; top: .8rem; }
.tile-name { bottom: .8rem; left: .8rem; }
.tile-shape { background: #0b0b0b; bottom: 12%; height: 54%; left: 50%; position: absolute; transform: translateX(-50%); transition: transform 500ms var(--ease-out); width: 44%; }
.collection-tile:hover .tile-shape { transform: translateX(-50%) scale(1.06) rotate(-2deg); }
.tile-shape::before, .tile-shape::after { background: inherit; content: ""; height: 38%; position: absolute; top: 0; width: 40%; }
.tile-shape::before { left: -27%; transform: skewX(-12deg); }
.tile-shape::after { right: -27%; transform: skewX(12deg); }
.tile-shape--hood::before { border-radius: 50% 50% 0 0; height: 29%; left: 14%; top: -19%; transform: none; width: 72%; }
.tile-shape--crew { background: #f1ede4; }
.tile-shape--jacket { height: 64%; width: 47%; }
.tile-shape--jacket::after { background: var(--orange); height: 100%; right: 48%; top: 0; transform: none; width: 2px; }
.tile-shape--cap { border-radius: 50% 50% 8% 8%; height: 20%; top: 43%; width: 45%; }
.tile-shape--cap::before { bottom: -20%; height: 25%; left: 58%; top: auto; transform: skewX(-28deg); width: 54%; }
.tile-shape--cap::after { display: none; }

.catalogue { background: var(--black); padding-bottom: var(--section-space); padding-top: var(--section-space); }
.catalogue-head { align-items: end; display: flex; justify-content: space-between; }
.catalogue-head h2 { font-size: clamp(4rem, 10vw, 10rem); font-weight: 900; letter-spacing: -.085em; line-height: .75; margin-top: 2.5rem; text-transform: uppercase; }
.catalogue-note { color: var(--muted); max-width: 22rem; }
.catalogue-controls { align-items: center; border-bottom: 1px solid var(--line); border-top: 1px solid var(--line); display: grid; font-size: .62rem; grid-template-columns: 1fr auto 1fr; margin-top: clamp(3.5rem, 7vw, 7rem); min-height: 4rem; }
.filter-list, .density-list { align-items: center; display: flex; gap: clamp(1rem, 2vw, 2rem); }
.filter-list button, .density-list button { color: var(--muted); font-size: inherit; letter-spacing: inherit; }
.filter-list button.is-active, .filter-list button:hover, .density-list button[aria-pressed="true"], .density-list button:hover { color: var(--orange); }
.density-list > span { color: var(--muted); }
.catalogue-status { justify-self: end; }
.product-grid { display: grid; gap: 1px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 1px; }
.product-grid.is-compact { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.product[hidden] { display: none; }
.product { background: var(--black); min-width: 0; }
.product a { display: block; }
.product-media { aspect-ratio: 4 / 5; overflow: hidden; position: relative; }
.product-media--ash { background: #3c3b39; }
.product-media--bone { background: var(--bone); color: var(--black); }
.product-media--purple { background: var(--purple-bright); }
.product-media--steel { background: #6e6b66; }
.product-media--mockup { background: #141313; }
.product-media--mockup img { height: 100%; object-fit: cover; transition: filter 500ms ease, transform 700ms var(--ease-out); width: 100%; }
.product-media--mockup::after { border: 1px solid var(--orange); content: ""; inset: .75rem; opacity: 0; pointer-events: none; position: absolute; transform: scale(.92); transition: opacity 300ms ease, transform 500ms var(--ease-out); z-index: 1; }
.media-code { font-size: .58rem; letter-spacing: .1em; position: absolute; right: .9rem; text-transform: uppercase; top: .9rem; z-index: 2; }
.garment { background: #0a0a0a; bottom: 7%; height: 62%; left: 50%; position: absolute; transform: translateX(-50%); transition: transform 600ms var(--ease-out); width: 45%; }
.garment::before, .garment::after { background: inherit; content: ""; height: 40%; position: absolute; top: 0; width: 43%; }
.garment::before { left: -29%; transform: skewX(-11deg); }
.garment::after { right: -29%; transform: skewX(11deg); }
.garment--light { background: #efede7; }
.garment--hoodie { height: 64%; width: 49%; }
.garment--hoodie::before { border-radius: 50% 50% 0 0; height: 31%; left: 12%; top: -20%; transform: none; width: 76%; }
.garment--grey { background: #484744; }
.product a:hover .garment { transform: translateX(-50%) scale(1.05); }
.product a:hover .product-media--mockup img, .product a:focus-visible .product-media--mockup img { filter: contrast(1.08) saturate(1.14); transform: scale(1.075); }
.product a:hover .product-media--mockup::after, .product a:focus-visible .product-media--mockup::after { opacity: 1; transform: scale(1); }
.product a:hover .media-code, .product a:focus-visible .media-code { color: var(--orange); }
.product-meta { align-items: flex-start; border-bottom: 1px solid var(--line); display: flex; font-size: .62rem; justify-content: space-between; min-height: 5.25rem; padding: .8rem var(--gutter) 1.3rem; }
.product-meta h3, .product-meta p { font-size: inherit; font-weight: 400; }
.product-meta > div p { color: var(--muted); font-size: .56rem; margin-top: .3rem; }
.catalogue-foot { align-items: end; display: flex; justify-content: space-between; padding-top: 2rem; }
.catalogue-foot > p { color: var(--muted); font-size: .62rem; letter-spacing: .08em; text-transform: uppercase; }

.editorial { min-height: 100svh; overflow: hidden; position: relative; }
.editorial-art { background: #171516; inset: 0; overflow: hidden; position: absolute; }
.editorial-noise { background: var(--purple); height: 130%; left: 12%; position: absolute; top: -15%; transform: rotate(12deg); width: 42%; }
.editorial-art::after { background: var(--orange); content: ""; height: 120%; opacity: .72; position: absolute; right: 18%; top: -10%; transform: skewX(-9deg); width: 2.4%; }
.editorial-art img { filter: grayscale(1) contrast(1.15); left: 50%; opacity: .32; position: absolute; top: 50%; transform: translate(-50%, -50%) rotate(-8deg); width: min(52vw, 48rem); }
.editorial-art > p { bottom: var(--gutter); font-size: .6rem; left: var(--gutter); letter-spacing: .1em; position: absolute; text-transform: uppercase; }
.editorial-copy { bottom: clamp(4rem, 8vw, 8rem); left: var(--gutter); position: absolute; right: var(--gutter); z-index: 3; }
.editorial-copy h2 { font-size: clamp(4.5rem, 12vw, 12rem); font-weight: 900; letter-spacing: -.09em; line-height: .74; margin-top: 3rem; text-transform: uppercase; }
.editorial-copy > p:last-child { bottom: 0; font-size: .61rem; letter-spacing: .1em; position: absolute; right: 0; text-align: right; text-transform: uppercase; }

.statement { background: var(--orange); color: var(--black); min-height: 100svh; padding-bottom: 4rem; padding-top: var(--section-space); }
.statement .section-index { border-color: rgba(9, 9, 9, .35); }
.statement h2 { font-size: clamp(4rem, 10.5vw, 10.5rem); font-weight: 900; letter-spacing: -.09em; line-height: .78; margin-top: clamp(5rem, 10vw, 10rem); text-transform: uppercase; }
.statement-foot { align-items: end; border-top: 1px solid rgba(9, 9, 9, .35); display: grid; gap: 2rem; grid-template-columns: 1fr auto; margin-top: clamp(6rem, 13vw, 13rem); padding-top: 1rem; }
.statement-foot p { font-size: clamp(1rem, 1.7vw, 1.45rem); max-width: 36rem; }
.statement-foot span { font-size: .65rem; letter-spacing: .11em; text-transform: uppercase; }

.collection-feature { display: grid; grid-template-columns: 1.15fr .85fr; min-height: 100svh; }
.collection-art { background: #151414; min-height: 52rem; overflow: hidden; padding: var(--gutter); position: relative; }
.collection-art > span:first-child { font-size: .6rem; letter-spacing: .1em; position: relative; text-transform: uppercase; z-index: 2; }
.cut { height: 140%; position: absolute; top: -20%; transform: rotate(21deg); }
.cut--one { background: var(--purple); left: 13%; width: 23%; }
.cut--two { background: #5c5953; left: 41%; width: 28%; }
.cut--three { background: var(--orange); left: 72%; width: 2%; }
.collection-copy { align-items: flex-start; background: var(--purple); display: flex; flex-direction: column; justify-content: center; overflow: hidden; padding-bottom: 5rem; padding-top: 5rem; position: relative; }
.collection-copy h2 { font-size: clamp(4rem, 7.4vw, 7.6rem); font-weight: 900; letter-spacing: -.085em; line-height: .77; margin: 4rem 0; text-transform: uppercase; }
.collection-copy > p:not(.eyebrow, .collection-number) { color: #c7bacc; font-size: clamp(1rem, 1.4vw, 1.25rem); max-width: 29rem; }
.collection-copy .text-link { margin-top: 3rem; }
.collection-number { bottom: -.13em; color: var(--orange); font-size: clamp(10rem, 24vw, 24rem); font-weight: 900; left: -.07em; letter-spacing: -.1em; line-height: .7; opacity: .16; position: absolute; }

.newsletter { align-items: end; background: var(--black-soft); display: grid; gap: clamp(4rem, 10vw, 10rem); grid-template-columns: 1fr 1fr; min-height: 72svh; padding-bottom: var(--section-space); padding-top: var(--section-space); }
.newsletter h2 { font-size: clamp(4rem, 7.5vw, 7.5rem); font-weight: 900; letter-spacing: -.08em; line-height: .78; margin-top: 3rem; text-transform: uppercase; }
.newsletter-form label { display: block; font-size: .64rem; letter-spacing: .09em; margin-bottom: 1.25rem; text-transform: uppercase; }
.email-field { align-items: center; border-bottom: 1px solid var(--ink); display: flex; }
.email-field input { background: transparent; font-size: clamp(1.1rem, 2vw, 1.8rem); min-width: 0; outline: 0; padding: 1rem 0; width: 100%; }
.email-field input::placeholder { color: var(--muted); }
.email-field button { color: var(--orange); font-size: .7rem; letter-spacing: .08em; padding: 1rem 0 1rem 2rem; }
.form-note { color: var(--muted); font-size: .61rem; letter-spacing: .07em; margin-top: 1rem; text-transform: uppercase; }

.site-footer { background: var(--purple); overflow: hidden; padding: .85rem var(--gutter) .7rem; position: relative; }
.site-footer::before { background: url("../images/abstract-flow.png") center / cover no-repeat; content: ""; inset: 0; opacity: .88; position: absolute; }
.footer-top { align-items: start; display: grid; gap: 2rem; grid-template-columns: auto 1fr; overflow: hidden; padding-bottom: 1.2rem; position: relative; z-index: 1; }
.footer-brand { display: block; font-size: 1.05rem; font-weight: 900; letter-spacing: -.065em; line-height: .76; position: relative; text-transform: uppercase; width: fit-content; z-index: 1; }
.footer-brand span { display: block; }
.footer-brand img { display: none; }
.footer-links { display: grid; gap: 1.5rem; grid-template-columns: repeat(3, minmax(0, 1fr)); justify-self: end; position: relative; width: min(100%, 34rem); z-index: 1; }
.footer-links nav { align-items: flex-start; display: flex; flex-direction: column; gap: .42rem; }
.footer-links p { color: #b9a9bf; font-size: .54rem; letter-spacing: .09em; margin-bottom: .25rem; text-transform: uppercase; }
.footer-links a { font-size: .6rem; letter-spacing: .08em; text-transform: uppercase; }
.footer-bottom { border-top: 1px solid var(--line); display: grid; font-size: .53rem; grid-template-columns: 1fr 1fr 1fr; padding-top: .7rem; position: relative; z-index: 1; }
.footer-bottom p:nth-child(2) { text-align: center; }
.footer-bottom a { justify-self: end; }

.search-dialog { background: var(--purple); border: 0; color: var(--ink); height: 100%; margin: 0; max-height: none; max-width: none; padding: 0; width: 100%; }
.search-dialog::backdrop { background: rgba(0, 0, 0, .82); }
.search-dialog-inner { display: flex; flex-direction: column; min-height: 100%; padding: var(--gutter); }
.search-head { align-items: center; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; padding-bottom: 1rem; }
.search-head h2, .search-head button { font-size: .68rem; font-weight: 400; letter-spacing: .09em; text-transform: uppercase; }
.search-dialog form { align-items: center; display: grid; grid-template-columns: 1fr auto; margin: auto 0; }
.search-dialog form label { font-size: 0; }
.search-dialog input { background: transparent; border-bottom: 2px solid var(--orange); color: var(--ink); font-size: clamp(2.5rem, 8vw, 8rem); font-weight: 900; letter-spacing: -.06em; outline: 0; padding: 1rem 0; text-transform: uppercase; width: 100%; }
.search-dialog input::placeholder { color: #ab94b4; }
.search-dialog form button { color: var(--orange); margin-left: 2rem; }
.search-dialog-inner > p { font-size: .61rem; letter-spacing: .08em; text-transform: uppercase; }

.cart-drawer-backdrop { background: rgba(0,0,0,.55); border: 0; inset: 0; opacity: 0; padding: 0; pointer-events: none; position: fixed; transition: opacity 220ms ease; z-index: 70; }
.cart-drawer { background: var(--purple); border-left: 1px solid var(--line); bottom: 0; display: flex; flex-direction: column; max-width: min(31rem, 92vw); padding: var(--gutter); position: fixed; right: 0; top: 0; transform: translateX(103%); transition: transform 360ms var(--ease-out); visibility: hidden; width: 100%; z-index: 71; }
.cart-drawer.is-open { transform: translateX(0); visibility: visible; }
.cart-drawer.is-open + .cart-drawer-backdrop { opacity: 1; pointer-events: auto; }
.cart-drawer-head { align-items: center; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; padding-bottom: 1rem; }
.cart-drawer-head h2, .cart-drawer-close { font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.cart-drawer-close { color: var(--orange); }
.cart-drawer-copy { margin: auto 0; }
.cart-drawer-copy p:first-child { color: var(--orange); font-size: .62rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.cart-drawer-copy h3 { font-size: clamp(2.4rem, 7vw, 4.8rem); font-weight: 900; letter-spacing: -.085em; line-height: .76; margin: 1.1rem 0; text-transform: uppercase; }
.cart-drawer-copy > p:last-child { color: #c4b6ca; max-width:22rem; }
.cart-drawer .hero-button { margin-top: 2rem; }

.reveal { opacity: 0; transform: translateY(1.5rem); transition: opacity 650ms var(--ease-out), transform 650ms var(--ease-out); }
.reveal.is-visible { opacity: 1; transform: none; }

@media (max-width: 1050px) {
  .hero { grid-template-columns: minmax(18rem, .72fr) minmax(0, 1.28fr); }
  .desktop-nav, .utility-nav { gap: .9rem; }
  .product-grid.is-compact { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .footer-top { gap: 1.5rem; }
}

@media (max-width: 900px) {
  .site-header { grid-template-columns: 1fr auto; min-height: 3.25rem; }
  .desktop-nav, .utility-nav { display: none; }
  .mobile-menu { display: block; justify-self: end; }
  .mobile-menu summary { cursor: pointer; font-size: .66rem; list-style: none; text-transform: uppercase; }
  .mobile-menu summary::-webkit-details-marker { display: none; }
  .mobile-menu summary span::after { color: var(--orange); content: " +"; }
  .mobile-menu[open] summary span::after { content: " −"; }
  .mobile-menu-panel { background: var(--black); border-bottom: 1px solid var(--line); left: 0; overflow: hidden; padding: 2rem var(--gutter); position: absolute; right: 0; top: 100%; }
  .mobile-menu-panel nav { display: flex; flex-direction: column; }
  .mobile-menu-panel nav a { border-bottom: 1px solid var(--line); font-size: clamp(2.2rem, 10vw, 4rem); font-weight: 900; letter-spacing: -.06em; line-height: 1; padding: .55rem 0; text-transform: uppercase; }
  .mobile-utility { display: flex; flex-wrap: wrap; font-size: .63rem; gap: 1.5rem; margin-top: 2rem; text-transform: uppercase; }
  .hero { grid-template-areas: "copy" "art"; grid-template-columns: minmax(0, 1fr); }
  .hero-logo-wrap { min-height: 38svh; }
  .hero-logo { width: min(52vw, 25rem); }
  .hero-copy { min-height: 44svh; padding-bottom: 4.7rem; }
  .drop-grid { grid-template-columns: 1fr; }
  .drop-copy { margin-left: 25%; }
  .collection-browser-head { align-items: flex-start; }
  .collection-rail { grid-auto-columns: minmax(12rem, 42vw); grid-auto-flow: column; grid-template-columns: none; overscroll-behavior-inline: contain; }
  .product-grid, .product-grid.is-compact { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .catalogue-controls { gap: 1rem; grid-template-columns: 1fr auto; }
  .catalogue-status { display: none; }
  .collection-feature { grid-template-columns: 1fr; }
  .collection-art { min-height: 72svh; }
  .collection-copy { min-height: 75svh; }
  .newsletter { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .prototype-flag span:nth-child(2), .prototype-flag span:nth-child(3), .announcement-code { display: none; }
  .announcement { justify-content: flex-start; }
  .hero-logo-wrap { min-height: 34svh; }
  .hero-logo { width: min(58vw, 18rem); }
  .hero-copy { min-height: 43svh; padding-bottom: 4.7rem; }
  .hero-copy h1 { font-size: clamp(3.2rem, 16vw, 5rem); }
  .hero-copy h1 em span { display: block; }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 1.25rem; }
  .hero-ticker { justify-content: flex-start; padding-left: 1rem; }
  .drop-grid { grid-template-columns: minmax(0, 1fr); }
  .drop-grid > *, .catalogue-head > * { min-width: 0; }
  .drop-grid h2, .catalogue-head h2 { font-size: clamp(2.65rem, 14vw, 5rem); }
  .drop-copy { margin-left: 0; max-width: 22rem; }
  .drop-facts { font-size: .55rem; }
  .collection-browser-head { align-items: flex-start; flex-direction: column; gap: 2rem; }
  .collection-browser-head > div { min-width: 0; width: 100%; }
  .collection-browser-head h2 { font-size: clamp(2.2rem, 12vw, 4rem); max-width: 100%; }
  .collection-rail { grid-auto-columns: minmax(10.5rem, 61vw); }
  .catalogue-head { align-items: flex-start; flex-direction: column; gap: 2rem; }
  .catalogue-note { max-width: 18rem; }
  .catalogue-controls { align-items: flex-start; display: flex; flex-direction: column; padding-bottom: 1rem; padding-top: 1rem; }
  .density-list { display: none; }
  .product-grid, .product-grid.is-compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-meta { display: block; min-height: 6.4rem; padding-left: .75rem; padding-right: .75rem; }
  .product-meta > p { margin-top: 1rem; }
  .catalogue-foot { align-items: flex-start; flex-direction: column; gap: 2rem; }
  .editorial { min-height: 88svh; }
  .editorial-noise { left: -15%; width: 75%; }
  .editorial-art img { width: 85vw; }
  .editorial-copy h2, .statement h2 { font-size: clamp(3.7rem, 18vw, 5.8rem); }
  .editorial-copy > p:last-child { margin-top: 2rem; position: static; text-align: left; }
  .statement { min-height: 88svh; }
  .statement-foot { grid-template-columns: 1fr; }
  .statement-foot span { justify-self: end; }
  .collection-art { min-height: 65svh; }
  .collection-copy h2, .newsletter h2 { font-size: clamp(3.5rem, 17vw, 5.4rem); }
  .newsletter { min-height: 84svh; }
  .footer-top { gap: 1rem; min-height: 0; }
  .footer-brand { min-width: 0; }
  .footer-links { gap: 1rem 1.5rem; grid-template-columns: repeat(2, minmax(0, 1fr)); min-width: 0; }
  .footer-bottom { gap: .75rem; grid-template-columns: 1fr auto; }
  .footer-bottom p:nth-child(2) { display: none; }
  .search-dialog form { display: block; }
  .search-dialog input { font-size: clamp(1.8rem, 8.6vw, 3rem); letter-spacing: -.04em; }
  .search-dialog form button { margin: 1rem 0 0; }
}

/* Simplified homepage */
.home-simple .drop-intro, .home-simple .collection-browser, .home-simple .editorial, .home-simple .statement, .home-simple .collection-feature, .home-simple .newsletter { display: none; }
.home-simple .catalogue { padding-bottom: clamp(2rem, 4vw, 3.5rem); padding-top: clamp(1.5rem, 2.5vw, 2.75rem); }
.home-simple .catalogue-head { align-items: end; }
.home-simple .catalogue-head h2 { font-size: clamp(3.5rem, 7vw, 7rem); line-height: .75; margin-top: .65rem; }
.catalogue-view-all { align-items: center; border: 1px solid var(--ink); display: inline-flex; font-size: .65rem; font-weight: 700; gap: 2.5rem; letter-spacing: .08em; padding: .85rem 1rem; text-transform: uppercase; transition: background-color 180ms ease, color 180ms ease; }
.catalogue-view-all:hover { background: var(--ink); color: var(--black); }
.home-simple .catalogue-controls, .home-simple .catalogue-foot { display: none; }
.home-simple .product-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); margin-top: clamp(1.5rem, 2.5vw, 2.5rem); }
.home-simple .product-media { aspect-ratio: 4 / 5; }
.home-simple .site-footer { border-top: 1px solid var(--line); }
.home-collections { background: var(--black-soft); border-top: 1px solid var(--line); padding-top: clamp(1.5rem, 3vw, 3rem); }
.home-collections-head { align-items: end; display: flex; justify-content: space-between; margin-bottom: clamp(2rem, 4vw, 4rem); }
.home-collections-head h2 { font-size: clamp(3.4rem, 6.5vw, 6.5rem); font-weight: 900; letter-spacing: -.09em; line-height: .73; margin-top: .85rem; text-transform: uppercase; }
.collection-showcase-grid { display: grid; gap: 1px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.collection-showcase-card { background: var(--black); display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(9rem, .92fr); min-width: 0; overflow: hidden; position: relative; }
.collection-showcase-image { min-height: clamp(17rem, 31vw, 31rem); overflow: hidden; }
.collection-showcase-image img { height: 100%; object-fit: cover; transition: filter 400ms ease, transform 700ms var(--ease-out); width: 100%; }
.collection-showcase-copy { display: flex; flex-direction: column; justify-content: space-between; padding: 1rem; position: relative; z-index: 2; }
.collection-showcase-art { min-width: 0; overflow: hidden; position: relative; z-index: 2; }
.collection-showcase-art img { height: 100%; inset: 0; object-fit: cover; object-position: center; position: absolute; transition: filter 450ms ease, opacity 420ms ease, transform 720ms var(--ease-out); width: 100%; }
.collection-showcase-art__open { opacity: 0; transform: scale(1.04) translateY(-1.4%); }
.collection-showcase-art__cta { align-items: center; background: rgba(8, 8, 8, .88); border: 1px solid rgba(255, 247, 235, .82); bottom: .85rem; color: var(--ink); display: flex; font-size: .56rem; font-weight: 700; gap: .8rem; justify-content: space-between; left: .85rem; letter-spacing: .08em; opacity: 0; padding: .7rem .75rem; pointer-events: none; position: absolute; text-transform: uppercase; transform: translateY(.65rem); transition: opacity 220ms ease, transform 360ms var(--ease-out); z-index: 2; }
.collection-showcase-art__cta b { color: var(--orange); font-size: .9rem; line-height: .5; }
.collection-showcase-card--animals .collection-rain { z-index: 3; }
.collection-showcase-copy small, .collection-showcase-copy em { font-size: .59rem; font-style: normal; letter-spacing: .08em; text-transform: uppercase; }
.collection-showcase-copy small { color: var(--muted); }
.collection-showcase-copy strong { font-size: clamp(1.8rem, 3.2vw, 3.6rem); font-weight: 900; letter-spacing: -.085em; line-height: .76; text-transform: uppercase; }
.collection-showcase-copy em { align-items: center; display: flex; gap: .65rem; }
.collection-showcase-copy b { color: var(--orange); font-size: 1.15rem; transition: transform 250ms var(--ease-out); }
.collection-showcase-card:hover .collection-showcase-image img, .collection-showcase-card:focus-visible .collection-showcase-image img { filter: contrast(1.1) saturate(1.1); transform: scale(1.06); }
.collection-showcase-card--animals:hover .collection-showcase-art__closed, .collection-showcase-card--animals:focus-visible .collection-showcase-art__closed { filter: contrast(1.08) saturate(1.08); opacity: 0; transform: scale(.98); }
.collection-showcase-card--animals:hover .collection-showcase-art__open, .collection-showcase-card--animals:focus-visible .collection-showcase-art__open { filter: contrast(1.12) saturate(1.12); opacity: 1; transform: scale(1); }
.collection-showcase-card--animals:hover .collection-showcase-art__cta, .collection-showcase-card--animals:focus-visible .collection-showcase-art__cta { opacity: 1; transform: translateY(0); }
.collection-showcase-card:hover .collection-showcase-copy b, .collection-showcase-card:focus-visible .collection-showcase-copy b { transform: translateX(.4rem); }
.collection-rain { display: block; inset: 0; overflow: hidden; pointer-events: none; position: absolute; z-index: 1; }
.rain-object { height: 1.6rem; left: var(--x); opacity: 0; position: absolute; top: -2rem; width: var(--size); }
.rain-cigarette { background: url("../images/cigarette.svg") center / contain no-repeat; }
.rain-logo { background: url("../images/get-strong-or-die-logo-v2.png") center / contain no-repeat; height: var(--size); width: var(--size); }
.rain-dildo { background: url("../images/dildo.svg") center / contain no-repeat; filter: var(--tone); height: 2.5rem; width: calc(var(--size) * 1.25); }
/* Six skin-tone treatments and silicone colors remain mixed even in reduced motion. */
.rain-dildo:nth-child(1), .rain-dildo:nth-child(9) { --tone: brightness(1.28) saturate(.65); }
.rain-dildo:nth-child(2), .rain-dildo:nth-child(14) { --tone: brightness(1.12) saturate(.85); }
.rain-dildo:nth-child(3), .rain-dildo:nth-child(10) { --tone: none; }
.rain-dildo:nth-child(5), .rain-dildo:nth-child(11) { --tone: brightness(.86) saturate(1.08); }
.rain-dildo:nth-child(6), .rain-dildo:nth-child(13) { --tone: brightness(.7) saturate(1.12); }
.rain-dildo:nth-child(7), .rain-dildo:nth-child(15) { --tone: brightness(.55) saturate(1.13); }
.rain-dildo:nth-child(4) { --tone: sepia(.3) hue-rotate(290deg) saturate(2.5); }
.rain-dildo:nth-child(8) { --tone: sepia(1) hue-rotate(150deg) saturate(2.2); }
.rain-dildo:nth-child(12) { --tone: sepia(1) hue-rotate(220deg) saturate(2.4); }
.rain-dildo:nth-child(16) { --tone: sepia(1) hue-rotate(65deg) saturate(2); }
.rain-dildo:nth-child(17) { --tone: sepia(1) hue-rotate(260deg) saturate(2.5); }
.rain-object:nth-child(3n) { --size: 4.35rem; }
.rain-object:nth-child(3n + 1) { --size: 5.15rem; }
.rain-object:nth-child(3n + 2) { --size: 4.75rem; }
.rain-object:nth-child(odd) { --tilt: -26deg; --sway: 38deg; --soft-spin: 82deg; --flip: 1; }
.rain-object:nth-child(even) { --tilt: 21deg; --sway: -41deg; --soft-spin: -78deg; --flip: -1; }
.rain-object:nth-child(1) { --x: 2%; --duration: 2.7s; --delay: 0s; --drift: 20px; --spin: 210deg; }
.rain-object:nth-child(2) { --x: 36%; --duration: 4.1s; --delay: .25s; --drift: -26px; --spin: -160deg; }
.rain-object:nth-child(3) { --x: 70%; --duration: 3.2s; --delay: .62s; --drift: 16px; --spin: 180deg; }
.rain-object:nth-child(4) { --x: 18%; --duration: 3.8s; --delay: .12s; --drift: -17px; --spin: -230deg; }
.rain-object:nth-child(5) { --x: 54%; --duration: 2.95s; --delay: .87s; --drift: 21px; --spin: 165deg; }
.rain-object:nth-child(6) { --x: 82%; --duration: 4.35s; --delay: .4s; --drift: -20px; --spin: -195deg; }
.rain-object:nth-child(7) { --x: 8%; --duration: 3.45s; --delay: 1.15s; --drift: 23px; --spin: 215deg; }
.rain-object:nth-child(8) { --x: 46%; --duration: 2.85s; --delay: .72s; --drift: -14px; --spin: -245deg; }
.rain-object:nth-child(9) { --x: 76%; --duration: 3.7s; --delay: 1.48s; --drift: 18px; --spin: 175deg; }
.rain-object:nth-child(10) { --x: 28%; --duration: 4s; --delay: .55s; --drift: -25px; --spin: -190deg; }
.rain-object:nth-child(11) { --x: 63%; --duration: 2.75s; --delay: 1.78s; --drift: 22px; --spin: 235deg; }
.rain-object:nth-child(12) { --x: 0%; --duration: 3.35s; --delay: 1.03s; --drift: -12px; --spin: -215deg; }
.rain-object:nth-child(13) { --x: 50%; --duration: 4.2s; --delay: 1.32s; --drift: 17px; --spin: 170deg; }
.rain-object:nth-child(14) { --x: 85%; --duration: 2.9s; --delay: 1.93s; --drift: -22px; --spin: -225deg; }
.rain-object:nth-child(15) { --x: 22%; --duration: 3.65s; --delay: 1.62s; --drift: 15px; --spin: 195deg; }
.rain-object:nth-child(16) { --x: 68%; --duration: 4.4s; --delay: 2.15s; --drift: -18px; --spin: -185deg; }
.rain-object:nth-child(17) { --x: 40%; --duration: 3.05s; --delay: 2.38s; --drift: 24px; --spin: 240deg; }
.collection-showcase-card--animals:hover .rain-object, .collection-showcase-card--animals:focus-visible .rain-object, .collection-showcase-card--two:hover .rain-object, .collection-showcase-card--two:focus-visible .rain-object { animation: cigarette-fall var(--duration) linear var(--delay) infinite; }
@keyframes cigarette-fall {
  0% { opacity: .98; top: -2rem; transform: translateX(0) rotate(var(--tilt)) scaleX(var(--flip)); }
  50% { transform: translateX(var(--drift)) rotate(var(--sway)) scaleX(var(--flip)); }
  92% { opacity: .98; }
  100% { opacity: 0; top: calc(100% + 2rem); transform: translateX(var(--drift)) rotate(var(--spin)) scaleX(var(--flip)); }
}
@keyframes cigarette-fall-gentle {
  0% { opacity: .95; top: -2rem; transform: rotate(var(--tilt)) scaleX(var(--flip)); }
  55% { transform: rotate(var(--sway)) scaleX(var(--flip)); }
  92% { opacity: .95; }
  100% { opacity: 0; top: calc(100% + 2rem); transform: rotate(var(--soft-spin)) scaleX(var(--flip)); }
}

@media (max-width: 900px) {
  .home-simple .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .home-simple .catalogue-head { align-items: flex-start; flex-direction: row; justify-content: space-between; }
  .catalogue-view-all { font-size: .58rem; gap: .75rem; padding: .7rem .75rem; }
  .home-simple .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-collections-head { align-items: flex-start; }
  .collection-showcase-grid { grid-auto-columns: minmax(17rem, 78vw); grid-auto-flow: column; grid-template-columns: none; overflow-x: auto; scrollbar-width: thin; }
  .collection-showcase-card { grid-template-columns: 1.05fr .95fr; }
  .collection-showcase-art__cta { bottom: .45rem; font-size: .4rem; gap: .28rem; left: .45rem; letter-spacing: .04em; padding: .42rem; white-space: nowrap; }
  .collection-showcase-art__cta b { font-size: .68rem; }
}

/* All collections — offline collection architecture preview */
.collections-intro { background: var(--purple); min-height: clamp(20rem, 36svh, 29rem); padding-bottom: clamp(2.5rem, 5vw, 4rem); padding-top: clamp(2.5rem, 5vw, 4rem); }
.collections-intro h1 { font-size: clamp(4.5rem, 9vw, 8rem); font-weight: 900; letter-spacing: -.1em; line-height: .7; margin: clamp(2rem, 4vw, 3.5rem) 0 1.5rem; text-transform: uppercase; }
.collections-intro h1 em { color: var(--orange); font-style: normal; }
.collections-intro > p:last-child { color: #c4b6ca; max-width: 30rem; }
.collections-index { display: grid; gap: 1px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.collection-index-card { display: flex; flex-direction: column; justify-content: space-between; min-height: clamp(20rem, 34vw, 32rem); overflow: hidden; padding: 1rem; position: relative; transition: color 250ms ease; }
.collection-index-card::after { border: 1px solid currentColor; content: ""; inset: 1rem; opacity: 0; position: absolute; transform: scale(.94); transition: opacity 250ms ease, transform 500ms var(--ease-out); }
.collection-index-card:hover::after, .collection-index-card:focus-visible::after { opacity: .75; transform: scale(1); }
.collection-index-card--purple { background: var(--purple); }
.collection-index-card--bone { background: var(--bone); color: var(--black); }
.collection-index-card--orange { background: var(--orange); color: var(--black); }
.collection-index-card--ash { background: #3a3837; }
.collection-index-card span, .collection-index-card small { font-size: .62rem; font-weight: 700; letter-spacing: .08em; position: relative; text-transform: uppercase; z-index: 1; }
.collection-index-card strong { font-size: clamp(2.7rem, 4.5vw, 5rem); font-weight: 900; letter-spacing: -.085em; line-height: .76; max-width: 8ch; position: relative; text-transform: uppercase; z-index: 1; }
.collection-index-card small { align-items: center; display: flex; justify-content: space-between; }
.collection-index-card b { font-size: 1rem; }
.collections-note { color: var(--muted); font-size: .65rem; letter-spacing: .08em; padding-bottom: clamp(3rem, 7vw, 6rem); padding-top: 1rem; text-transform: uppercase; }

@media (max-width: 900px) {
  .collections-index { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .collections-intro { min-height: 20rem; }
  .collections-index { grid-template-columns: 1fr; }
  .collection-index-card { min-height: 18rem; }
}

/* Collection, search, and bag pages */
.collection-page-hero { background: var(--purple); display: grid; gap: 2rem; grid-template-columns: minmax(0, .8fr) minmax(16rem, 1.15fr); min-height: clamp(29rem, 52svh, 38rem); padding-bottom: clamp(2.5rem, 5vw, 4.5rem); padding-top: clamp(3rem, 6vw, 5rem); position: relative; }
.collection-page-hero h1, .utility-page h1, .search-page h1 { font-size: clamp(4.2rem, 8vw, 7.5rem); font-weight: 900; letter-spacing: -.09em; line-height: .72; margin-top: clamp(2.5rem, 5vw, 4.5rem); text-transform: uppercase; }
.collection-page-hero h1 em, .utility-page h1 em, .search-page h1 em { color: var(--orange); font-style: normal; }
.collection-page-art { align-items: center; background: #171516; display: flex; justify-content: center; min-height: 22rem; overflow: hidden; position: relative; }
.collection-page-art img { opacity: .8; transform: rotate(-7deg); width: min(24vw, 20rem); }
.collection-page-art p { bottom: 1rem; font-size: .6rem; left: 1rem; letter-spacing: .08em; position: absolute; text-transform: uppercase; }
.collection-page-copy { display: flex; flex-direction: column; justify-content: space-between; min-height: 22rem; }
.collection-page-intro { max-width: 25rem; }
.collection-page-intro > p, .utility-page-copy p { color: var(--muted); font-size: 1rem; margin-bottom: 2rem; }
.collection-products { padding-bottom: var(--section-space); padding-top: var(--section-space); }
.collection-products-head { align-items: end; display: flex; justify-content: space-between; margin-bottom: clamp(2.5rem, 6vw, 5rem); }
.collection-products-head h2 { font-size: clamp(3.5rem, 8vw, 8rem); font-weight: 900; letter-spacing: -.08em; line-height: .75; text-transform: uppercase; }
.collection-product-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }

.animals-hero { background: var(--purple); display: grid; grid-template-columns: minmax(20rem, .9fr) minmax(0, 1.1fr); min-height: clamp(34rem, 74svh, 52rem); overflow: hidden; }
.animals-hero-copy { align-items: flex-start; display: flex; flex-direction: column; justify-content: center; padding-bottom: clamp(3rem, 7vw, 7rem); padding-top: clamp(3rem, 7vw, 7rem); position: relative; }
.animals-hero-copy .eyebrow { color: var(--orange); font-weight: 800; }
.animals-hero-copy h1 { font-size: clamp(4.4rem, 8.4vw, 9.5rem); font-weight: 900; letter-spacing: -.1em; line-height: .69; margin: 2rem 0; text-transform: uppercase; }
.animals-hero-copy h1 em { color: var(--orange); font-style: normal; }
.animals-hero-copy > p:not(.eyebrow) { color: #d5c9d8; font-size: clamp(.95rem, 1.4vw, 1.2rem); max-width: 25rem; }
.animals-hero-copy .hero-button { margin-top: 2.4rem; }
.animals-hero-copy small { bottom: 1.2rem; color: var(--muted); font-size: .58rem; letter-spacing: .08em; position: absolute; text-transform: uppercase; }
.animals-pack { background: #1a1514; min-height: 30rem; overflow: hidden; position: relative; }
.animals-pack::after { background: linear-gradient(90deg, rgba(0,0,0,.14), transparent 34%, transparent 74%, rgba(0,0,0,.2)), linear-gradient(0deg, rgba(0,0,0,.24), transparent 34%); content: ''; inset: 0; pointer-events: none; position: absolute; z-index: 2; }
.animals-pack img { height: 100%; inset: 0; object-fit: cover; object-position: 50% 32%; position: absolute; transition: filter 520ms ease, opacity 460ms ease, transform 900ms var(--ease-out); width: 100%; z-index: 1; }
.animals-pack-closed { transform: scale(1.12); }.animals-pack-open { opacity: 0; transform: scale(1.14) translateY(1%); }
.animals-pack-prompt { bottom: 1.25rem; font-size: .62rem; left: 1.25rem; letter-spacing: .09em; line-height: 1.45; position: absolute; text-transform: uppercase; z-index: 5; }.animals-pack-prompt b { color: var(--orange); font-size: 1.2rem; }
.animals-pack:is(:hover, :focus, .is-lit) .animals-pack-closed { filter: contrast(1.05) saturate(1.06); opacity: 0; transform: scale(1.1); }.animals-pack:is(:hover, :focus, .is-lit) .animals-pack-open { filter: contrast(1.06) saturate(1.08); opacity: 1; transform: scale(1.15); }
.animals-smoke { inset: 0; overflow: hidden; pointer-events: none; position: absolute; z-index: 4; }.animals-smoke::before { background: radial-gradient(ellipse 44% 66% at 7% 108%, rgba(228,235,233,.58), transparent 72%), radial-gradient(ellipse 48% 72% at 52% 112%, rgba(228,235,233,.5), transparent 72%), radial-gradient(ellipse 43% 67% at 100% 108%, rgba(228,235,233,.58), transparent 72%); content: ''; filter: blur(15px); inset: 0 -8% -8%; opacity: 0; position: absolute; transition: opacity 500ms ease; }.animals-smoke i { background: radial-gradient(ellipse at 50% 72%, rgba(238,241,239,.74) 0%, rgba(206,214,212,.48) 35%, rgba(168,181,180,.2) 58%, transparent 76%); border-radius: 50%; bottom: -32%; filter: blur(10px); height: 26rem; left: 14%; mix-blend-mode: screen; opacity: 0; position: absolute; transform: translate(-50%, 0) scale(.5); width: 31%; z-index: 1; }.animals-pack:is(:hover, :focus, .is-lit) .animals-smoke::before { opacity: .44; }.animals-pack:is(:hover, :focus, .is-lit) .animals-smoke i { animation: bear-smoke 5.2s ease-out infinite both; }.animals-pack:is(:hover, :focus, .is-lit) .animals-smoke i:nth-child(1) { animation-delay: -.35s; left: 12%; }.animals-pack:is(:hover, :focus, .is-lit) .animals-smoke i:nth-child(2) { animation-delay: -1.2s; left: 33%; }.animals-pack:is(:hover, :focus, .is-lit) .animals-smoke i:nth-child(3) { animation-delay: -2.05s; left: 53%; }.animals-pack:is(:hover, :focus, .is-lit) .animals-smoke i:nth-child(4) { animation-delay: -2.9s; left: 73%; }.animals-pack:is(:hover, :focus, .is-lit) .animals-smoke i:nth-child(5) { animation-delay: -3.75s; left: 91%; }.animals-pack:is(:hover, :focus, .is-lit) .animals-smoke i:nth-child(6) { animation-delay: -4.6s; left: 43%; }
@keyframes bear-smoke { 0% { opacity: 0; transform: translate(-50%, 16%) rotate(-8deg) scale(.5); } 14% { opacity: .72; } 56% { opacity: .4; } 100% { opacity: 0; transform: translate(-58%, -122%) rotate(12deg) scale(1.32); } }
.animals-manifest { align-items: end; background: #e6dfd0; color: var(--black); display: grid; gap: 3rem; grid-template-columns: .6fr 1.2fr .9fr; padding-bottom: clamp(4rem, 8vw, 8rem); padding-top: clamp(4rem, 8vw, 8rem); }
.animals-manifest > p { font-size: .6rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }.animals-manifest h2 { font-size: clamp(3rem, 6.6vw, 7rem); font-weight: 900; letter-spacing: -.09em; line-height: .72; text-transform: uppercase; }.animals-manifest h2 em { color: var(--orange); font-style: normal; }
.animals-manifest > div > p { font-size: clamp(.95rem, 1.35vw, 1.16rem); line-height: 1.4; margin-bottom: 2rem; max-width: 24rem; }.animals-manifest .text-link { color: var(--orange); }
.animals-products { background: var(--black); padding-top: clamp(4rem, 8vw, 8rem); }.animals-products-head { align-items: end; display: flex; gap: 2rem; justify-content: space-between; padding-bottom: clamp(2rem, 4vw, 4rem); }.animals-products-head .eyebrow { color: var(--orange); font-weight: 700; }.animals-products-head h2 { font-size: clamp(4rem, 8vw, 9rem); font-weight: 900; letter-spacing: -.1em; line-height: .67; margin-top: 1rem; text-transform: uppercase; }.animals-products-head > p { color: var(--muted); font-size: .82rem; max-width: 18rem; }
.animals-product-grid { display: grid; gap: 1px; grid-template-columns: repeat(3, minmax(0, 1fr)); }.animals-product-card a { background: #151414; display: block; min-height: min(64vw, 48rem); overflow: hidden; position: relative; }.animals-product-card img { height: 100%; inset: 0; object-fit: cover; position: absolute; transition: filter 400ms ease, transform 900ms var(--ease-out); width: 100%; }.animals-product-card a::after { background: linear-gradient(transparent 50%, rgba(0,0,0,.92)); content: ''; inset: 0; position: absolute; }.animals-product-card span { bottom: 0; display: flex; flex-direction: column; gap: .35rem; left: 0; padding: 1.25rem; position: absolute; right: 0; z-index: 1; }.animals-product-card small { color: var(--orange); font-size: .58rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }.animals-product-card strong { font-size: clamp(1.5rem, 3vw, 3.4rem); font-weight: 900; letter-spacing: -.075em; line-height: .78; text-transform: uppercase; transition: transform 340ms var(--ease-out); }.animals-product-card b { font-size: .65rem; letter-spacing: .07em; margin-top: .5rem; text-transform: uppercase; }.animals-product-card a:hover img, .animals-product-card a:focus-visible img { filter: contrast(1.06) saturate(1.08); transform: scale(1.015); }.animals-product-card a:hover strong, .animals-product-card a:focus-visible strong { transform: translateX(.32rem); }
.animals-exit { align-items: center; background: var(--purple); display: grid; gap: 1rem; grid-template-columns: 1fr auto 1fr; min-height: 6rem; }.animals-exit p, .animals-exit a { font-size: .62rem; letter-spacing: .08em; text-transform: uppercase; }.animals-exit a:nth-child(2) { justify-self: center; }.animals-exit a:last-child { justify-self: end; }.animals-exit a:last-child span { color: var(--orange); font-size: 1rem; }
.utility-page, .search-page { min-height: clamp(28rem, 58svh, 40rem); padding-bottom: clamp(3rem, 6vw, 5rem); padding-top: clamp(3rem, 6vw, 5rem); }
.utility-page h1, .search-page h1 { margin-bottom: clamp(2.5rem, 5vw, 4.5rem); }
.utility-page-copy { max-width: 31rem; }
.prototype-search-form { border-bottom: 1px solid var(--line); border-top: 1px solid var(--line); display: grid; gap: 1rem; max-width: 64rem; padding: 1rem 0; }
.prototype-search-form label, .prototype-search-form p { font-size: .62rem; letter-spacing: .08em; text-transform: uppercase; }
.prototype-search-form p { color: var(--muted); }
.prototype-search-form input { background: transparent; color: var(--ink); font-size: clamp(1.8rem, 5vw, 4.5rem); font-weight: 900; letter-spacing: -.06em; outline: 0; padding: .5rem 0; text-transform: uppercase; width: 100%; }
.prototype-search-form input::placeholder { color: #5f5a53; }
.search-results { border-top: 1px solid var(--line); margin-top: 3rem; max-width: 64rem; }
.search-results a { align-items: center; border-bottom: 1px solid var(--line); display: flex; font-size: clamp(1.4rem, 3.5vw, 3rem); font-weight: 800; justify-content: space-between; letter-spacing: -.05em; padding: 1rem 0; text-transform: uppercase; }
.search-results a span { color: var(--muted); font-size: .62rem; font-weight: 400; letter-spacing: .06em; text-align: right; }
.search-results a:hover { color: var(--orange); }

@media (max-width: 900px) {
  .collection-page-hero { grid-template-columns: 1fr; }
  .collection-page-art { min-height: 38svh; }
  .collection-page-art img { width: min(60vw, 28rem); }
  .collection-product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .collection-page-hero { min-height: auto; }
  .collection-page-hero h1, .utility-page h1, .search-page h1 { font-size: clamp(4rem, 20vw, 6.2rem); margin-top: 3rem; }
  .collection-page-art { min-height: 42svh; }
  .collection-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .search-results a { align-items: flex-start; flex-direction: column; gap: .6rem; }
  .search-results a span { text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
  .rain-object:nth-child(n+13) { display: none; }
  .collection-showcase-card--animals:hover .rain-object, .collection-showcase-card--animals:focus-visible .rain-object, .collection-showcase-card--two:hover .rain-object, .collection-showcase-card--two:focus-visible .rain-object { animation-name: cigarette-fall-gentle; }
}

/* Shop All — offline catalogue prototype */
.shop-intro { background: var(--purple); overflow: hidden; padding-bottom: clamp(1.5rem, 3vw, 2.5rem); padding-top: clamp(1.5rem, 3vw, 2.5rem); position: relative; }
.shop-intro-top, .shop-intro-foot { border-top: 1px solid var(--line); display: flex; font-size: .63rem; justify-content: space-between; letter-spacing: .08em; padding-top: .8rem; position: relative; text-transform: uppercase; z-index: 3; }
.shop-intro-stage { margin: clamp(.8rem, 1.8vw, 1.5rem) 0; position: relative; z-index: 3; }
.shop-intro-copy { position: relative; z-index: 4; }
.shop-intro h1 { font-size: clamp(3.6rem, 6vw, 6.8rem); font-weight: 900; letter-spacing: -.1em; line-height: .7; margin: 0; text-transform: uppercase; white-space: nowrap; }
.shop-intro h1 em { color: var(--orange); display: inline-block; font-style: normal; transition: transform 420ms var(--ease-out); }
.shop-intro:hover h1 em { transform: translateX(.12em) skewX(-5deg); }
.shop-ticket-rain { inset: 0; overflow: hidden; pointer-events: none; position: absolute; z-index: 1; }
.shop-ticket-rain .rain-object { --flip: 1; opacity: 0; }
.shop-ticket-rain .rain-object:nth-child(3n) { --duration: 1.45s; }
.shop-ticket-rain .rain-object:nth-child(3n + 1) { --duration: 1.8s; }
.shop-ticket-rain .rain-object:nth-child(3n + 2) { --duration: 2.15s; }
.shop-intro:hover .shop-ticket-rain .rain-object, .shop-intro:focus-within .shop-ticket-rain .rain-object { animation: cigarette-fall var(--duration) linear var(--delay) infinite; }
.shop-intro-tape { background: var(--orange); color: var(--black); font-size: .6rem; font-weight: 800; letter-spacing: .08em; margin: 0; overflow: hidden; position: sticky; text-transform: uppercase; top: 0; transform: rotate(-.35deg); white-space: nowrap; z-index: 30; }
.shop-intro-tape > div { align-items: center; animation: shop-stock-tape 22s linear infinite; display: flex; min-height: 1.9rem; width: max-content; }
.shop-intro-tape span { padding: 0 1.2rem; }
.shop-intro-tape i { font-style: normal; }
.shop-intro-foot { align-items: end; }
.shop-intro-foot p:first-child { color: #c4b6ca; letter-spacing: 0; max-width: 28rem; text-transform: none; }

.product-detail { background: var(--black); }
.product-breadcrumb { align-items: center; border-bottom: 1px solid var(--line); display: flex; flex-wrap: wrap; font-size: .62rem; gap: .55rem; letter-spacing: .08em; min-height: 3.2rem; text-transform: uppercase; }
.product-breadcrumb a { color: var(--muted); transition: color 180ms ease; }
.product-breadcrumb a:hover { color: var(--orange); }
.product-detail-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(21rem, .8fr); }
.product-gallery { background: #171615; display: grid; gap: 1px; grid-template-columns: minmax(0, 1fr) minmax(8rem, .33fr); min-width: 0; }
.product-gallery.reveal { clip-path: inset(0 0 8% 0); opacity: 1; transform: none; transition: clip-path 850ms var(--ease-out); }
.product-gallery.reveal.is-visible { clip-path: inset(0 0 0 0); }
.product-gallery-main, .product-gallery-detail { margin: 0; min-height: min(72vw, 48rem); overflow: hidden; position: relative; }
.product-gallery-main img, .product-gallery-detail img { height: 100%; inset: 0; object-fit: cover; position: absolute; transition: transform 900ms var(--ease-out), filter 600ms ease; width: 100%; }
.product-gallery-main:hover img { filter: contrast(1.05) saturate(1.08); transform: scale(1.015); }
.product-gallery-main figcaption { align-items: center; bottom: 0; color: var(--ink); display: flex; font-size: .58rem; justify-content: space-between; left: 0; letter-spacing: .08em; padding: .9rem 1rem; position: absolute; right: 0; text-transform: uppercase; z-index: 1; }
.product-gallery-main figcaption::before { background: linear-gradient(transparent, rgba(0,0,0,.82)); content: ''; inset: -5rem 0 0; position: absolute; z-index: -1; }
.product-gallery-detail { background: var(--purple); }
.product-gallery-detail img { object-position: 54% 31%; transform: scale(2.35); }
.product-gallery-detail:hover img { transform: scale(2.52) rotate(1deg); }
.product-gallery-detail span { bottom: 1rem; font-size: .56rem; left: 1rem; letter-spacing: .09em; line-height: 1.5; position: absolute; text-transform: uppercase; }
.product-buy-panel { align-self: start; border-left: 1px solid var(--line); padding-bottom: clamp(2rem, 4vw, 4rem); padding-top: clamp(1.5rem, 3vw, 3rem); position: sticky; top: 3.5rem; }
.product-buy-panel .eyebrow { color: var(--orange); font-weight: 700; }
.product-title-line { margin-top: 1rem; }
.product-title-line h1 { font-size: clamp(2.8rem, 4.7vw, 5.6rem); font-weight: 900; letter-spacing: -.085em; line-height: .77; max-width: 11ch; text-transform: uppercase; }
.product-title-line > p { color: var(--orange); font-size: .72rem; font-weight: 700; letter-spacing: .06em; margin-top: .85rem; white-space: nowrap; }
.product-fit { color: var(--muted); font-size: .82rem; margin-top: 1.6rem; max-width: 24rem; }
.product-divider { border-top: 1px solid var(--line); margin: 2rem 0 1.25rem; }
.product-sizes { border: 0; margin: 0; padding: 0; }
.product-sizes legend { display: flex; font-size: .65rem; justify-content: space-between; letter-spacing: .08em; margin-bottom: .8rem; text-transform: uppercase; width: 100%; }
.product-sizes legend span { color: var(--muted); text-transform: none; }
.product-sizes div { display: grid; gap: .3rem; grid-template-columns: repeat(6, 1fr); }
.product-sizes button { border: 1px solid var(--line); font-size: .65rem; min-height: 2.9rem; transition: background 180ms ease, border-color 180ms ease, color 180ms ease; }
.product-sizes button:hover, .product-sizes button.is-selected { background: var(--ink); border-color: var(--ink); color: var(--black); }
.product-add { align-items: center; background: var(--orange); color: var(--black); display: flex; font-size: .7rem; font-weight: 800; justify-content: space-between; letter-spacing: .08em; margin-top: 1.3rem; min-height: 3.7rem; overflow: hidden; padding: 0 1rem; transition: background 180ms ease, transform 220ms var(--ease-out); width: 100%; }
.product-add:hover { background: var(--ink); transform: translateY(-2px); }
.product-add span { transition: transform 350ms var(--ease-out); }
.product-add:hover span { transform: translateX(.55rem); }
.product-prototype-message { color: var(--muted); font-size: .62rem; line-height: 1.45; margin: .8rem 0 1.5rem; }
.product-detail-row { border-top: 1px solid var(--line); font-size: .76rem; padding: 1rem 0; }
.product-detail-row summary { cursor: pointer; display: flex; font-size: .65rem; font-weight: 700; justify-content: space-between; letter-spacing: .08em; list-style: none; text-transform: uppercase; }
.product-detail-row summary::-webkit-details-marker { display: none; }
.product-detail-row summary b { color: var(--orange); font-size: 1rem; line-height: .55; transition: transform 260ms var(--ease-out); }
.product-detail-row[open] summary b { transform: rotate(45deg); }
.product-detail-row p { color: var(--muted); margin-top: .85rem; max-width: 28rem; }
.product-collection-link { align-items: center; border-bottom: 1px solid var(--line); display: flex; font-size: .65rem; gap: .45rem; justify-content: space-between; letter-spacing: .07em; padding: 1rem 0; text-transform: uppercase; }
.product-collection-link span { color: var(--orange); margin-right: auto; }
.product-collection-link, .product-signoff > a, .text-link--orange { transition: color 180ms ease, transform 260ms var(--ease-out); }
.product-collection-link:hover, .product-signoff > a:hover, .text-link--orange:hover { transform: translateX(.32rem); }
.product-collection-stage { background: var(--purple); padding-top: clamp(3rem, 6vw, 6rem); }
.product-collection-stage-head { align-items: end; display: flex; gap: 2rem; justify-content: space-between; padding-bottom: clamp(2rem, 4vw, 4rem); }
.product-collection-stage-head .eyebrow { color: var(--orange); font-weight: 700; }
.product-collection-stage-head h2 { font-size: clamp(3rem, 7vw, 8rem); font-weight: 900; letter-spacing: -.09em; line-height: .72; margin-top: 1rem; text-transform: uppercase; }
.product-collection-stage-head > a { align-items: center; border-bottom: 1px solid var(--line); display: flex; font-size: .66rem; gap: .45rem; letter-spacing: .075em; padding-bottom: .7rem; text-transform: uppercase; transition: color 180ms ease, transform 260ms var(--ease-out); white-space: nowrap; }
.product-collection-stage-head > a span, .product-collection-stage-head > a b { color: var(--orange); }
.product-collection-stage-head > a:hover { transform: translateX(.32rem); }
.related-product-grid { display: grid; gap: 1px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.related-product-grid a { background: var(--black); min-height: min(62vw, 46rem); overflow: hidden; position: relative; }
.related-product-grid img { height: 100%; inset: 0; object-fit: cover; position: absolute; transition: filter 420ms ease, transform 800ms var(--ease-out); width: 100%; }
.related-product-grid a::after { background: linear-gradient(transparent 55%, rgba(0,0,0,.9)); content: ''; inset: 0; pointer-events: none; position: absolute; }
.related-product-grid span { bottom: 0; display: flex; flex-direction: column; gap: .35rem; left: 0; padding: 1rem; position: absolute; right: 0; z-index: 1; }
.related-product-grid small { color: var(--orange); font-size: .56rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.related-product-grid strong { font-size: clamp(1.15rem, 2vw, 2.3rem); font-weight: 900; letter-spacing: -.06em; line-height: .85; text-transform: uppercase; transform: translateY(.15rem); transition: transform 340ms var(--ease-out); }
.related-product-grid a:hover img, .related-product-grid a:focus-visible img { filter: contrast(1.06) saturate(1.08); transform: scale(1.015); }
.related-product-grid a:hover strong, .related-product-grid a:focus-visible strong { transform: translateX(.3rem); }
.product-stage-back { align-items: center; display: flex; font-size: .63rem; gap: .6rem; letter-spacing: .08em; padding-bottom: 1.2rem; padding-top: 1.2rem; text-transform: uppercase; }
.product-stage-back span { color: var(--orange); font-size: 1.1rem; }
.shop-catalogue { background: var(--black); padding-bottom: var(--section-space); }
.shop-toolbar { align-items: start; border-bottom: 1px solid var(--line); display: grid; gap: 2.5rem; grid-template-columns: minmax(14rem, .55fr) minmax(0, 1.45fr); padding-bottom: 1.25rem; padding-top: clamp(3.5rem, 7vw, 7rem); }
.shop-toolbar-title h2 { font-size: clamp(3rem, 6vw, 6.5rem); font-weight: 900; letter-spacing: -.085em; line-height: .75; margin-top: 1.5rem; text-transform: uppercase; }
.shop-filter-wrap { display: grid; gap: 2rem; min-width: 0; }
.shop-filter-wrap .filter-list { flex-wrap: wrap; }
.shop-filter-wrap .filter-list button { padding-bottom: .45rem; position: relative; }
.shop-filter-wrap .filter-list button::after { background: var(--orange); bottom: 0; content: ""; height: 2px; left: 0; position: absolute; transform: scaleX(0); transform-origin: left; transition: transform 280ms var(--ease-out); width: 100%; }
.shop-filter-wrap .filter-list button.is-active::after, .shop-filter-wrap .filter-list button:hover::after { transform: scaleX(1); }
.shop-toolbar-options { align-items: center; display: flex; gap: 2.5rem; justify-content: space-between; }
.sort-control { align-items: center; color: var(--muted); display: flex; font-size: .62rem; gap: .7rem; letter-spacing: .08em; text-transform: uppercase; }
.sort-control select { appearance: none; background: transparent; border: 1px solid var(--line); border-radius: 0; color: var(--ink); font: inherit; letter-spacing: inherit; padding: .65rem 2rem .65rem .7rem; text-transform: uppercase; }
.sort-control option { background: var(--black); }
.density-control { display: grid; gap: .45rem; justify-items: end; }
.density-control > span { color: var(--muted); font-size: .62rem; letter-spacing: .08em; text-transform: uppercase; }
.shop-toolbar-options .density-list { border: 1px solid var(--line); gap: 0; }
.shop-toolbar-options .density-list button { color: var(--muted); min-width: 4.75rem; padding: .65rem .8rem; transition: background-color 200ms ease, color 200ms ease; }
.shop-toolbar-options .density-list button + button { border-left: 1px solid var(--line); }
.shop-toolbar-options .density-list button[aria-pressed="true"] { background: var(--orange); color: var(--black); }
.shop-page .product.reveal { opacity: 1; transform: none; transition: none; }
.shop-page .product.reveal .product-media { clip-path: inset(0 0 7% 0); transition: clip-path 760ms var(--ease-out); }
.shop-page .product.reveal .product-meta { opacity: 0; transform: translateY(.45rem); transition: opacity 380ms ease 120ms, transform 520ms var(--ease-out) 120ms; }
.shop-page .product.reveal.is-visible .product-media { clip-path: inset(0); }
.shop-page .product.reveal.is-visible .product-meta { opacity: 1; transform: none; }
.shop-page .product-meta { overflow: hidden; position: relative; }
.shop-page .product-meta::before { background: var(--orange); bottom: 0; content: ""; height: 3px; left: 0; position: absolute; transform: scaleX(0); transform-origin: left; transition: transform 420ms var(--ease-out); width: 100%; }
.shop-page .product h3 { transition: color 180ms ease, transform 350ms var(--ease-out); }
.shop-page .product a:hover .product-meta::before, .shop-page .product a:focus-visible .product-meta::before { transform: scaleX(1); }
.shop-page .product a:hover h3, .shop-page .product a:focus-visible h3 { color: var(--orange); transform: translateX(.3rem); }
.shop-page .product a:hover .product-media--mockup img, .shop-page .product a:focus-visible .product-media--mockup img { transform: scale(1.015); }
.shop-toolbar > .catalogue-status { font-size: .62rem; grid-column: 2; justify-self: start; letter-spacing: .08em; text-transform: uppercase; }
.shop-product-grid { margin-top: 1px; }
.product-media--orange { background: var(--orange); color: var(--black); }
.garment--crew { height: 58%; width: 47%; }
.garment--pant { bottom: 5%; clip-path: polygon(6% 0, 94% 0, 82% 100%, 53% 100%, 50% 45%, 47% 100%, 18% 100%); height: 73%; width: 38%; }
.garment--short { bottom: 18%; clip-path: polygon(3% 0, 97% 0, 85% 85%, 54% 85%, 50% 43%, 46% 85%, 15% 85%); height: 48%; width: 42%; }
.garment--cap { border-radius: 50% 50% 8% 8%; bottom: 39%; height: 20%; width: 43%; }
.garment--cap::before { bottom: -20%; height: 25%; left: 58%; top: auto; transform: skewX(-28deg); width: 54%; }
.garment--cap::after { display: none; }
.garment--tote { border: .55rem solid currentColor; background: transparent; bottom: 18%; height: 48%; width: 42%; }
.garment--tote::before { background: transparent; border: .55rem solid currentColor; border-bottom: 0; height: 28%; left: 21%; top: -21%; transform: none; width: 53%; }
.garment--tote::after { display: none; }
.product-media--bone .garment--tote { color: var(--black); }
.garment--sock { border-radius: 0 0 20% 20%; bottom: 13%; height: 58%; transform: translateX(-68%) rotate(9deg); width: 20%; }
.garment--sock::before { bottom: 2%; height: 25%; left: 68%; top: auto; transform: skewX(-28deg); width: 95%; }
.garment--sock::after { display: none; }
.garment--belt { background: transparent; border: .55rem solid currentColor; bottom: 43%; height: 18%; transform: translateX(-50%) rotate(-7deg); width: 66%; }
.garment--belt::before { background: transparent; border: .35rem solid currentColor; height: 110%; left: 8%; top: -6%; transform: none; width: 14%; }
.garment--belt::after { display: none; }
.product-media--steel .garment--belt { color: var(--black); }

@media (max-width: 900px) {
  .shop-toolbar { grid-template-columns: 1fr; }
  .shop-toolbar > .catalogue-status { grid-column: auto; }
  .animals-hero { grid-template-columns: 1fr; }
  .animals-pack { min-height: 55svh; }
  .animals-manifest { grid-template-columns: 1fr 1.3fr; }
  .animals-manifest > p { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
  .shop-intro { padding-bottom: 1.25rem; padding-top: 1.25rem; }
  .shop-intro-top { gap: 1rem; }
  .shop-intro-top p:last-child { text-align: right; }
  .shop-intro-stage { margin: 1rem 0; }
  .shop-intro h1 { font-size: clamp(3.45rem, 16vw, 4.8rem); }
  .shop-intro-tape { font-size: .52rem; margin-bottom: 1rem; }
  .shop-intro-foot { align-items: start; flex-direction: column; gap: 1.25rem; }
  .product-detail-grid { display: block; }
  .product-gallery { grid-template-columns: minmax(0, 1fr) 27%; }
  .product-gallery-main, .product-gallery-detail { min-height: 116vw; }
  .product-buy-panel { border-left: 0; border-top: 1px solid var(--line); position: static; }
  .product-title-line h1 { font-size: clamp(2.85rem, 14vw, 4.7rem); }
  .product-title-line > p { font-size: .63rem; }
  .product-collection-stage-head { align-items: start; flex-direction: column; gap: 1.5rem; }
  .product-collection-stage-head h2 { font-size: clamp(3rem, 15vw, 4.8rem); }
  .related-product-grid { grid-template-columns: repeat(3, minmax(72vw, 1fr)); overflow-x: auto; scroll-snap-type: x mandatory; }
  .related-product-grid a { min-height: 112vw; scroll-snap-align: start; }
  .animals-hero-copy h1 { font-size: clamp(4rem, 20vw, 6.3rem); }
  .animals-pack { min-height: 42svh; }
  .animals-manifest { gap: 2rem; grid-template-columns: 1fr; }
  .animals-products-head { align-items: start; flex-direction: column; }
  .animals-product-grid { grid-template-columns: repeat(3, minmax(75vw, 1fr)); overflow-x: auto; scroll-snap-type: x mandatory; }
  .animals-product-card a { min-height: 116vw; scroll-snap-align: start; }
  .animals-exit { align-items: start; grid-template-columns: 1fr; padding-bottom: 1.25rem; padding-top: 1.25rem; }
  .animals-exit a:nth-child(2), .animals-exit a:last-child { justify-self: start; }
  .shop-toolbar { gap: 2rem; padding-bottom: 1rem; }
  .shop-filter-wrap { gap: 1.5rem; }
  .shop-filter-wrap .filter-list { column-gap: 1.35rem; row-gap: 1rem; }
  .shop-toolbar-options { align-items: flex-start; flex-direction: column; gap: 1rem; }
  .shop-toolbar-options .density-control { display: none; }
  .shop-toolbar > .catalogue-status { display: block; }
}

@keyframes shop-stock-tape {
  to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  .shop-intro-tape > div { animation: none; }
  .shop-intro-tape { transform: none; }
  .shop-intro:hover .shop-ticket-rain .rain-object, .shop-intro:focus-within .shop-ticket-rain .rain-object { animation-name: cigarette-fall-gentle; }
}