@font-face {
  font-family: 'Sharp Grotesk';
  src: url('../public/assets/fonts/SharpGroteskBold12.otf') format('opentype');
  font-display: swap;
  font-weight: 700;
}

@font-face {
  font-family: 'Sharp Sans';
  src: url('../public/assets/fonts/SharpSans-No2-Semibold.otf') format('opentype');
  font-display: swap;
  font-weight: 600;
}

:root {
  color-scheme: light;
  --black: #050505;
  --white: #fff;
  --paper: #eee;
  --silver: #d8d8d8;
  --line: #aaa;
  --gutter: clamp(20px, 3vw, 48px);
  --display: 'Sharp Grotesk', 'Arial Narrow', sans-serif;
  --body: 'Sharp Sans', Arial, sans-serif;
  --mono: 'SFMono-Regular', 'Roboto Mono', Consolas, monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; background: var(--white); color: var(--black); font-family: var(--body); }
body, button, input, select, textarea { font-family: var(--body); }
button, input, select, textarea { color: inherit; }
button { cursor: pointer; }
img { display: block; max-width: 100%; }
a { color: inherit; text-underline-offset: 5px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
h1, h2, h3, p, figure { margin-top: 0; }
h1, h2, h3 { font-family: var(--display); font-weight: 700; letter-spacing: -.035em; line-height: .82; text-transform: uppercase; }
h1 { font-size: clamp(78px, 12vw, 190px); }
h2 { font-size: clamp(56px, 8vw, 126px); letter-spacing: -.02em; }
h3 { font-size: clamp(28px, 3vw, 48px); letter-spacing: -.02em; }
strong { letter-spacing: -.02em; }

.skip-link { position: fixed; left: 12px; top: 12px; z-index: 1000; padding: 12px 16px; background: #fff; color: #000; transform: translateY(-180%); }
.skip-link:focus { transform: none; }
.brand { min-height: 44px; display: inline-flex; align-items: center; width: clamp(132px, 15vw, 218px); }
.brand img { width: 100%; }
.site-header .brand img, .private-header .brand img, .studio-header .brand img, .site-footer > img { filter: brightness(0) invert(1); }

.site-header, .private-header {
  position: sticky;
  top: 0;
  z-index: 50;
  min-height: 78px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 0 var(--gutter);
  border-bottom: 1px solid #555;
  background: var(--black);
  color: #fff;
}

.site-header nav, .private-header nav { display: flex; align-items: center; gap: clamp(18px, 2.5vw, 40px); }
.site-header nav a, .private-header nav a, .private-header nav span, .private-header > a:last-child {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  margin: 0;
  font: 10px/1 var(--mono);
  letter-spacing: .06em;
  text-decoration: none;
  text-transform: uppercase;
}
.site-header nav a:hover, .private-header nav a:hover { opacity: .65; }
.site-header nav a[aria-current="page"], .private-header nav a[aria-current="page"], .studio-header nav a[aria-current="page"] { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }
.private-header nav span { color: #aaa; }
.nav-action { padding: 12px 16px; border: 1px solid #fff; }
.mobile-menu { display: none; }
.private-header > a:last-child { justify-self: end; }

.project-journey { border-bottom: 1px solid #000; background: #fff; color: #000; }
.project-journey__desktop ol, .project-journey__mobile ol { margin: 0; padding: 0; list-style: none; }
.project-journey__desktop ol { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); }
.project-journey__desktop li + li { border-left: 1px solid #000; }
.project-journey__desktop li > a, .project-journey__desktop li > div { min-height: 92px; display: grid; grid-template-columns: auto 1fr; grid-template-rows: 1fr auto; gap: 9px 14px; align-items: end; padding: 16px 18px; text-decoration: none; }
.project-journey__desktop li > a:hover { background: var(--paper); }
.project-journey li span, .project-journey li small { font: 8px/1 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.project-journey li strong { align-self: end; font-size: 14px; line-height: 1.05; }
.project-journey li small { grid-column: 2; color: #666; }
.project-journey li.is-current { background: var(--paper); color: #000; }
.project-journey li.is-viewing { background: #000; color: #fff; }
.project-journey li.is-viewing small { color: #fff; }
.project-journey li.is-done:not(.is-viewing) { color: #555; }
.project-journey li.is-waiting { color: #999; }
.project-journey li.is-next { background: var(--paper); }
.project-journey__mobile { display: none; }

:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid currentColor;
  outline-offset: 3px;
}
main[tabindex="-1"]:focus { outline: none; }

.text-link { display: inline-block; padding-bottom: 5px; border-bottom: 1px solid currentColor; font: 11px/1 var(--mono); letter-spacing: .05em; text-decoration: none; text-transform: uppercase; }
.text-link--light { color: #fff; }

.project-home__hero { min-height: calc(100svh - 78px); display: grid; grid-template-columns: 1.05fr .95fr; background: #000; color: #fff; }
.project-home__copy { min-width: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(50px, 7vw, 110px) var(--gutter); }
.project-home__copy h1 { margin: 0 0 auto; padding-top: clamp(60px, 9vw, 130px); overflow-wrap: anywhere; }
.project-home__stage { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; margin: clamp(48px, 8vw, 110px) 0 30px; padding-top: 20px; border-top: 1px solid #555; }
.project-home__stage strong { font: clamp(30px, 4vw, 58px)/.9 var(--display); text-transform: uppercase; }
.project-home__stage span { font: 9px/1 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.project-home__action { display: flex; align-items: center; justify-content: space-between; min-height: 72px; padding: 18px 0; border-top: 1px solid #fff; border-bottom: 1px solid #fff; font: 11px/1 var(--mono); letter-spacing: .05em; text-decoration: none; text-transform: uppercase; }
.project-home__action:hover { opacity: .7; }
.project-home__waiting { min-height: 72px; display: flex; align-items: center; margin: 0; padding: 18px 0; border-top: 1px solid #fff; border-bottom: 1px solid #fff; font-size: 17px; line-height: 1.35; }
.project-home__hero > img { width: 100%; height: 100%; object-fit: contain; background: var(--paper); }
.project-home__action--waiting { cursor: default; }
.project-home__action--waiting:hover { opacity: 1; }
.project-home__media, .review-hero__media {
  position: relative;
  min-width: 0;
  overflow: hidden;
  background: var(--paper);
}
.project-home__media img, .review-hero__media img {
  position: absolute;
  bottom: -5%;
  width: 68%;
  height: 104%;
  object-fit: contain;
}
.project-home__media img:first-child, .review-hero__media img:first-child { left: -8%; z-index: 1; }
.project-home__media img:last-child, .review-hero__media img:last-child { right: -10%; }
.project-home__media img:only-child, .review-hero__media img:only-child { inset: 0; width: 100%; height: 100%; }

.home-hero { position: relative; min-height: calc(100svh - 78px); overflow: hidden; background: #000; color: #fff; }
.home-hero__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 46%; pointer-events: none; user-select: none; }
.home-hero__image--reveal {
  --reveal-x: -999px;
  --reveal-y: -999px;
  --reveal-radius: clamp(650px, 46vw, 1050px);
  z-index: 1;
  opacity: 0;
  -webkit-mask-image: radial-gradient(circle var(--reveal-radius) at var(--reveal-x) var(--reveal-y), #000 0%, #000 30%, rgba(0, 0, 0, .92) 45%, rgba(0, 0, 0, .68) 60%, rgba(0, 0, 0, .38) 75%, rgba(0, 0, 0, .14) 88%, transparent 100%);
  mask-image: radial-gradient(circle var(--reveal-radius) at var(--reveal-x) var(--reveal-y), #000 0%, #000 30%, rgba(0, 0, 0, .92) 45%, rgba(0, 0, 0, .68) 60%, rgba(0, 0, 0, .38) 75%, rgba(0, 0, 0, .14) 88%, transparent 100%);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  transition: opacity 240ms ease-out;
  will-change: opacity;
}
.home-hero.is-revealing .home-hero__image--reveal { opacity: 1; }
.home-hero__shade { position: absolute; inset: 0; z-index: 2; background: linear-gradient(90deg, rgba(0, 0, 0, .62), rgba(0, 0, 0, .03) 72%); pointer-events: none; }
.home-hero__copy { position: absolute; z-index: 3; left: var(--gutter); right: var(--gutter); bottom: clamp(42px, 8vh, 100px); }
.home-hero h1 { max-width: 1150px; margin-bottom: 28px; }
.home-hero p { max-width: 520px; margin-bottom: 30px; font-size: clamp(20px, 2.2vw, 34px); line-height: 1.14; }
.page-label { display: block; margin-bottom: 20px; font: 10px/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 22px 34px; }
.proof-strip { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid #000; }
.proof-strip span { min-height: 78px; display: flex; align-items: center; padding: 20px var(--gutter); font: 10px/1.2 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.proof-strip span + span { border-left: 1px solid #000; }

.custom-intro { padding: clamp(90px, 11vw, 170px) var(--gutter); }
.custom-intro p { margin: 0; }
.custom-intro__statement { max-width: 1500px; font: clamp(48px, 6.3vw, 104px)/.88 var(--display); text-transform: uppercase; }
.custom-intro__body { max-width: 680px; margin-top: clamp(34px, 4vw, 58px) !important; font-size: clamp(18px, 1.6vw, 24px); line-height: 1.4; }
.custom-intro__detail { max-width: 430px; font-size: clamp(18px, 1.6vw, 24px); line-height: 1.35; }
.custom-intro__detail p + p { margin-top: 20px; }

.trust-section { padding: 0 var(--gutter) clamp(74px, 8vw, 112px); border-bottom: 1px solid #000; }
.trust-section__head { display: flex; justify-content: space-between; align-items: center; gap: 30px; padding: 26px 0; border-top: 1px solid #000; border-bottom: 1px solid #000; }
.trust-section__head > span { font: 10px/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.trust-marks { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); padding: clamp(40px, 4.8vw, 72px) 0; }
.trust-mark { min-width: 0; min-height: 72px; display: grid; place-items: center; padding: 12px clamp(12px, 1.4vw, 24px); }
.trust-mark img { display: block; max-width: 150px; max-height: 54px; width: 100%; height: 100%; object-fit: contain; filter: grayscale(1) brightness(0); }
.trust-mark--xero img { max-width: 54px; max-height: 54px; }
.trust-mark--bikestyle img { max-width: 132px; max-height: 44px; }
.trust-mark--strava img { max-width: 132px; max-height: 46px; }
.trust-mark--felons img { max-width: 108px; max-height: 52px; }
.trust-mark--qas img { max-width: 118px; max-height: 58px; }
.trust-mark--uq img { max-width: 54px; max-height: 58px; }
.trust-mark--hutchies img { max-width: 128px; max-height: 50px; }

.job-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-bottom: 1px solid #000; }
.job-links header { grid-column: 1 / -1; padding: clamp(70px, 9vw, 130px) var(--gutter) 48px; border-bottom: 1px solid #000; }
.job-links header h2 { max-width: 1040px; margin: 0; }
.job-links > a { min-height: 190px; display: flex; flex-direction: column; justify-content: space-between; gap: 40px; padding: 30px var(--gutter); border-bottom: 1px solid #000; text-decoration: none; }
.job-links > a:nth-of-type(even) { border-left: 1px solid #000; }
.job-links strong { font: clamp(32px, 4vw, 62px)/.9 var(--display); text-transform: uppercase; }
.job-links span { max-width: 520px; font-size: 17px; line-height: 1.35; }
.job-links > a:hover { background: #000; color: #fff; }

.offer-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-bottom: 1px solid #000; }
.offer-grid header { grid-column: 1 / -1; padding: clamp(80px, 10vw, 150px) var(--gutter) 50px; border-bottom: 1px solid #000; }
.offer-grid header h2 { margin: 0; }
.offer-grid article { min-height: 250px; padding: 34px var(--gutter); border-bottom: 1px solid #000; }
.offer-grid article:nth-of-type(even) { border-left: 1px solid #000; }
.offer-grid article h3 { margin-bottom: 70px; }
.offer-grid article p { max-width: 510px; font-size: 18px; line-height: 1.4; }

.project-ordering { position: relative; min-height: clamp(620px, 56.25vw, 960px); overflow: hidden; border-bottom: 1px solid #000; background: #000; color: #fff; }
.project-ordering > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.project-ordering__shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0, 0, 0, .78) 0, rgba(0, 0, 0, .42) 42%, rgba(0, 0, 0, .04) 78%); }
.project-ordering__copy { position: relative; z-index: 1; max-width: 960px; min-height: inherit; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(70px, 8vw, 130px) var(--gutter); }
.project-ordering h2 { margin-bottom: 34px; font-size: clamp(64px, 8.5vw, 136px); }
.project-ordering p { max-width: 600px; margin-bottom: 42px; font-size: clamp(19px, 1.8vw, 28px); line-height: 1.25; }
.project-ordering h2 + p { margin-top: 10px; }
.ordering-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px; }
.ordering-options strong { font: clamp(28px, 3vw, 48px)/.9 var(--display); text-transform: uppercase; }
.ordering-options p { margin: 22px 0 28px; font-size: 18px; }

.project-process { padding: clamp(90px, 11vw, 170px) var(--gutter); overflow: hidden; border-bottom: 1px solid #000; }
.project-process__head { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(240px, .5fr); align-items: end; gap: 50px; margin-bottom: clamp(60px, 8vw, 120px); }
.project-process__head p { margin: 0; }
.project-process__lead { max-width: 1100px; font: clamp(48px, 6.3vw, 104px)/.88 var(--display); letter-spacing: -.035em; text-transform: uppercase; }
.project-process__meta { justify-self: end; display: flex; align-items: center; gap: 22px; padding-bottom: 5px; }
.project-process__meta p { border-bottom: 1px solid #000; font: 10px/1 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.project-process__meta { align-self: end; max-width: 260px; margin: 0; font: 10px/1.4 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.process-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; padding: 0; border-top: 1px solid #000; border-left: 1px solid #000; list-style: none; }
.process-list li { min-height: 250px; display: flex; flex-direction: column; padding: 24px; border-right: 1px solid #000; border-bottom: 1px solid #000; }
.process-list span { font: 10px/1 var(--mono); }
.process-list strong { margin: auto 0 24px; font: clamp(30px, 3vw, 48px)/.9 var(--display); text-transform: uppercase; }
.process-list p { max-width: 360px; margin: 0; font-size: 16px; line-height: 1.35; }
.guarantee-callout { min-height: 72svh; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(80px, 10vw, 150px) var(--gutter); background: #000; color: #fff; }
.guarantee-callout h2 { max-width: 1240px; margin-bottom: 42px; }
.guarantee-callout p { max-width: 620px; margin-bottom: 36px; font-size: 20px; line-height: 1.4; }
.process-timeline { cursor: crosshair; touch-action: pan-y; }
.process-rail { position: relative; height: 9px; border-top: 1px solid #000; }
.process-rail__fill { position: absolute; top: -1px; right: 0; left: 0; height: 3px; background: #000; transform: scaleX(0); transform-origin: left; }
.process-tick { position: absolute; top: 2px; width: 1px; height: 7px; background: #000; transform: scaleY(0); transform-origin: top; }
.process-tick:nth-of-type(2) { left: 0; }
.process-tick:nth-of-type(3) { left: 16.666%; }
.process-tick:nth-of-type(4) { left: 33.333%; }
.process-tick:nth-of-type(5) { left: 50%; }
.process-tick:nth-of-type(6) { left: 66.666%; }
.process-tick:nth-of-type(7) { left: 83.333%; }
.process-steps { display: grid; grid-template-columns: 1fr 4fr 1fr; margin: 0; padding: 0; border-bottom: 1px solid #000; list-style: none; }
.process-steps li { min-width: 0; min-height: 320px; display: flex; flex-direction: column; justify-content: space-between; padding: 22px 26px 28px 0; }
.process-steps li + li { padding-left: 26px; border-left: 1px solid #000; }
.process-label { opacity: 0; font: 10px/1 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.process-icon { opacity: 0; transform: scale(0) rotate(-20deg); transform-origin: center; }
.process-icon svg { display: block; overflow: visible; width: 100%; height: 100%; fill: #000; }
.process-icon--eye, .process-icon--flower { width: clamp(74px, 7vw, 104px); height: clamp(74px, 7vw, 104px); }
.process-icon--coil { width: min(280px, 72%); height: 104px; }
.process-eye__blink { transform-origin: 50px 50px; }
.process-pupil { transition: transform 120ms ease-out; }
.process-coil { fill: none; stroke: #000; stroke-width: 16; stroke-linecap: round; stroke-dasharray: 400; stroke-dashoffset: 400; transition: stroke-dashoffset 180ms ease-out; }
.process-coil-dot { opacity: 0; transition: opacity 180ms ease-out; }
.process-flower { transition: transform 250ms ease-out; transform-origin: center; }
.process-steps h3 { margin: 0; font-size: clamp(38px, 4.2vw, 72px); overflow-wrap: anywhere; }
.project-process.is-visible .process-rail__fill { animation: process-draw 2.6s linear both; }
.project-process.is-visible .process-tick { animation: process-tick 200ms both; }
.project-process.is-visible .process-tick:nth-of-type(2) { animation-delay: 430ms; }
.project-process.is-visible .process-tick:nth-of-type(3) { animation-delay: 870ms; }
.project-process.is-visible .process-tick:nth-of-type(4) { animation-delay: 1.3s; }
.project-process.is-visible .process-tick:nth-of-type(5) { animation-delay: 1.73s; }
.project-process.is-visible .process-tick:nth-of-type(6) { animation-delay: 2.17s; }
.project-process.is-visible .process-tick:nth-of-type(7) { animation-delay: 2.6s; }
.project-process.is-visible .process-label { animation: process-fade 400ms both; }
.project-process.is-visible .process-steps li:nth-child(1) .process-label { animation-delay: 50ms; }
.project-process.is-visible .process-steps li:nth-child(2) .process-label { animation-delay: 500ms; }
.project-process.is-visible .process-steps li:nth-child(3) .process-label { animation-delay: 2.2s; }
.project-process.is-visible .process-icon { animation: process-pop 700ms cubic-bezier(.34, 1.56, .64, 1) both; }
.project-process.is-visible .process-icon--eye { animation-delay: 150ms; }
.project-process.is-visible .process-icon--coil { animation-delay: 600ms; }
.project-process.is-visible .process-icon--flower { animation-delay: 2.3s; }
.project-process.is-visible .process-eye__blink { animation: process-blink 3.4s 1s infinite; }
.project-process.is-visible .process-pupil { animation: process-look 2.6s 1s ease-in-out infinite alternate; }
.project-process.is-visible .process-coil { animation: process-coil 2s 600ms cubic-bezier(.2, .8, .2, 1) both; }
.project-process.is-visible .process-coil-dot { animation: process-fade 300ms 2.3s both; }
.project-process.is-visible .process-flower { animation: process-spin 6s 3s linear infinite; }
.project-process.is-visible .process-steps h3 { animation: process-rise 550ms cubic-bezier(.2, .8, .2, 1) both; }
.project-process.is-visible .process-steps li:nth-child(1) h3 { animation-delay: 300ms; }
.project-process.is-visible .process-steps li:nth-child(2) h3 { animation-delay: 750ms; }
.project-process.is-visible .process-steps li:nth-child(3) h3 { animation-delay: 2.45s; }
.project-process.is-pointer-active .process-pupil, .project-process.is-pointer-active .process-coil, .project-process.is-pointer-active .process-coil-dot, .project-process.is-pointer-active .process-flower { animation: none; }

@keyframes process-draw { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes process-tick { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes process-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes process-rise { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
@keyframes process-pop { 0% { opacity: 0; transform: scale(0) rotate(-20deg); } 60% { opacity: 1; transform: scale(1.18) rotate(6deg); } 80% { transform: scale(.94) rotate(-2deg); } 100% { opacity: 1; transform: none; } }
@keyframes process-blink { 0%, 92%, 100% { transform: scaleY(1); } 96% { transform: scaleY(.1); } }
@keyframes process-look { from { transform: translateX(-14px); } to { transform: translateX(14px); } }
@keyframes process-coil { from { stroke-dashoffset: 400; } to { stroke-dashoffset: 0; } }
@keyframes process-spin { to { transform: rotate(360deg); } }

.home-archive { padding: clamp(80px, 10vw, 160px) var(--gutter); }
.home-archive__heading { display: grid; grid-template-columns: 2fr 1fr; align-items: end; gap: 40px; margin-bottom: 64px; }
.home-archive__heading h2 { margin: 0; }
.home-archive__heading a { justify-self: end; }

.home-guarantee { min-height: 76svh; background: #000; color: #fff; }
.home-guarantee__link { position: relative; min-height: 76svh; display: block; overflow: hidden; color: #fff; text-decoration: none; }
.home-guarantee__copy { position: absolute; inset: 0 auto 0 0; z-index: 2; width: min(56%, 1040px); display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: clamp(80px, 8vw, 130px) var(--gutter); }
.home-guarantee__label { display: inline-flex; align-items: center; gap: 9px; }
.home-guarantee__label svg { width: 12px; height: 12px; flex: 0 0 auto; fill: currentColor; }
.home-guarantee h2 { max-width: 760px; margin: 0; font-size: clamp(54px, 4.75vw, 88px); }
.home-guarantee h2 span { display: block; }
.home-guarantee h2 + p { max-width: 620px; margin: clamp(34px, 4vw, 54px) 0 0; font-size: clamp(18px, 1.6vw, 23px); line-height: 1.4; }
.home-guarantee__copy .text-link { margin-top: 34px; }
.home-guarantee__media { position: absolute; inset: 0; margin: 0; }
.home-guarantee__media img { width: 100%; height: 100%; object-fit: cover; object-position: center 56%; transition: transform 500ms ease; }
.home-guarantee__shade { position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(0,0,0,.92) 0%, rgba(0,0,0,.7) 31%, rgba(0,0,0,.14) 70%, rgba(0,0,0,.02) 100%); }
.home-guarantee__link:hover .home-guarantee__media img { transform: scale(1.012); }

.archive-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid #000; border-left: 1px solid #000; }
.archive-filters { display: flex; gap: 28px; padding: 28px var(--gutter); border-bottom: 1px solid #000; }
.archive-filters a { font: 11px/1 var(--mono); letter-spacing: .05em; text-decoration: none; text-transform: uppercase; }
.archive-filters a[aria-current="page"] { padding-bottom: 5px; border-bottom: 1px solid #000; }
.archive-card { min-width: 0; display: block; border-right: 1px solid #000; border-bottom: 1px solid #000; background: #fff; text-decoration: none; }
.archive-card__media { position: relative; aspect-ratio: 1.12; display: grid; place-items: center; overflow: hidden; background: var(--paper); }
.archive-card__media img { width: 90%; height: 92%; object-fit: contain; transition: transform 280ms ease-out; }
a.archive-card:hover .archive-card__media img { transform: scale(1.025); }
.archive-card__media--photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 58%; }
.archive-card__media--collection { display: block; background: #000; }
.collection-hero { position: absolute; inset: 0; overflow: hidden; }
.archive-card__media--collection .collection-hero img { position: absolute; bottom: -12%; width: 64%; height: 108%; object-fit: contain; }
.archive-card__media--collection .collection-hero img:first-child { left: -4%; z-index: 1; }
.archive-card__media--collection .collection-hero img:last-child { right: -5%; }
.archive-card__type { width: 100%; padding: 40px; font: clamp(60px, 8vw, 138px)/.78 var(--display); letter-spacing: -.04em; text-transform: uppercase; overflow-wrap: anywhere; }
.archive-card__name { min-height: 102px; display: flex; justify-content: space-between; align-items: center; gap: 30px; padding: 20px 24px; border-top: 1px solid #000; }
.archive-card__name h3 { margin: 0; font-size: clamp(28px, 3vw, 48px); }
.archive-card__name span { font-size: 22px; }
.project-close { display: grid; grid-template-columns: 1.5fr .5fr; gap: 40px; padding: clamp(70px, 9vw, 130px) var(--gutter); background: #000; color: #fff; }
.project-close > p { max-width: 980px; margin: 0; font: clamp(42px, 5.5vw, 84px)/.92 var(--display); text-transform: uppercase; }
.project-close > div { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; gap: 24px; }

.sport-hero { position: relative; min-height: calc(100svh - 78px); overflow: hidden; background: #000; color: #fff; }
.sport-hero > img { width: 100%; height: calc(100svh - 78px); object-fit: cover; }
.sport-hero__shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.76), rgba(0,0,0,.06) 75%); }
.sport-hero__copy { position: absolute; left: var(--gutter); right: var(--gutter); bottom: clamp(44px, 8vh, 100px); }
.sport-hero__copy h1 { max-width: 1120px; margin-bottom: 28px; }
.sport-hero__copy p { max-width: 590px; margin-bottom: 32px; font-size: clamp(19px, 2vw, 29px); line-height: 1.25; }
.sport-product { display: grid; grid-template-columns: 1.45fr .55fr; align-items: end; gap: 60px; padding: clamp(85px, 11vw, 170px) var(--gutter); border-bottom: 1px solid #000; }
.sport-product h2 { margin: 0; }
.sport-product p { margin: 0; font-size: 20px; line-height: 1.45; }
.sport-projects { padding: clamp(80px, 10vw, 150px) var(--gutter); }
.sport-projects > header { display: grid; grid-template-columns: 1.4fr .6fr; align-items: end; gap: 40px; margin-bottom: 60px; }
.sport-projects > header h2, .sport-projects > header p { margin: 0; }
.sport-projects > header p { font-size: 19px; line-height: 1.4; }

.faq-hero { min-height: 75svh; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(80px, 10vw, 150px) var(--gutter); background: #000; color: #fff; }
.faq-hero h1 { max-width: 1380px; margin: 0 0 44px; }
.faq-hero p { max-width: 640px; margin: 0; font-size: clamp(20px, 2vw, 28px); line-height: 1.32; }
.faq-index { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border-bottom: 1px solid #000; }
.faq-index a { min-height: 100px; display: flex; align-items: center; padding: 20px var(--gutter); border-right: 1px solid #000; font-size: 17px; line-height: 1.2; text-decoration: none; }
.faq-index a:last-child { border-right: 0; }
.faq-index a:hover { background: #000; color: #fff; }
.faq-section { display: grid; grid-template-columns: .7fr 1.3fr; gap: 70px; padding: clamp(80px, 10vw, 150px) var(--gutter); border-bottom: 1px solid #000; scroll-margin-top: 78px; }
.faq-section header h2 { max-width: 620px; margin: 0; font-size: clamp(48px, 6vw, 94px); }
.faq-list { border-top: 1px solid #000; }
.faq-list details { border-bottom: 1px solid #000; }
.faq-list summary { padding: 25px 36px 25px 0; cursor: pointer; font: 20px/1.25 var(--body); list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: '+'; float: right; font: 18px/1 var(--mono); }
.faq-list details[open] summary::after { content: '−'; }
.faq-list details p { max-width: 700px; margin: 0; padding: 0 48px 28px 0; font-size: 17px; line-height: 1.5; }
.price-list-section { min-height: 70svh; display: grid; grid-template-columns: .72fr 1.28fr; align-items: stretch; background: #000; color: #fff; }
.price-list-section__copy { position: sticky; top: 78px; align-self: start; min-height: calc(100svh - 78px); display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(80px, 9vw, 140px) var(--gutter); }
.price-list-section__copy h2 { margin: 0 0 38px; }
.price-list-section__copy p { max-width: 540px; margin: 0 0 28px; font-size: 19px; line-height: 1.45; }
.price-list-section__date { font: 9px/1.35 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.price-list-section__embed { min-width: 0; min-height: 70svh; padding: 0; border-left: 1px solid #555; background: var(--paper); color: #000; }
.price-controls { position: sticky; top: 78px; z-index: 4; background: var(--paper); }
.price-tabs { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid #000; }
.price-tabs button { min-height: 82px; border: 0; border-right: 1px solid #000; border-radius: 0; background: transparent; font: clamp(26px, 2.4vw, 42px)/1 var(--display); text-align: left; text-transform: uppercase; }
.price-tabs button { padding: 18px 24px; }
.price-tabs button:last-child { border-right: 0; }
.price-tabs button.is-active { background: #000; color: #fff; }
.price-currency-tabs { min-height: 48px; display: grid; grid-template-columns: 1fr auto auto; align-items: stretch; border-bottom: 1px solid #000; }
.price-currency-tabs > span { display: flex; align-items: center; padding: 0 24px; font: 9px/1 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.price-currency-tabs button { min-width: 170px; padding: 12px 18px; border: 0; border-left: 1px solid #000; border-radius: 0; background: transparent; font: 10px/1 var(--mono); letter-spacing: .03em; text-transform: uppercase; }
.price-currency-tabs button.is-active { background: #000; color: #fff; }
.price-panel { min-width: 0; }
.price-panel[hidden] { display: none; }
.price-range { min-width: 0; overflow-x: auto; border-bottom: 1px solid #000; }
.price-range > header { min-height: 112px; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding: 22px 24px; }
.price-range h3 { margin: 0; font-size: clamp(38px, 4vw, 62px); }
.price-range header span, .price-list-note { font: 9px/1.35 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.price-table { min-width: 720px; border-top: 1px solid #000; }
.price-row { min-height: 58px; display: grid; grid-template-columns: minmax(220px, 1fr) repeat(4, minmax(88px, 108px)); align-items: center; border-bottom: 1px solid #aaa; }
.price-row:last-child { border-bottom: 0; }
.price-row > span { padding: 14px 18px; font-size: 14px; line-height: 1.25; }
.price-row > span + span { border-left: 1px solid #aaa; font-variant-numeric: tabular-nums; text-align: right; }
.price-row--head > span { font: 9px/1 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.price-list-surcharge { display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, .45fr); align-items: end; gap: 28px; padding: 34px 24px; background: #000; color: #fff; }
.price-list-surcharge strong { font: clamp(32px, 3.8vw, 58px)/.86 var(--display); text-transform: uppercase; }
.price-list-surcharge span { max-width: 270px; font-size: 17px; line-height: 1.35; }
.price-list-note { max-width: 720px; margin: 0; padding: 24px; }
.service-steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-bottom: 1px solid #000; }
.service-steps article { min-height: 330px; display: flex; flex-direction: column; padding: 30px var(--gutter); border-bottom: 1px solid #000; }
.service-steps article:nth-child(even) { border-left: 1px solid #000; }
.service-steps span { font: 10px/1 var(--mono); }
.service-steps h2 { margin: auto 0 28px; font-size: clamp(42px, 5vw, 76px); }
.service-steps p { max-width: 560px; margin: 0; font-size: 18px; line-height: 1.4; }
.store-directory > header { margin-bottom: 55px; }
.store-directory > header h2 { margin-bottom: 30px; }
.store-directory > header p { max-width: 520px; font-size: 19px; line-height: 1.4; }

.editorial-page-hero { min-height: 75svh; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(80px, 10vw, 150px) var(--gutter); background: #000; color: #fff; }
.editorial-page-hero h1 { max-width: 1300px; margin-bottom: 44px; }
.editorial-page-hero p { max-width: 620px; margin: 0; font-size: 22px; line-height: 1.4; }
.guarantee-sections { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 1px solid #000; }
.guarantee-sections article { min-height: 520px; display: flex; flex-direction: column; align-items: flex-start; padding: 38px var(--gutter); }
.guarantee-sections article + article { border-left: 1px solid #000; }
.guarantee-sections h2 { margin-bottom: 80px; font-size: clamp(42px, 4.5vw, 68px); }
.guarantee-sections p { font-size: 17px; line-height: 1.5; }
.guarantee-sections .text-link { margin-top: auto; }
.rights-statement { max-width: 900px; margin: 0; padding: 55px var(--gutter); font-size: 14px; line-height: 1.5; }
.form-trap { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; }
.form-helper, .form-privacy { margin: 0; font-size: 13px; line-height: 1.45; }
.form-privacy { color: #555; }

.start-project { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 0; padding: 0; background: #000; color: #fff; }
.start-project__intro { min-width: 0; padding: clamp(80px, 9vw, 140px) var(--gutter); }
.start-project > .project-form { width: 100%; align-self: stretch; align-content: center; padding: clamp(80px, 9vw, 140px) var(--gutter); background: var(--paper); color: #000; }
.start-project h2 { margin-bottom: 36px; }
.start-project > div p { max-width: 430px; font-size: 21px; line-height: 1.35; }
.project-positioning { margin-top: clamp(50px, 6vw, 82px); border-top: 1px solid currentColor; }
.project-positioning ol { margin: 0; padding: 0; list-style: none; }
.project-positioning li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 14px; padding: 19px 0 21px; border-bottom: 1px solid currentColor; }
.project-positioning li > span { padding-top: 3px; font: 9px/1 var(--mono); letter-spacing: .05em; }
.project-positioning strong { display: block; font: clamp(24px, 2vw, 34px)/.92 var(--display); text-transform: uppercase; }
.project-positioning li p { max-width: 430px; margin: 11px 0 0; font-size: 14px; line-height: 1.4; }
.start-page {
  min-height: calc(100svh - 78px);
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  background: #000;
  color: #fff;
}
.start-page__intro { min-width: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(52px, 8vw, 120px) var(--gutter); }
.start-page__intro h1 { margin: 0 0 clamp(32px, 5vw, 70px); overflow-wrap: anywhere; }
.start-page__intro p { max-width: 510px; margin: 0; font-size: clamp(20px, 2vw, 30px); line-height: 1.25; }
.start-page__intro .project-positioning { width: 100%; max-width: 620px; }
.start-page__intro .project-positioning li p { font-size: 14px; line-height: 1.4; }
.start-page__form { display: flex; align-items: center; padding: clamp(52px, 8vw, 120px) var(--gutter); background: var(--paper); color: #000; }
.start-page__form .project-form { width: 100%; }
.project-form { align-self: end; display: grid; grid-template-columns: 1fr 1fr; gap: 30px 24px; }
.project-form label, .comment-form label, .kit-item label { display: flex; flex-direction: column; gap: 9px; font: 10px/1.3 var(--mono); letter-spacing: .07em; text-transform: uppercase; }
.project-form input, .project-form select, .project-form textarea, .comment-form input, .comment-form textarea, .kit-item select {
  width: 100%;
  padding: 12px 0;
  border: 0;
  border-bottom: 1px solid #000;
  border-radius: 0;
  outline: none;
  background: transparent;
  font-size: 18px;
  line-height: 1.35;
}
.project-form input:focus, .project-form select:focus, .project-form textarea:focus, .comment-form input:focus, .comment-form textarea:focus { border-bottom-width: 3px; }
.form-wide { grid-column: 1 / -1; }
.project-form button, .comment-form button, .quantity-actions button, .kit-item button {
  min-height: 44px;
  justify-self: start;
  padding: 14px 20px;
  border: 1px solid #000;
  border-radius: 0;
  background: #000;
  color: #fff;
  font: 10px/1 var(--mono);
  letter-spacing: .06em;
  text-transform: uppercase;
}
.project-form button:hover, .comment-form button:hover, .quantity-actions button:hover, .kit-item button:hover { background: #fff; color: #000; }
button:disabled { cursor: wait; opacity: .45; }
.form-status { min-height: 16px; margin: 0; font: 9px/1.4 var(--mono); letter-spacing: .03em; text-transform: uppercase; }

@media (min-width: 901px) {
  .home-guarantee h2 span { white-space: nowrap; }
}

.site-footer { min-height: 430px; display: flex; flex-direction: column; justify-content: space-between; gap: 70px; padding: clamp(58px, 5vw, 82px) var(--gutter) 30px; border-top: 1px solid #333; background: #000; color: #fff; }
.site-footer__main { display: grid; grid-template-columns: minmax(340px, 1.5fr) minmax(180px, .7fr) minmax(220px, .85fr); gap: clamp(44px, 7vw, 120px); }
.site-footer__brand img { width: min(250px, 78%); margin-bottom: 38px; filter: brightness(0) invert(1); }
.site-footer__brand > p { max-width: 500px; margin: 0; font-size: clamp(16px, 1.35vw, 22px); line-height: 1.35; }
.site-footer__links { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
.site-footer__links p { margin: 0 0 10px; font: 9px/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.site-footer__links a, .site-footer__links button { padding: 0; color: inherit; background: none; border: 0; font: inherit; font-size: clamp(14px, 1.25vw, 20px); line-height: 1.15; text-align: left; text-decoration: none; cursor: pointer; }
.site-footer__links a:hover, .site-footer__links button:hover { opacity: .62; }
.site-footer__bottom { display: flex; align-items: center; justify-content: center; gap: 32px; font-size: 14px; }
.site-footer__bottom p { margin: 0; }
.site-footer__bottom a { text-decoration: none; }
.site-footer__markets { margin-right: auto; display: flex; gap: 18px; font: 10px/1 var(--mono); }
.site-footer__staff { margin-left: auto; font: 9px/1 var(--mono); letter-spacing: .05em; text-transform: uppercase; }

.review-hero { min-height: clamp(520px, 64svh, 760px); display: grid; grid-template-columns: 1.05fr .95fr; background: #000; color: #fff; }
.review-hero > div:not(.review-hero__media) { display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(44px, 5vw, 80px) var(--gutter); }
.review-hero h1 { margin-bottom: 0; }
.review-hero p { max-width: 530px; font-size: clamp(20px, 2.3vw, 34px); line-height: 1.2; }
.review-hero > img { width: 100%; height: 100%; object-fit: contain; background: var(--paper); }

.area-review { padding: clamp(44px, 6vw, 90px) var(--gutter) clamp(80px, 10vw, 150px); }
.area-review > header { margin-bottom: 60px; }
.area-review > header h2 { margin: 0; }
.area-review > header p { max-width: 450px; margin: 0; font-size: 19px; line-height: 1.4; }
.review-garments { position: sticky; top: 78px; z-index: 15; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid #000; border-left: 1px solid #000; background: #fff; }
.review-garments button { min-height: 72px; padding: 15px 18px; border: 0; border-right: 1px solid #000; border-bottom: 1px solid #000; background: #fff; font-size: 13px; line-height: 1.2; text-align: left; }
.review-garments button.is-active { background: #000; color: #fff; }
.review-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(330px, 1fr); border-left: 1px solid #000; }
#review-visual, .review-sidebar { min-width: 0; border-right: 1px solid #000; border-bottom: 1px solid #000; }
#review-visual { align-self: start; }
.pin-stage { position: relative; aspect-ratio: 1.05; background: var(--paper); }
.pin-canvas { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; padding: 0; border: 0; background: transparent; }
.pin-stage img { width: 100%; height: 100%; object-fit: contain; }
.saved-pin, .pending-pin { position: absolute; z-index: 4; width: 32px; height: 32px; display: grid; place-items: center; padding: 0; border: 1px solid #fff; border-radius: 50%; background: #000; color: #fff; font: 11px/1 var(--mono); transform: translate(-50%, -50%); }
.saved-pin { pointer-events: auto; }
.pending-pin { z-index: 3; background: #fff; color: #000; border-color: #000; pointer-events: none; }
.saved-pin:focus-visible { outline: 3px solid #000; outline-offset: 3px; }
.angle-tabs { display: flex; min-height: 56px; border-top: 1px solid #000; }
.angle-tabs button { flex: 1; padding: 16px; border: 0; border-right: 1px solid #000; background: #fff; font: 9px/1 var(--mono); text-transform: uppercase; }
.angle-tabs button:last-child { border-right: 0; }
.angle-tabs button.is-active { background: #000; color: #fff; }
.angle-tabs button.is-missing { background: var(--paper); color: #777; cursor: not-allowed; opacity: 1; }
#review-comments { padding: clamp(28px, 4vw, 60px); }
#review-comments h3 { margin-bottom: 26px; }
#review-comments > p { max-width: 350px; line-height: 1.4; }
.comment-form { display: grid; gap: 20px; margin: 48px 0; }
.comment-form button:disabled { cursor: not-allowed; opacity: .3; }
.client-identity { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 0; border-top: 1px solid #000; border-bottom: 1px solid #000; }
.client-identity p, .client-identity > span { margin: 0; font: 9px/1.35 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.client-identity button { min-height: 44px; padding: 10px 0; border: 0; border-bottom: 1px solid #000; background: transparent; font: 9px/1 var(--mono); text-transform: uppercase; }
.comment-list { border-top: 1px solid #000; }
.comment-list > p { padding: 20px 0; font-size: 13px; }
.comment-list article { display: grid; grid-template-columns: 28px 1fr; gap: 15px; padding: 20px 0; border-bottom: 1px solid #000; }
.comment-list article span { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: #000; color: #fff; font: 9px/1 var(--mono); }
.comment-list article p { margin: 0 0 14px; font-size: 15px; line-height: 1.35; }
.comment-list article p strong { display: block; margin-bottom: 4px; font: 9px/1 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.thread-reply { display: grid; gap: 12px; margin-top: 18px; }
.thread-reply label { font: 9px/1.3 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.thread-reply textarea { width: 100%; margin-top: 8px; padding: 10px 0; border: 0; border-bottom: 1px solid #000; border-radius: 0; background: transparent; }
.thread-reply button, .inline-action { justify-self: start; padding: 10px 13px; border: 1px solid #000; border-radius: 0; background: #fff; font: 9px/1 var(--mono); text-transform: uppercase; }
.thread-status { font: 9px/1 var(--mono) !important; letter-spacing: .05em; text-transform: uppercase; }
.loading-line { font: 10px/1.4 var(--mono); text-transform: uppercase; }
.garment-approval { margin-top: 42px; padding-top: 26px; border-top: 1px solid #000; }
.garment-approval > p:first-child { margin: 0 0 16px; font: 10px/1.4 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.garment-approval button, .review-signoff-actions button { padding: 14px 20px; border: 1px solid #000; border-radius: 0; background: #000; color: #fff; font: 10px/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.garment-approval button:hover, .review-signoff-actions button:hover { background: #fff; color: #000; }
.garment-approval button:disabled, .review-signoff-actions button:disabled { background: var(--paper); color: #777; cursor: not-allowed; opacity: 1; }
.review-finish { margin-top: clamp(70px, 9vw, 130px); border: 1px solid #000; }
.review-finish > header { display: grid; grid-template-columns: 2fr 1fr; align-items: end; gap: 50px; padding: clamp(32px, 5vw, 70px); }
.review-finish > header h2, .review-finish > header p { margin: 0; }
.review-finish > header p { max-width: 390px; font-size: 18px; line-height: 1.4; }
.review-finish__status, .review-finish__summary { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid #000; border-bottom: 1px solid #000; }
.review-finish__status p, .review-finish__summary p { min-height: 104px; display: flex; flex-direction: column; justify-content: space-between; margin: 0; padding: 22px; border-right: 1px solid #000; }
.review-finish__status p:last-child, .review-finish__summary p:last-child { border-right: 0; }
.review-finish__status strong, .review-finish__summary strong { font: clamp(28px, 3vw, 50px)/.9 var(--display); text-transform: uppercase; }
.review-finish__status span, .review-finish__summary span { font: 9px/1.2 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.review-signoff-form { display: grid; grid-template-columns: 1fr 1fr; gap: 26px 34px; padding: clamp(32px, 5vw, 70px); }
.review-signoff-form label { display: grid; gap: 10px; font: 9px/1.2 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.review-signoff-form input, .review-signoff-form textarea { width: 100%; padding: 12px 0; border: 0; border-bottom: 1px solid #000; border-radius: 0; outline: none; background: transparent; font-size: 18px; line-height: 1.35; }
.review-signoff-form input:focus, .review-signoff-form textarea:focus { border-bottom-width: 3px; }
.review-signoff-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.review-signoff-form > p:not(.form-status) { max-width: 470px; margin: 0; font-size: 14px; line-height: 1.4; }

.page-intro { min-height: 72svh; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(70px, 10vw, 150px) var(--gutter); background: #000; color: #fff; }
.page-intro h1 { margin-bottom: 42px; }
.page-intro > p { max-width: 620px; margin: 0; font-size: clamp(22px, 2.6vw, 38px); line-height: 1.15; }
.page-intro--light { background: var(--paper); color: #000; }
.page-intro--order { min-height: 48svh; }
.page-intro--archive { background: #141414; }
.page-intro--archive.page-intro--photo > img { object-position: center 54%; }
.page-intro--photo { position: relative; min-height: calc(100svh - 78px); display: block; padding: 0; overflow: hidden; }
.page-intro--photo > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 48%; }
.page-intro__shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0, 0, 0, .68), rgba(0, 0, 0, .06) 68%); }
.page-intro__copy { position: absolute; z-index: 1; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(70px, 10vw, 150px) var(--gutter); }
.page-intro__copy h1 { margin-bottom: 42px; }
.page-intro__copy p { max-width: 620px; margin: 0; font-size: clamp(22px, 2.6vw, 38px); line-height: 1.15; }
.page-intro__copy p + .text-link { margin-top: clamp(42px, 4vw, 58px); }

.range-overview { padding: clamp(80px, 10vw, 150px) var(--gutter); }
.range-overview > h2 { margin-bottom: 32px; }
.range-overview > p { max-width: 590px; margin-bottom: 70px; font-size: 21px; line-height: 1.35; }
.garment-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid #000; border-left: 1px solid #000; }
.garment-tile { min-width: 0; border-right: 1px solid #000; border-bottom: 1px solid #000; }
.garment-tile__image { aspect-ratio: 1.05; display: grid; place-items: center; overflow: hidden; background: var(--paper); }
.garment-tile__image img { width: 88%; height: 90%; object-fit: contain; }
.garment-tile__name { min-height: 105px; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 18px 22px; border-top: 1px solid #000; }
.garment-tile__name h3 { margin: 0; font-size: clamp(27px, 2.9vw, 45px); }
.garment-tile__name span { font: 9px/1 var(--mono); text-transform: uppercase; }

.model-feature { min-height: 780px; display: grid; grid-template-columns: .85fr 1.15fr; background: #000; color: #fff; }
.model-feature__copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(48px, 7vw, 110px) var(--gutter); }
.model-feature__copy h2 { margin-bottom: 44px; font-size: clamp(54px, 6.4vw, 104px); }
.model-feature__copy > p { max-width: 510px; font-size: 18px; line-height: 1.45; }
.model-feature__copy .viewer-help { margin-top: 25px; font: 9px/1.4 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.model-feature__viewer { min-height: 780px; background: var(--paper); }
.model-feature model-viewer { width: 100%; height: 100%; min-height: 780px; background: var(--paper); }
.model-feature__viewer { position: relative; display: grid; place-items: center; overflow: hidden; }
.model-poster { width: 100%; height: 100%; min-height: 780px; object-fit: contain; }
.model-launch { position: absolute; left: 50%; bottom: 38px; transform: translateX(-50%); padding: 14px 20px; border: 1px solid #000; border-radius: 0; background: #000; color: #fff; font: 10px/1 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.model-launch:hover { background: #fff; color: #000; }
.model-status { position: absolute; left: 20px; right: 20px; bottom: 10px; margin: 0; font: 9px/1.3 var(--mono); text-align: center; text-transform: uppercase; }
.model-angles { display: grid; grid-template-columns: repeat(5, 1fr); border-left: 1px solid #000; }
.model-angles figure { margin: 0; border-right: 1px solid #000; border-bottom: 1px solid #000; }
.model-angles img { width: 100%; aspect-ratio: .78; object-fit: contain; background: var(--paper); }
.model-angles figcaption, .angle-grid figcaption { padding: 12px; border-top: 1px solid #000; font: 9px/1 var(--mono); text-transform: uppercase; }

.quantity-builder { padding: clamp(80px, 10vw, 150px) var(--gutter); }
.quantity-builder > header, .kit-builder > header { display: grid; grid-template-columns: 2fr 1fr; align-items: end; gap: 50px; margin-bottom: 60px; }
.quantity-builder > header h2, .kit-builder > header h2 { margin: 0; }
.quantity-builder > header p, .kit-builder > header p { max-width: 440px; margin: 0; font-size: 18px; line-height: 1.4; }
.quantity-row { margin: 0; padding: 0; border: 0; border-top: 1px solid #000; }
.quantity-row:last-child { border-bottom: 1px solid #000; }
.quantity-row h3 { margin: 0; font-size: clamp(26px, 2.8vw, 42px); }
.quantity-row > summary { min-height: 88px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: center; padding: 20px 0; cursor: pointer; list-style: none; }
.quantity-row > summary::-webkit-details-marker { display: none; }
.quantity-row > summary::after { content: '+'; grid-column: 2; grid-row: 1; justify-self: end; font: 28px/1 var(--display); }
.quantity-row[open] > summary::after { content: '−'; }
.quantity-row__total, .quantity-row > summary > span { grid-column: 2; grid-row: 1; justify-self: end; margin-right: 40px; font: 10px/1 var(--mono); text-transform: uppercase; }
.quantity-row > div, .quantity-sizes { display: grid; grid-template-columns: repeat(auto-fit, minmax(48px, 1fr)); gap: 12px; padding: 0 0 28px; }
.quantity-row label { display: grid; gap: 8px; font: 9px/1 var(--mono); text-align: center; }
.quantity-row input { width: 100%; min-width: 0; min-height: 44px; padding: 12px 5px; border: 1px solid #000; border-radius: 0; background: #fff; text-align: center; }
.quantity-total { display: flex; align-items: baseline; gap: 18px; margin: 48px 0 32px; }
.quantity-total strong { font: clamp(60px, 8vw, 120px)/.8 var(--display); }
.quantity-total span { font: 10px/1 var(--mono); text-transform: uppercase; }
.quantity-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.quantity-actions button { padding: 14px 20px; border: 1px solid #000; border-radius: 0; background: #000; color: #fff; font: 10px/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.quantity-actions #save-quantities { background: #fff; color: #000; }
.quantity-builder > .form-status { display: block; margin: 16px 0 0; }
.quantity-summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; margin-top: 42px; padding-top: 26px; border-top: 1px solid #000; background: #fff; }
.quantity-summary .quantity-total { margin: 0; }
.quantity-summary .quantity-total strong { font-size: clamp(54px, 6vw, 86px); }
.quantity-summary .quantity-actions { align-items: center; }
.quantity-summary .form-status { flex: 1 0 100%; }
.quantity-summary > button { min-height: 44px; padding: 14px 20px; border: 1px solid #000; border-radius: 0; background: #000; color: #fff; font: 10px/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.quantity-summary > button:hover { background: #fff; color: #000; }

.store-directory { padding: clamp(50px, 8vw, 110px) var(--gutter); }
.store-row { min-height: 330px; display: grid; grid-template-columns: 1fr 2fr 1fr auto; gap: 30px; align-items: center; border-top: 1px solid #000; border-bottom: 1px solid #000; text-decoration: none; }
.store-row > div { align-self: stretch; display: grid; place-items: center; background: var(--paper); }
.store-row .store-row__type { background: #000; color: #fff; font: clamp(54px, 7vw, 104px)/.8 var(--display); letter-spacing: -.04em; text-transform: uppercase; }
.store-row img { width: 80%; height: 90%; object-fit: contain; }
.store-row h2 { margin: 0; font-size: clamp(58px, 7vw, 110px); }
.store-row p { margin: 0; font: 10px/1 var(--mono); text-transform: uppercase; }
.store-row > span { padding-right: 15px; font-size: 26px; }
.store-empty { min-height: 260px; display: flex; align-items: center; margin: 0; border-top: 1px solid #000; border-bottom: 1px solid #000; font: clamp(42px, 5.2vw, 78px)/.85 var(--display); letter-spacing: -.035em; text-transform: uppercase; }
.start-callout { min-height: 580px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: var(--gutter); background: #000; color: #fff; }
.start-callout h2 { margin-bottom: 50px; }

.store-hero { min-height: calc(100svh - 78px); display: grid; grid-template-columns: 1fr 1fr; background: #000; color: #fff; }
.store-hero > div { display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(55px, 8vw, 120px) var(--gutter); }
.store-hero h1 { margin-bottom: 34px; }
.store-hero p { margin: 0; font-size: clamp(24px, 3vw, 42px); text-transform: uppercase; }
.store-hero > img { width: 100%; height: 100%; object-fit: contain; background: var(--paper); }
.store-status { padding: 20px var(--gutter); border-bottom: 1px solid #000; background: #fff; font: 11px/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.kit-builder { padding: clamp(80px, 10vw, 150px) var(--gutter); }
.kit-progress { min-height: 54px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid #000; }
.kit-progress p { margin: 0; font: 9px/1.35 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.kit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid #000; border-left: 1px solid #000; }
.kit-item { display: grid; grid-template-columns: 1fr; gap: 24px; align-items: end; padding: 30px; border-right: 1px solid #000; border-bottom: 1px solid #000; }
.kit-item img { grid-column: 1 / -1; width: 100%; aspect-ratio: 1.15; object-fit: contain; background: var(--paper); }
.kit-item h3 { grid-column: 1 / -1; margin: 10px 0; }
.kit-item label { grid-column: 1 / -1; }
.kit-item select { min-height: 44px; }
.kit-item .form-status { grid-column: 1 / -1; }
.kit-item--closed { grid-template-columns: 1fr; align-items: start; }

.archive-grid--all { grid-template-columns: repeat(3, minmax(0, 1fr)); border-left: 0; }
.archive-grid--all .archive-card:nth-child(3n + 1) { border-left: 1px solid #000; }
.archive-grid--all .archive-card__media { aspect-ratio: .92; }
.archive-grid--all .archive-card__type { font-size: clamp(50px, 6.2vw, 106px); }

.archive-hero { min-height: calc(100svh - 78px); display: grid; grid-template-columns: .95fr 1.05fr; background: #000; color: #fff; }
.archive-hero > div { display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(55px, 8vw, 120px) var(--gutter); }
.archive-hero h1 { margin-bottom: 40px; }
.archive-hero p { max-width: 500px; margin: 0; font-size: clamp(20px, 2.4vw, 34px); line-height: 1.25; }
.archive-hero > img { width: 100%; height: 100%; object-fit: contain; background: var(--paper); }
.editorial-archive-hero { position: relative; min-height: calc(100svh - 78px); overflow: hidden; background: #000; color: #fff; }
.editorial-archive-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 48%; }
.editorial-archive-hero--holdfast > img { object-position: center 52%; }
.editorial-archive-hero--runasone > img { object-position: center 44%; }
.editorial-archive-hero--goodness-gravel > img { object-position: center 38%; }
.editorial-archive-hero--clubkt > img { object-position: center 58%; }
.editorial-archive-hero__shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0, 0, 0, .7), rgba(0, 0, 0, .08) 68%); }
.editorial-archive-hero__copy { position: absolute; z-index: 1; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(55px, 8vw, 120px) var(--gutter); }
.editorial-archive-hero__copy h1 { margin: 0; }
.editorial-archive-hero__copy p { margin: 0 0 22px; font: 10px/1 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.editorial-archive-intro { display: grid; grid-template-columns: minmax(170px, .35fr) minmax(0, 1fr) minmax(260px, .55fr); align-items: end; gap: clamp(30px, 5vw, 80px); padding: clamp(80px, 10vw, 150px) var(--gutter); border-bottom: 1px solid #000; }
.editorial-archive-intro > p:first-child { align-self: start; font: 10px/1.3 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.editorial-archive-intro h2 { margin: 0; }
.editorial-archive-intro > p:last-child { max-width: 430px; margin: 0; font-size: clamp(18px, 1.7vw, 25px); line-height: 1.35; }
.archive-range { border-top: 1px solid #000; }
.archive-garment > header { padding: clamp(55px, 7vw, 105px) var(--gutter) 36px; }
.archive-garment > header h2 { max-width: 1200px; margin: 0; font-size: clamp(54px, 7vw, 110px); }
.angle-grid { display: grid; border-top: 1px solid #000; border-left: 1px solid #000; }
.angle-grid--1, .angle-grid--2, .angle-grid--3, .angle-grid--4 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.angle-grid figure { min-width: 0; margin: 0; border-right: 1px solid #000; border-bottom: 1px solid #000; }
.angle-grid img { width: 100%; aspect-ratio: .75; object-fit: contain; background: var(--paper); }
.archive-back { display: block; padding: 36px var(--gutter); border-top: 1px solid #000; background: #000; color: #fff; font: 11px/1 var(--mono); text-transform: uppercase; }
.range-overview--archive { padding-top: 0; }
.archive-hero--mhp > img { padding: clamp(20px, 3vw, 50px); }
.turntable { padding: clamp(30px, 5vw, 80px); background: var(--paper); }
.turntable video { display: block; width: min(100%, 1100px); margin: 0 auto; background: #000; }
.archive-empty { min-height: calc(100svh - 78px); display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; padding: clamp(70px, 10vw, 150px) var(--gutter); background: #000; color: #fff; }
.archive-empty h1 { max-width: 1300px; margin-bottom: 40px; overflow-wrap: anywhere; }
.archive-empty p { margin-bottom: 36px; font-size: clamp(20px, 2.4vw, 34px); }

.page-loading, .platform-error, .studio-loading { min-height: 100svh; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: 24px; padding: clamp(60px, 9vw, 130px) var(--gutter); background: var(--paper); }
.page-loading img { width: min(430px, 75vw); }
.page-loading p, .studio-loading p { font: 10px/1.4 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.platform-error { background: #000; color: #fff; }
.platform-error h1 { margin: 0; }
.platform-error p { max-width: 600px; font-size: 22px; }
.platform-error button { padding: 0 0 5px; border: 0; border-bottom: 1px solid currentColor; border-radius: 0; background: transparent; }

.studio-header { position: sticky; top: 0; z-index: 100; min-height: 74px; display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 0 var(--gutter); border-bottom: 1px solid #555; background: #000; color: #fff; }
.studio-header nav { display: flex; align-items: center; gap: clamp(14px, 2vw, 28px); overflow-x: auto; }
.studio-header nav a { font: 10px/1 var(--mono); letter-spacing: .05em; text-decoration: none; text-transform: uppercase; }
.studio-header nav a { flex: 0 0 auto; }
.studio-client-view { padding-left: clamp(14px, 2vw, 28px); border-left: 1px solid #555; }
.studio-account { padding-left: clamp(14px, 2vw, 28px); border-left: 1px solid #555; font: 9px/1 var(--mono); letter-spacing: .04em; white-space: nowrap; text-transform: uppercase; }
.studio-sign-out { flex: 0 0 auto; padding: 0 0 4px; border: 0; border-bottom: 1px solid currentColor; border-radius: 0; background: transparent; color: #fff; font: 9px/1 var(--mono); letter-spacing: .04em; white-space: nowrap; text-transform: uppercase; }
.studio-section[id] { scroll-margin-top: 74px; }
.studio-auth { min-height: calc(100svh - 74px); display: flex; align-items: flex-end; padding: clamp(70px, 10vw, 150px) var(--gutter); background: #000; color: #fff; }
.studio-auth section { width: min(100%, 980px); padding-top: 24px; border-top: 1px solid #555; }
.studio-auth h1 { margin: 0 0 34px; }
.studio-auth section > p:not(.form-status):not(.studio-auth__help) { max-width: 620px; margin-bottom: 30px; font-size: clamp(18px, 2vw, 28px); line-height: 1.25; }
.studio-auth__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 22px; }
.studio-auth__actions a { padding-bottom: 5px; border-bottom: 1px solid currentColor; font: 10px/1 var(--mono); letter-spacing: .05em; text-decoration: none; text-transform: uppercase; }
.studio-auth__help { max-width: 620px; margin: 22px 0 0; font: 10px/1.5 var(--mono); letter-spacing: .025em; text-transform: uppercase; }
.studio-auth button,
.studio-auth .button-link { padding: 14px 20px; border: 1px solid #fff; border-radius: 0; background: #000; color: #fff; font: 10px/1 var(--mono); letter-spacing: .05em; text-decoration: none; text-transform: uppercase; }
.studio-auth button:hover,
.studio-auth .button-link:hover { background: #fff; color: #000; }
.studio-auth .form-status { margin-top: 16px; }
.studio { background: #fff; }
.studio-hero { min-height: 72svh; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(70px, 9vw, 140px) var(--gutter) 44px; background: #000; color: #fff; }
.studio-hero h1 { margin: 0 0 clamp(60px, 10vw, 150px); }
.studio-hero--compact { min-height: clamp(260px, 34svh, 420px); }
.studio-hero--compact h1 { margin: 0; }

.studio-section { padding: clamp(58px, 7vw, 100px) var(--gutter); border-bottom: 1px solid #000; }
.studio-section__title { display: grid; grid-template-columns: 1.3fr .7fr; align-items: end; gap: 40px; margin-bottom: 54px; }
.studio-section__title h2 { margin: 0; font-size: clamp(54px, 7vw, 106px); }
.studio-section__title p { max-width: 430px; margin: 0; font-size: 17px; line-height: 1.4; }
.studio-section--split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(45px, 8vw, 130px); }
.studio-section--split .studio-section__title { grid-template-columns: 1fr; align-items: start; }
.studio-section--split .studio-section__title h2 { font-size: clamp(48px, 5.5vw, 86px); }
.studio-section__title--sub { margin-top: clamp(70px, 9vw, 130px); }
.studio-section__title--sub h3 { margin: 0; font-size: clamp(42px, 5vw, 76px); }

.studio-connections { border-top: 1px solid #000; }
.studio-connection { min-height: 220px; display: grid; grid-template-columns: minmax(190px, .35fr) minmax(0, 1.4fr) minmax(210px, .4fr); border-bottom: 1px solid #000; }
.studio-connection > header { grid-column: 1; grid-row: 1 / span 2; display: flex; flex-direction: column; justify-content: space-between; gap: 36px; padding: 30px 28px 30px 0; border-right: 1px solid #000; }
.studio-connection > header h3 { margin: 0; font-size: clamp(42px, 4.5vw, 72px); }
.studio-connection > header span { display: flex; align-items: center; gap: 9px; font: 9px/1.2 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.studio-connection > header span::before { width: 9px; height: 9px; border: 1px solid #000; content: ''; }
.studio-connection.is-connected > header span::before { background: #000; }
.studio-connection dl { grid-column: 2; grid-row: 1; display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); align-content: stretch; margin: 0; }
.studio-connection dl > div { min-width: 0; display: flex; flex-direction: column; justify-content: space-between; gap: 24px; padding: 30px 22px; border-right: 1px solid #000; }
.studio-connection dt { font: 9px/1.2 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.studio-connection dd { margin: 0; overflow-wrap: anywhere; font-size: 15px; line-height: 1.25; }
.studio-connection__actions { grid-column: 3; grid-row: 1 / span 2; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 12px; padding: 30px 0 30px 28px; }
.studio-connection__actions form { display: grid; gap: 10px; }
.studio-action { display: inline-block; padding: 13px 17px; border: 1px solid #000; border-radius: 0; background: #000; color: #fff; font: 9px/1 var(--mono); letter-spacing: .03em; text-align: left; text-decoration: none; text-transform: uppercase; }
.studio-action--quiet { background: #fff; color: #000; }
.studio-action:disabled { cursor: not-allowed; opacity: .35; }
.studio-connection__blockers { grid-column: 2; grid-row: 2; display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 0; padding: 0 22px 24px; list-style: none; }
.studio-connection__blockers li { font: 9px/1.3 var(--mono); text-transform: uppercase; }
.studio-connection__blockers li::before { content: '— '; }
.studio-connection .form-status { max-width: 210px; margin: 0; font: 9px/1.4 var(--mono); text-transform: uppercase; }
.studio-assets { border-top: 1px solid #000; }
.studio-assets__header { display: grid; grid-template-columns: 1.3fr .7fr; align-items: end; gap: 40px; padding: 42px 0; border-bottom: 1px solid #000; }
.studio-assets__header h2 { margin: 0; font-size: clamp(54px, 7vw, 106px); }
.studio-assets__header p { max-width: 480px; margin: 0; font-size: 17px; line-height: 1.4; }
.asset-source-state { min-height: 56px; display: grid; grid-template-columns: 1fr auto auto; gap: 24px; align-items: center; padding: 17px 0; border-bottom: 1px solid #000; }
.asset-source-state span, .asset-source-state small { font: 9px/1.2 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.asset-source-state strong { font-size: 14px; }
.asset-revision-gate { min-height: 170px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 22px 34px; align-items: center; padding: 38px 0; border-bottom: 1px solid #000; }
.asset-revision-gate > p:first-child { max-width: 720px; margin: 0; font-size: clamp(27px, 3.2vw, 48px); line-height: .98; }
.asset-revision-gate > a, .asset-revision-gate > button { min-width: 190px; padding: 16px 20px; border: 1px solid #000; border-radius: 0; background: #000; color: #fff; cursor: pointer; font: 9px/1 var(--mono); letter-spacing: .03em; text-align: center; text-decoration: none; text-transform: uppercase; }
.asset-revision-gate > button:disabled { cursor: wait; opacity: .4; }
.asset-revision-gate > .form-status { grid-column: 1 / -1; margin: -8px 0 0; }
.asset-package-form { display: grid; grid-template-columns: minmax(230px, .42fr) minmax(0, 1fr); gap: 0; border-bottom: 1px solid #000; }
.asset-package-form__lead { padding: 38px 34px 38px 0; border-right: 1px solid #000; }
.asset-package-form__lead h3 { margin: 0 0 28px; font-size: clamp(44px, 5vw, 78px); }
.asset-package-form__lead p { max-width: 340px; margin: 0; font-size: 15px; line-height: 1.4; }
.asset-package-form__fields { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 34px; padding: 38px; }
.asset-package-picker { grid-column: 2; display: grid; grid-template-columns: 1fr auto; align-items: center; border-top: 1px solid #000; border-bottom: 1px solid #000; }
.asset-package-picker label { min-height: 74px; display: flex; align-items: center; padding: 18px 24px; cursor: pointer; font: 10px/1.2 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.asset-package-picker label + label { border-left: 1px solid #000; }
.asset-package-picker__primary { background: #000; color: #fff; }
.studio-form .asset-package-picker input[type="file"] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.asset-package-picker > span { grid-column: 1 / -1; padding: 12px 0; font: 9px/1.3 var(--mono); text-transform: uppercase; }
#asset-package-result { grid-column: 2; display: grid; gap: 0; padding: 30px 38px; }
#asset-package-result > p { margin: 0; }
.asset-package-summary { padding-bottom: 22px; font: 10px/1.4 var(--mono); text-transform: uppercase; }
.asset-package-summary strong { font-size: 15px; }
.asset-package-exceptions, .asset-package-missing { border-top: 1px solid #000; }
.asset-package-exceptions h4, .asset-package-missing h4 { margin: 0; padding: 18px 0; font: 10px/1 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.asset-package-exception { display: grid; grid-template-columns: minmax(180px, 1fr) 1fr .7fr; gap: 20px; align-items: end; padding: 18px 0; border-top: 1px solid #d5d5d5; }
.asset-package-exception > strong { overflow-wrap: anywhere; font-size: 13px; }
.asset-package-exception label { display: grid; gap: 7px; font: 9px/1 var(--mono); text-transform: uppercase; }
.asset-package-exception select { width: 100%; padding: 9px 0; border: 0; border-bottom: 1px solid #000; border-radius: 0; background: #fff; }
.asset-package-exception > span { grid-column: 2 / -1; font: 9px/1.35 var(--mono); text-transform: uppercase; }
.asset-package-missing p { margin: 0; padding: 0 0 20px; font: 10px/1.7 var(--mono); text-transform: uppercase; }
.asset-package-ready { padding: 18px 0; border-top: 1px solid #000; font: 10px/1.3 var(--mono); text-transform: uppercase; }
.asset-package-form > button { grid-column: 2; margin: 0 38px 38px; }
.asset-package-form > .form-status { grid-column: 2; margin: -20px 38px 38px; }
.studio-designer-check { margin-top: clamp(42px, 7vw, 88px); border-top: 1px solid #000; border-bottom: 1px solid #000; }
.studio-designer-check > header { display: grid; grid-template-columns: 1.3fr .7fr; align-items: end; gap: 40px; padding: 34px 0; }
.studio-designer-check > header h3 { margin: 0; font-size: clamp(48px, 6vw, 92px); }
.studio-designer-check > header p { max-width: 430px; margin: 0; font-size: 17px; line-height: 1.4; }
.studio-designer-check__garments { border-top: 1px solid #000; }
.studio-designer-check__garments article { display: grid; grid-template-columns: minmax(180px, .3fr) minmax(0, 1fr); border-bottom: 1px solid #000; }
.studio-designer-check__garments article > strong { padding: 22px 22px 22px 0; border-right: 1px solid #000; font-size: 17px; }
.studio-designer-check__garments article > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.studio-designer-check figure { margin: 0; border-right: 1px solid #000; background: #e3e3e3; }
.studio-designer-check figure:last-child { border-right: 0; }
.studio-designer-check figure img { width: 100%; aspect-ratio: 1 / 1; object-fit: contain; }
.studio-designer-check figcaption { padding: 10px 12px; border-top: 1px solid #000; background: #fff; font: 9px/1 var(--mono); text-transform: uppercase; }
.studio-designer-check > form { display: grid; grid-template-columns: auto minmax(260px, 1fr) auto; gap: 18px; align-items: end; padding: 30px 0; }
.studio-designer-check > form label { display: grid; gap: 8px; font: 9px/1 var(--mono); text-transform: uppercase; }
.studio-designer-check > form textarea { min-height: 78px; resize: vertical; }
.studio-designer-check > form .form-status { grid-column: 1 / -1; margin: 0; }
.studio-recovery { margin-top: 34px; border-top: 1px solid #000; border-bottom: 1px solid #000; scroll-margin-top: 92px; }
.studio-recovery > summary { padding: 20px 0; cursor: pointer; font: 9px/1 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.studio-recovery[open] > summary { border-bottom: 1px solid #000; }
.studio-recovery .studio-tool-grid { border-top: 0; }

.studio-tool-grid { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid #000; border-left: 1px solid #000; }
.studio-tool { min-width: 0; align-content: start; padding: clamp(28px, 4vw, 52px); border-right: 1px solid #000; border-bottom: 1px solid #000; }
.studio-tool h3 { margin: 0 0 38px; font-size: clamp(32px, 3.5vw, 54px); }
.studio-tool > p { font-size: 15px; line-height: 1.4; }
.studio-tool__note { margin: 0; padding-top: 18px; border-top: 1px solid #000; font: 9px/1.4 var(--mono); text-transform: uppercase; }
.studio-tool__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.studio-checkbox { display: flex !important; grid-template-columns: none !important; flex-direction: row; align-items: center; }
.design-lane { margin: 0; padding: 0; list-style: none; border-top: 1px solid #000; }
.design-lane li { display: grid; grid-template-columns: 28px 1fr auto; gap: 16px; align-items: baseline; padding: 17px 0; border-bottom: 1px solid #000; }
.design-lane span, .design-lane small { font: 9px/1.2 var(--mono); text-transform: uppercase; }
.design-lane strong { font-size: 15px; }
#manifest-result p { margin: 0; padding: 12px 0; border-top: 1px solid #000; font-size: 12px; line-height: 1.4; }

.studio-ledger { border-top: 1px solid #000; }
.studio-ledger__head, .studio-ledger__row { display: grid; grid-template-columns: minmax(190px, 1.5fr) 1fr .65fr; gap: 20px; align-items: center; min-height: 76px; padding: 14px 0; border-bottom: 1px solid #000; }
.studio-ledger__head { min-height: 42px; font: 9px/1 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.studio-ledger__row { text-decoration: none; }
.studio-ledger__row strong { font: clamp(25px, 2.7vw, 42px)/.9 var(--display); text-transform: uppercase; }
.studio-ledger__row span { font-size: 13px; }
.studio-ledger__row span:last-child { font: 9px/1 var(--mono); text-transform: uppercase; }
.studio-ledger__row:hover { background: var(--paper); }

.studio-inbox { border-top: 1px solid #000; }
.studio-inbox__row { display: grid; grid-template-columns: 1fr auto; gap: 8px 20px; padding: 22px 0; border-bottom: 1px solid #000; text-decoration: none; }
.studio-inbox__row strong { font: 26px/.95 var(--display); text-transform: uppercase; }
.studio-inbox__row > span { font: 9px/1.2 var(--mono); text-align: right; text-transform: uppercase; }
.studio-inbox__row p { grid-column: 1 / -1; margin: 8px 0 0; font-size: 14px; line-height: 1.4; }
.studio-inbox__row time { grid-column: 1 / -1; font: 9px/1 var(--mono); text-transform: uppercase; }
.studio-empty { padding: 24px 0; border-top: 1px solid #000; border-bottom: 1px solid #000; }

.studio-boundary { display: flex; justify-content: space-between; align-items: flex-end; gap: 50px; background: #000; color: #fff; }
.studio-boundary h2 { margin-bottom: 30px; font-size: clamp(58px, 7vw, 112px); }
.studio-boundary p { max-width: 650px; margin: 0; font-size: 18px; line-height: 1.4; }
.studio-boundary > strong { flex: 0 0 auto; padding: 14px 18px; border: 1px solid #fff; font: 10px/1 var(--mono); text-transform: uppercase; }
.audit-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid #000; }
.audit-list li { display: grid; grid-template-columns: 140px 1fr 1fr; gap: 22px; padding: 18px 0; border-bottom: 1px solid #000; }
.audit-list time, .audit-list span { font: 9px/1.3 var(--mono); text-transform: uppercase; }

.studio-project-hero { min-height: clamp(320px, 38svh, 470px); display: flex; flex-direction: column; justify-content: flex-end; padding: 34px var(--gutter); background: #000; color: #fff; }
.studio-project-hero > a { align-self: flex-start; margin-bottom: auto; font: 9px/1 var(--mono); text-transform: uppercase; }
.studio-project-hero h1 { max-width: 1300px; margin: 42px 0; }
.studio-project-hero > div { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #555; }
.studio-project-hero > div p { display: grid; gap: 9px; margin: 0; padding: 22px 22px 0 0; }
.studio-project-hero > div p + p { padding-left: 22px; border-left: 1px solid #555; }
.studio-project-hero span { font: 9px/1 var(--mono); text-transform: uppercase; }
.studio-project-hero strong { font-size: 20px; }

.studio-workflow { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); padding: 0 var(--gutter); border-top: 1px solid #555; border-bottom: 1px solid #555; background: #000; color: #fff; }
.studio-workflow a { min-height: 74px; display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; padding: 18px 18px 16px 0; text-decoration: none; }
.studio-workflow a + a { padding-left: 18px; border-left: 1px solid #555; }
.studio-workflow a[aria-current="step"] { background: #fff; color: #000; }
.studio-workflow a[aria-current="step"] + a { border-left-color: #fff; }
.studio-workflow strong { font-size: 15px; }
.studio-workflow span { font: 9px/1 var(--mono); text-transform: uppercase; }
.studio-workflow .is-done:not([aria-current="step"]) { color: #aaa; }

.studio-next-action { min-height: 170px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 36px; align-items: center; padding: 40px var(--gutter); border-bottom: 1px solid #000; }
.studio-next-action > div { max-width: 920px; }
.studio-next-action h2 { margin: 0 0 14px; font-size: clamp(42px, 5.4vw, 78px); }
.studio-next-action p { max-width: 680px; margin: 0; font-size: 17px; line-height: 1.4; }
.studio-next-action > a { min-width: 170px; padding: 15px 18px; border: 1px solid #000; background: #000; color: #fff; font: 9px/1 var(--mono); text-align: center; text-decoration: none; text-transform: uppercase; }
.studio-next-action.is-waiting { background: var(--paper); }

.studio-form { display: grid; gap: 24px; }
.studio-form label, .studio-form legend { display: grid; gap: 8px; font: 9px/1.3 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.studio-form input:not([type="checkbox"]), .studio-form select, .studio-form textarea { width: 100%; padding: 12px 0; border: 0; border-bottom: 1px solid #000; border-radius: 0; background: transparent; font-size: 17px; }
.studio-form fieldset { display: grid; gap: 12px; margin: 0; padding: 20px 0; border: 0; border-top: 1px solid #000; border-bottom: 1px solid #000; }
.studio-form fieldset label { display: flex; grid-template-columns: none; flex-direction: row; align-items: center; }
.studio-form button, .studio-reply-form button, .thread-state-action, .studio-feedback-action button { justify-self: start; padding: 13px 17px; border: 1px solid #000; border-radius: 0; background: #000; color: #fff; font: 9px/1 var(--mono); text-transform: uppercase; }
.studio-form--state { grid-template-columns: auto 1fr; align-items: center; }
.studio-state .studio-form--state { margin-top: 48px; }
.studio-form--state .form-status { grid-column: 1 / -1; }
.bulk-submissions { border-top: 1px solid #000; }
.bulk-submissions article { border-bottom: 1px solid #000; }
.bulk-submissions article > header { display: grid; grid-template-columns: 1fr 1fr auto; gap: 20px; align-items: center; padding: 18px 0; }
.bulk-submissions article > header span { font: 9px/1 var(--mono); text-transform: uppercase; }
.bulk-submissions button, .access-revoke { padding: 10px 13px; border: 1px solid #000; border-radius: 0; background: #fff; font: 9px/1 var(--mono); text-transform: uppercase; }
.order-receipt-table { border-top: 1px solid #000; }
.order-receipt-table__head, .order-receipt-table__row { display: grid; grid-template-columns: minmax(220px, 1.5fr) 1fr .5fr .5fr; gap: 16px; align-items: center; padding: 14px 0; border-bottom: 1px solid #d5d5d5; }
.order-receipt-table__row:last-child { border-bottom: 0; }
.order-receipt-table__head, .order-receipt-table__row span { font: 9px/1.2 var(--mono); text-transform: uppercase; }
.order-receipt-table__row strong { font-size: 14px; }

.readiness-line { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid #000; border-bottom: 1px solid #000; }
.readiness-line p { display: grid; gap: 13px; margin: 0; padding: 30px 20px 30px 0; }
.readiness-line p + p { padding-left: 20px; border-left: 1px solid #000; }
.readiness-line strong { font: clamp(34px, 4vw, 58px)/.85 var(--display); text-transform: uppercase; }
.readiness-line span { font: 9px/1 var(--mono); text-transform: uppercase; }

.asset-ledger-scroll { max-width: 100%; overflow-x: auto; }
.asset-ledger { min-width: 980px; border-top: 1px solid #000; }
.asset-ledger__head, .asset-ledger__row { display: grid; grid-template-columns: minmax(250px, 1.5fr) repeat(7, minmax(82px, .55fr)); gap: 16px; align-items: center; padding: 15px 0; border-bottom: 1px solid #000; }
.asset-ledger__head { font: 9px/1 var(--mono); text-transform: uppercase; }
.asset-ledger__row > div { display: grid; gap: 6px; }
.asset-ledger__row > div strong { font-size: 16px; }
.asset-ledger__row > div span { font: 9px/1.2 var(--mono); text-transform: uppercase; }
.coverage-mark { font: 9px/1 var(--mono); text-transform: uppercase; }
.coverage-mark__label { display: none; }
.coverage-mark strong { font: inherit; }
.coverage-mark::before { content: ''; display: inline-block; width: 8px; height: 8px; margin-right: 7px; border: 1px solid #000; }
.coverage-mark.is-ready::before { background: #000; }

.studio-feedback-list { border-top: 1px solid #000; }
.studio-feedback-action { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; }
.studio-feedback-action p { margin: 0; }
.studio-feedback-action > span { max-width: 280px; font: 9px/1.4 var(--mono); text-transform: uppercase; }
.studio-feedback-thread { display: grid; grid-template-columns: minmax(300px, .8fr) minmax(0, 1.2fr); border-bottom: 1px solid #000; }
.studio-feedback-media { position: relative; min-height: 520px; overflow: hidden; background: var(--paper); }
.studio-feedback-media img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: contain; }
.studio-pin { position: absolute; z-index: 2; width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid #fff; border-radius: 50%; background: #000; color: #fff; font: 10px/1 var(--mono); transform: translate(-50%, -50%); }
.studio-feedback-copy { padding: clamp(28px, 4vw, 58px); border-left: 1px solid #000; }
.studio-feedback-copy header { display: flex; justify-content: space-between; gap: 30px; margin-bottom: 35px; }
.studio-feedback-copy h3 { margin: 0 0 8px; }
.studio-feedback-copy header p, .studio-feedback-copy header > span { margin: 0; font: 9px/1 var(--mono); text-transform: uppercase; }
.studio-thread-messages { border-top: 1px solid #000; }
.studio-thread-messages p { margin: 0; padding: 18px 0; border-bottom: 1px solid #000; font-size: 15px; line-height: 1.4; }
.studio-thread-messages strong { display: block; margin-bottom: 7px; font: 9px/1 var(--mono); text-transform: uppercase; }
.studio-reply-form { display: grid; gap: 14px; margin: 28px 0 18px; }
.studio-reply-form label { display: grid; gap: 9px; font: 9px/1 var(--mono); text-transform: uppercase; }
.studio-reply-form textarea { width: 100%; padding: 12px 0; border: 0; border-bottom: 1px solid #000; border-radius: 0; background: transparent; }
.thread-state-action { background: #fff; color: #000; }

.studio-feedback-history { margin-top: 34px; border-top: 1px solid #000; border-bottom: 1px solid #000; }
.studio-feedback-history > summary { padding: 20px 0; cursor: pointer; font: 9px/1 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.studio-feedback-history[open] > summary { border-bottom: 1px solid #000; }

.studio-client-access { margin-top: clamp(58px, 7vw, 100px); border-top: 1px solid #000; }
.studio-client-access__grid { display: grid; grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr); gap: clamp(40px, 7vw, 100px); }
.studio-issued-links > h3 { margin: 0 0 28px; font-size: clamp(30px, 3vw, 48px); }

.access-ledger { border-top: 1px solid #000; }
.access-ledger > p { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 7px 20px; align-items: center; padding: 18px 0; border-bottom: 1px solid #000; }
.access-ledger strong, .access-ledger span { font-size: 13px; }
.access-ledger code, .access-ledger time { font: 9px/1 var(--mono); text-transform: uppercase; }
.access-revoke { grid-column: 2; grid-row: 3; }
#access-link-result { overflow-wrap: anywhere; }
#access-link-result p { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 0; border-top: 1px solid #000; font-size: 11px; line-height: 1.4; }
#access-link-result button { background: #fff; color: #000; }
.shopify-handoff form { flex: 0 1 520px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.shopify-handoff button { min-height: 44px; padding: 12px 15px; border: 1px solid #fff; border-radius: 0; background: #000; color: #fff; font: 9px/1 var(--mono); text-transform: uppercase; }
.shopify-handoff button:disabled { cursor: not-allowed; }
.shopify-handoff .form-status, #shopify-preview-result { grid-column: 1 / -1; }
#shopify-preview-result { font-size: 13px; line-height: 1.4; }

.studio-release-status { margin: 34px 0 0; font-size: 17px; }
.studio-release-shopify { display: grid; grid-template-columns: minmax(220px, .45fr) minmax(0, 1fr); gap: 40px; align-items: end; margin-top: clamp(58px, 7vw, 100px); padding: clamp(34px, 5vw, 68px); background: #000; color: #fff; }
.studio-release-shopify h3 { margin: 0; font-size: clamp(48px, 6vw, 88px); }

.studio-manage { border-bottom: 1px solid #000; }
.studio-manage > summary { padding: 24px var(--gutter); cursor: pointer; font: 10px/1 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.studio-manage[open] > summary { border-bottom: 1px solid #000; }
[hidden] { display: none !important; }

@media (max-width: 900px) {
  .site-header { min-height: 66px; align-items: center; flex-direction: row; gap: 20px; padding: 0 18px; }
  .site-header .brand { width: 132px; }
  .site-header > .site-nav { display: none; }
  .mobile-menu { display: block; margin-left: auto; }
  .mobile-menu summary { min-height: 44px; display: inline-flex; align-items: center; justify-content: flex-end; list-style: none; cursor: pointer; font: 10px/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
  .mobile-menu summary::-webkit-details-marker { display: none; }
  .mobile-menu__close, .mobile-menu[open] .mobile-menu__open { display: none; }
  .mobile-menu[open] .mobile-menu__close { display: inline; }
  .mobile-menu nav { position: fixed; top: 66px; right: 0; bottom: 0; left: 0; z-index: 49; width: auto; display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 0 18px 18px; overflow-y: auto; border-top: 1px solid #555; background: #000; }
  .mobile-menu nav a { min-height: 0; flex: 1 0 112px; display: flex; align-items: center; padding: 20px 0; border-bottom: 1px solid #555; font: clamp(48px, 14vw, 76px)/.82 var(--display); letter-spacing: -.035em; white-space: normal; }
  .mobile-menu nav .nav-action { flex: 0 0 auto; justify-content: center; margin-top: 18px; padding: 18px; border: 1px solid #fff; font: 10px/1 var(--mono); letter-spacing: .06em; }
  .private-header { min-height: 66px; gap: 14px; }
  .private-header nav { max-width: 65vw; gap: 16px; overflow-x: auto; }
  .private-header nav a, .private-header nav span { flex: 0 0 auto; white-space: nowrap; }
  .home-hero, .project-home__hero, .store-hero, .archive-hero { min-height: calc(100svh - 66px); }
  .home-hero__image--reveal { --reveal-radius: clamp(500px, 75vw, 760px); }
  .page-intro--photo { min-height: calc(100svh - 66px); }
  .start-page { min-height: calc(100svh - 66px); }
  .archive-grid--all { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .archive-grid--all .archive-card:nth-child(3n + 1) { border-left: 0; }
  .archive-grid--all .archive-card:nth-child(2n + 1) { border-left: 1px solid #000; }
  .review-layout { grid-template-columns: 1.4fr 1fr; }
  .model-feature { grid-template-columns: 1fr 1.15fr; }
  .store-row { grid-template-columns: 1fr 1.4fr; padding: 0; }
  .store-row > div { grid-row: 1 / 3; }
  .store-row p { display: block; grid-column: 2; grid-row: 2; align-self: start; }
  .store-row > span { display: none; }
  .studio-section--split { grid-template-columns: 1fr; }
  .studio-connection { grid-template-columns: 1fr; }
  .studio-connection > header, .studio-connection dl, .studio-connection__blockers, .studio-connection__actions { grid-column: 1; grid-row: auto; }
  .studio-connection > header { flex-direction: row; align-items: flex-end; padding: 28px 0; border-right: 0; border-bottom: 1px solid #000; }
  .studio-connection__actions { flex-direction: row; flex-wrap: wrap; padding: 24px 0; border-top: 1px solid #000; }
  .studio-connection__blockers { padding: 22px 0; }
  .studio-assets__header { grid-template-columns: 1fr; align-items: start; gap: 22px; }
  .asset-package-form { grid-template-columns: 1fr; }
  .asset-package-form__lead { padding-right: 0; border-right: 0; border-bottom: 1px solid #000; }
  .asset-package-form__fields, .asset-package-picker, #asset-package-result, .asset-package-form > button, .asset-package-form > .form-status { grid-column: 1; }
  .asset-package-form > button { margin-left: 38px; }
  .asset-package-form > .form-status { margin-left: 38px; }
  .studio-designer-check > header { grid-template-columns: 1fr; align-items: start; gap: 20px; }
  .studio-designer-check__garments article { grid-template-columns: 1fr; }
  .studio-designer-check__garments article > strong { border-right: 0; border-bottom: 1px solid #000; }
  .studio-designer-check > form { grid-template-columns: 1fr; align-items: stretch; }
  .studio-designer-check > form .form-status { grid-column: 1; }
  .studio-tool-grid { grid-template-columns: 1fr; }
  .studio-client-access__grid { grid-template-columns: 1fr; }
  .readiness-line { grid-template-columns: 1fr 1fr; }
  .readiness-line p:nth-child(3) { border-left: 0; border-top: 1px solid #000; }
  .readiness-line p:nth-child(4) { border-top: 1px solid #000; }
}

@media (max-width: 640px) {
  :root { --gutter: 18px; }
  h1 { font-size: clamp(64px, 20vw, 88px); }
  h2 { font-size: clamp(50px, 15vw, 72px); }
  .brand { width: 132px; }
  .home-hero__copy { bottom: 40px; }
  .home-hero h1 { margin-bottom: 22px; }
  .home-hero p { max-width: 310px; font-size: 19px; }
  .home-hero__image--reveal { --reveal-radius: clamp(330px, 92vw, 430px); }
  .project-home__hero { grid-template-columns: 1fr; min-height: auto; }
  .project-journey__desktop { display: none; }
  .project-journey__mobile { display: block; }
  .project-journey__mobile summary { min-height: 76px; display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: end; padding: 16px 18px; cursor: pointer; list-style: none; }
  .project-journey__mobile summary::-webkit-details-marker { display: none; }
  .project-journey__mobile summary span, .project-journey__mobile summary small { font: 8px/1 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
  .project-journey__mobile summary strong { font-size: 16px; line-height: 1; }
  .project-journey__mobile[open] summary { border-bottom: 1px solid #000; }
  .project-journey__mobile ol { padding: 0 18px; }
  .project-journey__mobile li > a, .project-journey__mobile li > div { min-height: 54px; display: grid; grid-template-columns: 34px 1fr auto; gap: 12px; align-items: center; border-bottom: 1px solid #d5d5d5; text-decoration: none; }
  .project-journey__mobile li.is-current { margin: 0 -18px; padding: 0 18px; }
  .project-journey__mobile li small { grid-column: 3; }
  .project-home__copy { min-height: 58svh; padding: 58px 18px 30px; }
  .project-home__copy h1 { padding-top: 30px; }
  .project-home__stage { align-items: flex-start; flex-direction: column; margin: 55px 0 24px; }
  .project-home__hero > img { height: 48svh; }
  .project-home__media { min-height: 46svh; }
  .project-home__media img { bottom: -2%; width: 72%; height: 100%; }
  .project-home__media img:first-child { left: -12%; }
  .project-home__media img:last-child { right: -14%; }
  .hero-actions { gap: 16px 24px; }
  .proof-strip { grid-template-columns: 1fr; }
  .proof-strip span { min-height: 52px; padding: 15px 18px; }
  .proof-strip span + span { border-top: 1px solid #000; border-left: 0; }
  .custom-intro { grid-template-columns: 1fr; gap: 38px; padding: 82px 18px; }
  .custom-intro > .page-label { grid-column: 1; }
  .custom-intro__statement { font-size: clamp(48px, 14.5vw, 68px); }
  .custom-intro__body { font-size: 18px; }
  .custom-intro__detail { font-size: 18px; }
  .trust-section { padding: 0 18px 76px; }
  .trust-section__head { align-items: flex-start; }
  .trust-marks { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 28px 0; }
  .trust-mark { min-height: 96px; padding: 20px 16px; }
  .trust-mark img { max-width: 124px; max-height: 44px; }
  .job-links, .offer-grid, .service-steps { grid-template-columns: 1fr; }
  .job-links header, .offer-grid header { padding: 72px 18px 36px; }
  .job-links > a { min-height: 160px; padding: 24px 18px; }
  .job-links > a:nth-of-type(even), .offer-grid article:nth-of-type(even), .service-steps article:nth-child(even) { border-left: 0; }
  .offer-grid article { min-height: 220px; padding: 28px 18px; }
  .offer-grid article h3 { margin-bottom: 54px; }
  .project-ordering { min-height: 76svh; }
  .project-ordering > img { object-position: 54% center; }
  .project-ordering__shade { background: linear-gradient(180deg, rgba(0, 0, 0, .72) 0, rgba(0, 0, 0, .18) 62%, rgba(0, 0, 0, .7) 100%); }
  .project-ordering__copy { justify-content: space-between; padding: 54px 18px 46px; }
  .project-ordering h2 { max-width: 340px; margin-bottom: auto; font-size: clamp(58px, 18vw, 78px); }
  .project-ordering p { max-width: 330px; margin: 42px 0 30px; font-size: 18px; }
  .ordering-options { grid-template-columns: 1fr; gap: 8px; }
  .ordering-options > div { padding-top: 24px; border-top: 1px solid rgba(255,255,255,.55); }
  .ordering-options p { margin: 18px 0 24px; }
  .project-process { padding: 82px 18px; }
  .project-process__head { grid-template-columns: 1fr; align-items: start; gap: 32px; margin-bottom: 60px; }
  .project-process__lead { font-size: clamp(48px, 14.5vw, 68px); }
  .project-process__meta { justify-self: start; flex-wrap: wrap; }
  .process-list { grid-template-columns: 1fr; }
  .process-list li { min-height: 210px; padding: 22px 18px; }
  .guarantee-callout { min-height: 76svh; padding: 82px 18px; }
  .guarantee-callout p { font-size: 18px; }
  .process-steps { grid-template-columns: 1fr 1.8fr 1fr; }
  .process-steps li { min-height: 220px; padding: 18px 10px 20px 0; }
  .process-steps li + li { padding-left: 10px; }
  .process-steps h3 { font-size: clamp(24px, 7.2vw, 32px); }
  .process-icon--eye, .process-icon--flower { width: clamp(60px, 18vw, 78px); height: clamp(60px, 18vw, 78px); }
  .process-icon--coil { width: 100%; height: 78px; }
  .process-label { font-size: 8px; }
  .home-archive { padding: 80px 18px; }
  .home-archive__heading { grid-template-columns: 1fr; align-items: start; }
  .home-archive__heading a { justify-self: start; }
  .home-guarantee, .home-guarantee__link { min-height: 82svh; }
  .home-guarantee__copy { inset: 0; width: 100%; justify-content: flex-end; padding: 82px 18px 52px; }
  .home-guarantee h2 { font-size: clamp(54px, 15.5vw, 74px); }
  .home-guarantee__media img { object-position: center 48%; }
  .home-guarantee__shade { background: linear-gradient(180deg, rgba(0,0,0,.06) 22%, rgba(0,0,0,.38) 58%, rgba(0,0,0,.94) 100%); }
  .archive-filters { gap: 22px; padding: 24px 18px; overflow-x: auto; }
  .archive-grid, .archive-grid--all { grid-template-columns: 1fr; }
  .archive-grid .archive-card, .archive-grid--all .archive-card { border-left: 0; }
  .archive-grid--all .archive-card:nth-child(2n + 1) { border-left: 0; }
  .archive-card__media, .archive-grid--all .archive-card__media { aspect-ratio: 1.05; }
  .archive-card__name { min-height: 84px; padding: 16px 18px; }
  .archive-card__type { padding: 28px 18px; font-size: clamp(56px, 19vw, 80px); }
  .start-project { grid-template-columns: 1fr; }
  .start-project__intro { margin: 0; padding: 76px 18px 64px; }
  .start-project > .project-form { padding: 54px 18px 72px; }
  .start-page { min-height: 0; grid-template-columns: 1fr; }
  .start-page__intro { min-height: 48svh; padding: 76px 18px 64px; }
  .start-page__intro h1 { margin-bottom: 30px; }
  .start-page__intro p { max-width: 330px; font-size: 19px; }
  .project-positioning { margin-top: 50px; }
  .project-positioning strong { font-size: 27px; }
  .project-positioning li p, .start-page__intro .project-positioning li p { max-width: 300px; font-size: 14px; }
  .start-page__form { padding: 54px 18px 72px; }
  .project-form { grid-template-columns: 1fr; }
  .project-form .form-wide { grid-column: auto; }
  .site-footer { min-height: 0; gap: 62px; padding: 62px 18px 28px; }
  .site-footer__main { grid-template-columns: 1fr; gap: 0; }
  .site-footer__brand { padding-bottom: 54px; }
  .site-footer__brand img { width: 180px; margin-bottom: 30px; }
  .site-footer__brand > p { max-width: 350px; font-size: 16px; }
  .site-footer__links { padding: 30px 0; border-top: 1px solid #444; }
  .site-footer__links { gap: 16px; }
  .site-footer__links p { margin-bottom: 12px; }
  .site-footer__links a, .site-footer__links button { font-size: 17px; }
  .site-footer__bottom { align-items: flex-start; flex-direction: column; gap: 18px; padding-top: 26px; border-top: 1px solid #444; }
  .site-footer__markets, .site-footer__staff { margin: 0; }
  .sport-hero, .sport-hero > img { min-height: calc(100svh - 66px); height: calc(100svh - 66px); }
  .sport-hero__copy { left: 18px; right: 18px; bottom: 42px; }
  .sport-hero__copy h1 { font-size: clamp(58px, 18vw, 82px); }
  .sport-hero__copy p { max-width: 340px; font-size: 18px; }
  .sport-product, .sport-projects > header, .project-close, .faq-section, .price-list-section { grid-template-columns: 1fr; }
  .sport-product { gap: 38px; padding: 82px 18px; }
  .sport-projects { padding: 80px 18px; }
  .project-close { padding: 76px 18px; }
  .project-close > div { margin-top: 45px; }
  .faq-section { gap: 46px; padding: 76px 18px; }
  .faq-hero { min-height: 70svh; padding: 80px 18px 58px; }
  .faq-hero h1 { font-size: clamp(58px, 18vw, 84px); }
  .faq-index { grid-template-columns: 1fr; }
  .faq-index a { min-height: 86px; padding: 18px; border-right: 0; border-bottom: 1px solid #000; }
  .faq-index a:last-child { border-bottom: 0; }
  .price-list-section__copy { position: static; min-height: 70svh; padding: 76px 18px; }
  .price-list-section__embed { min-height: 52svh; border-top: 1px solid #555; border-left: 0; }
  .price-controls { top: 66px; }
  .price-tabs button { min-height: 70px; padding: 16px 18px; font-size: 30px; }
  .price-currency-tabs { grid-template-columns: auto 1fr 1fr; }
  .price-currency-tabs > span { padding: 0 12px; }
  .price-currency-tabs button { min-width: 0; padding: 12px 10px; font-size: 8px; }
  .price-range > header { min-height: 96px; padding: 20px 18px; }
  .price-table { min-width: 650px; }
  .price-row { grid-template-columns: minmax(210px, 1fr) repeat(4, 110px); }
  .price-row > span { padding: 13px 10px; font-size: 12px; }
  .price-row > span:first-child { padding-left: 18px; }
  .price-list-surcharge { grid-template-columns: 1fr; gap: 18px; padding: 30px 18px; }
  .price-list-note { padding: 22px 18px; }
  .service-steps article { min-height: 250px; padding: 24px 18px; }
  .editorial-page-hero { min-height: 70svh; padding: 80px 18px 58px; }
  .editorial-page-hero h1 { font-size: clamp(58px, 18vw, 84px); }
  .editorial-page-hero p { font-size: 19px; }
  .guarantee-sections { grid-template-columns: 1fr; }
  .guarantee-sections article { min-height: 420px; padding: 38px 18px; }
  .guarantee-sections article + article { border-top: 1px solid #000; border-left: 0; }
  .rights-statement { padding: 42px 18px; }

  .review-hero, .store-hero, .archive-hero { grid-template-columns: 1fr; min-height: auto; }
  .review-hero > div:not(.review-hero__media) { min-height: 34svh; padding: 48px 18px 30px; }
  .store-hero > div, .archive-hero > div { min-height: 62svh; padding: 72px 18px 45px; }
  .review-hero > img { height: 44svh; }
  .review-hero__media { min-height: 44svh; }
  .review-hero__media img { bottom: -3%; width: 72%; height: 102%; }
  .review-hero__media img:first-child { left: -13%; }
  .review-hero__media img:last-child { right: -14%; }
  .store-hero > img, .archive-hero > img { height: 58svh; }
  .editorial-archive-hero { min-height: auto; display: flex; flex-direction: column; }
  .editorial-archive-hero > img { position: relative; order: 1; height: auto; aspect-ratio: 1; object-fit: cover; }
  .editorial-archive-hero__shade { display: none; }
  .editorial-archive-hero__copy { position: relative; order: 2; min-height: 46svh; justify-content: flex-end; padding: 60px 18px 42px; }
  .editorial-archive-hero__copy h1 { font-size: clamp(62px, 18vw, 104px); }
  .editorial-archive-intro { grid-template-columns: 1fr; align-items: start; gap: 34px; padding: 76px 18px; }
  .editorial-archive-intro h2 { font-size: 54px; }
  .editorial-archive-intro > p:last-child { font-size: 18px; }
  .area-review { padding: 30px 18px 76px; }
  .area-review > header, .quantity-builder > header, .kit-builder > header { grid-template-columns: 1fr; align-items: start; margin-bottom: 42px; }
  .review-garments { top: 66px; display: flex; margin: 0 -18px; overflow-x: auto; border-left: 0; scroll-snap-type: x proximity; scrollbar-width: none; }
  .review-garments::-webkit-scrollbar { display: none; }
  .review-garments button { flex: 0 0 min(72vw, 280px); min-height: 64px; padding: 12px 18px; font-size: 12px; scroll-snap-align: start; }
  .review-garments button:first-child { border-left: 1px solid #000; }
  .review-layout { grid-template-columns: 1fr; }
  #review-visual, .review-sidebar { border-right: 1px solid #000; }
  .pin-stage { aspect-ratio: .9; }
  #review-comments { padding: 34px 20px; }
  .review-finish > header { grid-template-columns: 1fr; align-items: start; gap: 26px; padding: 32px 20px; }
  .review-finish__status, .review-finish__summary { grid-template-columns: 1fr 1fr; }
  .review-finish__status p, .review-finish__summary p { min-height: 94px; padding: 18px 14px; }
  .review-signoff-form { grid-template-columns: 1fr; padding: 32px 20px; }
  .review-signoff-form .form-wide { grid-column: auto; }
  .review-signoff-actions { flex-direction: column; align-items: stretch; }

  .page-intro { min-height: 64svh; padding: 70px 18px 45px; }
  .page-intro--order { min-height: 46svh; }
  .page-intro > p { font-size: 21px; }
  .page-intro--photo { min-height: calc(100svh - 112px); padding: 0; }
  .page-intro--photo > img { object-position: center center; }
  .page-intro__copy { padding: 70px 18px 45px; }
  .page-intro__copy p { max-width: 320px; font-size: 21px; }
  .page-intro__copy p + .text-link { margin-top: 42px; }
  .range-overview { padding: 76px 18px; }
  .range-overview > p { margin-bottom: 42px; font-size: 18px; }
  .garment-grid { grid-template-columns: 1fr; }
  .garment-tile__image { aspect-ratio: 1; }
  .garment-tile__name { min-height: 84px; padding: 14px 16px; }

  .model-feature { grid-template-columns: 1fr; min-height: auto; }
  .model-feature__copy { padding: 76px 18px 50px; }
  .model-feature__copy h2 { font-size: 54px; }
  .model-feature__viewer, .model-feature model-viewer { min-height: 72svh; }
  .model-poster { min-height: 72svh; }
  .model-angles { grid-template-columns: repeat(2, 1fr); }
  .model-angles figure:last-child { grid-column: 1 / -1; }
  .quantity-builder, .kit-builder { padding: 76px 18px; }
  .quantity-row > summary { min-height: 72px; padding: 14px 0; }
  .quantity-row h3 { font-size: 28px; }
  .quantity-row__total, .quantity-row > summary > span { margin-right: 32px; }
  .quantity-row > div, .quantity-sizes { grid-template-columns: repeat(3, 1fr); gap: 12px 9px; padding-bottom: 22px; }
  .quantity-row input { font-size: 16px; }
  .quantity-summary { position: sticky; z-index: 12; bottom: 0; margin: 32px -18px -76px; padding: 14px 18px calc(14px + env(safe-area-inset-bottom)); border-top: 1px solid #000; }
  .quantity-summary .quantity-total { gap: 10px; }
  .quantity-summary .quantity-total strong { font-size: 46px; }
  .quantity-summary .quantity-actions { flex: 1; justify-content: flex-end; }
  .quantity-summary > button { margin-left: auto; }
  .quantity-summary .quantity-actions button { min-height: 44px; }
  .quantity-summary .form-status { order: 3; min-height: 0; }
  .quantity-builder > .form-status { display: block; margin: 16px 0 0; }

  .store-directory { padding: 36px 18px 80px; }
  .store-row { min-height: 220px; grid-template-columns: .9fr 1.1fr; gap: 16px; }
  .store-row h2 { font-size: 50px; }
  .start-callout { min-height: 470px; }
  .kit-grid { grid-template-columns: 1fr; }
  .kit-progress { position: sticky; z-index: 12; top: 108px; margin: 0 -18px; padding: 0 18px; background: #fff; }
  .kit-item { padding: 20px; }

  .archive-garment > header { padding: 70px 18px 28px; }
  .archive-garment > header h2 { font-size: 48px; }
  .angle-grid--1, .angle-grid--2, .angle-grid--3, .angle-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .angle-grid img { aspect-ratio: .75; }
  .archive-back { padding: 28px 18px; }
  .turntable { padding: 18px; }

  .studio-header { min-height: auto; align-items: flex-start; flex-direction: column; gap: 0; padding-top: 16px; }
  .studio-header .brand { width: 120px; }
  .studio-header nav { width: 100%; max-width: none; flex-wrap: wrap; gap: 16px; padding: 14px 0 16px; overflow: visible; }
  .studio-account { display: none; }
  .studio-auth { min-height: calc(100svh - 112px); padding: 72px 18px; }
  .studio-auth__actions { align-items: stretch; flex-direction: column; }
  .studio-auth__actions button,
  .studio-auth__actions .button-link { width: 100%; text-align: center; }
  .studio-auth__actions a:not(.button-link) { align-self: flex-start; }
  .studio-section[id] { scroll-margin-top: 112px; }
  .studio-hero { min-height: 78svh; padding: 72px 18px 32px; }
  .studio-hero h1 { margin-bottom: 70px; }
  .studio-hero--compact { min-height: 32svh; }
  .studio-hero--compact h1 { margin: 0; }
  .studio-section { padding: 72px 18px; }
  .studio-section__title { grid-template-columns: 1fr; align-items: start; gap: 24px; margin-bottom: 40px; }
  .studio-section__title h2 { font-size: 54px; }
  .studio-section--split { gap: 80px; }
  .studio-boundary { align-items: flex-start; flex-direction: column; }
  .audit-list li { grid-template-columns: 1fr; gap: 7px; }
  .studio-project-hero { min-height: clamp(300px, 40svh, 420px); padding: 32px 18px; }
  .studio-project-hero h1 { margin: 48px 0 36px; }
  .studio-project-hero > div { grid-template-columns: 1fr; }
  .studio-project-hero > div p, .studio-project-hero > div p + p { padding: 16px 0; border-left: 0; border-bottom: 1px solid #555; }
  .studio-workflow { max-width: 100%; grid-template-columns: repeat(5, minmax(0, 1fr)); overflow: visible; padding: 0; }
  .studio-workflow a { min-width: 0; min-height: 64px; flex-direction: column; align-items: flex-start; justify-content: flex-end; gap: 7px; padding: 12px 6px; }
  .studio-workflow a + a { padding-left: 6px; }
  .studio-workflow strong { font-size: 11px; }
  .studio-workflow span { font-size: 7px; }
  .studio-next-action { grid-template-columns: 1fr; align-items: start; padding: 34px 18px; }
  .studio-next-action > a { width: 100%; }
  .studio-connection dl { grid-template-columns: 1fr 1fr; }
  .studio-connection dl > div { padding: 22px 16px 22px 0; border-right: 0; border-bottom: 1px solid #000; }
  .studio-connection dl > div:nth-child(even) { padding-left: 16px; border-left: 1px solid #000; }
  .studio-connection dl > div:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .studio-connection__actions { align-items: stretch; flex-direction: column; }
  .studio-connection__actions form, .studio-action { width: 100%; }
  .studio-connection__actions .studio-action { text-align: center; }
  .studio-assets__header h2 { font-size: 54px; }
  .asset-source-state { grid-template-columns: 1fr auto; gap: 10px 18px; }
  .asset-source-state small { grid-column: 1 / -1; }
  .asset-revision-gate { grid-template-columns: 1fr; align-items: start; }
  .asset-revision-gate > a, .asset-revision-gate > button { width: 100%; }
  .asset-package-form__fields { grid-template-columns: 1fr; padding: 30px 0; }
  .asset-package-picker { grid-template-columns: 1fr; }
  .asset-package-picker label + label { border-top: 1px solid #000; border-left: 0; }
  .asset-package-picker > span { padding: 12px 0; }
  #asset-package-result { padding: 28px 0; }
  .asset-package-exception { grid-template-columns: 1fr; gap: 14px; }
  .asset-package-exception > span { grid-column: 1; }
  .asset-package-form > button { margin: 0 0 34px; }
  .asset-package-form > .form-status { margin: -18px 0 34px; }
  .asset-ledger-scroll { overflow: visible; }
  .asset-ledger { min-width: 0; }
  .asset-ledger__head { display: none; }
  .asset-ledger__row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; padding: 0; }
  .asset-ledger__row > div { grid-column: 1 / -1; padding: 20px 0; border-bottom: 1px solid #000; }
  .coverage-mark { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 14px 8px 14px 0; border-bottom: 1px solid #d5d5d5; }
  .coverage-mark:nth-child(even) { padding-left: 8px; border-left: 1px solid #d5d5d5; }
  .coverage-mark__label { display: block; overflow-wrap: anywhere; }
  .studio-designer-check__garments article > div { grid-template-columns: 1fr; }
  .studio-designer-check figure { border-right: 0; border-bottom: 1px solid #000; }
  .studio-designer-check figure:last-child { border-bottom: 0; }
  .studio-recovery { scroll-margin-top: 124px; }
  .studio-form--state { grid-template-columns: 1fr; }
  .bulk-submissions article > header { grid-template-columns: 1fr auto; }
  .bulk-submissions button { grid-column: 1 / -1; justify-self: start; }
  .order-receipt-table { overflow-x: auto; }
  .order-receipt-table__head, .order-receipt-table__row { min-width: 620px; }
  .readiness-line { grid-template-columns: 1fr; }
  .readiness-line p, .readiness-line p + p, .readiness-line p:nth-child(3), .readiness-line p:nth-child(4) { padding: 22px 0; border-left: 0; border-top: 1px solid #000; }
  .readiness-line p:first-child { border-top: 0; }
  .studio-feedback-thread { grid-template-columns: 1fr; }
  .studio-feedback-media { min-height: 390px; }
  .studio-feedback-copy { padding: 32px 0; border-left: 0; border-top: 1px solid #000; }
  .studio-feedback-copy header { flex-direction: column; gap: 12px; }
  .shopify-handoff form { width: 100%; grid-template-columns: 1fr; }
  .shopify-handoff .form-status, #shopify-preview-result { grid-column: auto; }
  .studio-release-shopify { grid-template-columns: 1fr; gap: 28px; padding: 34px 20px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .process-rail__fill, .process-tick, .process-label, .process-icon, .process-steps h3 { opacity: 1; transform: none; transition: none; }
  .process-coil { stroke-dashoffset: 0; }
  .process-coil-dot { opacity: 1; }
}
/* Accepted project media carries through every customer ordering surface. */
.order-hero {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-height: clamp(320px, 52vw, 760px);
  background: #ececec;
  border-bottom: 1px solid #111;
}

.order-hero--single { grid-template-columns: 1fr; }
.order-hero img { width: 100%; height: 100%; object-fit: cover; }

@media (max-width: 720px) {
  .order-hero { min-height: 58vh; grid-template-columns: 1fr; }
  .order-hero img:not(:first-child) { display: none; }
}

/* The Design Brief is a working project document, not a generic form card. */
.design-brief { min-height: 70svh; background: #fff; }
.design-brief__form-view > header, .design-brief__submitted > header, .design-brief__submitted > p, .design-brief__submitted > dl, .design-brief__summary-files {
  padding-left: var(--gutter);
  padding-right: var(--gutter);
}
.design-brief__form-view > header { min-height: clamp(520px, 64svh, 760px); align-items: end; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(260px, .6fr); column-gap: 7vw; padding-top: clamp(56px, 8vw, 120px); padding-bottom: clamp(56px, 8vw, 110px); background: #000; color: #fff; }
.design-brief__form-view > header h1 { max-width: 980px; margin: 0; font-size: clamp(74px, 11vw, 176px); }
.design-brief__form-view > header p { align-self: end; max-width: 460px; margin: 0 0 10px; font-size: clamp(17px, 1.5vw, 23px); line-height: 1.35; }
#design-brief-form { margin: 0; }
#design-brief-form fieldset { display: grid; grid-template-columns: minmax(240px, .7fr) minmax(0, 1.3fr); align-items: start; gap: clamp(28px, 5vw, 90px); margin: 0; padding: clamp(44px, 6vw, 90px) var(--gutter); border: 0; border-bottom: 1px solid #000; }
.design-brief__section-heading h2 { margin: 0; font: clamp(36px, 5vw, 72px)/.88 var(--display); letter-spacing: -.025em; text-transform: uppercase; }
.design-brief__section-content { min-width: 0; }
.design-brief__starting-grid, .design-brief__choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; border-top: 1px solid #000; }
.design-brief__starting-point { position: relative; min-height: 150px; display: flex; flex-direction: column; justify-content: space-between; padding: 20px; border-right: 1px solid #000; border-bottom: 1px solid #000; cursor: pointer; }
.design-brief__starting-point:nth-child(2n) { border-right: 0; }
.design-brief__starting-point input, .design-brief__choice input { position: absolute; opacity: 0; pointer-events: none; }
.design-brief__starting-point strong { max-width: 250px; font: 24px/.95 var(--display); text-transform: uppercase; }
.design-brief__starting-point span { max-width: 280px; font-size: 14px; line-height: 1.3; }
.design-brief__starting-point:has(input:checked), .design-brief__choice:has(input:checked) { background: #000; color: #fff; }
.design-brief__starting-point:hover, .design-brief__choice:hover { background: var(--paper); color: #000; }
.design-brief__help { margin: 0 0 28px; font: 10px/1 var(--mono); text-transform: uppercase; }
.design-brief__choice { position: relative; min-height: 76px; display: flex; align-items: center; padding: 18px 20px; border-right: 1px solid #000; border-bottom: 1px solid #000; cursor: pointer; }
.design-brief__choice:nth-child(2n) { border-right: 0; }
.design-brief__choice span { font-size: 17px; }
.design-brief__choices--direction .design-brief__choice { min-height: 102px; align-items: flex-start; flex-direction: column; justify-content: center; }
.design-brief__choices--direction .design-brief__choice span { line-height: .95; transition: transform 220ms ease-out; }
.design-brief__choices--direction .design-brief__choice:hover span,
.design-brief__choices--direction .design-brief__choice:has(input:checked) span { transform: translateX(4px); }
.design-brief__choice--minimal:hover span,
.design-brief__choice--minimal:has(input:checked) span { font-family: Baskerville, 'Iowan Old Style', Georgia, serif; font-size: 27px; font-weight: 400; letter-spacing: -.035em; }
.design-brief__choice--expressive:hover span,
.design-brief__choice--expressive:has(input:checked) span { font: 29px/.82 var(--display); letter-spacing: -.025em; text-transform: uppercase; }
.design-brief__choice--technical:hover span,
.design-brief__choice--technical:has(input:checked) span { font: 700 15px/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.design-brief__choice--retro:hover span,
.design-brief__choice--retro:has(input:checked) span { font-family: Baskerville, 'Times New Roman', serif; font-size: 24px; font-style: italic; font-weight: 700; letter-spacing: -.02em; }
.design-brief__choice--race_led:hover span,
.design-brief__choice--race_led:has(input:checked) span { font-family: 'Arial Narrow', 'Helvetica Neue', Arial, sans-serif; font-size: 22px; font-style: italic; font-weight: 900; letter-spacing: .035em; text-transform: uppercase; }
.design-brief__choices--direction .design-brief__choice--other:hover span,
.design-brief__choices--direction .design-brief__choice--other:has(input:checked) span { font-family: var(--body); font-size: 20px; font-weight: 600; letter-spacing: -.01em; }
.design-brief__choices--colour .design-brief__choice { transition: background-color 220ms ease-out, color 220ms ease-out; }
.design-brief__choices--colour .design-brief__choice--lights:hover, .design-brief__choices--colour .design-brief__choice--lights:has(input:checked) { background: #f4f0e8; color: #000; }
.design-brief__choices--colour .design-brief__choice--brights:hover, .design-brief__choices--colour .design-brief__choice--brights:has(input:checked) { background: #f4ed22; color: #000; }
.design-brief__choices--colour .design-brief__choice--blues:hover, .design-brief__choices--colour .design-brief__choice--blues:has(input:checked) { background: #2563eb; color: #fff; }
.design-brief__choices--colour .design-brief__choice--greens:hover, .design-brief__choices--colour .design-brief__choice--greens:has(input:checked) { background: #1f8a5b; color: #fff; }
.design-brief__choices--colour .design-brief__choice--warm:hover, .design-brief__choices--colour .design-brief__choice--warm:has(input:checked) { background: #e86f3a; color: #000; }
.design-brief__choices--colour .design-brief__choice--monochrome:hover, .design-brief__choices--colour .design-brief__choice--monochrome:has(input:checked) { background: #d5d5d5; color: #000; }
.design-brief__choices--colour .design-brief__choice--darks:hover, .design-brief__choices--colour .design-brief__choice--darks:has(input:checked) { background: #171717; color: #fff; }
.design-brief__choices--colour .design-brief__choice--other:hover, .design-brief__choices--colour .design-brief__choice--other:has(input:checked) { background: #7567a8; color: #fff; }
.design-brief__text, .design-brief__upload { display: block; padding-top: 30px; font: 10px/1 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.design-brief__text textarea { width: 100%; display: block; margin-top: 16px; padding: 16px 0; border: 0; border-top: 1px solid #000; border-bottom: 1px solid #000; border-radius: 0; outline: none; resize: vertical; background: transparent; font: 18px/1.4 var(--body); text-transform: none; }
.design-brief__text textarea:focus { border-bottom-width: 3px; }
.design-brief__upload { position: relative; min-height: 150px; display: flex; flex-direction: column; justify-content: center; gap: 10px; margin-top: 24px; padding: 28px; border: 1px solid #000; background: #000; color: #fff; cursor: pointer; transition: opacity 220ms ease-out; }
.design-brief__upload:hover { opacity: .72; }
.design-brief__upload input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.design-brief__upload strong { font: clamp(28px, 3vw, 44px)/.95 var(--display); letter-spacing: -.02em; text-transform: uppercase; }
.design-brief__upload > span { max-width: 560px; font: 16px/1.35 var(--body); letter-spacing: 0; text-transform: none; }
.design-brief__upload > small { color: #bbb; font: 8px/1.2 var(--mono); }
.design-brief__conditional-upload, .design-brief__conditional-text { animation: design-brief-reveal 240ms ease-out both; }
.design-brief__conditional-upload[hidden], .design-brief__conditional-text[hidden] { display: none; }
.design-brief__upload--context { min-height: 124px; margin-top: 24px; background: var(--paper); color: #000; }
.design-brief__upload--context > span { font-size: 14px; }
@keyframes design-brief-reveal { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
.design-brief__empty { margin: 14px 0 0; color: #666; font-size: 14px; }
.design-brief__files { margin: 0; padding: 0; list-style: none; }
.design-brief__files li { display: grid; grid-template-columns: 58px minmax(0, 1fr) auto; align-items: center; gap: 18px; padding: 12px 0; border-bottom: 1px solid #bbb; }
.design-brief__file-preview { width: 58px; height: 58px; display: grid; place-items: center; overflow: hidden; border: 1px solid #000; background: var(--paper); color: #000; text-decoration: none; }
.design-brief__file-preview:hover { background: #000; color: #fff; }
.design-brief__file-preview img { width: 100%; height: 100%; object-fit: cover; }
.design-brief__file-preview > span { font: 10px/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.design-brief__files strong { overflow-wrap: anywhere; font-size: 14px; }
.design-brief__files small { flex: 0 0 auto; font: 9px/1 var(--mono); text-transform: uppercase; }
#design-brief-form > footer { min-height: 120px; display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 28px var(--gutter); background: #000; color: #fff; }
#design-brief-form > footer p { margin: 0; font: 9px/1 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
#design-brief-form .button-link { min-width: 230px; padding: 18px 24px; border: 1px solid #fff; border-radius: 0; background: #fff; color: #000; font: 10px/1 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
#design-brief-form .button-link:hover { background: #000; color: #fff; }
#design-brief-form .form-status { min-height: 0; margin: 0; padding: 0 var(--gutter); background: #000; color: #fff; }
#design-brief-form .form-status:not(:empty) { min-height: 58px; padding-bottom: 24px; }
.design-brief__submitted { padding-bottom: clamp(70px, 10vw, 150px); }
.design-brief__submitted > header { min-height: clamp(520px, 64svh, 760px); display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; padding-top: clamp(60px, 9vw, 130px); padding-bottom: clamp(42px, 6vw, 80px); background: #000; color: #fff; }
.design-brief__submitted > header span { display: block; margin-bottom: 34px; font: 9px/1 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.design-brief__submitted h1 { margin: 0; font-size: clamp(84px, 13vw, 190px); }
.outline-button { flex: 0 0 auto; min-width: 150px; padding: 16px 20px; border: 1px solid currentColor; border-radius: 0; background: transparent; color: inherit; font: 10px/1 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.outline-button:hover { background: #fff; color: #000; }
.design-brief__submitted > .design-brief__intro { max-width: 850px; margin: clamp(48px, 7vw, 95px) 0; font-size: clamp(24px, 3vw, 44px); line-height: 1.08; }
.design-brief__submitted dl { margin: 0; border-top: 1px solid #000; }
.design-brief__submitted dl > div { display: grid; grid-template-columns: minmax(170px, .45fr) minmax(0, 1.55fr); gap: 40px; padding-top: 26px; padding-bottom: 26px; border-bottom: 1px solid #000; }
.design-brief__submitted dt { font: 9px/1.2 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.design-brief__submitted dd { margin: 0; font-size: clamp(18px, 2vw, 28px); line-height: 1.25; white-space: pre-line; }
.design-brief__summary-files { padding-top: 54px; }
.design-brief__summary-files h2 { margin-bottom: 26px; font-size: clamp(38px, 5vw, 68px); }
.studio-design-brief { margin-bottom: 34px; border-top: 1px solid #000; border-bottom: 1px solid #000; }
.studio-design-brief > header { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; padding: 20px 0; border-bottom: 1px solid #000; }
.studio-design-brief h3 { margin: 0; font-size: clamp(30px, 4vw, 54px); }
.studio-design-brief > header span, .studio-design-brief dt, .studio-design-brief__files > strong { font: 9px/1.2 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.studio-design-brief > p { margin: 0; padding: 24px 0; }
.studio-design-brief dl { margin: 0; }
.studio-design-brief dl > div { display: grid; grid-template-columns: minmax(150px, .4fr) minmax(0, 1.6fr); gap: 24px; padding: 18px 0; border-bottom: 1px solid #bbb; }
.studio-design-brief dd { margin: 0; white-space: pre-line; }
.studio-design-brief__files { padding: 24px 0; }
.studio-design-brief__files > strong { display: block; margin-bottom: 14px; }

@media (max-width: 720px) {
  .design-brief__form-view > header { min-height: 34svh; grid-template-columns: 1fr; padding: 48px 18px 30px; }
  .design-brief__form-view > header p { margin-top: 34px; }
  #design-brief-form fieldset { grid-template-columns: 1fr; gap: 24px; padding: 48px 18px; }
  .design-brief__help { margin-bottom: 18px; }
  .design-brief__starting-grid, .design-brief__choices { grid-template-columns: 1fr; }
  .design-brief__starting-point, .design-brief__choice { border-right: 0; }
  .design-brief__files li { grid-template-columns: 52px minmax(0, 1fr); gap: 14px; }
  .design-brief__file-preview { width: 52px; height: 52px; grid-row: 1 / 3; }
  .design-brief__files small { grid-column: 2; }
  #design-brief-form > footer { align-items: stretch; flex-direction: column; padding: 28px 18px; }
  #design-brief-form .button-link { width: 100%; }
  .design-brief__submitted > header { min-height: 34svh; justify-content: flex-end; align-items: stretch; flex-direction: column; padding: 56px 18px 42px; }
  .design-brief__submitted > header .outline-button { width: 100%; }
  .design-brief__submitted > p, .design-brief__submitted > dl, .design-brief__summary-files { padding-left: 18px; padding-right: 18px; }
  .design-brief__submitted dl > div { grid-template-columns: 1fr; gap: 14px; }
  .studio-design-brief dl > div { grid-template-columns: 1fr; gap: 10px; }
}

/* Design review: project context, linked product truth and collection lineup. */
.review-overview { display: grid; grid-template-columns: 1fr 2fr; gap: clamp(24px, 5vw, 80px); padding: 0 0 clamp(40px, 5vw, 72px); }
.review-overview h2, .review-product h2, .review-collection h2, .review-finish > header h2 { margin: 0; font-size: clamp(36px, 4vw, 60px); }
.review-overview p { max-width: 760px; margin: 0; font-size: clamp(16px, 1.4vw, 20px); line-height: 1.65; white-space: pre-line; overflow-wrap: anywhere; }
.review-sidebar { display: flex; flex-direction: column; }
#review-product { margin-top: clamp(48px, 6vw, 80px); }
#review-product:empty { display: none; }
.review-product { display: grid; grid-template-columns: 1fr 1.5fr 1fr; gap: clamp(24px, 4vw, 64px); border-top: 1px solid #aaa; padding-top: 32px; }
.review-product h3 { margin: 0 0 16px; font: 10px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .04em; }
.review-product p, .review-product li { margin: 0; font-size: 14px; line-height: 1.65; white-space: pre-line; overflow-wrap: anywhere; }
.review-product > header p { margin-top: 16px; }
.review-product > p { max-width: 760px; }
.review-product ul { margin: 0; padding: 0; list-style: none; }
.review-product li + li { margin-top: 6px; }
.review-collection { margin-top: clamp(64px, 8vw, 112px); }
.review-collection > header { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 32px; }


.review-collection__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 32px 20px; }
.review-collection__garment { display: block; min-width: 0; padding: 0; background: transparent; border: 0; color: #000; text-align: left; }
.review-collection__image { display: grid; place-items: center; aspect-ratio: 1; background: var(--paper); overflow: hidden; }
.review-collection__image img { width: 100%; height: 100%; object-fit: contain; }
.review-collection__caption { display: grid; grid-template-columns: auto 1fr auto; align-items: baseline; gap: 14px; padding: 18px 0; border-bottom: 1px solid #000; }
.review-collection__caption > span { font: 10px/1.4 var(--mono); text-transform: uppercase; }
.review-collection__caption strong { font-size: 14px; line-height: 1.4; }
.review-collection__garment:hover .review-collection__caption strong { text-decoration: underline; text-underline-offset: 4px; }
.review-collection__garment:focus-visible { outline: 2px solid #000; outline-offset: 5px; }
.review-garments { scroll-margin-top: 78px; }
.review-collection + #review-completion .review-finish { margin-top: 48px; }
@media (max-width: 700px) {
  .review-overview { grid-template-columns: 1fr; gap: 20px; padding-bottom: 36px; }
  .review-product { grid-template-columns: 1fr; gap: 28px; }
  .review-collection > header { display: block; }

  .review-collection__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 12px; }
  .review-collection__caption { grid-template-columns: 1fr; gap: 6px; padding: 14px 0; }
  .review-collection__caption strong { font-size: 12px; }
  .review-garments { scroll-margin-top: 66px; }
}

.design-brief__choice:has(input:focus-visible) { outline: 2px solid currentColor; outline-offset: -5px; }
.design-brief__choices--colour .design-brief__choice:has(input:checked) { outline: 2px solid currentColor; outline-offset: -3px; }

/* Deliberate, page-specific help. Native dialog supplies focus containment and Escape. */
:is(.private-header, .site-header) .page-help-trigger { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; color: #fff; }
:is(.private-header, .site-header) .page-help-trigger span { min-height: 23px; color: #fff; display: grid; place-items: center; width: 23px; height: 23px; border: 1px solid currentColor; border-radius: 50%; font: 14px/1 var(--mono); }
.page-help-trigger:focus-visible { outline: 2px solid #fff; outline-offset: -3px; }
.page-help { position: fixed; inset: auto 24px 24px auto; width: min(460px, calc(100vw - 32px)); max-height: calc(100svh - 32px); margin: 0; padding: 28px; overflow: auto; border: 1px solid #000; border-radius: 0; background: #fff; color: #000; }
.page-help::backdrop { background: rgb(0 0 0 / .18); }
.page-help header, .page-help footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.page-help header { padding-bottom: 18px; border-bottom: 1px solid #000; }
.page-help__page, .page-help__progress { font: 10px/1.5 var(--mono); text-transform: uppercase; }
.page-help__progress { margin: 24px 0 12px; }
.page-help h2 { margin: 0 0 18px; font: 36px/.95 var(--display); text-transform: uppercase; }
.page-help #page-help-copy { margin: 0; font-size: 16px; line-height: 1.6; }
.page-help footer { margin-top: 28px; }
.page-help button { min-height: 44px; padding: 12px 18px; border: 1px solid #000; border-radius: 0; background: #fff; color: #000; font: 11px/1.2 var(--mono); text-transform: uppercase; }
.page-help button[data-help-next] { background: #000; color: #fff; }
.page-help button:disabled { opacity: .35; cursor: default; }
.page-help .page-help__close { padding: 10px 0 10px 14px; border: 0; }
.page-help-target { outline: 2px solid #000; outline-offset: 5px; scroll-margin-top: 110px; }
@media (max-width: 720px) {
  .private-header nav { gap: 10px; }
  :is(.private-header, .site-header) .page-help-trigger { flex-basis: 36px; width: 36px; }
  .page-help { inset: auto 16px 16px; padding: 22px; }
}

.private-header nav { margin-left: auto; min-width: 0; }

/* Keep the referenced control bright and connect it directly to its guide. */
.page-help { inset: 0; width: 100vw; height: 100dvh; max-width: none; max-height: none; padding: 0; border: 0; background: transparent; overflow: hidden; }
.page-help::backdrop { background: transparent; }
.page-help__spotlight { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.page-help__shade { fill: rgb(0 0 0 / .58); }
.page-help__outline { fill: none; stroke: #fff; stroke-width: 3; }
.page-help__connector { fill: none; stroke: #fff; stroke-width: 2; }
.page-help__example circle { fill: #000; stroke: #fff; stroke-width: 2; }
.page-help__example text { fill: #fff; font: 14px var(--mono); }
.page-help__example .page-help__example-label { font-size: 10px; paint-order: stroke; stroke: #000; stroke-width: 4px; }
.page-help__card { position: absolute; max-height: calc(100dvh - 32px); overflow: auto; padding: 24px; background: #fff; border: 1px solid #000; }
@media (max-width: 720px) {
  .page-help__card { padding: 20px; }
  .page-help h2 { font-size: 30px; }
  .page-help #page-help-copy { font-size: 14px; line-height: 1.5; }
  .page-help__progress { margin-top: 16px; }
  .page-help footer { margin-top: 18px; }
}