:root { --ink:#090909; --bone:#f0ede5; --paper:#e9e5dc; --line:rgba(240,237,229,.42); --sans:"Inter",Arial,sans-serif; --display:"Archivo Black",Arial Black,sans-serif; --space-1:1.5rem; --space-2:3rem; --space-3:6rem; --space-4:9rem; --gutter:2.25rem; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--ink); }
body { margin:0; color:var(--bone); background:var(--ink); font-family:var(--sans); overflow-x:hidden; }
body.menu-open { overflow:hidden; }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
img { display:block; width:100%; height:100%; object-fit:cover; }
.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; }
.site-header { position:fixed; inset:0 0 auto; z-index:50; height:72px; padding:0 var(--gutter); display:grid; grid-template-columns:1fr auto 1fr; align-items:center; color:#fff; mix-blend-mode:difference; text-transform:uppercase; font-size:.75rem; letter-spacing:.14em; }
.brand { font-family:var(--display); font-size:1.25rem; letter-spacing:-.06em; justify-self:start; }
.brand span { font-family:var(--sans); font-size:.45rem; vertical-align:top; margin-left:.18rem; letter-spacing:0; }
.desktop-nav { display:flex; gap:2.2rem; }
.desktop-nav a,.cart { position:relative; }
.desktop-nav a::after,.cart::after { content:""; position:absolute; left:0; right:100%; bottom:-.35rem; border-bottom:1px solid; transition:right .25s ease; }
.desktop-nav a:hover::after,.cart:hover::after { right:0; }
.cart { justify-self:end; }
.menu-toggle { display:none; border:0; background:none; color:inherit; text-transform:uppercase; letter-spacing:.14em; padding:0; }
.mobile-menu { display:none; }
.hero-canvas { position:fixed; inset:0; z-index:0; background:#353535 url("assets/hero.jpg") center 24% / cover no-repeat; transform:scale(1.015); }
.hero-wash { position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.02) 42%,rgba(0,0,0,.68)); }
main { position:relative; z-index:1; }
.hero { min-height:100svh; padding:8rem var(--gutter) 2.2rem; display:flex; flex-direction:column; justify-content:flex-end; position:relative; }
.eyebrow { position:absolute; top:17%; left:var(--gutter); margin:0; text-transform:uppercase; font-size:.68rem; letter-spacing:.18em; }
.hero-label { position:absolute; top:18%; right:var(--gutter); text-transform:uppercase; font-size:.68rem; letter-spacing:.18em; writing-mode:vertical-rl; transform:rotate(180deg); }
.hero-label span { opacity:.45; margin:.35rem 0; }
.hero h1 { margin:0 0 var(--space-1); max-width:980px; font-family:var(--display); font-size:clamp(4.1rem,8.8vw,8.7rem); line-height:.8; letter-spacing:-.072em; text-transform:uppercase; text-shadow:0 2px 30px rgba(0,0,0,.18); }
.hero h1 span { display:block; }
.hero h1 span:not(:first-child) { margin-left:12vw; }
.hero-index { border-top:1px solid var(--line); padding-top:.75rem; display:flex; justify-content:space-between; font-size:.66rem; text-transform:uppercase; letter-spacing:.16em; }
.scroll-cue { position:absolute; right:var(--gutter); bottom:5.25rem; font-size:.65rem; letter-spacing:.15em; text-transform:uppercase; transform:rotate(90deg) translateX(100%); transform-origin:right bottom; }
.drop { min-height:220vh; padding:12vh var(--gutter) 14vh; position:relative; }
.drop::before { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.32) 38%,rgba(0,0,0,.62)); z-index:-1; }
.drop-heading { display:grid; grid-template-columns:1fr 1.35fr 1fr; align-items:end; margin-bottom:6vh; border-top:1px solid var(--line); padding-top:1rem; }
.drop-heading p { margin:0; font-size:.7rem; line-height:1.5; letter-spacing:.15em; text-transform:uppercase; }
.drop-heading p:last-child { justify-self:end; text-align:right; }
.drop-heading h2 { margin:0; font-family:var(--display); font-size:clamp(3rem,5.1vw,5.2rem); line-height:.84; letter-spacing:-.065em; text-align:center; }
.product-drift { min-height:195vh; display:grid; grid-template-columns:repeat(12,1fr); grid-template-rows:repeat(4,minmax(30rem,1fr)); column-gap:1.1rem; }
.float-product { align-self:center; width:min(26vw,350px); will-change:transform; transition:transform .12s linear; }
.product-one { grid-column:2 / 6; grid-row:1; }.product-two { grid-column:8 / 12; grid-row:2; }.product-three { grid-column:2 / 6; grid-row:3; }.product-four { grid-column:8 / 12; grid-row:4; }
.product-visual { position:relative; aspect-ratio:4/5; overflow:hidden; background:#aaa; box-shadow:0 22px 60px rgba(0,0,0,.18); }
.product-visual img { width:100%; height:100%; object-fit:cover; filter:saturate(.58) contrast(1.04); }
.product-visual b { position:absolute; right:.8rem; bottom:.6rem; color:rgba(255,255,255,.65); font-size:.55rem; letter-spacing:.15em; font-weight:500; }
.product-info { display:grid; grid-template-columns:1fr auto; gap:.15rem 1rem; padding-top:.75rem; color:#fff; text-shadow:0 1px 10px rgba(0,0,0,.25); }
.product-info h3 { margin:0; font-size:.8rem; font-weight:600; text-transform:uppercase; letter-spacing:.08em; }.product-info p,.product-info span { margin:0; font-size:.65rem; text-transform:uppercase; letter-spacing:.11em; }.product-info p { opacity:.68; }.product-info span { grid-column:2; grid-row:1 / 3; align-self:start; }
.manifesto { min-height:140vh; padding:16vh 0 14vh; position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:center; }
.manifesto::before { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.62),rgba(0,0,0,.05) 50%,rgba(0,0,0,.55)); z-index:-1; }
.manifesto-line { white-space:nowrap; font-family:var(--display); font-size:clamp(5.2rem,13vw,13rem); line-height:.78; letter-spacing:-.077em; text-transform:uppercase; transform:translateX(-2vw); }
.manifesto-line-right { text-align:right; transform:translateX(3vw); }
.manifesto-copy { width:min(39rem,calc(100% - (2 * var(--gutter)))); margin:10vh auto 0; display:grid; grid-template-columns:9rem 1fr; gap:2rem; border-top:1px solid var(--line); padding-top:1rem; }
.manifesto-copy span { font-size:.65rem; text-transform:uppercase; letter-spacing:.14em; }.manifesto-copy p { margin:0; font-size:clamp(1.15rem,1.7vw,1.6rem); line-height:1.35; }
.editorial-break { min-height:150vh; padding:12vh var(--gutter) 16vh; position:relative; display:grid; grid-template-columns:repeat(12,1fr); grid-template-rows:auto auto; gap:10vh 1.1rem; align-items:start; background:linear-gradient(180deg,rgba(0,0,0,.58),rgba(0,0,0,.72)); }
.editorial-frame { margin:0; }.editorial-frame img { filter:saturate(.72) contrast(1.04); }.editorial-frame figcaption { margin-top:.6rem; font-size:.62rem; text-transform:uppercase; letter-spacing:.15em; }
.editorial-main { grid-column:2 / 8; grid-row:1; aspect-ratio:3/4; }.editorial-still { grid-column:8 / 12; grid-row:2; aspect-ratio:1; align-self:end; }
.editorial-note { grid-column:8 / 13; grid-row:1; align-self:center; margin:0; font-family:var(--display); font-size:clamp(2rem,4.8vw,5rem); line-height:.9; letter-spacing:-.05em; text-transform:uppercase; }
.resolution { position:relative; z-index:2; background:var(--bone); color:var(--ink); padding:8vh var(--gutter) 0; border-radius:2.5rem 2.5rem 0 0; }
.resolution-intro { display:grid; grid-template-columns:repeat(12,1fr); align-items:start; row-gap:var(--space-1); padding-bottom:9vh; }
.resolution-intro p,.resolution-intro span { margin:0; font-size:.68rem; line-height:1.5; letter-spacing:.14em; text-transform:uppercase; }.resolution-intro p { grid-column:1 / 4; }.resolution-intro span { grid-column:8 / 13; grid-row:2; justify-self:start; }
.resolution-intro h2 { grid-column:4 / 12; margin:0; font-family:var(--display); font-size:clamp(3.6rem,6vw,6.3rem); line-height:.85; letter-spacing:-.066em; text-transform:uppercase; }
.categories { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:1rem; }.category { display:block; }.category-image { aspect-ratio:3/4; overflow:hidden; background:#bbb; }
.category-image img { transition:transform .8s cubic-bezier(.2,.75,.2,1),filter .5s; filter:saturate(.55) contrast(1.05); }.category:hover img { transform:scale(1.035); filter:saturate(.8) contrast(1.02); }
.category-hoodies img { object-position:53% center; }.category-tees img { object-position:47% 22%; }.category-bottoms img { object-position:center; }
.category > div:last-child { display:flex; justify-content:space-between; align-items:baseline; border-top:1px solid rgba(9,9,9,.35); margin-top:.75rem; padding-top:.7rem; }
.category h3 { margin:0; font-family:var(--display); font-size:clamp(1.3rem,2.1vw,2.1rem); letter-spacing:-.05em; text-transform:uppercase; }.category span { font-size:.62rem; text-transform:uppercase; letter-spacing:.13em; }
.quiet-statement { min-height:78vh; display:flex; align-items:flex-end; justify-content:space-between; padding:16vh 0 7vh; }.quiet-statement p { margin:0; max-width:12ch; font-family:var(--display); font-size:clamp(4rem,8vw,8rem); line-height:.81; letter-spacing:-.07em; text-transform:uppercase; }.quiet-statement span { font-size:.65rem; letter-spacing:.14em; text-transform:uppercase; }
footer { min-height:100svh; border-top:1px solid rgba(9,9,9,.5); padding-top:calc(72px + var(--space-2)); overflow:hidden; display:flex; flex-direction:column; }.footer-top { display:grid; grid-template-columns:1.5fr 2fr; gap:5rem; }
.signup > p { margin:0 0 1.6rem; font-family:var(--display); font-size:1.6rem; letter-spacing:-.04em; }.signup form { display:flex; border-bottom:1px solid var(--ink); width:min(100%,31rem); }.signup input { flex:1; border:0; background:transparent; padding:.9rem 0; outline:none; color:var(--ink); font-size:.75rem; letter-spacing:.12em; }.signup input::placeholder { color:var(--ink); opacity:.75; }.signup button { border:0; background:transparent; padding:.9rem 0 .9rem 1rem; text-transform:uppercase; font-size:.7rem; letter-spacing:.13em; cursor:pointer; }.signup > span { display:block; margin-top:.8rem; font-size:.62rem; text-transform:uppercase; letter-spacing:.1em; opacity:.65; }
.footer-links { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; }.footer-links div { display:flex; flex-direction:column; gap:.65rem; }.footer-links p { margin:0 0 .6rem; font-size:.64rem; text-transform:uppercase; letter-spacing:.14em; opacity:.55; }.footer-links a { width:max-content; font-size:.8rem; text-transform:uppercase; letter-spacing:.08em; }.footer-links a:hover { text-decoration:underline; text-underline-offset:.25rem; }
.footer-wordmark { width:100%; margin:auto 0 var(--space-1); padding-top:var(--space-3); font-family:var(--display); font-size:clamp(8rem,22vw,22rem); line-height:.76; letter-spacing:-.085em; white-space:nowrap; text-align:center; }.footer-legal { display:flex; justify-content:space-between; border-top:1px solid rgba(9,9,9,.35); padding:.9rem 0 1.1rem; font-size:.58rem; text-transform:uppercase; letter-spacing:.12em; }
.reveal { opacity:0; transform:translateY(2.5rem); transition:opacity .9s ease,transform .9s cubic-bezier(.2,.75,.2,1); }.reveal.in-view { opacity:1; transform:none; }
@media (max-width:900px) { .drop-heading { grid-template-columns:1fr 1fr; }.drop-heading h2 { grid-column:1 / 3; grid-row:2; margin-top:var(--space-1); text-align:left; }.drop-heading p:last-child { grid-column:2; grid-row:1; }.float-product { width:min(38vw,360px); }.manifesto-copy { margin-top:9vh; }.resolution-intro { grid-template-columns:repeat(8,1fr); row-gap:var(--space-1); }.resolution-intro p { grid-column:1 / 4; }.resolution-intro h2 { grid-column:2 / 9; grid-row:2; }.resolution-intro span { grid-column:5 / 9; grid-row:3; }.categories { grid-template-columns:1.25fr 1fr; }.category:last-child { grid-column:2; }.footer-top { grid-template-columns:1fr; } }
@media (max-width:720px) {
  :root { --gutter:1.1rem; --space-1:1.25rem; --space-2:2.5rem; --space-3:4.5rem; --space-4:6rem; }
  .site-header { height:62px; padding:0 var(--gutter); grid-template-columns:1fr auto auto; gap:1rem; }.desktop-nav { display:none; }.brand { font-size:1.08rem; }.cart,.menu-toggle { font-size:.63rem; }.menu-toggle { display:block; }
  .mobile-menu { display:flex; position:fixed; inset:0; z-index:40; background:var(--bone); color:var(--ink); padding:7rem 1.1rem 1.5rem; flex-direction:column; transform:translateY(-105%); transition:transform .45s cubic-bezier(.72,0,.2,1); }.mobile-menu.open { transform:none; }.mobile-menu > a { font-family:var(--display); font-size:clamp(3.5rem,17vw,5rem); line-height:.88; letter-spacing:-.07em; text-transform:uppercase; }.mobile-menu p { margin:auto 0 0; font-size:.65rem; line-height:1.5; letter-spacing:.14em; text-transform:uppercase; }
  .hero { padding:7rem var(--gutter) 1.15rem; }.hero-canvas { background-position:58% center; }.eyebrow { top:14%; left:var(--gutter); font-size:.58rem; }.hero-label { top:16%; right:var(--gutter); font-size:.58rem; }.hero h1 { max-width:92%; font-size:12vw; line-height:.84; margin-bottom:1.25rem; letter-spacing:-.06em; }.hero h1 span:not(:first-child) { margin-left:7vw; font-size:.82em; line-height:1.01; }.hero-index { font-size:.54rem; gap:1rem; }.scroll-cue { display:none; }
  .drop { min-height:238vh; padding:10vh var(--gutter) 10vh; }.drop-heading { display:block; margin-bottom:4vh; }.drop-heading h2 { margin:var(--space-1) 0 .8rem; font-size:11.5vw; }.drop-heading p:last-child { text-align:left; }.product-drift { min-height:212vh; grid-template-columns:repeat(2,1fr); grid-template-rows:repeat(4,minmax(28rem,1fr)); column-gap:.7rem; }.float-product { width:min(69vw,270px); }.product-one,.product-three { grid-column:1 / 3; justify-self:start; }.product-two,.product-four { grid-column:1 / 3; justify-self:end; }.product-one{grid-row:1}.product-two{grid-row:2}.product-three{grid-row:3}.product-four{grid-row:4}
  .manifesto { min-height:122vh; padding:13vh 0 11vh; }.manifesto-line { font-size:17vw; line-height:.84; }.manifesto-copy { width:calc(100% - (2 * var(--gutter))); grid-template-columns:1fr; margin-top:9vh; }
  .editorial-break { min-height:122vh; padding:10vh var(--gutter) 12vh; grid-template-columns:repeat(6,1fr); gap:8vh .7rem; }.editorial-main { grid-column:1 / 6; }.editorial-note { grid-column:2 / 7; grid-row:2; }.editorial-still { grid-column:3 / 7; grid-row:3; }
  .resolution { padding:7vh var(--gutter) 0; border-radius:1.5rem 1.5rem 0 0; }.resolution-intro { display:grid; grid-template-columns:repeat(6,1fr); padding-bottom:7vh; row-gap:var(--space-1); }.resolution-intro > * { min-width:0; }.resolution-intro p { grid-column:1 / 5; }.resolution-intro h2 { grid-column:1 / 7; grid-row:2; font-size:10.5vw; line-height:.9; }.resolution-intro span { grid-column:3 / 7; grid-row:3; text-align:right; justify-self:end; }.categories { grid-template-columns:1fr; gap:var(--space-3); }.category:last-child { grid-column:auto; }.category-image { aspect-ratio:4/5; }.quiet-statement { min-height:62vh; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; padding:14vh 0 7vh; }.quiet-statement p { max-width:100%; font-size:11vw; line-height:.84; }.quiet-statement span { display:block; margin-top:var(--space-1); }
  footer { padding-top:calc(62px + var(--space-2)); }.footer-top { gap:var(--space-3); }.footer-links { gap:1rem; }.footer-wordmark { margin:auto 0 var(--space-1); padding-top:var(--space-3); font-size:23vw; line-height:.8; }.footer-legal { gap:1rem; flex-wrap:wrap; }
}
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.float-product{transform:none!important}.mobile-menu{transition:none} }