@import url('/public/readability.css?v=4');

:root { --ink:#0b0c0b; --paper:#eee9df; --muted:#9d9d98; --line:rgba(238,233,223,.24); }
* { box-sizing:border-box; }
html { background:var(--ink); scroll-behavior:auto; }
body { margin:0; overflow-x:hidden; background:var(--ink); color:var(--paper); font-family:var(--mono); }
img { display:block; max-width:100%; }
a { color:inherit; }
.project-header { position:fixed; z-index:20; top:0; left:0; right:0; display:grid; grid-template-columns:1fr 1fr 1fr; padding:28px 32px; color:#fff; font-size:10px; font-weight:500; text-transform:uppercase; letter-spacing:.13em; mix-blend-mode:difference; }
.project-header a { text-decoration:none; }
.project-header span { text-align:center; }
.project-header a:last-child { text-align:right; }
.context-back { position:fixed; z-index:21; top:76px; left:32px; display:inline-flex; align-items:center; gap:10px; padding:9px 12px 9px 10px; border:1px solid rgba(255,255,255,.42); color:#fff; background:rgba(8,9,8,.16); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); font-size:9px; font-weight:500; line-height:1; text-decoration:none; text-transform:uppercase; letter-spacing:.13em; mix-blend-mode:difference; }
.context-back span:first-child { font-size:15px; line-height:.7; transform:translateY(-1px); }
.context-back:hover,.context-back:focus-visible { background:#fff; color:#090a09; outline:none; }
.project-hero { position:relative; min-height:100svh; overflow:hidden; background:#171817; }
.project-hero > img { position:absolute; inset:-4%; width:108%; height:108%; object-fit:cover; object-position:center; }
.project-hero::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(6,7,6,.08),rgba(6,7,6,.08) 48%,rgba(6,7,6,.72)); }
.project-hero--pending { background:radial-gradient(circle at 72% 34%,rgba(217,128,98,.14),transparent 24%),linear-gradient(118deg,#111311,#080908 66%); }
.project-hero--pending::before { content:attr(data-project); position:absolute; right:-.06em; bottom:-.18em; color:rgba(238,233,223,.035); font:400 clamp(180px,31vw,570px)/.7 var(--serif); letter-spacing:-.08em; text-transform:uppercase; }
.project-hero-copy { position:absolute; z-index:2; left:5.5vw; right:5.5vw; bottom:8vh; }
.project-hero-copy p { margin:0 0 22px; font-size:10px; text-transform:uppercase; letter-spacing:.14em; }
.project-hero-copy h1 { max-width:88vw; margin:0; font:400 clamp(112px,17vw,292px)/.66 var(--serif); letter-spacing:-.07em; }
.project-hero-copy h1 em { display:block; margin-left:18vw; font-weight:400; }
.project-index { position:absolute; right:0; bottom:5px; font-size:10px; letter-spacing:.14em; }
.project-intro { display:grid; grid-template-columns:1fr 1.4fr; gap:10vw; padding:16vh 7vw 18vh; background:var(--paper); color:var(--ink); }
.project-intro-label { font-size:10px; text-transform:uppercase; letter-spacing:.14em; }
.project-intro h2 { max-width:860px; margin:0; font:400 clamp(58px,7.6vw,132px)/.82 var(--serif); letter-spacing:-.055em; }
.project-intro-copy { display:grid; grid-template-columns:1.2fr 1fr; gap:6vw; margin-top:10vh; }
.project-intro-copy p { margin:0; font-size:clamp(13px,1vw,17px); line-height:1.65; }
.project-details { margin:0; padding:0; list-style:none; border-top:1px solid rgba(11,12,11,.25); }
.project-details li { display:grid; grid-template-columns:42px 1fr; padding:13px 0; border-bottom:1px solid rgba(11,12,11,.18); font-size:10px; text-transform:uppercase; letter-spacing:.1em; }
.project-details span { opacity:.48; }
.kinetic-gallery-section { --gallery-scroll-height:440vh; position:relative; height:var(--gallery-scroll-height); background:#070807; color:var(--paper); isolation:isolate; }
.kinetic-gallery-section.is-empty { height:100svh; min-height:680px; }
.kinetic-gallery-section.is-static { height:auto; padding:98px 20px 72px; }
.kinetic-gallery-section.is-static .kinetic-gallery-viewport { position:relative; height:auto; min-height:0; overflow:visible; background:transparent; }
.kinetic-gallery-section.is-static .kinetic-gallery-viewport::after { display:none; }
.kinetic-gallery-section.is-static .kinetic-gallery-heading { position:relative; top:auto; left:auto; right:auto; margin-bottom:30px; pointer-events:auto; }
.kinetic-gallery-section.is-static .project-gallery { position:relative; top:auto; display:grid; grid-template-columns:1fr; gap:34px; width:auto; height:auto; padding:0; transform:none!important; will-change:auto; }
.kinetic-gallery-section.is-static .kinetic-card,
.kinetic-gallery-section.is-static .kinetic-card:nth-child(n) { width:100%; height:min(68vh,620px); margin:0; transform:none; will-change:auto; }
.kinetic-gallery-section.is-static .kinetic-card img { transform:none; }
.kinetic-gallery-section.is-static .kinetic-card figcaption { position:relative; bottom:auto; padding:10px 0 0; opacity:1; transform:none; }
.kinetic-gallery-viewport { position:sticky; top:0; height:100svh; min-height:620px; overflow:hidden; background:#070807; }
.kinetic-gallery-viewport::after { content:''; position:absolute; z-index:2; inset:0; pointer-events:none; background:linear-gradient(90deg,rgba(7,8,7,.72),transparent 10%,transparent 88%,rgba(7,8,7,.62)),linear-gradient(180deg,rgba(7,8,7,.52),transparent 24%,transparent 72%,rgba(7,8,7,.7)); }
.kinetic-gallery-atmosphere { position:absolute; z-index:0; inset:-8%; overflow:hidden; pointer-events:none; }
.kinetic-backdrop { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; filter:blur(46px) saturate(.72) brightness(.36); transform:scale(1.16); transition:opacity 1.15s cubic-bezier(.22,.75,.22,1),transform 6s ease; }
.kinetic-backdrop.is-visible { opacity:.42; transform:scale(1.1); }
.kinetic-gallery-atmosphere span { position:absolute; inset:0; background:rgba(7,8,7,.42); }
.kinetic-gallery-heading { position:absolute; z-index:6; top:7vh; left:4vw; right:4vw; display:flex; justify-content:space-between; align-items:flex-start; pointer-events:none; }
.kinetic-gallery-heading p { display:flex; gap:16px; margin:0; font-size:10px; text-transform:uppercase; letter-spacing:.15em; }
.kinetic-gallery-heading p span { color:var(--paper); }
.kinetic-gallery-heading p em { color:rgba(238,233,223,.5); font-style:normal; }
.kinetic-gallery-heading div { display:flex; align-items:baseline; gap:8px; font-size:10px; letter-spacing:.15em; }
.kinetic-gallery-heading b { font-weight:400; }
.kinetic-gallery-heading i { color:rgba(238,233,223,.34); font-style:normal; }
.kinetic-gallery-cue { position:absolute; z-index:6; left:4vw; right:4vw; bottom:5vh; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:18px; color:rgba(238,233,223,.56); font-size:9px; text-transform:uppercase; letter-spacing:.15em; pointer-events:none; }
.kinetic-gallery-cue i { position:relative; height:1px; overflow:hidden; background:rgba(238,233,223,.2); }
.kinetic-gallery-cue b { position:absolute; inset:0; background:var(--paper); transform:scaleX(.015); transform-origin:left center; will-change:transform; }
.project-gallery { position:absolute; z-index:4; left:0; top:15vh; display:flex; align-items:center; gap:clamp(54px,6vw,118px); width:max-content; height:72vh; padding:0 14vw 0 13vw; will-change:transform; }
.kinetic-card { --drift-y:0px; --drift-r:0deg; position:relative; flex:none; width:clamp(520px,52vw,980px); height:clamp(360px,60vh,720px); margin:0; z-index:1; outline:none; transform:translate3d(0,calc(var(--stagger-y) + var(--drift-y)),0) rotate(calc(var(--stagger-r) + var(--drift-r))) scale(1); transform-origin:center; transition:transform .92s cubic-bezier(.16,.82,.18,1),filter .7s ease,opacity .7s ease; will-change:transform; }
.kinetic-card--portrait { width:clamp(300px,29vw,540px); height:clamp(440px,69vh,790px); }
.kinetic-card--standard { width:clamp(400px,41vw,760px); height:clamp(390px,63vh,740px); }
.kinetic-card:nth-child(4n+2) { margin-left:-1.8vw; }
.kinetic-card:nth-child(5n) { margin-left:1.5vw; }
.kinetic-card-media { position:relative; width:100%; height:100%; overflow:hidden; background:#171817; box-shadow:0 34px 110px rgba(0,0,0,.42); }
.kinetic-card-media::after { content:''; position:absolute; inset:0; border:1px solid rgba(255,255,255,.12); pointer-events:none; }
.kinetic-card img { width:100%; height:100%; object-fit:cover; filter:saturate(.76) contrast(.98) brightness(.83); transform:scale(1.045); transition:transform 1.2s cubic-bezier(.16,.82,.18,1),filter .85s ease; }
.kinetic-card.is-active img { filter:saturate(.94) contrast(1) brightness(.98); }
.kinetic-card figcaption { position:absolute; left:0; right:0; bottom:-36px; display:grid; grid-template-columns:34px minmax(0,1fr); gap:12px; padding-top:10px; border-top:1px solid rgba(238,233,223,.28); color:rgba(238,233,223,.54); font-size:8px; line-height:1.35; text-transform:uppercase; letter-spacing:.13em; opacity:0; transform:translateY(8px); transition:opacity .45s ease,transform .65s cubic-bezier(.16,.82,.18,1); }
.kinetic-card figcaption span:last-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kinetic-card:hover,.kinetic-card:focus-visible,.kinetic-card.is-held { z-index:8; transform:translate3d(0,var(--stagger-y),0) rotate(0deg) scale(1.115); }
.kinetic-card:hover img,.kinetic-card:focus-visible img,.kinetic-card.is-held img { filter:saturate(1) contrast(1) brightness(1); transform:scale(1); }
.kinetic-card:hover figcaption,.kinetic-card:focus-visible figcaption,.kinetic-card.is-held figcaption { opacity:1; transform:translateY(0); }
.project-gallery:has(.kinetic-card:hover) .kinetic-card:not(:hover),.project-gallery:has(.kinetic-card:focus-visible) .kinetic-card:not(:focus-visible) { opacity:.42; filter:brightness(.62); }
.kinetic-gallery-empty { display:grid; align-content:center; width:84vw; height:66vh; padding:8vw; border:1px solid rgba(238,233,223,.24); background:linear-gradient(135deg,rgba(238,233,223,.035),transparent 55%); }
.kinetic-gallery-empty > span,.kinetic-gallery-empty small { font-size:10px; text-transform:uppercase; letter-spacing:.14em; color:var(--muted); }
.kinetic-gallery-empty p { margin:7vh 0 3vh; font:400 clamp(76px,10vw,174px)/.72 var(--serif); letter-spacing:-.065em; }
.kinetic-gallery-empty em { font-weight:400; }
.project-footer { display:grid; place-items:center; min-height:76vh; padding:12vh 5vw; text-align:center; }
.project-footer p { margin:0 0 22px; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.14em; }
.project-footer a { font:400 clamp(70px,10vw,174px)/.8 var(--serif); letter-spacing:-.06em; text-decoration:none; }
.project-footer a em { display:block; font-weight:400; }
.project-footer-nav { display:flex; justify-content:center; gap:28px; margin-top:54px; font-size:9px; text-transform:uppercase; letter-spacing:.13em; }
.project-footer-nav a { padding-bottom:8px; border-bottom:1px solid rgba(238,233,223,.42); font:inherit; letter-spacing:inherit; }
.work-index { min-height:100vh; padding:18vh 4vw 10vh; background:var(--paper); color:var(--ink); }
.work-index-heading { display:grid; grid-template-columns:1fr 2fr; align-items:end; gap:4vw; padding-bottom:10vh; }
.work-index-heading p { margin:0; font-size:10px; text-transform:uppercase; letter-spacing:.14em; }
.work-index-heading h1 { margin:0; font:400 clamp(100px,15vw,250px)/.68 var(--serif); letter-spacing:-.07em; }
.work-section { padding:5vh 0 14vh; }
.work-section + .work-section { border-top:1px solid rgba(11,12,11,.22); }
.work-section-heading { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:4vh; font-size:10px; text-transform:uppercase; letter-spacing:.14em; }
.work-section-heading span:last-child { opacity:.48; }
.work-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:5vw 1.4vw; }
.work-card { grid-column:span 6; color:var(--ink); text-decoration:none; }
.work-card:nth-child(3n) { grid-column:3 / span 8; }
.work-card figure { margin:0; }
.work-card-image { height:68vh; overflow:hidden; background:#d7d1c6; }
.work-card img { width:100%; height:100%; object-fit:cover; transition:transform 1s cubic-bezier(.2,.7,.2,1); }
.work-card:hover img { transform:scale(1.025); }
.work-card figcaption { display:grid; grid-template-columns:48px 1fr auto; gap:12px; padding-top:14px; border-top:1px solid rgba(11,12,11,.32); font-size:10px; text-transform:uppercase; letter-spacing:.12em; }
.work-card figcaption em { font-style:normal; opacity:.48; }
.work-card--pending .work-card-image { display:grid; place-items:end start; padding:24px; color:var(--paper); background:radial-gradient(circle at 78% 18%,rgba(217,128,98,.22),transparent 26%),linear-gradient(145deg,#161816,#080908); }
.work-card--pending .work-card-image span { max-width:86%; font:400 clamp(44px,5.4vw,96px)/.82 var(--serif); letter-spacing:-.055em; }
.work-card--more .work-card-image { display:grid; place-items:center; background:transparent; border:1px solid rgba(11,12,11,.35); }
.work-card--more .work-card-image span { font:400 clamp(76px,9vw,150px)/1 var(--serif); letter-spacing:-.06em; }
.commercial-collective { padding-bottom: 5vh; }
.commercial-work-gallery {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-flow: dense;
  grid-auto-rows: 7vw;
  gap: 1.2vw;
}
.commercial-work-gallery-item {
  grid-column: span 4;
  grid-row: span 3;
  margin: 0;
  overflow: hidden;
  background: #cec8bd;
}
.commercial-work-gallery-item--wide { grid-column: span 8; grid-row: span 4; }
.commercial-work-gallery-item--portrait { grid-column: span 4; grid-row: span 6; }
.commercial-work-gallery img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.78);
  transform: scale(1.01);
  transition: transform 1.25s cubic-bezier(.2,.7,.2,1), filter .7s ease;
}
.commercial-work-gallery figure:hover img { transform: scale(1.045); filter: saturate(1); }
.commercial-work-gallery figure:nth-child(5n+1) img { object-position: 43% center; }
.commercial-work-gallery figure:nth-child(7n+3) img { object-position: 61% center; }
@media(max-width:760px){.project-header{padding:20px;grid-template-columns:1fr 1fr}.project-header>span{display:none}.project-hero-copy{left:20px;right:20px}.project-hero-copy h1{font-size:clamp(68px,20vw,112px);line-height:.72}.project-hero-copy h1 em{margin-left:8vw}.project-index{bottom:-36px}.project-intro{grid-template-columns:1fr;gap:28px;padding:12vh 20px}.project-intro-copy{grid-template-columns:1fr;margin-top:5vh}.kinetic-gallery-section{--gallery-scroll-height:360vh}.kinetic-gallery-section.is-empty{height:100svh;min-height:620px}.kinetic-gallery-viewport{min-height:560px}.kinetic-gallery-heading{top:8vh;left:20px;right:20px}.kinetic-gallery-heading p{gap:8px;font-size:8px}.kinetic-gallery-heading p em{display:none}.kinetic-gallery-heading div{font-size:8px}.kinetic-gallery-cue{left:20px;right:20px;bottom:4vh;gap:10px;font-size:7px}.kinetic-gallery-atmosphere{inset:-12%}.kinetic-backdrop{filter:blur(30px) saturate(.7) brightness(.32)}.project-gallery{top:16vh;height:69vh;gap:42px;padding:0 12vw 0 8vw}.kinetic-card,.kinetic-card--wide,.kinetic-card--standard{width:86vw;height:57vh}.kinetic-card--portrait{width:68vw;height:66vh}.kinetic-card:nth-child(n){margin-left:0}.kinetic-card figcaption{bottom:-30px;font-size:7px;opacity:.72;transform:none}.kinetic-card:hover,.kinetic-card:focus-visible,.kinetic-card.is-held{transform:translate3d(0,var(--stagger-y),0) rotate(0) scale(1.035)}.kinetic-gallery-empty{width:calc(100vw - 40px);height:62vh;padding:28px}.kinetic-gallery-empty p{font-size:clamp(58px,18vw,88px)}.project-footer{min-height:62vh}.project-footer-nav{flex-direction:column}.work-index{padding:15vh 20px 8vh}.work-index-heading{grid-template-columns:1fr;gap:30px;padding-bottom:5vh}.work-index-heading h1{font-size:clamp(82px,25vw,126px)}.work-section{padding:4vh 0 9vh}.work-grid{display:block}.work-card,.work-card:nth-child(3n){display:block;margin-bottom:52px}.work-card-image{height:58vh}.work-card--pending .work-card-image span{font-size:clamp(52px,16vw,78px)}.work-card figcaption{grid-template-columns:40px 1fr}.work-card figcaption em{display:none}.commercial-work-gallery{grid-template-columns:repeat(2,1fr);grid-auto-rows:28vw;gap:10px}.commercial-work-gallery-item{grid-column:span 2;grid-row:span 2}.commercial-work-gallery-item--wide{grid-column:span 2;grid-row:span 2}.commercial-work-gallery-item--portrait{grid-column:span 1;grid-row:span 3}.kinetic-gallery-section.is-static{padding:84px 20px 62px}.kinetic-gallery-section.is-static .kinetic-gallery-heading{margin-bottom:24px}.kinetic-gallery-section.is-static .kinetic-card,.kinetic-gallery-section.is-static .kinetic-card:nth-child(n){width:100%;height:58vh}.kinetic-gallery-section.is-static .kinetic-card--portrait{height:68vh}}
@media(prefers-reduced-motion:reduce){.kinetic-gallery-section{height:auto}.kinetic-gallery-viewport{position:relative;height:auto;padding:16vh 0 10vh;overflow:hidden}.kinetic-gallery-atmosphere,.kinetic-gallery-cue{display:none}.project-gallery{position:relative;top:auto;display:grid;grid-template-columns:1fr 1fr;gap:9vh 3vw;width:auto;height:auto;padding:0 4vw;transform:none!important}.kinetic-card,.kinetic-card:nth-child(n){width:auto;height:64vh;margin:0;transform:none;transition:none}.kinetic-card img{transition:none}.kinetic-card figcaption{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce) and (max-width:760px){.project-gallery{grid-template-columns:1fr}.kinetic-card,.kinetic-card:nth-child(n){height:64vh}}
@media(max-width:760px){.context-back{top:64px;left:20px;padding:9px 10px}.context-back span:last-child{display:none}}
