:root{--paper:#f4f2ed;--ink:#11110f;--signal:#d8ff3e;--muted:#74736e;--line:rgba(17,17,15,.2)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif;font-size:16px;line-height:1.5}
img{display:block;width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
.site-header{position:fixed;z-index:20;top:0;left:0;width:100%;display:flex;justify-content:space-between;align-items:flex-start;padding:22px 28px;mix-blend-mode:difference;color:#fff}
.wordmark{display:inline-flex;flex-direction:column;font-weight:600;font-size:18px;line-height:.86;letter-spacing:-.05em;text-transform:uppercase}
nav{display:flex;gap:28px;font-size:13px;text-transform:uppercase;letter-spacing:.08em}
nav a{position:relative}
nav a:after{content:"";position:absolute;left:0;bottom:-4px;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .25s}
nav a:hover:after,nav a:focus-visible:after{transform:scaleX(1);transform-origin:left}
.menu-button{display:none;border:0;background:none;padding:0;text-transform:uppercase;font-size:13px}
.hero{min-height:100svh;display:grid;grid-template-columns:42% 58%;position:relative;overflow:hidden}
.hero-copy{padding:18vh 5vw 11vh 4vw;display:flex;flex-direction:column;justify-content:space-between;z-index:2}
.eyebrow,.index{font-size:12px;text-transform:uppercase;letter-spacing:.14em}
h1,h2{font-family:"Libre Caslon Display",serif;font-weight:400;letter-spacing:-.045em;line-height:.9;margin:0}
h1{font-size:clamp(4rem,8vw,9.5rem);white-space:nowrap}
h1 em,h2 em{font-weight:400}
.intro{max-width:29rem;font-size:clamp(1rem,1.35vw,1.3rem);margin:0}
.hero-image{margin:0;height:100svh;position:relative;background:#24241f}
.hero-image img{height:100%;object-fit:cover;filter:saturate(.88) contrast(1.03)}
.scroll-cue{position:absolute;left:4vw;bottom:28px;font-size:12px;text-transform:uppercase;letter-spacing:.1em;display:flex;gap:16px}
.section-heading{display:grid;grid-template-columns:10% 1fr auto;align-items:end;padding:110px 4vw 48px;border-bottom:1px solid var(--line)}
.section-heading h2{font-size:clamp(3rem,7vw,7.8rem)}
.section-heading .index{margin:0 0 10px}
.filters{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.filters button{border:1px solid var(--ink);background:transparent;border-radius:999px;padding:7px 13px;font-size:12px;cursor:pointer}
.filters button.active,.filters button:hover{background:var(--ink);color:var(--paper)}
.portfolio-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:10px;padding:10px}
.project{grid-column:span 4;border:0;padding:0;background:#ddd;position:relative;min-height:43vw;overflow:hidden;cursor:zoom-in;text-align:left}
.project-wide{grid-column:span 8}
.project-tall{min-height:58vw}
.project img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.2,.7,.2,1),filter .4s}
.project:hover img,.project:focus-visible img{transform:scale(1.025);filter:saturate(.75)}
.project[hidden]{display:none}
.practice{background:var(--ink);color:var(--paper);padding-bottom:10px}
.section-heading.inverse{border-color:rgba(244,242,237,.25);grid-template-columns:10% 1fr}
.practice-list{padding:0 4vw}
.practice-list article{display:grid;grid-template-columns:10% 36% 1fr;gap:20px;padding:28px 0;border-bottom:1px solid rgba(244,242,237,.25);align-items:baseline}
.practice-list article>span{font-size:11px;color:var(--signal)}
.practice-list h3{font-family:"Libre Caslon Display",serif;font-size:clamp(2rem,4vw,5rem);font-weight:400;margin:0}
.practice-list p{margin:0;max-width:31rem;color:#b6b5af}
.production-heading{display:grid;grid-template-columns:1fr auto;align-items:end;gap:30px;margin:90px 4vw 24px;padding-bottom:16px;border-bottom:1px solid rgba(244,242,237,.25)}
.production-heading p{margin:0}.production-heading p:first-child{font-family:"Libre Caslon Display",serif;font-size:clamp(2.7rem,5vw,6rem);line-height:.9}.production-heading p:last-child{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:#b6b5af;text-align:right}
.production-strip{display:grid;grid-template-columns:1.4fr 1fr;gap:10px;margin:0 10px}
.production-strip img{height:38vw;object-fit:cover;background:#222}
.about{padding-bottom:120px}
.about .section-heading{grid-template-columns:10% 1fr;padding-right:12vw}
.about-grid{display:grid;grid-template-columns:40% 1fr;gap:8vw;padding:70px 4vw 0 14%}
.about-grid figure{margin:0}.about-grid figure img{aspect-ratio:4/5;object-fit:cover;filter:grayscale(1)}
.bio{max-width:46rem;font-size:clamp(1.15rem,1.8vw,1.75rem);letter-spacing:-.02em}
.bio p{margin:0 0 1.4em}.bio p:first-child{font-family:"Libre Caslon Display",serif;font-size:1.5em;line-height:1.15}
.clients{margin:80px 4vw 0 14%;padding-top:30px;border-top:1px solid var(--line);max-width:82%;display:grid;grid-template-columns:22% 1fr;gap:10px 4vw}
.clients p{margin:0}.clients-label{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.contact{background:var(--signal);padding:90px 4vw 70px;min-height:75vh;display:flex;flex-direction:column;justify-content:space-between}
.contact h2{font-size:clamp(4rem,10vw,11rem);margin:30px 0}
.contact p{margin:0}
.contact-links{align-self:flex-end;display:flex;flex-direction:column;align-items:flex-end}
.contact a{border-bottom:1px solid;padding:10px 0;font-size:clamp(1.1rem,2vw,1.8rem)}
footer{display:flex;justify-content:space-between;align-items:flex-end;padding:35px 4vw;background:var(--ink);color:var(--paper);font-size:12px;text-transform:uppercase;letter-spacing:.08em}
footer p{margin:0}
.lightbox{width:100vw;height:100vh;max-width:none;max-height:none;border:0;padding:0;background:rgba(10,10,9,.96);color:#fff}
.lightbox[open]{display:grid;place-items:center}
.lightbox::backdrop{background:#000}
.lightbox img{max-width:88vw;max-height:84vh;width:auto;height:auto;object-fit:contain}
.lightbox-close{position:fixed;top:22px;right:24px;border:0;background:none;color:white;text-transform:uppercase;font-size:12px;cursor:pointer;z-index:2}
@media(max-width:760px){.site-header{padding:18px}.menu-button{display:block}nav{display:none;position:absolute;top:50px;right:18px;flex-direction:column;align-items:flex-end;gap:15px}nav.open{display:flex}.hero{grid-template-columns:1fr;min-height:auto}.hero-copy{position:absolute;inset:0;color:#fff;padding:18vh 18px 15vh;text-shadow:0 1px 15px rgba(0,0,0,.18)}h1{font-size:clamp(3.7rem,18vw,6rem);white-space:normal}.intro{font-size:1rem;max-width:20rem}.hero-image{height:100svh}.hero-image img{filter:brightness(.68) saturate(.8)}.scroll-cue{color:#fff;left:18px}.section-heading{grid-template-columns:40px 1fr;padding:85px 18px 30px}.section-heading h2{font-size:3.5rem}.filters{grid-column:2;margin-top:26px;justify-content:flex-start}.portfolio-grid{grid-template-columns:1fr;gap:6px;padding:6px}.project,.project-wide{grid-column:auto;min-height:128vw}.project-wide{min-height:72vw}.practice-list{padding:0 18px}.practice-list article{grid-template-columns:32px 1fr;padding:25px 0}.practice-list p{grid-column:2}.production-strip{grid-template-columns:1fr;margin-top:55px}.production-strip img{height:70vw}.about .section-heading{grid-template-columns:40px 1fr;padding-right:18px}.about-grid{grid-template-columns:1fr;padding:40px 18px 0;gap:40px}.about{padding-bottom:70px}.bio{font-size:1.08rem}.clients{margin:50px 18px 0;max-width:none;grid-template-columns:1fr;gap:10px}.clients .clients-label:not(:first-child){margin-top:24px}.contact{padding:70px 18px 35px;min-height:68vh}.contact h2{font-size:18vw}.contact-links{align-self:flex-start;align-items:flex-start;margin-top:60px}.contact a{font-size:1rem}footer{padding:30px 18px;display:grid;grid-template-columns:1fr 1fr;gap:30px}footer p:last-child{grid-column:1/-1}.lightbox img{max-width:94vw;max-height:80vh}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.project img,.project span{transition:none}}
@media(max-width:760px){.production-heading{grid-template-columns:1fr;margin:55px 18px 20px}.production-heading p:last-child{text-align:left}.production-strip{margin-top:0}}