@font-face{font-family:Caslon;src:url('/assets/libre-caslon.woff2') format('woff2');font-display:swap}
@font-face{font-family:DM;src:url('/assets/dm-sans.woff2') format('woff2');font-display:swap}
:root{--ink:#1b211c;--cream:#ede9df;--paper:#f6f3eb;--rust:#a8553b;--line:#bdbbb1;--serif:Caslon,Georgia,serif;--sans:DM,Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--sans)}
img{display:block;width:100%;height:auto}
a{color:inherit}
::selection{background:#d7a788;color:#151915}
a:focus-visible{outline:2px solid #db7852;outline-offset:5px}
.skip{position:fixed;left:1rem;top:-5rem;z-index:100;background:#fff;color:#111;padding:1rem}
.skip:focus{top:1rem}
.masthead{height:70px;position:absolute;inset:0 0 auto;z-index:4;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 4.1vw;border-bottom:1px solid #ffffff65;font-size:10px;letter-spacing:.14em}
.brand{font-weight:800;font-size:17px;letter-spacing:.08em;text-decoration:none}
.masthead-center{position:absolute;left:50%;transform:translateX(-50%)}
.masthead-center span{opacity:.6}
.header-link{text-decoration:none}
.progress{position:fixed;top:0;left:0;width:100%;height:2px;z-index:9;pointer-events:none}
.progress span{display:block;height:100%;width:100%;transform-origin:left;transform:scaleX(0);background:#d77f56}
.hero{height:110svh;min-height:680px;background:#171a16;color:#fff;position:relative}
.hero-sticky{position:sticky;top:0;height:100svh;min-height:620px;overflow:hidden}
.hero-picture,.hero-shade{position:absolute;inset:0}
.hero-picture{transform:scale(calc(1.02 + var(--p,0)*.035))}
.hero-picture img{height:100%;object-fit:cover;object-position:center 50%}
.hero-shade{background:linear-gradient(90deg,#0c120eaa,#0c120e1a 78%),linear-gradient(0deg,#0c120e77,transparent 44%)}
.hero-content{position:absolute;inset:0;padding:clamp(130px,18vh,200px) 7vw 6vh;display:flex;flex-direction:column;justify-content:space-between}
.eyebrow,.overline{font-size:10px;letter-spacing:.16em;font-weight:700;line-height:1.5}
.light{color:#fff}
.hero h1,.intro h2,.chapter h2,.screen-title h2,.library h2,.closing h2{font-family:var(--serif);font-weight:400;letter-spacing:-.06em;line-height:.96;margin:0}
.hero h1{font-size:clamp(82px,12.5vw,180px);margin:auto 0}
.hero em,.screen-title em,.closing em{font-weight:400;color:#dcc6ad}
.hero-bottom{display:flex;align-items:end;justify-content:space-between;gap:2rem}
.hero-bottom p{font-family:var(--serif);font-size:clamp(17px,1.4vw,21px);line-height:1.5;margin:0}
.scroll-cue{font-size:9px;letter-spacing:.12em;text-decoration:none;display:flex;align-items:center;gap:1rem}
.icon-arrow{display:inline-block;width:1.1em;height:1.1em;vertical-align:-.15em;flex:none}
.scroll-cue .icon-arrow{width:24px;height:24px}
.section-pad{padding-left:7vw;padding-right:7vw}
.intro{padding-top:clamp(72px,8vw,115px);padding-bottom:clamp(72px,8vw,115px);background:var(--paper)}
.intro-main{display:grid;grid-template-columns:1fr 2fr;column-gap:5vw}
.intro-main h2{font-size:clamp(54px,7vw,100px);grid-column:2}
.intro h2 em,.chapter h2 em,.library h2 em{color:var(--rust)}
.intro-copy{grid-column:2;margin-top:30px;max-width:650px}
.intro-copy p,.essay p:not(.overline),.screen-copy p:not(.overline),.library-text p:not(.project-credit){font-family:var(--serif);font-size:clamp(17px,1.35vw,20px);line-height:1.65;margin:0}
.intro-bottom{margin-top:55px;display:grid;grid-template-columns:1fr 2fr;gap:5vw;font-size:10px;letter-spacing:.12em;font-weight:700}
.intro-bottom nav{border-top:1px solid var(--ink)}
.intro-bottom nav a{display:flex;gap:1.5rem;align-items:center;padding:16px 0;border-bottom:1px solid var(--line);font:400 clamp(19px,2vw,28px) var(--serif);letter-spacing:-.02em;text-decoration:none}
.intro-bottom i{font:normal 10px var(--sans);letter-spacing:.1em;color:var(--rust)}
.intro-bottom .icon-arrow{width:20px;height:20px;margin-left:auto;transition:transform .2s}
.intro-bottom nav a:hover .icon-arrow{transform:translate(3px,-3px)}
.chapter{background:#d7d2c6}
.chapter-heading{padding-top:clamp(65px,7vw,105px);padding-bottom:clamp(42px,5vw,72px)}
.overline{margin:0 0 28px}
.chapter h2,.library h2{font-size:clamp(60px,8.5vw,125px)}
.photo-bleed{margin:0}
.image-window{height:clamp(480px,68vw,900px);overflow:hidden}
.image-window img{height:106%;object-fit:cover;object-position:center 56%;transform:translateY(calc(var(--p,0)*-3%))}
.wide-photo figcaption{max-width:780px;padding:18px 7vw 0;font-size:12px;line-height:1.6}
.essay{display:grid;grid-template-columns:1fr 2fr;gap:5vw;padding-top:55px;padding-bottom:clamp(70px,8vw,115px)}
.essay>div{max-width:650px}
.story-link{display:inline-flex;align-items:center;gap:.8rem;margin-top:25px;font:600 12px/1.6 var(--sans);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:5px}
.screen-section{background:#202620;color:#f2eee4}
.screen-picture{height:88svh;min-height:560px;position:relative;overflow:hidden}
.screen-picture img{position:absolute;inset:-3% 0;width:100%;height:106%;object-fit:cover;object-position:center 43%;transform:translateY(calc(var(--p,0)*-2%))}
.screen-overlay{position:absolute;inset:0;background:linear-gradient(90deg,#101710a6,#1017100a 80%),linear-gradient(0deg,#10171050,transparent 50%)}
.screen-title{position:absolute;inset:auto 7vw 7vw}
.screen-title h2{font-size:clamp(60px,8vw,120px)}
.screen-copy{display:grid;grid-template-columns:1fr 2fr;gap:5vw;padding-top:clamp(55px,6vw,85px);padding-bottom:clamp(70px,8vw,115px)}
.screen-copy>div{max-width:650px}
.library{background:var(--paper);padding-top:clamp(70px,8vw,115px);padding-bottom:clamp(80px,9vw,130px)}
.library-header{margin-bottom:clamp(42px,5vw,70px)}
.library-grid{display:grid;grid-template-columns:1.4fr .7fr;gap:8vw;align-items:center}
.library-photo{margin:0}
.library-photo img{aspect-ratio:3/4;object-fit:cover;object-position:center 50%}
.library-photo figcaption{font-size:12px;line-height:1.6;margin-top:16px}
.library-text h3{font:400 clamp(32px,3.5vw,50px)/1.1 var(--serif);letter-spacing:-.04em;margin:0 0 25px}
.project-credit{margin:35px 0 0;padding-top:22px;border-top:1px solid var(--line);font:12px/1.8 var(--sans)}
.project-credit a{text-underline-offset:4px}
.closing{background:#a3523d;color:#fff}
.closing-inner{padding-top:clamp(75px,9vw,130px);padding-bottom:clamp(75px,9vw,130px)}
.closing h2{font-size:clamp(60px,8vw,120px)}
.closing-inner>p:not(.overline){font:clamp(19px,1.8vw,25px)/1.5 var(--serif);max-width:580px;margin:32px 0 45px}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;max-width:800px;border-top:1px solid #ffffff80;padding-top:28px}
.contact-grid div{display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-width:0}
.contact-grid span{font-size:10px;letter-spacing:.12em;margin-bottom:10px}
.contact-grid strong{font:400 26px var(--serif)}
.contact-grid small{font-size:12px}
.contact-grid a,.phone{font-size:12px;text-decoration:none;border-bottom:1px solid #ffffff88;padding-bottom:4px;overflow-wrap:anywhere}
.contact-grid .icon-arrow{margin-left:.4rem}
.phone{display:inline-block;margin-top:35px;font-size:16px}
.footer{background:#191e19;color:#e9e6dc;display:grid;grid-template-columns:1fr 1fr auto;gap:6vw;padding:50px 7vw;font-size:11px;line-height:1.6}
.footer-brand{font-size:18px;font-weight:800;letter-spacing:.1em;text-decoration:none}
.footer p{max-width:400px;color:#c1c4bb}
.footer>span{font-size:9px;letter-spacing:.15em}
.footer div:nth-child(2) a{display:inline-block;margin-top:15px;font-size:9px;letter-spacing:.12em;text-decoration:none}
.reveal{opacity:1;transform:none}
@media(max-width:800px){
  .masthead{height:62px}.masthead-center{display:none}
  .hero{height:100svh;min-height:620px}.hero-sticky{height:100%;min-height:0;position:relative}
  .hero-content{padding:115px 6vw 6vh}.hero h1{font-size:clamp(76px,16vw,130px)}
  .hero-picture,.image-window img,.screen-picture img{transform:none}
  .hero-bottom p{max-width:230px}
  .section-pad{padding-left:6vw;padding-right:6vw}
  .intro-main,.intro-bottom{grid-template-columns:1fr}
  .intro-main h2,.intro-copy{grid-column:auto}.intro-main .overline{margin-bottom:20px}.intro-bottom{gap:22px}
  .image-window{height:72svh;min-height:440px}.image-window img{height:100%}
  .essay,.screen-copy{grid-template-columns:1fr 2fr;gap:30px}
  .screen-picture{height:80svh;min-height:520px}
  .library-grid{gap:5vw}
  .footer{grid-template-columns:1fr 1fr}.footer>span{grid-column:1/-1}
}
@media(max-width:560px){
  .hero h1{font-size:clamp(72px,18vw,100px)}
  .hero-bottom{align-items:start;flex-direction:column;gap:24px}.hero-bottom p{font-size:17px}.scroll-cue{font-size:9px}
  .intro h2,.chapter h2,.library h2,.screen-title h2,.closing h2{font-size:clamp(51px,12.5vw,72px)}
  .essay,.screen-copy{grid-template-columns:1fr;gap:10px}.essay{padding-top:38px}
  .essay .overline,.screen-copy .overline{margin-bottom:12px}
  .screen-title{inset:auto 6vw 9vw}
  .library-grid{grid-template-columns:1fr;gap:35px}.library-text{max-width:500px}
  .contact-grid{grid-template-columns:1fr;gap:32px}
  .footer{grid-template-columns:1fr;gap:20px}.footer>span{grid-column:auto}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .hero{height:100svh}.hero-sticky{position:relative;height:100%}
  .hero-picture,.image-window img,.screen-picture img{transform:none!important}
}
