/* Alef Atelier Pro — editorial luxury design system */
:root {
  --paper: #f3efe8;
  --paper-bright: #fbf8f2;
  --ink: #171614;
  --muted: #716d66;
  --red: #b4222c;
  --red-dark: #761219;
  --line: rgba(23, 22, 20, 0.18);
  --line-light: rgba(255, 255, 255, 0.22);
  --max: 1440px;
  --pad: clamp(22px, 4vw, 72px);
  --serif: "Bodoni Moda", Didot, "Times New Roman", serif;
  --sans: Inter, Helvetica, Arial, sans-serif;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 300 16px/1.7 var(--sans); overflow-x: clip; }
body.nav-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
button { color: inherit; }
img { max-width: 100%; }
::selection { background: var(--red); color: #fff; }
.wrap { width: min(var(--max), calc(100% - (var(--pad) * 2))); margin-inline: auto; }
.section { padding-block: clamp(90px, 11vw, 180px); position: relative; }
.section--ink { background: var(--ink); color: var(--paper); }
.section--red { background: var(--red); color: #fff; }
.display, h1, h2, h3, blockquote { font-family: var(--serif); font-weight: 500; }
.eyebrow { margin: 0; color: var(--red); font-size: 0.67rem; font-weight: 600; letter-spacing: 0.3em; line-height: 1.4; text-transform: uppercase; }
.section--ink .eyebrow, .section--red .eyebrow, .contact-page .eyebrow { color: #e35a62; }
.italic, h1 em, h2 em, blockquote em { font-style: italic; font-weight: 500; }
.line { display: block; overflow: hidden; padding-bottom: 0.08em; margin-bottom: -0.08em; }
.line > span { display: block; }
.scroll-progress { position: fixed; inset: 0 auto auto 0; width: 100%; height: 2px; z-index: 120; background: var(--red); transform: scaleX(0); transform-origin: left; pointer-events: none; }

/* entrance curtain */
.page-curtain { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; background: var(--ink); color: var(--paper); pointer-events: none; transform-origin: top; }
.page-curtain span { font: italic 500 clamp(5rem, 14vw, 13rem)/1 var(--serif); opacity: 0; }
.js.is-loaded .page-curtain { animation: curtain-out 1.2s 0.45s var(--ease-in-out) forwards; }
.js.is-loaded .page-curtain span { animation: monogram-in 0.75s 0.05s var(--ease) forwards; }
@keyframes curtain-out { to { transform: scaleY(0); } }
@keyframes monogram-in { 0% { opacity: 0; transform: translateY(25px); } 45%, 70% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateY(-15px); } }

/* navigation */
.site-header { position: fixed; inset: 0 0 auto; z-index: 100; color: var(--ink); transition: color 0.4s, transform 0.5s var(--ease), background 0.4s, box-shadow 0.4s; }
.site-header--dark { color: var(--paper); }
.site-header.is-scrolled { background: rgba(243, 239, 232, 0.9); color: var(--ink); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); box-shadow: 0 1px var(--line); }
.site-header.is-hidden { transform: translateY(-110%); }
.nav-shell { min-height: 92px; padding-inline: var(--pad); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 28px; }
.brand { justify-self: start; display: grid; grid-template-columns: 31px auto; grid-template-rows: auto auto; column-gap: 10px; align-items: center; }
.brand-mark { grid-row: 1 / 3; width: 31px; aspect-ratio: 1; border: 1px solid currentColor; display: grid; place-items: center; font: italic 500 1.25rem/1 var(--serif); }
.brand-name { font: 600 1.24rem/1 var(--serif); letter-spacing: 0.16em; text-transform: uppercase; }
.site-header:not(.is-scrolled) .nav-shell { color: #fff; mix-blend-mode: difference; }
.brand-place { margin-top: 4px; color: currentColor; opacity: .52; font-size: 0.57rem; font-weight: 500; letter-spacing: 0.18em; line-height: 1; text-transform: uppercase; }
.site-nav { display: flex; align-items: center; gap: clamp(18px, 2.3vw, 40px); }
.site-nav a { position: relative; padding: 10px 0; font-size: 0.65rem; font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase; }
.site-nav a span { display: none; }
.site-nav a::after { content: ""; position: absolute; inset: auto 0 4px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform 0.35s var(--ease); }
.site-nav a:hover::after, .site-nav a.active::after { transform: scaleX(1); transform-origin: left; }
.nav-appointment { justify-self: end; display: flex; align-items: center; gap: 14px; font-size: 0.68rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; }
.nav-appointment span { color: currentColor; font-size: 1rem; }
.menu-toggle { justify-self: end; display: none; border: 0; background: none; padding: 10px 0 10px 12px; cursor: pointer; align-items: center; gap: 12px; }
.menu-label { font-size: 0.65rem; letter-spacing: 0.2em; text-transform: uppercase; }
.menu-icon { width: 24px; height: 15px; display: flex; flex-direction: column; justify-content: space-between; }
.menu-icon i { width: 100%; height: 1px; background: currentColor; transition: transform .4s var(--ease), translate .4s var(--ease); }
.menu-toggle[aria-expanded="true"] .menu-icon i:first-child { transform: rotate(45deg); translate: 0 7px; }
.menu-toggle[aria-expanded="true"] .menu-icon i:last-child { transform: rotate(-45deg); translate: 0 -7px; }

/* buttons and links */
.button { width: fit-content; min-height: 58px; padding: 0 22px 0 26px; display: inline-flex; align-items: center; justify-content: space-between; gap: 44px; border: 1px solid currentColor; background: transparent; cursor: pointer; font-size: 0.67rem; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; transition: color .35s, background .35s, transform .35s var(--ease); }
.button b { font-size: 1rem; font-weight: 400; transition: transform .35s var(--ease); }
.button:hover b { transform: translate(4px, -4px); }
.button--dark { background: var(--ink); border-color: var(--ink); color: #fff; }
.button--dark:hover { background: var(--red); border-color: var(--red); }
.button--light { background: var(--paper); border-color: var(--paper); color: var(--ink); }
.button--light:hover { background: var(--red); border-color: var(--red); color: #fff; }
.text-link { width: fit-content; display: inline-flex; align-items: center; gap: 14px; padding-bottom: 5px; border-bottom: 1px solid currentColor; font-size: 0.68rem; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase; }
.text-link span { transition: transform .3s var(--ease); }
.text-link:hover span { transform: translateX(6px); }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, [tabindex="0"]:focus-visible { outline: 2px solid var(--red); outline-offset: 5px; }

/* home hero */
.hero { min-height: 100svh; display: grid; grid-template-columns: 52% 48%; position: relative; background: var(--paper); }
.hero-copy { padding: clamp(145px, 16vh, 190px) var(--pad) 70px; display: flex; flex-direction: column; justify-content: center; position: relative; z-index: 2; }
.hero-copy .eyebrow { display: flex; justify-content: space-between; max-width: 660px; }
.hero-copy .eyebrow span { color: var(--muted); }
.hero-title { margin: clamp(20px, 4vh, 42px) 0 clamp(28px, 4vh, 44px); font-size: clamp(4rem, 8.1vw, 9.3rem); letter-spacing: -0.075em; line-height: 0.78; }
.hero-title .italic { color: var(--red); }
.hero-title .indent { padding-left: 0.52em; }
.hero-bottom { width: min(610px, 92%); margin-left: auto; display: grid; grid-template-columns: 1fr; gap: 28px; }
.hero-bottom > p { max-width: 430px; margin: 0; color: var(--muted); font-size: clamp(.95rem, 1.15vw, 1.12rem); }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 28px; }
.vertical-note { position: absolute; left: 17px; bottom: 70px; margin: 0; writing-mode: vertical-rl; transform: rotate(180deg); color: var(--muted); font-size: .55rem; letter-spacing: .2em; text-transform: uppercase; }
.hero-visual { position: relative; min-height: 100svh; overflow: hidden; background: #161514; isolation: isolate; }
.visual-grid { position: absolute; inset: 0; opacity: .15; background-image: linear-gradient(rgba(255,255,255,.16) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.16) 1px, transparent 1px); background-size: 11.11% 12.5%; }
.visual-orbit { position: absolute; width: 68%; aspect-ratio: 1; left: 16%; top: 12%; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; animation: orbit 22s linear infinite; }
.visual-orbit::before, .visual-orbit::after { content:""; position:absolute; border-radius:50%; }
.visual-orbit::before { width: 10px; aspect-ratio: 1; background: var(--red); top: 9%; left: 18%; box-shadow: 0 0 30px rgba(180,34,44,.7); }
.visual-orbit::after { inset: 17%; border: 1px solid rgba(255,255,255,.08); }
@keyframes orbit { to { transform: rotate(360deg); } }
.fabric { position: absolute; will-change: transform; transition: transform .3s ease-out; }
.fabric--back { width: 52%; height: 68%; top: 17%; left: 7%; background: linear-gradient(145deg, #3b3a37 0%, #121211 53%, #272624 100%); clip-path: polygon(22% 0, 82% 8%, 100% 91%, 52% 100%, 0 76%); transform: rotate(-7deg); box-shadow: 30px 40px 90px #000; }
.fabric--front { width: 53%; height: 72%; top: 14%; right: 2%; background: linear-gradient(120deg, #d7d1c7 0%, #f2eee7 45%, #aaa49a 100%); clip-path: polygon(18% 0, 76% 4%, 100% 78%, 69% 100%, 0 88%, 7% 22%); transform: rotate(8deg); box-shadow: -25px 40px 90px rgba(0,0,0,.65); }
.fabric--front::before { content:""; position:absolute; inset: 0; opacity:.34; background: repeating-linear-gradient(96deg,transparent 0 16px,rgba(0,0,0,.1) 17px); }
.seam { position:absolute; background: rgba(23,22,20,.45); height:1px; transform-origin:left; }
.seam--one { width:78%; top:34%; left:12%; transform:rotate(68deg); }
.seam--two { width:65%; top:55%; left:18%; transform:rotate(-14deg); }
.look-number { position:absolute; z-index:3; top:17%; left:9%; color:#fff; display:grid; }
.look-number span,.look-number small { font-size:.57rem; letter-spacing:.22em; text-transform:uppercase; }
.look-number strong { font:500 clamp(4rem,8vw,8rem)/.9 var(--serif); }
.visual-caption { position:absolute; z-index:4; inset:auto 32px 28px; padding-top:14px; border-top:1px solid var(--line-light); color:rgba(255,255,255,.68); display:flex; justify-content:space-between; font-size:.57rem; letter-spacing:.17em; text-transform:uppercase; }
.scroll-cue { position:absolute; z-index:5; left:calc(52% - 1px); bottom:0; translate:-100% 0; width:175px; height:66px; padding:0 20px; background:var(--red); color:#fff; display:flex; align-items:center; gap:14px; font-size:.57rem; letter-spacing:.15em; text-transform:uppercase; }
.scroll-cue > span { width:24px; height:34px; border:1px solid rgba(255,255,255,.65); border-radius:20px; position:relative; }
.scroll-cue > span::after { content:""; position:absolute; width:2px; height:6px; background:#fff; top:6px; left:10px; animation:scroll-dot 1.7s infinite; }
@keyframes scroll-dot { 0%{opacity:0;transform:translateY(0)} 30%{opacity:1} 100%{opacity:0;transform:translateY(14px)} }

/* manifesto */
.manifesto { background: var(--paper-bright); border-bottom: 1px solid var(--line); overflow: hidden; position:relative; }
.marquee { padding: 18px 0; border-block: 1px solid var(--line); white-space: nowrap; overflow: hidden; color: var(--muted); font: italic 500 clamp(1.2rem,2vw,2rem)/1 var(--serif); }
.marquee div { width:max-content; animation:marquee 25s linear infinite; }
@keyframes marquee { to { transform:translateX(-50%); } }
.manifesto-grid { min-height:620px; padding-block: clamp(78px, 9vw, 135px); display:grid; grid-template-columns: .62fr 2.15fr .23fr; gap:5vw; align-items:center; position:relative; z-index:2; }
.manifesto-aside { align-self:stretch; display:flex; flex-direction:column; justify-content:space-between; }
.manifesto-swatch { width:min(220px,100%); aspect-ratio:4/5; background:#242220; position:relative; overflow:hidden; box-shadow:16px 20px 45px rgba(23,22,20,.16); }
.manifesto-swatch::before { content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.1) 1px,transparent 1px); background-size:34px 34px; }
.manifesto-swatch i { position:absolute; width:62%; height:112%; left:20%; top:-6%; background:linear-gradient(145deg,#eee8de,#a9a298); clip-path:polygon(20% 0,80% 0,100% 100%,0 100%); transform:rotate(-7deg); }
.manifesto-swatch b { position:absolute; left:15px; bottom:13px; color:#fff; font-size:.49rem; font-weight:500; letter-spacing:.18em; }
.manifesto-copy { margin:0; max-width:950px; font:500 clamp(2.15rem,4.7vw,5.2rem)/1.02 var(--serif); letter-spacing:-.045em; }
.manifesto-copy em { color:var(--red); }
.manifesto-index { justify-self:end; color:var(--muted); font-size:.65rem; letter-spacing:.18em; }
.manifesto-notes { margin-top:55px; padding-top:22px; border-top:1px solid var(--line); display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.manifesto-notes p { margin:0; color:var(--muted); font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; }
.manifesto-notes span { display:block; margin-bottom:7px; color:var(--red); font-size:.54rem; letter-spacing:.2em; }
.manifesto-orbit { position:absolute; width:min(560px,45vw); aspect-ratio:1; right:-10%; bottom:-48%; border:1px solid rgba(180,34,44,.12); border-radius:50%; }
.manifesto-orbit::before,.manifesto-orbit::after { content:""; position:absolute; border:1px solid rgba(180,34,44,.1); border-radius:50%; }
.manifesto-orbit::before { inset:15%; }.manifesto-orbit::after { inset:31%; }
.manifesto-orbit span { position:absolute; top:9%; left:18%; color:rgba(180,34,44,.18); font:italic 500 7rem/1 var(--serif); }

/* collection cards */
.arrivals { padding-top:clamp(70px,7vw,110px); scroll-margin-top:74px; }
.arrivals .section-heading { margin-bottom:clamp(22px,2.4vw,38px); padding-bottom:24px; border-bottom:1px solid var(--line); }
.section-heading { margin-bottom: clamp(55px, 8vw, 110px); display:grid; grid-template-columns:1.4fr .6fr; align-items:end; gap:8vw; }
.section-heading h2 { margin:.55rem 0 0; font-size:clamp(3rem,6vw,7rem); line-height:.88; letter-spacing:-.06em; }
.section-heading h2 em { color:var(--red); }
.section-heading > p { max-width:420px; margin:0 0 .5rem; color:var(--muted); }
.lookbook-grid { display:grid; grid-template-columns:1.13fr .87fr; grid-template-rows:auto auto; gap:clamp(28px,4vw,64px); }
.look-card { min-width:0; }
.look-card--coat { grid-row:1 / 3; }
.look-art { min-height:420px; aspect-ratio: 4 / 5; position:relative; overflow:hidden; background:#d8d2c9; }
.look-card--dress .look-art,.look-card--trouser .look-art { aspect-ratio: 16 / 10; min-height:300px; }
.look-art::before { content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.2) 1px,transparent 1px); background-size:48px 48px; opacity:.5; }
.look-shape,.look-detail { position:absolute; display:block; transition:transform 1s var(--ease); }
.look-card:hover .look-shape { transform:scale(1.035) rotate(1deg); }
.look-card--coat .look-art { background:linear-gradient(145deg,#d9d3c9,#aaa49b); }
.look-card--coat .look-shape { width:64%; height:90%; left:18%; top:6%; background:#1b1a18; clip-path:polygon(24% 0,75% 0,91% 32%,78% 100%,22% 100%,8% 32%); }
.look-card--coat .look-detail { width:1px; height:87%; background:#66625d; left:50%; top:8%; }
.look-card--dress .look-art { background:linear-gradient(135deg,#751117,#ba2730); }
.look-card--dress .look-shape { width:31%; height:90%; left:36%; top:6%; background:#e2d9d0; clip-path:polygon(28% 0,72% 0,85% 100%,15% 100%); }
.look-card--dress .look-detail { width:70%; height:1px; background:rgba(255,255,255,.4); left:15%; top:48%; }
.look-card--trouser .look-art { background:linear-gradient(135deg,#cbc4b9,#eee9e1); }
.look-card--trouser .look-shape { width:48%; height:95%; left:26%; top:2%; background:#302e2b; clip-path:polygon(13% 0,87% 0,100% 100%,55% 100%,50% 36%,45% 100%,0 100%); }
.look-card--trouser .look-detail { width:20%; aspect-ratio:1; border:1px solid rgba(23,22,20,.4); border-radius:50%; top:13%; right:12%; }
.look-code { position:absolute; top:20px; right:20px; color:rgba(255,255,255,.78); font-size:.58rem; letter-spacing:.2em; }
.look-card--trouser .look-code,.look-card--coat .look-code { color:rgba(23,22,20,.6); }
.look-meta { padding:22px 0 34px; border-bottom:1px solid var(--line); display:grid; grid-template-columns:1.2fr 1fr auto; gap:20px; align-items:end; }
.look-meta p { margin:0; color:var(--muted); font-size:.78rem; }
.look-meta h3 { margin:.2rem 0 0; font-size:clamp(1.7rem,2.2vw,2.65rem); line-height:1; }
.look-meta strong { font-size:.72rem; font-weight:500; }
.section-link-row { margin-top:60px; display:flex; justify-content:space-between; align-items:center; gap:20px; color:var(--muted); font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; }

/* atelier story */
.story-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(60px,9vw,145px); align-items:center; }
.story-art { min-height:660px; position:relative; background:#292724; overflow:hidden; perspective:900px; }
.story-art::before { content:""; position:absolute; inset:0; background:linear-gradient(115deg,transparent 50%,rgba(255,255,255,.045) 50%); }
.pattern-paper { position:absolute; width:73%; height:78%; top:8%; left:15%; background:#ded8cd; color:var(--ink); transform:rotate(-5deg); box-shadow:0 30px 80px #000; transition:transform .7s var(--ease); }
.story-art:hover .pattern-paper { transform:rotate(-2deg) translateY(-8px); }
.pattern-paper::before,.pattern-paper::after { content:""; position:absolute; border:1px solid rgba(23,22,20,.28); border-radius:50%; }
.pattern-paper::before { width:70%; aspect-ratio:1; left:15%; top:13%; }
.pattern-paper::after { width:43%; height:75%; left:28%; top:7%; border-radius:50% 50% 20% 20%; }
.pattern-paper span { position:absolute; right:6%; top:5%; font:500 3rem var(--serif); }
.pattern-paper i { position:absolute; width:1px; height:100%; background:rgba(23,22,20,.25); left:50%; }
.pattern-paper b { position:absolute; left:6%; bottom:5%; font-size:.55rem; letter-spacing:.2em; }
.story-art > p { position:absolute; z-index:2; margin:0; left:4%; bottom:3%; color:#fff; font-size:.57rem; letter-spacing:.24em; text-transform:uppercase; }
.story-copy h2 { margin:22px 0 34px; font-size:clamp(3rem,5.8vw,6.7rem); line-height:.92; letter-spacing:-.055em; }
.story-copy h2 em { color:#e35a62; }
.story-copy > p:not(.eyebrow) { max-width:510px; margin:0 0 42px; color:rgba(255,255,255,.62); font-size:1.05rem; }
.appointment { overflow:hidden; text-align:center; background:var(--paper-bright); }
.appointment-mark { position:absolute; inset:50% auto auto 50%; translate:-50% -49%; color:rgba(180,34,44,.065); font:italic 500 min(55vw,800px)/1 var(--serif); pointer-events:none; }
.appointment-inner { position:relative; display:flex; flex-direction:column; align-items:center; }
.appointment h2 { margin:24px 0 20px; font-size:clamp(4rem,9vw,10rem); line-height:.85; letter-spacing:-.07em; }
.appointment h2 em { color:var(--red); }
.appointment p:not(.eyebrow) { max-width:500px; margin:0 0 38px; color:var(--muted); }

/* page heroes */
.page-hero { padding-top:92px; min-height:100svh; position:relative; overflow:hidden; }
.page-hero-index { position:absolute; top:125px; right:var(--pad); z-index:2; color:var(--muted); font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; }
.page-hero-grid { min-height:55vh; padding-top:clamp(80px,10vh,130px); display:grid; grid-template-columns:1.5fr .5fr; gap:8vw; align-items:center; }
.page-title { margin:25px 0 0; font-size:clamp(4.5rem,10vw,11rem); letter-spacing:-.08em; line-height:.78; }
.page-title .italic { color:var(--red); }
.page-intro { align-self:end; padding-bottom:8vh; }
.page-intro p { color:var(--muted); font-size:1.05rem; }
.page-intro span { display:block; margin-top:28px; font-size:.57rem; letter-spacing:.2em; text-transform:uppercase; }
.collection-banner { height:45vh; min-height:390px; position:relative; overflow:hidden; background:#1a1917; color:#fff; }
.collection-banner::before { content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px); background-size:7.14% 25%; }
.banner-shape { position:absolute; bottom:-20%; transition:transform .8s var(--ease); }
.collection-banner:hover .banner-shape--one { transform:rotate(-3deg) translateY(-3%); }
.collection-banner:hover .banner-shape--two { transform:rotate(4deg) translateY(-3%); }
.banner-shape--one { width:38%; height:125%; left:22%; background:linear-gradient(140deg,#e0d9cf,#9f998f); clip-path:polygon(23% 0,75% 0,100% 100%,0 100%); transform:rotate(-7deg); }
.banner-shape--two { width:30%; height:115%; right:17%; background:linear-gradient(140deg,#83131a,#c22e36); clip-path:polygon(26% 0,77% 0,100% 100%,0 100%); transform:rotate(9deg); }
.collection-banner > p { position:absolute; left:var(--pad); bottom:4%; margin:0; font:italic 500 clamp(5rem,14vw,14rem)/.8 var(--serif); color:rgba(255,255,255,.88); }
.collection-banner > span { position:absolute; right:var(--pad); bottom:25px; font-size:.57rem; letter-spacing:.2em; text-transform:uppercase; }
.collection-toolbar { padding-bottom:25px; display:flex; justify-content:space-between; gap:30px; border-bottom:1px solid var(--line); }
.collection-toolbar > p:last-child { margin:0; color:var(--muted); }
.category { min-height:190px; display:grid; grid-template-columns:80px 1fr 220px 35px; gap:30px; align-items:center; border-bottom:1px solid var(--line); position:relative; overflow:hidden; transition:color .4s, padding .5s var(--ease); cursor:default; }
.category::before { content:""; position:absolute; inset:0; background:var(--ink); transform:translateX(-101%); transition:transform .6s var(--ease); }
.category > * { position:relative; z-index:1; }
.category:hover,.category:focus-visible { color:#fff; padding-inline:24px; }
.category:hover::before,.category:focus-visible::before { transform:none; }
.category-number { font-size:.6rem; letter-spacing:.2em; color:var(--muted); }
.category-title p { margin:0 0 4px; color:var(--red); font-size:.57rem; letter-spacing:.2em; text-transform:uppercase; }
.category-title h2 { margin:0; font-size:clamp(2.7rem,5vw,5.6rem); line-height:1; letter-spacing:-.05em; }
.category-title > span { color:var(--muted); font-size:.82rem; }
.category-art { height:145px; position:relative; background:#d0c9bf; overflow:hidden; opacity:.76; transition:opacity .4s; }
.category:hover .category-art,.category:focus-visible .category-art { opacity:1; }
.category-art i { position:absolute; width:42%; height:120%; left:30%; top:-10%; background:#1b1a18; transform:skew(-8deg); }
.category-art b { position:absolute; right:10px; bottom:-23px; color:rgba(255,255,255,.65); font:italic 500 5rem var(--serif); }
.category--dresses .category-art { background:var(--red); }.category--dresses .category-art i { background:#e2dcd3; width:24%; left:38%; }
.category--tailoring .category-art { background:#beb8ae; }.category--tailoring .category-art i { clip-path:polygon(0 0,100% 0,76% 100%,52% 100%,50% 38%,47% 100%,22% 100%); width:55%; left:23%; }
.category--knitwear .category-art { background:repeating-linear-gradient(90deg,#c4bdb2 0 7px,#d7d0c6 7px 14px); }.category--knitwear .category-art i { border-radius:50% 50% 12% 12%; }
.category--accessories .category-art { background:#751117; }.category--accessories .category-art i { height:58%; top:25%; border:2px solid #e1d8ce; background:transparent; }
.category--menswear .category-art { background:#34312e; }.category--menswear .category-art i { background:#eee9e1; }
.category-arrow { font-size:1.35rem; transition:transform .35s var(--ease); }
.category:hover .category-arrow { transform:translate(5px,-5px); }
.quote-grid { display:grid; grid-template-columns:.5fr 2fr .7fr; gap:4vw; align-items:end; }
.quote-grid blockquote { margin:0; font-size:clamp(3.7rem,7vw,8rem); line-height:.9; letter-spacing:-.06em; }
.quote-grid blockquote em { color:var(--ink); }

/* about */
.house-title-grid { min-height:63vh; padding-top:clamp(90px,12vh,150px); display:grid; grid-template-columns:.35fr 1.65fr; grid-template-areas:"eye title" ". deck"; align-content:center; gap:25px 4vw; }
.house-title-grid .eyebrow { grid-area:eye; padding-top:15px; }
.house-title-grid .page-title { grid-area:title; margin:0; }
.house-title-grid .page-title .indent { padding-left:.6em; }
.house-deck { grid-area:deck; max-width:520px; margin:10px 0 40px .8em; color:var(--muted); font-size:1.05rem; }
.house-canvas { height:46vh; min-height:430px; background:#d4cdc2; position:relative; overflow:hidden; }
.house-canvas::before { content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(23,22,20,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(23,22,20,.12) 1px,transparent 1px); background-size:6.25% 25%; }
.canvas-paper,.canvas-red,.canvas-black { position:absolute; transition:transform .3s ease-out; }
.canvas-paper { width:37%; height:110%; left:12%; top:-5%; background:#ede8df; transform:rotate(-5deg); box-shadow:20px 20px 60px rgba(23,22,20,.25); }
.canvas-paper span { position:absolute; right:7%; top:6%; font:500 2rem var(--serif); }
.canvas-paper i { position:absolute; width:65%; height:80%; left:18%; top:10%; border:1px solid rgba(23,22,20,.3); border-radius:50% 50% 15% 15%; }
.canvas-red { width:26%; height:110%; left:49%; top:0; background:var(--red); clip-path:polygon(18% 0,82% 0,100% 100%,0 100%); transform:rotate(8deg); }
.canvas-black { width:25%; height:120%; right:7%; top:-8%; background:#1b1a18; clip-path:polygon(25% 0,75% 0,100% 100%,0 100%); transform:rotate(-3deg); }
.house-canvas > p { position:absolute; z-index:4; right:var(--pad); bottom:24px; margin:0; font-size:.57rem; letter-spacing:.22em; text-transform:uppercase; }
.origin-grid { display:grid; grid-template-columns:.48fr 1.52fr; gap:8vw; }
.origin-aside { display:flex; flex-direction:column; min-height:460px; padding-right:30px; border-right:1px solid var(--line); }
.origin-aside > span { margin-top:90px; font:500 2.2rem/1.05 var(--serif); }
.origin-aside > b { margin-top:auto; color:var(--muted); font-size:.57rem; font-weight:500; letter-spacing:.16em; }
.origin-lead { margin:0; font:500 clamp(2.4rem,4.7vw,5.2rem)/1.05 var(--serif); letter-spacing:-.045em; }
.origin-columns { margin-top:65px; display:grid; grid-template-columns:1fr 1fr; gap:5vw; color:var(--muted); }
.origin-columns p { margin:0; }
.principle-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line-light); }
.principle { min-height:430px; padding:28px clamp(20px,3vw,44px) 30px; border-right:1px solid var(--line-light); display:flex; flex-direction:column; }
.principle:first-child { border-left:1px solid var(--line-light); }
.principle > span { font-size:.58rem; letter-spacing:.2em; color:rgba(255,255,255,.45); }
.principle-glyph { height:150px; margin:45px 0 35px; position:relative; }
.glyph-line::before { content:""; position:absolute; width:1px; height:100%; left:50%; background:var(--red); transform:rotate(22deg); }
.glyph-circle::before { content:""; position:absolute; width:130px; aspect-ratio:1; border:1px solid var(--red); border-radius:50%; left:50%; translate:-50% 0; }
.glyph-circle::after { content:""; position:absolute; width:10px; aspect-ratio:1; background:var(--red); border-radius:50%; left:50%; top:60px; translate:-50% 0; }
.glyph-stitch::before { content:""; position:absolute; inset:15px 20%; border-left:1px dashed var(--red); border-right:1px dashed var(--red); transform:skew(-14deg); }
.principle h3 { margin:0 0 12px; font-size:2rem; }
.principle p { margin:0; color:rgba(255,255,255,.55); }
.statement-grid { min-height:550px; display:grid; grid-template-columns:.35fr 1.65fr; grid-template-areas:"eye title" ". note"; position:relative; align-content:center; }
.statement-grid > .eyebrow { grid-area:eye; }
.statement-grid h2 { grid-area:title; margin:0; font-size:clamp(4rem,8vw,9rem); line-height:.86; letter-spacing:-.07em; position:relative; z-index:2; }
.statement-grid h2 em { color:var(--red); }
.statement-note { grid-area:note; margin:40px 0 0 45%; position:relative; z-index:2; }
.statement-note p { max-width:350px; color:var(--muted); }
.statement-a { position:absolute; right:0; bottom:-15%; color:rgba(180,34,44,.07); font:italic 500 32rem/1 var(--serif); }

/* contact */
.contact-page { background:var(--ink); color:var(--paper); }
.contact-hero { min-height:100svh; display:grid; grid-template-columns:1fr 1fr; padding-top:92px; }
.contact-intro { padding:clamp(90px,11vw,170px) var(--pad) 70px; display:flex; flex-direction:column; background:#1c1b19; position:relative; overflow:hidden; }
.contact-intro::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 30% 55%,rgba(180,34,44,.18),transparent 38%); }
.contact-intro > * { position:relative; z-index:1; }
.contact-intro .page-title { margin:35px 0 45px; }
.contact-intro > p:not(.eyebrow) { max-width:440px; color:rgba(255,255,255,.58); }
.contact-monogram { margin-top:auto; align-self:flex-end; color:rgba(255,255,255,.06); font:italic 500 clamp(10rem,24vw,25rem)/.65 var(--serif); }
.contact-form-panel { padding:clamp(90px,11vw,170px) var(--pad) 70px; background:var(--red); display:flex; flex-direction:column; justify-content:center; }
.form-heading { display:flex; justify-content:space-between; align-items:end; padding-bottom:25px; border-bottom:1px solid rgba(255,255,255,.32); }
.form-heading span { font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; }
.form-heading p { margin:0; font:italic 500 1.7rem var(--serif); }
#contact-form { margin-top:35px; }
.field { position:relative; margin-bottom:30px; }
.field label { display:block; margin-bottom:4px; font-size:.58rem; font-weight:500; letter-spacing:.2em; text-transform:uppercase; }
.field input,.field textarea { width:100%; padding:13px 0 16px; border:0; border-bottom:1px solid rgba(255,255,255,.32); outline:0; resize:vertical; background:transparent; color:#fff; font:300 clamp(1.1rem,1.6vw,1.45rem) var(--sans); }
.field input::placeholder,.field textarea::placeholder { color:rgba(255,255,255,.42); }
.field-line { position:absolute; inset:auto 0 0; height:1px; background:#fff; transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease); }
.field:focus-within .field-line { transform:scaleX(1); }
.form-submit { margin-top:40px; display:flex; align-items:center; gap:30px; }
.form-submit > p { max-width:240px; margin:0; color:rgba(255,255,255,.6); font-size:.7rem; }
.form-status { min-height:25px; margin:24px 0 0; color:#fff; font-size:.8rem; }
.contact-details { background:var(--paper); color:var(--ink); }
.details-grid { display:grid; grid-template-columns:repeat(3,1fr); border-block:1px solid var(--line); }
.detail-block { padding:45px clamp(20px,3vw,48px) 50px; border-right:1px solid var(--line); }
.detail-block:first-child { border-left:1px solid var(--line); }
.detail-block > span { color:var(--red); font-size:.58rem; letter-spacing:.2em; text-transform:uppercase; }
.detail-block h2 { margin:70px 0 0; font-size:clamp(1.8rem,3vw,3.6rem); line-height:1.05; }

/* footer */
.site-footer { padding:80px 0 26px; background:#11100f; color:#fff; }
.footer-top { display:grid; grid-template-columns:1.2fr .8fr .5fr; gap:6vw; align-items:start; padding-bottom:80px; }
.footer-brand { font:italic 500 clamp(5rem,11vw,11rem)/.7 var(--serif); letter-spacing:-.08em; }
.footer-top > p { margin:0; color:rgba(255,255,255,.55); }
.footer-top nav { display:flex; flex-direction:column; gap:10px; font-size:.68rem; letter-spacing:.15em; text-transform:uppercase; }
.footer-top nav a { width:fit-content; }
.footer-top nav a:hover { color:#e35a62; }
.footer-bottom { padding-top:22px; border-top:1px solid rgba(255,255,255,.16); display:flex; justify-content:space-between; gap:20px; color:rgba(255,255,255,.4); font-size:.55rem; letter-spacing:.14em; text-transform:uppercase; }

/* motion */
.js .hero-title .line > span,.js .page-title .line > span { transform:translateY(112%); }
.js.is-loaded .hero-title .line > span,.js.is-loaded .page-title .line > span { animation:title-in 1.05s var(--ease) forwards; }
.js.is-loaded .hero-title .line:nth-child(1)>span,.js.is-loaded .page-title .line:nth-child(1)>span { animation-delay:1.1s; }
.js.is-loaded .hero-title .line:nth-child(2)>span,.js.is-loaded .page-title .line:nth-child(2)>span { animation-delay:1.22s; }
.js.is-loaded .hero-title .line:nth-child(3)>span { animation-delay:1.34s; }
@keyframes title-in { to { transform:none; } }
.js .hero-sequence { opacity:0; transform:translateY(24px); }
.js.is-loaded .hero-sequence { animation:sequence-in .9s 1.45s var(--ease) forwards; }
.js.is-loaded .hero-bottom.hero-sequence,.js.is-loaded .page-intro.hero-sequence { animation-delay:1.62s; }
@keyframes sequence-in { to { opacity:1; transform:none; } }
.js .hero-visual,.js .collection-banner,.js .house-canvas { clip-path:inset(0 0 100% 0); }
.js.is-loaded .hero-visual,.js.is-loaded .collection-banner,.js.is-loaded .house-canvas { animation:visual-in 1.35s 1s var(--ease) forwards; }
@keyframes visual-in { to { clip-path:inset(0); } }
.js .reveal { opacity:1; transform:none; clip-path:inset(0); transition:opacity .9s var(--ease),transform .9s var(--ease),clip-path 1.1s var(--ease); }
.js .reveal.is-pending { opacity:0; transform:translateY(44px); }
.js .reveal--image.is-pending { transform:none; clip-path:inset(0 0 100% 0); }
.js .reveal--text.is-pending { transform:translateY(32px); }
.js .reveal.is-visible { opacity:1; transform:none; clip-path:inset(0); }
.principle:nth-child(2),.category:nth-child(2) { transition-delay:.08s; }
.principle:nth-child(3),.category:nth-child(3) { transition-delay:.16s; }
.category:nth-child(4) { transition-delay:.24s; }.category:nth-child(5) { transition-delay:.32s; }.category:nth-child(6) { transition-delay:.4s; }

/* responsive */
@media (max-width: 1050px) {
  .nav-shell { grid-template-columns:1fr auto; }
  .site-nav { position:fixed; inset:0; z-index:-1; padding:130px var(--pad) 60px; background:var(--ink); color:var(--paper); flex-direction:column; align-items:flex-start; justify-content:center; gap:0; opacity:0; visibility:hidden; transition:opacity .45s,visibility .45s; }
  .site-nav.is-open { opacity:1; visibility:visible; }
  .site-nav a { width:100%; padding:17px 0; border-bottom:1px solid rgba(255,255,255,.16); font:500 clamp(2.5rem,8vw,5rem)/1 var(--serif); letter-spacing:-.04em; text-transform:none; transform:translateY(25px); opacity:0; transition:transform .5s var(--ease),opacity .5s; }
  .site-nav.is-open a { opacity:1; transform:none; }
  .site-nav.is-open a:nth-child(2){transition-delay:.06s}.site-nav.is-open a:nth-child(3){transition-delay:.12s}.site-nav.is-open a:nth-child(4){transition-delay:.18s}
  .site-nav a span { display:inline-block; width:50px; color:#e35a62; font:500 .55rem var(--sans); letter-spacing:.15em; }
  .site-nav a::after { display:none; }
  .nav-appointment { display:none; }
  .menu-toggle { display:flex; }
  .nav-open .site-header { color:var(--paper)!important; background:transparent!important; box-shadow:none!important; transform:none; }
  .nav-open .site-header .nav-shell { color:var(--paper); mix-blend-mode:normal; }
  .hero { grid-template-columns:1fr; }
  .hero-copy { min-height:88svh; padding-top:145px; }
  .hero-title { font-size:clamp(4.5rem,15vw,8rem); }
  .hero-visual { min-height:75svh; }
  .scroll-cue { left:auto; right:0; translate:0; bottom:75svh; }
  .manifesto-grid { grid-template-columns:.55fr 1.45fr; min-height:0; }
  .manifesto-index { display:none; }
  .manifesto-index { justify-self:start; }
  .story-grid { grid-template-columns:1fr; }
  .story-copy { padding-bottom:20px; }
  .page-hero-grid { grid-template-columns:1fr; padding-bottom:70px; }
  .page-intro { padding-bottom:0; max-width:500px; }
  .category { grid-template-columns:55px 1fr 160px 25px; }
  .quote-grid { grid-template-columns:1fr; }
  .quote-grid .button { margin-top:25px; }
  .house-title-grid { grid-template-columns:1fr; grid-template-areas:"eye" "title" "deck"; }
  .house-deck { margin-left:0; }
  .origin-grid { grid-template-columns:1fr; }
  .origin-aside { min-height:0; padding:0 0 35px; border-right:0; border-bottom:1px solid var(--line); display:grid; grid-template-columns:1fr 1fr 1fr; align-items:end; }
  .origin-aside > span { margin:0; }
  .principle-grid { grid-template-columns:1fr; }
  .principle,.principle:first-child { border-left:1px solid var(--line-light); min-height:360px; }
  .statement-grid { grid-template-columns:1fr; grid-template-areas:"eye" "title" "note"; }
  .statement-note { margin-left:0; }
  .contact-hero { grid-template-columns:1fr; }
  .contact-intro { min-height:80svh; }
  .details-grid { grid-template-columns:1fr; }
  .detail-block,.detail-block:first-child { border-left:1px solid var(--line); }
  .footer-top { grid-template-columns:1fr 1fr; }
  .footer-top nav { grid-column:2; }
}

@media (max-width: 720px) {
  :root { --pad: 20px; }
  .nav-shell { min-height:74px; }
  .brand-place { display:none; }
  .site-header.is-scrolled { min-height:74px; }
  .section { padding-block:82px; }
  .hero-copy { min-height:82svh; padding-top:120px; padding-bottom:85px; }
  .hero-copy .eyebrow span { display:none; }
  .hero-title { font-size:clamp(3.7rem,18.4vw,6.4rem); line-height:.82; }
  .hero-title .indent { padding-left:.18em; }
  .hero-bottom { width:100%; margin-left:0; }
  .hero-actions { align-items:flex-start; flex-direction:column; }
  .vertical-note { display:none; }
  .hero-visual { min-height:65svh; }
  .fabric--back { width:62%; left:1%; }.fabric--front { width:65%; right:-8%; }
  .scroll-cue { bottom:65svh; width:155px; height:58px; }
  .manifesto-grid { padding-block:72px; grid-template-columns:1fr; gap:42px; }
  .manifesto-aside { min-height:320px; }
  .manifesto-swatch { width:180px; }
  .manifesto-copy { font-size:clamp(2.15rem,11vw,3.8rem); }
  .manifesto-notes { margin-top:38px; grid-template-columns:1fr; gap:14px; }
  .manifesto-orbit { width:420px; right:-60%; bottom:-16%; }
  .section-heading { grid-template-columns:1fr; gap:25px; margin-bottom:50px; }
  .arrivals .section-heading { margin-bottom:22px; padding-bottom:20px; }
  .section-heading h2 { font-size:clamp(3.2rem,15vw,5.5rem); }
  .lookbook-grid { display:block; }
  .look-card { margin-bottom:55px; }
  .look-card--coat .look-art,.look-card--dress .look-art,.look-card--trouser .look-art { min-height:360px; aspect-ratio:4/5; }
  .look-meta { grid-template-columns:1fr auto; }
  .look-meta > p { grid-column:1 / 3; grid-row:2; }
  .section-link-row { align-items:flex-start; flex-direction:column; }
  .story-art { min-height:500px; }
  .story-copy h2 { font-size:clamp(3.3rem,15vw,5.4rem); }
  .appointment h2 { font-size:clamp(4rem,18vw,6.5rem); }
  .page-hero { padding-top:74px; }
  .page-hero-index { top:100px; }
  .page-hero-grid { min-height:68svh; padding-top:110px; align-content:center; }
  .page-title { font-size:clamp(4rem,19vw,7rem); }
  .collection-banner,.house-canvas { min-height:360px; height:55vh; }
  .banner-shape--one { width:55%; left:5%; }.banner-shape--two { width:48%; right:-3%; }
  .collection-toolbar { align-items:flex-start; flex-direction:column; }
  .category { min-height:160px; grid-template-columns:34px 1fr 68px 15px; gap:12px; }
  .category:hover,.category:focus-visible { padding-inline:8px; }
  .category-title h2 { font-size:clamp(2.3rem,12vw,4rem); }
  .category-title > span { display:none; }
  .category-art { height:100px; }
  .quote-grid blockquote { font-size:clamp(3.4rem,15vw,5.8rem); }
  .house-title-grid { min-height:75svh; padding-top:110px; }
  .house-title-grid .page-title .indent { padding-left:.16em; }
  .canvas-paper { width:55%; left:2%; }.canvas-red { width:40%; left:42%; }.canvas-black { width:38%; right:-8%; }
  .origin-aside { grid-template-columns:1fr 1fr; gap:30px; }
  .origin-aside > b { display:none; }
  .origin-lead { font-size:clamp(2.3rem,11vw,4rem); }
  .origin-columns { grid-template-columns:1fr; gap:20px; }
  .principle { min-height:350px; }
  .statement-grid h2 { font-size:clamp(3.7rem,17vw,6rem); }
  .contact-hero { padding-top:74px; }
  .contact-intro { min-height:75svh; padding-top:115px; }
  .contact-form-panel { padding-top:80px; }
  .form-heading { align-items:flex-start; flex-direction:column; gap:10px; }
  .form-submit { align-items:flex-start; flex-direction:column; }
  .details-grid { border:0; }
  .detail-block,.detail-block:first-child { border-left:0; border-right:0; border-top:1px solid var(--line); }
  .detail-block h2 { margin-top:35px; }
  .footer-top { grid-template-columns:1fr; padding-bottom:55px; }
  .footer-top nav { grid-column:auto; }
  .footer-bottom { align-items:flex-start; flex-direction:column; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
  .page-curtain { display:none; }
  .js .hero-title .line>span,.js .page-title .line>span,.js .hero-sequence,.js .reveal { opacity:1; transform:none; clip-path:none; }
  .js .hero-visual,.js .collection-banner,.js .house-canvas { clip-path:none; }
}