:root { --paper:#f2f0e9; --ink:#151513; --muted:#6f6d66; --line:#c5c1b7; --white:#faf9f5; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font:15px/1.5 "DM Sans",Arial,sans-serif; }
button,input { font:inherit; }
a { color:inherit; text-decoration:none; }
.film-progress { position:fixed; z-index:100; top:0; left:0; width:100%; height:2px; background:var(--ink); transform:scaleX(0); transform-origin:left center; pointer-events:none; }
.header { min-height:84px; display:flex; align-items:center; justify-content:space-between; padding:0 3vw; border-bottom:1px solid var(--line); }
.brand-lockup { width:76px; height:47px; display:inline-flex; align-items:center; justify-content:center; }
.brand-mark { display:block; width:76px; height:47px; object-fit:contain; }
nav { display:flex; gap:38px; }
nav a:hover,footer a:hover { text-decoration:underline; text-underline-offset:4px; }
.portal-link { margin:-8px 0; border:1px solid var(--line); padding:7px 13px; font-size:.78rem; letter-spacing:.02em; }
.portal-link:hover { border-color:var(--ink); text-decoration:none; }
.menu-button { display:none; background:none; border:0; padding:4px 0; }
.intro { min-height:calc(100svh - 84px); display:flex; flex-direction:column; justify-content:space-between; padding:5.5vh 3vw 4vh; }
.kicker,.label { margin:0; color:var(--muted); font-size:.72rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.intro h1 { width:min(100%,1560px); margin:auto; padding:5vh 0; font:400 clamp(4.5rem,8.8vw,9.8rem)/.88 "Newsreader",Georgia,serif; letter-spacing:-.045em; text-align:center; text-wrap:balance; }
.title-line { display:block; overflow:hidden; margin:-.14em 0 -.18em; padding:.14em 0 .18em; }
.title-line>span { display:block; }
.title-line-intro { margin:0 0 1.8rem; padding:0; font:600 clamp(.7rem,.85vw,.9rem)/1.2 "DM Sans",Arial,sans-serif; letter-spacing:.2em; text-transform:uppercase; }
.title-line-name>span { white-space:nowrap; }
.intro-foot { display:flex; align-items:flex-start; justify-content:space-between; gap:40px; border-top:1px solid var(--line); padding-top:18px; color:var(--muted); }
.intro-foot p { max-width:780px; margin:0; }
.scroll-cue { display:flex; align-items:center; gap:18px; white-space:nowrap; font-size:.78rem; letter-spacing:.04em; }
.scroll-line { width:54px; height:1px; background:currentColor; }
.page-ready .title-line>span { animation:title-reveal 1.15s cubic-bezier(.22,.75,.18,1) both; }
.page-ready .title-line:nth-child(1)>span { animation-delay:.08s; }
.page-ready .title-line:nth-child(2)>span { animation-delay:.22s; }
.page-ready .title-line:nth-child(3)>span { animation-delay:.36s; }
.page-ready .brand-lockup { animation:brand-reveal .9s cubic-bezier(.22,.75,.18,1) both; }
.page-ready .intro-foot { animation:intro-foot-reveal .9s cubic-bezier(.22,.75,.18,1) .68s both; }
.page-ready .scroll-cue { animation:intro-fade 1s ease-out 1.15s both; }
.page-ready .scroll-line { animation:line-reveal .9s cubic-bezier(.22,.75,.18,1) 1.28s both; }
@keyframes title-reveal { from { opacity:0; transform:translateY(108%); } to { opacity:1; transform:translateY(0); } }
@keyframes brand-reveal { from { opacity:0; transform:translateY(-8px); } to { opacity:1; transform:translateY(0); } }
@keyframes intro-foot-reveal { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }
@keyframes line-reveal { from { transform:scaleX(0); transform-origin:left; } to { transform:scaleX(1); transform-origin:left; } }
@keyframes intro-fade { from { opacity:0; } to { opacity:1; } }
.reveal-section { opacity:0; clip-path:inset(0 0 18% 0); transform:translateY(28px); }
.reveal-section.is-visible { animation:section-rise 1s cubic-bezier(.2,.72,.18,1) var(--reveal-delay,0ms) both; }
@keyframes section-rise { from { opacity:0; clip-path:inset(0 0 18% 0); transform:translateY(28px); } to { opacity:1; clip-path:inset(0); transform:translateY(0); } }
.work.reveal-work { opacity:1; clip-path:inset(0 0 100% 0); }
.work.reveal-work.is-visible { animation:frame-open 1.05s cubic-bezier(.76,0,.24,1) var(--reveal-delay,0ms) both; }
.work.reveal-work .poster-blank,.work.reveal-work .poster-art { transform:scale(1.035); transform-origin:center; }
.work.reveal-work.is-visible .poster-blank,.work.reveal-work.is-visible .poster-art { transition:transform 1.4s cubic-bezier(.2,.72,.18,1) calc(var(--reveal-delay,0ms) + 100ms); transform:scale(1); }
@keyframes frame-open { from { clip-path:inset(0 0 100% 0); } to { clip-path:inset(0); } }
.cinema { position:relative; height:840svh; background:#10100e; }
.cinema-sticky { position:sticky; top:0; height:100svh; overflow:hidden; background:#10100e; color:var(--white); }
.cinema-scenes { position:absolute; inset:0 0 64px; }
.cinema-scene { position:absolute; inset:0; }
.cinema-scene { visibility:hidden; display:grid; place-items:center; opacity:0; background:#10100e; pointer-events:none; }
.cinema-scene.is-active { visibility:visible; opacity:var(--scene-opacity,1); }
.cinema-intertitle { padding:8vw; }
.intertitle-copy { width:min(1180px,88vw); overflow:hidden; text-align:center; transform:translateY(var(--text-y,32px)); will-change:transform; }
.intertitle-copy p { margin:0 0 22px; color:#85847e; font-size:.68rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; }
.intertitle-copy h2 { margin:0; font:400 clamp(4rem,9.5vw,10rem)/.88 "Newsreader",Georgia,serif; letter-spacing:-.045em; }
.cinema-art-scene { overflow:hidden; }
.cinema-artwork { width:min(38vw,60.8svh,540px); max-width:calc(100vw - 12vw); height:auto; aspect-ratio:4/5; overflow:hidden; background:#e7e4dc; clip-path:inset(var(--art-inset-y,50%) var(--art-inset-x,10%)); transform:translateY(var(--art-y,45px)) scale(var(--art-scale,.92)); transform-origin:center; will-change:clip-path,transform; }
.cinema-artwork-wide { width:min(68vw,102svh,1040px); aspect-ratio:3/2; }
.cinema-artwork.has-artwork { width:auto; max-width:min(86vw,1200px); height:auto; max-height:76svh; aspect-ratio:auto; background:transparent; }
.cinema-artwork img { display:block; width:auto; height:auto; max-width:min(86vw,1200px); max-height:76svh; object-fit:contain; }
.cinema-final-scene .cinema-artwork { transform:translateY(var(--art-y,45px)) scale(var(--art-scale,.92)); }
.cinema-logo-scene { overflow:hidden; }
.cinema-signature { width:clamp(176px,20vw,352px); clip-path:inset(0 var(--logo-inset,100%) 0 0); opacity:var(--logo-opacity,0); transform:translateY(var(--logo-y,18px)) scale(var(--logo-scale,.96)); transform-origin:center; will-change:clip-path,opacity,transform; }
.cinema-signature img { display:block; width:100%; height:auto; filter:brightness(0) invert(1); opacity:.94; }
.cinema-controls { position:absolute; z-index:10; right:0; bottom:0; left:0; min-height:64px; display:grid; grid-template-columns:auto minmax(80px,1fr) auto; align-items:center; gap:24px; padding:0 3vw; border-top:1px solid #2e2e2a; background:#10100e; }
.cinema-control-label,.skip-story { color:#aaa79f; font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; white-space:nowrap; }
.skip-story { padding:6px 0; border-bottom:1px solid #686761; }
.skip-story:hover,.skip-story:focus-visible { border-color:var(--white); color:var(--white); outline:none; }
.cinema-rail { position:relative; height:1px; background:#363632; }
.cinema-rail span { display:block; width:100%; height:1px; background:#aaa79f; transform:scaleX(var(--cinema-progress,0)); transform-origin:left; }
.archive { padding:8rem 3vw; background:var(--white); }
.archive-head { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; margin-bottom:3rem; }
.archive-head h2 { margin:.2rem 0 0; font:400 clamp(2.7rem,5vw,5rem) "Newsreader",Georgia,serif; }
.archive-count { margin:0 0 8px; color:var(--muted); font-size:.78rem; }
.art-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.work { min-width:0; display:flex; flex-direction:column; overflow:hidden; margin:0; padding:0; color:inherit; font:inherit; text-align:left; background:none; border:0; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.work-open { cursor:pointer; }
.work-open:hover .poster-art img { opacity:.9; }
.poster-blank { position:relative; display:block; width:100%; aspect-ratio:4/5; border-bottom:1px solid var(--line); background:#ebe9e2; }
.poster-blank span { position:absolute; top:14px; left:14px; color:#8a8881; font-size:.69rem; letter-spacing:.09em; }
.poster-art { width:100%; aspect-ratio:4/5; overflow:hidden; border-bottom:1px solid var(--line); background:#ebe9e2; }
.poster-art img { display:block; width:100%; height:100%; object-fit:cover; }
.work-info { min-height:88px; display:flex; justify-content:space-between; gap:12px; padding:14px; }
.work-info span:first-child { min-width:0; }
.work-info strong,.work-info small { display:block; }
.work-info strong { font-size:.91rem; font-weight:500; }
.work-info small { margin-top:2px; color:var(--muted); font-size:.72rem; }
.work-info>small { margin-top:1px; }
.about,.contact { display:grid; grid-template-columns:1fr 3fr; gap:4vw; padding:9rem 3vw; border-bottom:1px solid var(--line); }
.about h2,.contact h2 { max-width:1100px; margin:0; font:400 clamp(3.4rem,6.6vw,7.1rem)/1 "Newsreader",Georgia,serif; letter-spacing:-.03em; text-wrap:balance; }
.about-text { max-width:900px; display:grid; grid-template-columns:minmax(0,.8fr) minmax(320px,1.2fr); gap:70px; margin:5rem 0 0 auto; color:var(--muted); }
.about-text p { margin:0; }
.about-statement { max-width:390px; }
.artist-facts { margin:0; border-top:1px solid var(--line); }
.artist-facts div { display:grid; grid-template-columns:95px 1fr; gap:24px; padding:13px 0; border-bottom:1px solid var(--line); }
.artist-facts dt { color:var(--ink); font-size:.68rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
.artist-facts dd { margin:0; }
.contact { background:var(--ink); color:var(--white); }
.contact .label { color:#9e9d97; }
.contact a { display:inline-block; margin-top:4.5rem; border-bottom:1px solid; padding-bottom:4px; font-size:1.1rem; }
footer { display:flex; justify-content:space-between; padding:28px 3vw; background:var(--ink); color:var(--white); border-top:1px solid #454540; }
.artwork-page { min-height:100svh; background:var(--white); }
.artwork-page-header { min-height:84px; display:flex; align-items:center; justify-content:space-between; padding:0 3vw; border-bottom:1px solid var(--line); }
.artwork-page-header>a:last-child,.artwork-back { border-bottom:1px solid currentColor; padding-bottom:2px; font-size:.78rem; }
.single-artwork { padding:34px 3vw 8rem; }
.artwork-back { display:inline-block; margin-bottom:34px; color:var(--muted); }
.single-artwork-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(300px,.65fr); min-height:calc(100svh - 190px); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.single-artwork-visual { min-width:0; display:grid; place-items:center; margin:0; padding:4vw; background:#e7e5de; }
.single-artwork-visual img { display:block; max-width:100%; max-height:76svh; width:auto; height:auto; object-fit:contain; }
.single-artwork-details { align-self:stretch; border-left:1px solid var(--line); padding:8vh 3vw 40px; }
.single-artwork-details h1 { margin:12px 0 50px; font:400 clamp(3.4rem,5.8vw,7rem)/.92 "Newsreader",Georgia,serif; letter-spacing:-.04em; overflow-wrap:anywhere; }
.single-artwork-details dl { margin:0; border-top:1px solid var(--line); }
.single-artwork-details dl div { display:grid; grid-template-columns:95px 1fr; gap:15px; padding:12px 0; border-bottom:1px solid var(--line); }
.single-artwork-details dt { color:var(--muted); font-size:.72rem; }
.single-artwork-details dd { margin:0; font-size:.8rem; }
.single-artwork-description { margin:42px 0 0; color:var(--muted); white-space:normal; }
.artwork-pagination { display:grid; grid-template-columns:1fr 1fr; margin-top:70px; border-top:1px solid var(--line); }
.artwork-pagination a { display:flex; flex-direction:column; min-height:150px; justify-content:center; padding:25px 0; }
.artwork-pagination a:last-child { align-items:flex-end; border-left:1px solid var(--line); padding-left:3vw; text-align:right; }
.artwork-pagination small { color:var(--muted); font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; }
.artwork-pagination span { margin-top:6px; font:400 clamp(1.8rem,3vw,3.4rem) "Newsreader",Georgia,serif; }
.artwork-not-found { min-height:calc(100svh - 76px); display:flex; flex-direction:column; align-items:flex-start; justify-content:center; padding:8vw; }
.artwork-not-found h1 { max-width:850px; margin:16px 0 38px; font:400 clamp(3.8rem,8vw,8rem)/.94 "Newsreader",Georgia,serif; }
.artwork-not-found a { border-bottom:1px solid; padding-bottom:3px; }
.artwork-viewer { width:min(1240px,94vw); height:min(820px,92svh); max-width:none; max-height:none; padding:0; border:1px solid #77746d; background:var(--paper); color:var(--ink); }
.artwork-viewer::backdrop { background:rgba(10,10,9,.78); }
.artwork-viewer[open] { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(320px,.75fr); }
.viewer-close { position:absolute; z-index:4; top:18px; right:20px; border:0; border-bottom:1px solid; background:var(--paper); padding:2px 0; color:var(--ink); cursor:pointer; }
.viewer-visual { min-width:0; padding:26px; background:#e5e3dc; }
.viewer-visual img { display:block; width:100%; height:100%; object-fit:contain; }
.viewer-details { overflow:auto; border-left:1px solid var(--line); padding:90px 34px 34px; }
.viewer-details h2 { margin:12px 0 38px; font:400 clamp(2.8rem,4.5vw,5rem)/.95 "Newsreader",Georgia,serif; }
.viewer-details dl { margin:0; border-top:1px solid var(--line); }
.viewer-details dl div { display:grid; grid-template-columns:95px 1fr; gap:15px; padding:11px 0; border-bottom:1px solid var(--line); }
.viewer-details dt { color:var(--muted); font-size:.72rem; }
.viewer-details dd { margin:0; font-size:.78rem; }
.viewer-description { margin:35px 0 0; color:var(--muted); white-space:pre-line; }
@media(max-width:980px) { .art-grid { grid-template-columns:repeat(3,1fr); } }
@media(max-width:680px) {
  .header { min-height:68px; padding:0 18px; position:relative; }
  .brand-lockup { width:58px; height:36px; }
  .brand-mark { width:58px; height:36px; }
  .menu-button { display:block; }
  nav { display:none; position:absolute; top:68px; left:0; right:0; padding:22px 18px; background:var(--paper); border-bottom:1px solid var(--line); }
  nav.open { display:grid; grid-template-columns:1fr 1fr; gap:18px 24px; }
  .portal-link { margin:-7px 0; text-align:center; }
  .intro { min-height:calc(100svh - 68px); padding:30px 18px 22px; }
  .intro h1 { width:100%; padding:5vh 0; font-size:clamp(2.75rem,12.4vw,4.8rem); line-height:.92; letter-spacing:-.045em; }
  .title-line-intro { margin-bottom:1.25rem; font-size:.65rem; letter-spacing:.18em; }
  .intro-foot { display:block; }
  .scroll-cue { margin-top:24px; }
  .cinema { height:770svh; }
  .cinema-intertitle { padding:18px; }
  .intertitle-copy { width:100%; }
  .intertitle-copy p { margin-bottom:18px; }
  .intertitle-copy h2 { font-size:clamp(3.6rem,16vw,5.4rem); line-height:.92; }
  .cinema-artwork,.cinema-artwork-wide { width:min(76vw,54.4svh,390px); max-width:calc(100vw - 36px); height:auto; aspect-ratio:4/5; }
  .cinema-artwork-wide { width:min(calc(100vw - 36px),87svh); aspect-ratio:3/2; }
  .cinema-artwork.has-artwork { width:auto; max-width:calc(100vw - 36px); height:auto; max-height:68svh; aspect-ratio:auto; }
  .cinema-artwork.has-artwork img { max-width:calc(100vw - 36px); max-height:68svh; }
  .cinema-signature { width:clamp(148px,45vw,220px); }
  .cinema-scenes { inset-bottom:62px; }
  .cinema-controls { min-height:62px; grid-template-columns:minmax(40px,1fr) auto; gap:16px; padding:0 18px; }
  .cinema-control-label { display:none; }
  .skip-story { font-size:.58rem; letter-spacing:.06em; }
  .archive { padding:5.5rem 18px; }
  .archive-head { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; }
  .archive-count { max-width:90px; margin:0 0 6px; text-align:right; }
  .art-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .work.reveal-work,.work.reveal-work.is-visible { opacity:1; clip-path:none; animation:none; }
  .work.reveal-work .poster-blank,.work.reveal-work.is-visible .poster-blank,.work.reveal-work .poster-art,.work.reveal-work.is-visible .poster-art { transform:none; transition:none; }
  .poster-blank span { top:7px; left:7px; font-size:.52rem; }
  .work-info { min-height:68px; display:block; padding:7px 5px; overflow:hidden; }
  .work-info strong { overflow:hidden; font-size:.6rem; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }
  .work-info small { overflow:hidden; margin-top:3px; font-size:.5rem; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }
  .work-info>small { display:none; }
  .about,.contact { display:block; padding:6rem 18px; }
  .about h2,.contact h2 { margin-top:2.5rem; font-size:clamp(2.75rem,13.5vw,4.25rem); line-height:1.02; }
  .about-text { display:block; margin-top:3rem; }
  .about-statement { max-width:100%; margin-bottom:32px !important; }
  .artist-facts div { grid-template-columns:78px 1fr; gap:14px; }
  footer { padding:22px 18px; }
  .artwork-page-header { min-height:68px; padding:0 18px; }
  .single-artwork { padding:24px 18px 5rem; }
  .artwork-back { margin-bottom:24px; }
  .single-artwork-grid { display:block; min-height:0; }
  .single-artwork-visual { min-height:60svh; padding:30px 14px; }
  .single-artwork-visual img { max-height:70svh; }
  .single-artwork-details { border-top:1px solid var(--line); border-left:0; padding:45px 0 50px; }
  .single-artwork-details h1 { margin-bottom:35px; font-size:clamp(3.5rem,15vw,5.2rem); }
  .single-artwork-description { margin-top:34px; }
  .artwork-pagination { margin-top:45px; }
  .artwork-pagination a { min-height:115px; }
  .artwork-pagination a:last-child { padding-left:18px; }
  .artwork-pagination span { font-size:1.55rem; }
  .artwork-not-found { min-height:calc(100svh - 68px); padding:18px; }
  .artwork-viewer { width:100vw; height:100svh; border:0; }
  .artwork-viewer[open] { display:block; overflow:auto; }
  .viewer-close { position:fixed; top:16px; right:18px; }
  .viewer-visual { height:58svh; padding:50px 18px 18px; }
  .viewer-details { border:0; border-top:1px solid var(--line); padding:30px 18px 45px; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .page-ready .brand-lockup,.page-ready .title-line>span,.page-ready .intro-foot,.page-ready .scroll-cue,.page-ready .scroll-line,.reveal-section,.reveal-section.is-visible,.work.reveal-work,.work.reveal-work.is-visible { opacity:1; clip-path:none; transform:none; animation:none; transition:none; }
  .cinema { height:auto; }
  .cinema-sticky { position:relative; height:auto; }
  .cinema-scenes { position:relative; inset:auto; }
  .cinema-scene { position:relative; display:none; min-height:88svh; visibility:visible; opacity:1 !important; }
  .cinema-scene:nth-child(1),.cinema-scene:nth-child(2) { display:grid; }
  .intertitle-copy,.cinema-artwork,.cinema-signature { clip-path:none; opacity:1; transform:none; }
  .cinema-controls { position:relative; grid-template-columns:1fr auto; }
  .cinema-rail { display:none; }
  .work.reveal-work .poster-blank,.work.reveal-work.is-visible .poster-blank,.work.reveal-work .poster-art,.work.reveal-work.is-visible .poster-art { transform:none; transition:none; }
}