/* ════════════════════════════════════════════════════════════════════
   Film page — slate, credits, services, CTA
   Shares tokens/layout with site.css; loaded after it.
   ════════════════════════════════════════════════════════════════════ */

/* #region hero */
/* ─── hero ───────────────────────────────────────────────────────── */
.film-hero-bg{background:radial-gradient(120% 95% at 50% 30%,#2a221c 0%,#181311 55%,#0e0b09 100%)}
/* #endregion */

/* #region slate (film cards) */
/* ─── slate (film cards) ─────────────────────────────────────────── */
/* card + info side-by-side, alternating via HTML source order */
.slate-item{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,56px);align-items:center;margin-top:40px}
.slate-item:first-of-type{margin-top:30px}
/* card shell */
.film-card{position:relative;aspect-ratio:16/10;border-radius:16px;overflow:hidden;border:1.5px solid var(--border);
  background:linear-gradient(145deg,#2a1c14,#140e0a)}
/* film-grain texture overlay */
.film-card .grain-layer{position:absolute;inset:0;opacity:.5;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
/* caption overlay — label, title, year, bottom-anchored */
.film-card .ct{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:30px;z-index:1}
.film-card .ct .lab{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,97,54,.8)}
.film-card .ct .ttl{display:block;font-family:var(--stamp);font-size:clamp(40px,6vw,72px);text-transform:uppercase;line-height:.9;margin:10px 0 2px}
.film-card .ct .yr{font-family:var(--mono);font-size:13px;opacity:.8}
/* vimeo embed variant — no padding, iframe fills the card */
.film-card.vimeo{padding:0}
.film-card.vimeo iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
/* info column — title, director, synopsis, producer credit, badge */
.film-info h3{font-family:var(--stamp);text-transform:uppercase;font-size:clamp(28px,3.4vw,46px);line-height:.95}
.film-info .dir{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--fp-orange);margin-top:10px;text-transform:uppercase}
.film-info p{opacity:.78;margin-top:10px;font-size:15px}
.film-info .prod{font-size:13.5px;opacity:.6;margin-top:4px}
.film-badge{display:inline-block;margin-top:18px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--fp-orange);border:1px solid rgba(255,97,54,.4);border-radius:999px;
  padding:7px 14px;background:rgba(255,97,54,.06)}
/* #endregion */

/* #region credit marquee */
/* ─── credit marquee ─────────────────────────────────────────────── */
.credit{font-family:var(--stamp);font-size:clamp(18px,2vw,26px);text-transform:uppercase;letter-spacing:.02em;
  opacity:.55;white-space:nowrap;display:flex;align-items:center;gap:14px}
.credit .star{color:var(--fp-orange);font-family:var(--disp)}
/* wrapper around the duplicated (aria-hidden) marquee half — no box of its own */
.mq-dup{display:contents}
/* #endregion */

/* #region services list */
/* ─── services list ──────────────────────────────────────────────── */
/* each row nudges right and its name recolors on hover */
.svc-list{margin-top:28px;border-top:1px solid var(--border)}
.svc-row{display:grid;grid-template-columns:.9fr 1.1fr;gap:24px;padding:26px 0;border-bottom:1px solid var(--border);
  align-items:center;transition:padding-left .25s}
.svc-row:hover{padding-left:10px}
.svc-row .nm{font-family:var(--stamp);font-size:clamp(22px,2.6vw,34px);text-transform:uppercase;line-height:.95}
.svc-row .ds{opacity:.72;font-size:15px}
.svc-row:hover .nm{color:var(--fp-orange)}
/* #endregion */

/* #region CTA banner */
/* ─── CTA banner ─────────────────────────────────────────────────── */
.film-cta{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px;margin-top:52px;
  border:1.5px solid var(--border);border-radius:18px;padding:clamp(28px,4vw,44px);background:var(--ink-850)}
.film-cta p{font-family:var(--stamp);text-transform:uppercase;font-size:clamp(22px,2.8vw,38px);line-height:.95}
/* #endregion */

/* #region responsive */
/* ─── responsive ─────────────────────────────────────────────────── */
@media(max-width:820px){.slate-item,.svc-row{grid-template-columns:1fr}.slate-item .film-info{order:2}}
/* #endregion */