/* Films page only: individual title treatments, not a site-wide redesign. */
@font-face {
  font-family: "Reenie Beanie";
  src: url("/assets/reenie-beanie.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Gemini Syne";
  src: url("/assets/syne-variable.ttf") format("truetype");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}
#film-moon .feature-heading h2 {
  font-family: "Reenie Beanie", "Noteworthy", cursive;
  font-size: clamp(4.25rem, 6.3vw, 7rem);
  font-weight: 400;
  line-height: .88;
  letter-spacing: .015em;
  text-transform: uppercase;
  transform: skewX(-6deg);
  transform-origin: left bottom;
}
#film-moon .feature-heading > p {
  font-family: "Reenie Beanie", "Noteworthy", cursive;
  font-size: clamp(1.8rem, 2vw, 2.25rem);
  font-weight: 400;
  letter-spacing: .015em;
  line-height: 1.1;
  text-transform: uppercase;
  transform: skewX(-6deg);
  transform-origin: left bottom;
}
#film-thoth .feature-heading h2 {
  font-family: "Gemini Syne", "Syne", var(--sans);
  font-size: clamp(3rem, 5.7vw, 5.5rem);
  font-weight: 650;
  letter-spacing: .015em;
  text-transform: uppercase;
}
#film-thoth { background: #c75833; }
#film-thoth .feature-heading > p {
  font-family: "Gemini Syne", "Syne", var(--sans);
  font-size: clamp(1.125rem, 1.3vw, 1.4rem);
  font-weight: 650;
  letter-spacing: -.025em;
  line-height: 1.25;
  text-transform: uppercase;
}
#film-thoth .thoth-feature-copy > .prose { grid-column: 2; }
#film-thoth .thoth-feature-copy > .prose > p { font-size: inherit; }
#film-libra .feature-heading h2 {
  font-family: "SignPainter", "Snell Roundhand", "Brush Script MT", "Allura", cursive;
  font-size: clamp(3.1rem, 4.8vw, 5.2rem);
  font-weight: 400;
  letter-spacing: .005em;
  line-height: 1.04;
  color: #b63774;
  text-shadow: 0 1px 0 #7b264b55, 1px 3px 3px #64203930, 0 8px 14px #a4386428;
  white-space: nowrap;
}
#film-libra .feature-heading > p {
  font-family: "SignPainter", "Snell Roundhand", "Brush Script MT", "Allura", cursive;
  font-size: clamp(1.8rem, 2.2vw, 2.6rem);
  font-weight: 400;
  letter-spacing: .005em;
  line-height: 1.04;
  color: #b63774;
  text-shadow: 0 1px 0 #7b264b55, 1px 3px 3px #64203930, 0 8px 14px #a4386428;
}
#film-pisces .feature-heading > p {
  font-family: var(--sans);
  font-weight: 500;
  letter-spacing: -.025em;
}
/* Stronger reading type for the descriptions, without changing authored copy. */
.film-feature .feature-copy > .prose {
  font-family: "Avenir Next", Avenir, var(--sans);
  font-size: clamp(1.125rem, 1.05vw, 1.25rem);
  font-weight: 500;
  line-height: 1.75;
  letter-spacing: 0;
}
.film-feature .feature-copy > .prose > p + p { margin-top: 1.6rem; }
.film-feature .feature-copy > .prose strong { font-weight: 650; }
/* Pisces: the pitch leads, and the producer inquiry reads as the next step. */
#film-pisces .feature-copy > .prose > p:first-child {
  font-size: clamp(1.375rem, 1.25vw, 1.625rem);
  line-height: 1.6;
}
#film-pisces .feature-copy > .prose > p:nth-child(2) {
  font-style: italic;
  color: #edafd5;
}
#film-pisces .pisces-inquiry {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid #edafd54d;
}
#film-pisces .pisces-inquiry .materials-note {
  padding-top: 0;
  border-top: 0;
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0;
  text-transform: none;
  color: #f1c9e2;
}
#film-pisces .pisces-inquiry .section-actions { margin-top: 1.25rem; }
#film-pisces .pisces-contact {
  background: #edafd5;
  font-size: 1.0625rem;
  font-weight: 600;
  padding: 1rem 1.3rem;
  box-shadow: 0 5px 15px #0004, 0 0 24px #edafd516;
}
#film-pisces .pisces-contact:hover { background: #f3c5e2; }
#film-pisces .pisces-inquiry .editorial-link { font-size: 1rem; }
/* Larger posters match their adjacent video's height. */
.film-media-layout {
  grid-template-columns: minmax(0, .42fr) minmax(0, 1fr);
  align-items: stretch;
}
.film-poster-column {
  position: relative;
  max-width: none;
  margin: 0;
}
.film-poster-column img {
  position: absolute;
  inset: 0 auto auto 0;
  width: auto;
  max-width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: left top;
  outline: 1px solid #20060338;
  box-shadow: 0 3px 5px #20060319, 0 16px 26px -8px #20060342, 0 30px 48px -20px #20060330;
}
.film-main-preview { position: relative; }
.film-media-label {
  position: absolute;
  bottom: 100%;
  left: 0;
  margin-bottom: .5rem;
  font-family: var(--sans);
  font-size: .8125rem;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0;
}
.film-loop-preview { position: relative; }
.film-feature:has(.film-loop-preview) .feature-copy { margin-top: 3.25rem; }
.film-loop-picture .film-loop {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}
.film-main-preview .film-picture,
.full-film-frame .film-loop-picture {
  border: 0;
  box-shadow: none;
  -webkit-mask: url("/assets/film-edge-mask.svg") center / 100% 100% no-repeat;
  mask: url("/assets/film-edge-mask.svg") center / 100% 100% no-repeat;
}
.film-main-preview .film-loop-preview,
.full-film-frame .film-loop-preview {
  filter: drop-shadow(0 4px 3px #20060340) drop-shadow(0 18px 14px #20060359);
}
#film-pisces .film-loop-picture {
  border: 0;
  box-shadow: none;
}
#film-pisces .full-film-frame .film-loop-preview {
  filter: drop-shadow(0 5px 4px #0009) drop-shadow(0 22px 18px #000b);
}
/* Hide only Pisces' baked-in letterboxing; retain the complete picture width. */
.film-loop-picture.film-loop-letterbox-trim {
  position: relative;
  aspect-ratio: 3840 / 1608;
  overflow: hidden;
}
.film-loop-letterbox-trim .film-loop {
  position: absolute;
  inset: 0 auto auto 0;
  transform: translateY(-12.7777778%);
}
.full-film-frame .film-loop-controls { position: static; }
.film-loop-controls {
  position: absolute;
  top: 100%;
  right: 0;
  display: flex;
  justify-content: flex-end;
  margin-top: .65rem;
}
.film-loop-toggle {
  padding: .35rem .7rem;
  border: 1px solid currentColor;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: .8rem;
  line-height: 1.3;
}
.film-loop-toggle:hover {
  background: var(--ink);
  color: var(--paper);
}
.film-loop-toggle:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}
@media (max-width: 680px) {
  #film-thoth .thoth-feature-copy > .prose { grid-column: 1; }
  #film-moon .feature-heading h2 { font-size: clamp(3.8rem, 16vw, 5rem); }
  #film-libra .feature-heading h2 { font-size: clamp(1.5rem, 7vw, 3rem); }
  .film-media-layout { grid-template-columns: 1fr; }
  .film-media-layout:has(.film-media-label) { row-gap: 2.25rem; }
  .film-poster-column { max-width: 17rem; margin-inline: auto; }
  .film-poster-column img { position: static; width: 100%; height: auto; }
}