@font-face {
  font-family: "AT Surt";
  src: url("fonts/Surt-Normal-Light-TRIAL.otf") format("opentype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "AT Surt";
  src: url("fonts/Surt-Normal-Regular-TRIAL.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --ivory: #f5f3e9;
  --ink: #25251f;
  --muted: #66665e;
  --page-margin: 44px;
  --grid-width: 60vw;
  color-scheme: light;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--ivory); color: var(--ink); font-family: "AT Surt", sans-serif; font-weight: 300; -webkit-font-smoothing: antialiased; }
button, a { color: inherit; font: inherit; font-weight: 300; }
button { cursor: pointer; }
button { border: 0; padding: 0; background: transparent; }
a { text-decoration: none; }
button:focus-visible, a:focus-visible { outline: 1px solid currentColor; outline-offset: 7px; }
.category-label { font-weight: 400; }

.site-header { display: flex; width: 100%; justify-content: space-between; align-items: baseline; padding: 27px var(--page-margin) 0; font-size: 22px; line-height: 1.4; }
.site-header nav { display: flex; gap: 57px; }
.site-header a:hover, .site-header button:hover { color: var(--muted); }
.film-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0; }
.film-tile { position: relative; display: block; width: 100%; min-width: 0; margin: 0; text-align: center; }
.film-tile > img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; }
.tile-caption { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 18px; padding: 24px; background: #171715; color: var(--ivory); opacity: 0; transition: opacity 200ms ease; }
.tile-title { font-size: 26px; line-height: 1.3; }
.tile-status { font-size: 15px; line-height: 1.3; }
.film-tile:hover .tile-caption, .film-tile:focus-visible .tile-caption { opacity: 1; }
.film-tile:focus-visible { outline-offset: 0; z-index: 1; }

dialog { border: 0; padding: 0; background: var(--ivory); color: var(--ink); font: inherit; }
dialog::backdrop { background: rgba(30,30,25,.2); }
.info-dialog { position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; overflow: auto; }
.dialog-header { display: flex; justify-content: space-between; padding: 27px var(--page-margin); font-size: 22px; line-height: 1.4; }
.dialog-header button:hover { color: var(--muted); }
.info-content h1 { margin: 0; font: inherit; font-size: 25px; line-height: 1.35; }
.info-content { margin: 100px 20%; font-size: 22px; line-height: 1.5; }
.info-content p { margin: 12px 0 0; }
body.dialog-open { overflow: hidden; }

.film-page-content { width: min(780px,calc(100% - 88px)); margin: 110px auto 90px; }
.film-intro { display: grid; grid-template-columns: minmax(0,1.23fr) minmax(0,1fr); gap: 70px; align-items: start; }
.film-information { font-size: 16px; line-height: 1.75; }
.film-information h1 { margin: 0 0 22px; font-size: 28px; font-weight: 300; line-height: 1.3; }
.film-information p { margin: 0 0 22px; }
.film-information .film-status, .film-information .film-details { margin: -8px 0 22px; color: var(--muted); font-size: 15px; }
.film-cast { margin-top: 30px !important; }
.film-credits { margin: 30px 0 0; }
.film-credits div { display: block; }
.film-credits dt, .film-credits dd { display: inline; margin: 0; }
.film-credits dt::after { content: ": "; }
.film-festivals, .film-links { margin: 30px 0 0; padding: 0; list-style: none; }
.film-festivals li::before { content: "+ "; }
.film-links li::before { content: "– "; }
.text-link { text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }
.text-link:hover { color: var(--muted); }
.film-poster, .film-cover, .film-stills figure { margin: 0; }
.film-poster img, .film-cover img, .film-stills img { display: block; width: 100%; height: auto; }
.film-media { margin: 55px 0 0; }
.film-media .film-cover { margin: 0; }
.vimeo-player { position: relative; width: 100%; aspect-ratio: var(--film-ratio); background: #171715; }
.vimeo-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-password { margin: 12px 0 0; text-align: right; font-size: 15px; line-height: 1.5; }
.screener-action { margin: 24px 0 0; font-size: 18px; line-height: 1.5; }
.film-stills { display: grid; gap: 30px; margin-top: 50px; }
.pitch-deck h2 { margin: 0 0 22px; font-size: 22px; font-weight: 300; }
.pdf-reader { border-block: 1px solid #25251f30; }
.pdf-toolbar { display: flex; align-items: center; gap: 18px; min-height: 60px; padding: 10px 0; font-size: 15px; line-height: 1.5; }
.pdf-toolbar button { min-width: 36px; min-height: 36px; font-size: 20px; }
.pdf-toolbar button:disabled { opacity: .3; cursor: default; }
.pdf-open { margin-left: auto; }
.pdf-pages { position: relative; display: grid; align-content: start; gap: 16px; padding: 16px; height: min(72vh,850px); min-height: 280px; overflow: auto; overscroll-behavior: contain; background: #e7e4d9; }
.pdf-page { margin: 0; width: 100%; background: var(--ivory); }
.pdf-page canvas { display: block; width: 100%; height: auto; }
.pdf-page canvas[hidden] { display: none; }
.pdf-message { margin: 16px 0; font-size: 15px; line-height: 1.5; }
.pdf-message[hidden] { display: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

@media (min-width: 601px) {
  body.home-page { display: grid; grid-template-rows: auto minmax(0,1fr); height: 100vh; height: 100dvh; overflow: hidden; }
  .film-stage { min-width: 0; min-height: 0; display: grid; place-items: center; padding: clamp(24px,4vh,58px) var(--page-margin); container-type: size; }
  .film-grid { width: min(var(--grid-width),1152px,100cqw,100cqh); aspect-ratio: 1; grid-template-rows: repeat(2,minmax(0,1fr)); }
  .film-tile { min-height: 0; }
  .film-tile > img { height: 100%; }
}

@media (min-width: 1921px) {
  .site-header { max-width: 1920px; margin: auto; }
}

@media (max-width: 1024px) {
  :root { --page-margin: 30px; --grid-width: 86vw; }
  .tile-title { font-size: 23px; }
  .film-page-content { width: min(780px,calc(100% - 60px)); margin-top: 90px; }
  .film-intro { gap: 40px; }
}

@media (max-width: 600px) {
  :root { --page-margin: 22px; }
  .site-header { padding-top: 23px; font-size: 18px; }
  .film-grid { width: calc(100% - 44px); margin: 54px auto 35px; grid-template-columns: 1fr; row-gap: 30px; }
  .tile-caption { position: static; align-items: flex-start; padding: 12px 0 0; opacity: 1; background: transparent; color: var(--ink); text-align: left; gap: 7px; }
  .tile-title { font-size: 17px; line-height: 1.4; }
  .tile-title br { display: none; }
  .tile-status { font-size: 13px; color: var(--muted); }
  .dialog-header { padding-top: 23px; font-size: 18px; }
  .info-content { margin: 70px 22px; }
  .film-page-content { width: calc(100% - 44px); margin: 65px auto 55px; }
  .film-intro { grid-template-columns: 1fr; gap: 35px; }
  .film-information h1 { font-size: 26px; }
  .film-information { font-size: 16px; }
  .film-poster { width: min(100%,320px); }
  .film-media { margin-top: 40px; }
  .screener-action { font-size: 17px; }
  .pdf-toolbar { gap: 8px; font-size: 13px; }
  .pdf-toolbar button { min-width: 30px; }
  .pdf-pages { padding: 8px; gap: 8px; height: 60vh; }
}

@media (hover: none) and (min-width: 601px) {
  .tile-caption { opacity: 1; background: linear-gradient(transparent 45%,rgba(0,0,0,.65)); text-align: left; align-items: flex-start; justify-content: flex-end; padding: 16px; gap: 7px; }
  .tile-title { font-size: 19px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .tile-caption { transition: none; }
}