.edition {
  --edition-bg: #131310;
  --edition-border: #decb9a3b;
  --edition-muted: #c4bfb3;
  background: var(--edition-bg);
}
.archive-masthead { padding-block: clamp(48px,7vw,100px) clamp(32px,5vw,69px); }
.archive-meta { display: flex; justify-content: space-between; gap: 20px; border-top: 1px solid var(--edition-border); padding-top: 13px; color: var(--gold); }
.edition .screening-head { grid-template-columns: minmax(0,1.65fr) minmax(240px,.75fr); padding-block: clamp(32px,5vw,75px) 27px; }
.edition .screening-head h2 { font-size: clamp(54px,8.3vw,131px); line-height: .94; letter-spacing: -.077em; }
.edition .screening-head>div { justify-self: start; max-width: 365px; }
.archive-index { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); border-block: 1px solid var(--edition-border); }
.archive-index a {
  display: grid;
  grid-template-columns: 60px auto 1fr auto;
  align-items: center;
  gap: clamp(8px,1.1vw,18px);
  padding: 13px clamp(10px,1.7vw,23px);
  transition: background-color .2s, color .2s;
}
.archive-index a + a { border-left: 1px solid var(--edition-border); }
.archive-index a:hover, .archive-index a:focus-visible { background: #2a261d; color: var(--gold); }
.archive-index img { width: 60px; height: 43px; object-fit: cover; }
.archive-index strong { display: block; font-size: 15px; line-height: 1.2; }
.archive-index small { display: block; margin-top: 4px; font-size: 11px; color: var(--edition-muted); }
.archive-index-number, .case-topline { font-size: 10px; letter-spacing: .12em; color: var(--gold); font-weight: 700; }
.case-film { scroll-margin-top: 54px; }
.case-film + .case-film { border-top: 1px solid var(--edition-border); }
.edition .scene-step { min-height: max(450px,73svh); border-bottom: 0; }
.edition .scene-step .scene-visual::after { background: linear-gradient(90deg,#11100ed1,#11100e14 78%),linear-gradient(0deg,#11100edb,transparent 65%); }
.edition .case-film:nth-child(n+2) .scene-visual img { scale: 1.14; }
.edition .scene-copy { align-self: stretch; display: flex; flex-direction: column; justify-content: flex-end; padding-block: 108px clamp(32px,5.5vw,84px); }
.case-topline { position: absolute; inset: clamp(27px,4vw,62px) 0 auto; border-top: 1px solid #e9d6a78a; display: flex; justify-content: space-between; gap: 12px; padding-top: 11px; }
.edition .scene-copy .case-category { color: #ebd9af; font-weight: 650; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; }
.edition .scene-copy h3 { margin-block: 9px 20px; font-size: clamp(50px,8vw,119px); line-height: .93; text-wrap: balance; }
.edition .film-link { align-self: flex-start; margin-top: 0; gap: 12px; padding: 11px 13px; }
.edition .film-link small { padding-left: 11px; border-left: 1px solid currentColor; font-weight: 500; font-size: 11px; }
.case-dossier { padding-block: clamp(38px,6.5vw,95px); }
.dossier-copy { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.7fr); gap: clamp(20px,7vw,110px); align-items: start; margin-bottom: clamp(28px,4.5vw,58px); }
.dossier-copy h4 { font-size: clamp(29px,4vw,59px); margin: 8px 0 13px; }
.dossier-copy p:not(.kicker) { color: var(--edition-muted); font-size: 17px; max-width: 560px; }
.case-label { color: var(--gold); }
.dossier-copy dl, .production-brief dl { margin: 0; }
.dossier-copy dl>div, .production-brief dl>div { padding-block: 10px; border-top: 1px solid var(--edition-border); }
.dossier-copy dt, .production-brief dt { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--gold); }
.dossier-copy dd, .production-brief dd { margin: 3px 0 0; color: var(--edition-muted); font-size: 14px; }
.frame-grid { display: grid; grid-template-columns: 1.23fr 1fr; gap: clamp(10px,2vw,29px); }
.frame-grid figure { min-width: 0; }
.frame-grid img { width: 100%; height: auto; aspect-ratio: 1.91; object-fit: cover; border: 1px solid #e2d1aa52; }
.frame-grid figcaption { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; border-color: var(--edition-border); color: var(--edition-muted); font-size: 10px; }
.frame-grid figcaption span { color: var(--gold); }
.edition .screening-footer { border-top: 1px solid var(--edition-border); }
.production-brief { margin-top: clamp(28px,5vw,74px); background: #201d17; color: var(--ivory); padding: clamp(22px,5vw,72px); display: grid; grid-template-columns: 1fr .85fr; gap: clamp(23px,6vw,92px); align-items: end; }
.production-brief .kicker { color: var(--gold); }
.production-brief h3 { font-size: clamp(36px,5.2vw,78px); margin-block: 10px 15px; }
.production-brief p:not(.kicker) { color: #d0c7b6; max-width: 420px; }
.production-brief dl>div { border-color: #decb9a3b; }
.production-brief dd { color: #d0c7b6; }
@media(min-width:801px) {
  .edition.scene-motion .scene-step { min-height: max(490px,83svh); }
  .edition.scene-motion .scene-visual { height: max(440px,calc(77svh - 52px)); }
}
@media(max-width:850px) {
  .archive-index a { grid-template-columns: auto 1fr auto; }
  .archive-index img { display: none; }
}
@media(max-width:680px) {
  .edition .screening-head, .dossier-copy, .production-brief { grid-template-columns: 1fr; gap: 19px; }
  .archive-meta p { font-size: 9px; }
  .archive-index { grid-template-columns: 1fr; }
  .archive-index img { display: block; }
  .archive-index a { grid-template-columns: 52px auto 1fr auto; gap: 11px; padding: 8px 0; }
  .archive-index img { width: 52px; height: 34px; }
  .archive-index a+a { border-left: 0; border-top: 1px solid var(--edition-border); }
  .edition .scene-step { min-height: max(350px,58svh); }
  .edition .scene-copy h3 { font-size: clamp(44px,10vw,64px); }
  .case-film { scroll-margin-top: 46px; }
  .dossier-copy p:not(.kicker) { font-size: 16px; }
  .frame-grid { grid-template-columns: 1fr; gap: 15px; }
}
@media(prefers-reduced-motion:reduce) { .archive-index a { transition: none; } }
.frame-zoom { display: block; position: relative; }
.frame-zoom span { position: absolute; bottom: 10px; right: 10px; display: grid; place-items: center; width: 35px; height: 35px; border: 1px solid #f0ddac9e; background: #151310d6; color: var(--ivory); font-size: 20px; }
.frame-zoom:hover span { background: var(--gold); color: var(--black); }
#frame-viewer { width: min(1150px,calc(100% - 32px)); }
#frame-viewer img { width: 100%; max-height: 76svh; object-fit: contain; }
