@font-face{font-family:'Commune';src:url('assets/fonts/Commune-Nuit-Debout.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Bagnard';src:url('assets/fonts/Bagnard.otf') format('opentype');font-style:normal;font-weight:400;font-display:swap}
:root{--display:'Commune','Arial Narrow',sans-serif;--serif:'Bagnard',Georgia,serif}
body{font-synthesis:none}.site-nav .nav-brand{font-weight:400;font-size:37px;letter-spacing:.015em}.site-nav .nav-brand span{font-size:7px}.title-composition,.cinema-mode .title-composition{align-items:flex-start;padding:0 8vw 2vh}.title-composition h1{font-family:var(--display);font-weight:400;font-size:35vw;line-height:.8;letter-spacing:.01em;margin:0;white-space:nowrap}.title-composition h1 span{margin-left:.055em}.title-composition p{font:400 10px/1.8 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--paper);margin:35px 0 0 2px;text-shadow:none}.story h2,.cinema-mode .story h2{font-family:var(--serif);font-size:clamp(58px,8.5vw,130px);line-height:1.08;letter-spacing:-.025em}.story h2 em,.credits h2 em{font-style:normal;font-weight:400;color:inherit}.story .synopsis,.cinema-mode .synopsis{font:400 clamp(12px,1.1vw,16px)/1.85 var(--mono);letter-spacing:-.025em;max-width:620px}.story-bottom{align-items:end}.film-copy h2,.cinema-mode .film-copy h2{font-family:var(--display);font-weight:400;font-size:clamp(65px,11vw,155px);letter-spacing:.02em;line-height:.9}.film-byline,.cinema-mode .film-byline{font:400 9px/1.8 var(--mono);text-transform:uppercase;letter-spacing:.05em;color:var(--paper);margin-top:25px;margin-bottom:40px}.cast>p,.cinema-mode .cast>p{font:400 clamp(25px,2.8vw,39px)/1.4 var(--serif);letter-spacing:0}.credits h2,.cinema-mode .credits h2{font-family:var(--serif);font-size:clamp(48px,6.2vw,92px);line-height:1.12;letter-spacing:-.025em}.credit-grid dd,.cinema-mode .credit-grid dd{font-family:var(--serif);font-size:clamp(20px,1.8vw,26px);letter-spacing:0;line-height:1.35}.footer-title{font:400 22vw/.9 var(--display);letter-spacing:.015em}.type-credit{display:block;opacity:.65;font-size:7px;margin-top:12px;text-transform:none;line-height:1.7}
@media(max-width:700px){.site-nav .nav-brand{font-size:29px;letter-spacing:.02em}.site-nav .nav-brand span{font-size:6px}.title-composition,.cinema-mode .title-composition{padding:0 6vw 1vh}.title-composition h1{font-size:37vw}.title-composition p{font-size:8px;letter-spacing:.06em;margin-top:26px}.story h2,.cinema-mode .story h2{font-size:12vw;line-height:1.12;letter-spacing:-.02em}.story .synopsis,.cinema-mode .synopsis{font-size:12px;line-height:1.85}.film-copy h2,.cinema-mode .film-copy h2{font-size:15vw;letter-spacing:.01em}.film-byline,.cinema-mode .film-byline{font-size:8px;margin-top:18px;margin-bottom:30px}.cast>p,.cinema-mode .cast>p{font-size:22px;line-height:1.45}.credits h2,.cinema-mode .credits h2{font-size:10.6vw;line-height:1.15}.credit-grid dd,.cinema-mode .credit-grid dd{font-size:20px;line-height:1.4}.footer-title{font-size:27vw}.type-credit{font-size:6px;max-width:180px}}
@media(min-width:701px) and (min-height:651px){.cinema-mode .title-composition{padding-top:100px;padding-bottom:0}}
/* Title mark follows the actual film poster instead of a font approximation. */
.poster-title{display:block;width:100%;height:auto}.site-nav .nav-brand{justify-content:center;gap:9px;padding-top:12px;padding-bottom:10px}.site-nav .nav-brand .poster-title{width:112px;max-width:100%;height:auto}.site-nav .nav-brand:hover .poster-title,.site-nav .nav-brand[aria-current="location"] .poster-title{filter:drop-shadow(0 0 1px #3a2717)}.title-composition,.cinema-mode .title-composition{align-items:flex-start;padding:0 7vw}.title-composition h1{font-size:inherit;line-height:1;margin:0;width:min(86vw,1080px);letter-spacing:0;white-space:normal}.title-composition h1 .poster-title{width:100%;height:auto}.title-composition p{margin-top:36px;margin-left:7px}.film-copy h2,.cinema-mode .film-copy h2{font-size:inherit;line-height:1;width:min(100%,520px)}.film-byline,.cinema-mode .film-byline{margin-top:26px}.footer-title{font-size:inherit;line-height:1;gap:40px}.footer-title .poster-title{width:min(73vw,900px)}.footer-title>span{font:400 7vw var(--serif)}
@media(max-width:700px){.site-nav .nav-brand{padding-top:13px;padding-bottom:12px;gap:8px}.site-nav .nav-brand .poster-title{width:90px}.title-composition,.cinema-mode .title-composition{padding:0 5vw}.title-composition h1{width:90vw}.title-composition p{font-size:7px;margin-top:25px;margin-left:5px}.film-copy h2,.cinema-mode .film-copy h2{width:100%}.film-byline,.cinema-mode .film-byline{margin-top:22px}.footer-title{gap:20px}}
.site-nav .nav-brand:hover,.site-nav .nav-brand[aria-current="location"]{background:#0b100e;color:var(--paper)}.site-nav .nav-brand:hover .poster-title,.site-nav .nav-brand[aria-current="location"] .poster-title{filter:none}

/* A lower, centered title leaves the action in the main frame unobstructed. */
.title-composition,.cinema-mode .title-composition{inset:auto 0 clamp(90px,11svh,130px);align-items:center;justify-content:flex-end;padding:0 5vw;text-align:center}
.title-composition h1{width:min(52vw,660px)}
.title-composition p{margin:20px 0 0;font-size:11px;line-height:1.8;letter-spacing:.23em;text-align:center;text-shadow:0 2px 7px #120c08}
@media(max-width:700px){.title-composition,.cinema-mode .title-composition{bottom:95px;padding:0 5vw}.title-composition h1{width:74vw}.title-composition p{margin:18px 0 0;font-size:9px;letter-spacing:.18em}}

/* Feathered lower shading improves contrast without a panel over the film. */
.opening{isolation:isolate}
.opening:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,transparent 47%,rgba(14,10,7,.04) 62%,rgba(14,10,7,.24) 82%,rgba(14,10,7,.38) 100%)}
