/* Brent's film, "Premier Builder": the in-page player (a <dialog>, never a browser popup). Added at the owner's direction. */
.film-face { display: block; position: relative; width: 100%; height: 100%; color: inherit; text-decoration: none; }
.film-face .film-tag {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 14px 12px;
  font: 600 0.82rem/1 var(--head); letter-spacing: 0.14em; text-transform: uppercase; color: var(--white);
  background: linear-gradient(180deg, rgba(10,10,11,0) 0%, rgba(10,10,11,0.82) 100%);
}
.film-face:hover .film-tag, .film-face:focus-visible .film-tag { color: var(--bronze-hi); }
.film-face:focus-visible { outline: 2px solid var(--bronze-hi); outline-offset: 3px; }
.film-link {
  display: inline-block; margin-top: 14px; padding: 0; border: 0; background: none; cursor: pointer;
  font: 600 0.95rem/1.2 var(--head); letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--bronze); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px;
}
.film-link:hover, .film-link:focus-visible { color: var(--bronze-hi); }

dialog.film { padding: 0; border: 1px solid var(--line); background: var(--black); color: var(--white); width: min(1200px, calc(100vw - 32px)); max-width: none; max-height: calc(100vh - 32px); }
dialog.film::backdrop { background: rgba(5,5,6,0.86); }
.film-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 12px 10px 16px; border-bottom: 2px solid var(--bronze); }
.film-bar h2 { margin: 0; font: 600 1rem/1.2 var(--head); letter-spacing: 0.12em; text-transform: uppercase; color: var(--white); }
.film-bar h2 span { color: var(--grey); font-weight: 400; }
.film-close { border: 1px solid var(--line); background: var(--char); color: var(--white); font: 600 0.85rem/1 var(--head); letter-spacing: 0.12em; text-transform: uppercase; padding: 9px 14px; cursor: pointer; }
.film-close:hover, .film-close:focus-visible { border-color: var(--bronze); color: var(--bronze-hi); }
dialog.film video { display: block; width: 100%; height: auto; max-height: calc(100vh - 110px); background: #000; aspect-ratio: 16 / 9; }
@media (max-width: 760px) { .film-bar h2 span { display: none; } }