/* Focused film pages. The opening frame remains still until the visitor plays. */
[hidden] { display: none !important; }
.film-collection main, .film-screening main { padding: 0; }
.film-eyebrow { color: var(--champ); font: 500 11px/1.5 var(--sans); letter-spacing: .2em; text-transform: uppercase; }
.film-collection .nav [aria-current="page"] { color: var(--champ); }
.collection { max-width: 1350px; margin: 0 auto; padding: calc(var(--hdr) + 80px) var(--gut) 40px; }
.collection-intro { margin-bottom: 62px; text-align: center; }
.collection-intro h1 { margin-top: 16px; font: 500 clamp(46px, 6vw, 84px)/1.05 var(--serif); letter-spacing: -.02em; }
.collection-intro > p:last-child { margin-top: 22px; color: var(--ash-light); font-size: 14px; }
.collection-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 64px 34px; }
.collection-card { min-width: 0; }
.collection-poster { position: relative; display: block; aspect-ratio: 9 / 16; background: var(--ink); box-shadow: 0 18px 40px -24px #000; transition: box-shadow .4s, transform .4s var(--ease); }
.collection-poster > img { display: block; width: 100%; height: 100%; object-fit: contain; }
.collection-poster:hover { transform: translateY(-4px); box-shadow: 0 24px 50px -24px #000; }
.collection-watch { position: absolute; left: 18px; bottom: 20px; display: inline-flex; align-items: center; gap: 12px; padding: 12px 16px; min-height: 44px; background: rgba(14, 14, 14, .8); color: var(--bone); font-size: 11px; letter-spacing: .06em; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.collection-watch svg { fill: var(--champ); }
.collection-caption { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding-top: 22px; }
.collection-caption h2 { font: 500 clamp(23px, 2.3vw, 31px)/1.12 var(--serif); }
.collection-caption h2 a:hover { color: var(--champ); }
.collection-caption p { margin-top: 9px; color: var(--ash-light); font-size: 12px; }
.film-share-icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 44px; width: 44px; height: 44px; margin-top: -8px; background: none; color: var(--champ); border: 1px solid transparent; cursor: pointer; }
.film-share-icon:hover { border-color: var(--champ-a); }
.collection-empty { text-align: center; padding: 70px 0; color: var(--ash-light); }
.collection-end { display: flex; flex-direction: column; align-items: center; gap: 24px; padding-top: 110px; }
.collection-end p { font: 500 38px/1.1 var(--serif); }

.screening { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1fr); align-items: center; gap: clamp(60px, 8vw, 120px); max-width: 1180px; margin: 0 auto; padding: calc(var(--hdr) + 60px) var(--gut) 40px; }
.screening-player { width: 100%; max-width: 390px; justify-self: center; }
.screening-frame { position: relative; aspect-ratio: 9 / 16; background: #070707; box-shadow: 0 0 0 1px rgba(220, 203, 166, .2), 0 32px 70px -28px #000; }
.screening-video { display: block; width: 100%; height: 100%; object-fit: contain; }
.screening-start { position: absolute; left: 50%; bottom: 14%; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; gap: 14px; min-width: 150px; min-height: 52px; padding: 16px 24px; border: 1px solid rgba(242, 239, 233, .22); background: rgba(14, 14, 14, .82); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); color: var(--bone); font-size: 12px; letter-spacing: .06em; cursor: pointer; transition: color .2s, background .2s; }
.screening-start svg { flex: 0 0 16px; fill: var(--champ); }
.screening-start:hover { background: var(--champ); color: var(--charcoal); }
.screening-start:hover svg { fill: currentColor; }
.screening-play-note { margin-top: 17px; text-align: center; color: var(--ash-light); font-size: 11px; letter-spacing: .04em; }
.screening-play-error { margin-top: 12px; font-size: 12px; color: var(--bone-soft); }
.screening-play-error a { text-decoration: underline; text-underline-offset: 4px; }
.screening-copy { padding: 12px 0 40px; }
.screening-copy h1 { margin-top: 19px; font: 500 clamp(42px, 4.4vw, 67px)/1.02 var(--serif); letter-spacing: -.015em; text-wrap: balance; overflow-wrap: break-word; }
.screening-line { margin-top: 22px; font-size: 14px; color: var(--ash-light); }
.screening-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 20px 24px; margin-top: 34px; }
.screening-actions .btn { padding: 0 19px; letter-spacing: .08em; text-transform: none; font-size: 12px; }
.screening-permalink { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; font-size: 12px; color: var(--ash-light); }
.screening-permalink:hover { color: var(--bone); }
.screening-credits { margin-top: 48px; }
.screening-credits h2 { color: var(--ash-light); font: 500 10px/1.4 var(--sans); letter-spacing: .16em; text-transform: uppercase; margin-bottom: 21px; }
.screening-credits dl { display: grid; gap: 16px; }
.screening-credits dt { font-size: 10px; line-height: 1.4; color: var(--ash-light); }
.screening-credits dd { margin-top: 4px; font-size: 13px; line-height: 1.5; color: var(--bone-soft); }
.screening-note { max-width: 360px; margin-top: 25px; color: var(--ash-light); font-size: 10px; line-height: 1.7; }
.film-screening .ftr { padding-top: 36px; }

.film-share-message { position: fixed; z-index: 200; bottom: max(24px, env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%); width: max-content; max-width: calc(100vw - 40px); padding: 13px 22px; color: var(--charcoal); background: var(--champ); font-size: 13px; text-align: center; box-shadow: 0 8px 35px rgba(0, 0, 0, .3); }
.film-share-message:empty { display: none; }
.film-link-dialog { width: min(500px, calc(100vw - 40px)); padding: 32px; background: var(--panel); color: var(--bone); border: 1px solid var(--champ-a); }
.film-link-dialog::backdrop { background: rgba(0, 0, 0, .75); }
.film-link-dialog h2 { font: 500 34px/1.1 var(--serif); }
.film-link-dialog p { margin-top: 14px; font-size: 13px; color: var(--ash-light); }
.film-link-dialog input { display: block; width: 100%; min-height: 48px; margin: 22px 0; padding: 10px 12px; border: 1px solid var(--bone-a); background: var(--ink); color: var(--bone); font: 400 13px/1.4 var(--sans); }

@media (min-width: 1200px) and (min-height: 800px) {
  .screening { min-height: calc(100svh - 150px); }
}
@media (max-width: 1050px) {
  .collection-grid { gap: 52px 26px; }
  .screening { gap: 50px; }
}
@media (max-width: 899px) {
  .collection { padding-top: calc(var(--hdr) + 54px); }
  .collection-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .screening { padding-top: calc(var(--hdr) + 46px); gap: 36px; }
  .screening-copy h1 { font-size: clamp(35px, 5.2vw, 47px); }
  .screening-copy .film-eyebrow { font-size: 9px; letter-spacing: .14em; }
  .screening-credits { margin-top: 32px; }
  .screening-actions { gap: 10px; }
}
@media (max-width: 599px) {
  .film-collection .nav, .film-screening .nav { gap: 18px; }
  .film-collection .nav-link:not([aria-current]) { display: none; }
  .film-collection .nav-cta, .film-screening .nav-cta { display: none; }
  .collection { padding-top: calc(var(--hdr) + 46px); }
  .collection-intro { margin-bottom: 42px; }
  .collection-intro h1 { font-size: clamp(42px, 10.5vw, 58px); }
  .collection-intro > p:last-child { margin-top: 17px; font-size: 13px; }
  .collection-grid { grid-template-columns: minmax(0, 1fr); gap: 44px; max-width: 380px; margin: 0 auto; }
  .collection-caption { padding-top: 18px; }
  .collection-caption h2 { font-size: 28px; }
  .collection-end { padding-top: 75px; }
  .screening { grid-template-columns: minmax(0, 1fr); gap: 34px; padding-top: calc(var(--hdr) + 24px); }
  .screening-player { max-width: min(380px, calc((100svh - var(--hdr) - 94px) * 9 / 16)); min-width: min(230px, 100%); }
  .screening-copy { width: 100%; max-width: 380px; margin: 0 auto; padding-bottom: 0; }
  .screening-copy h1 { margin-top: 14px; font-size: clamp(40px, 10.5vw, 53px); }
  .screening-line { margin-top: 17px; }
  .screening-actions { margin-top: 26px; gap: 20px; }
  .screening-credits { margin-top: 34px; }
  .screening-credits dl { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 24px; }
  .screening-note { max-width: none; }
  .film-screening .ftr { padding-top: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  .collection-poster { transition: none; }
  .collection-poster:hover { transform: none; }
}