/* V4.23 — interactive credits with in-page performance playback. */
#work { position:relative; isolation:isolate; }
.film-backdrop { display:none; }
.filmography-ready .film-backdrop { display:block; position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; background:radial-gradient(ellipse at 75% 45%,#23271f,#090b0a 75%); }
#work[data-preview-category="commercial"] .film-backdrop { background:radial-gradient(ellipse at 75% 40%,#29281f,#090a09 75%); }
#work[data-preview-category="tv"] .film-backdrop { background:radial-gradient(ellipse at 75% 40%,#20282d,#090b0b 75%); }
.film-backdrop-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 43%; opacity:0; transform:scale(1.035); transition:opacity .45s ease,transform 1.2s ease; }
.film-backdrop-image.is-visible { opacity:.78; transform:scale(1); }
.film-backdrop-shade { position:absolute; inset:0; background:linear-gradient(90deg,#050707e8 0%,#050707bc 38%,#05070732 100%),linear-gradient(0deg,#050707db,transparent 40%,#05070790); }
.film-backdrop-type { position:absolute; right:-3vw; top:23%; color:#e3e5d407; font-size:36vw; font-weight:700; letter-spacing:-.09em; transition:opacity .4s; }
.has-image .film-backdrop-type { opacity:0; }
.film-mode #work .scene-scroll { position:relative; z-index:1; }
.filmography-shell { position:relative; z-index:1; }
.filmography-heading { display:flex; justify-content:space-between; align-items:end; gap:25px; padding-bottom:26px; }
.filmography-heading h2 { margin:20px 0 0; font-weight:500; font-size:clamp(50px,7vw,110px); line-height:.9; letter-spacing:-.065em; }
.filmography-heading p { max-width:245px; margin:0 0 4px; font-size:10px; line-height:1.7; letter-spacing:.06em; color:#b8bdb2; }
.filmography-filters { display:flex; flex-wrap:wrap; gap:6px 8px; margin:10px 0 23px; }
.filmography-filters button { padding:11px 15px; min-height:40px; border:1px solid #eee9e131; border-radius:100px; background:#080a0955; color:#b9bcb2; font:inherit; font-size:10px; cursor:pointer; }
.filmography-filters button[aria-pressed="true"] { color:#11180b; background:var(--paper); border-color:var(--paper); }
.filmography-meta { display:flex; justify-content:space-between; gap:24px; padding-bottom:16px; border-bottom:1px solid #eee9e140; font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:#adb2a3; }
.filmography-meta #filmographyPreview { text-align:right; }
.film-entry { border-bottom:1px solid #eee9e126; margin:0; }
.film-entry[hidden] { display:none!important; }
.film-title-button { display:grid; grid-template-columns:55px minmax(0,1fr) 40px; gap:20px; align-items:center; padding:25px 0; width:100%; border:0; text-align:left; background:none; color:#d4d5cb; cursor:pointer; }
.film-year { align-self:start; margin-top:10px; color:#a9aea0; font-size:10px; }
.film-title-group { min-width:0; }
.film-project-title { display:block; font-size:clamp(34px,5.1vw,78px); font-weight:500; letter-spacing:-.06em; line-height:1.05; transition:color .2s,transform .25s; }
.film-project-format { display:block; margin-top:9px; font-size:9px; color:#a6ac9c; text-transform:uppercase; letter-spacing:.12em; line-height:1.5; }
.film-entry-arrow { font-size:30px; font-weight:300; opacity:.35; transition:opacity .2s; }
.is-previewing .film-project-title { color:#fff; transform:translateX(7px); }
.is-previewing .film-entry-arrow { opacity:1; }
.is-previewing .film-year { color:var(--accent); }
.film-inline { font-size:13px; color:#aab19f; padding-bottom:20px; }
.filmography-ready .film-inline { display:none; }
.filmography-end { margin:40px 0 0; font-size:11px; color:#a4aa9b; }
.film-detail { color:#edece4; background:#0b0e0c; border:1px solid #6b746140; padding:0; width:min(880px,calc(100% - 36px)); max-height:calc(100dvh - 56px); overflow:auto; overscroll-behavior:contain; box-shadow:0 30px 120px #000; }
.film-detail::backdrop { background:#020403cf; backdrop-filter:blur(8px); }
.film-detail-close { position:sticky; top:0; z-index:2; display:flex; justify-content:space-between; align-items:center; gap:24px; padding:17px 26px; width:100%; min-height:56px; border:0; border-bottom:1px solid #d7ddc126; color:#e3e5d9; background:#0b0e0cf5; cursor:pointer; font-size:11px; letter-spacing:.04em; }
.film-detail-close span { font-size:27px; }
.film-detail-visual img { display:block; width:100%; max-height:48vh; object-fit:contain; background:#060806; }
.film-detail-player { position:relative; width:100%; aspect-ratio:16/9; background:#000; border-bottom:1px solid #d7ddc126; }
.film-detail-player iframe { position:absolute; inset:0; display:block; width:100%; height:100%; border:0; background:#000; }
.film-detail-player[hidden] { display:none; }
.film-detail-content { padding:34px 36px 42px; }
.film-detail-kicker { margin:0 0 17px; font-size:10px; text-transform:uppercase; letter-spacing:.17em; color:#aab49e; }
.film-detail h2 { margin:0 0 22px; font-size:clamp(38px,6vw,70px); font-weight:500; letter-spacing:-.06em; line-height:1; }
#filmDetailNotes { color:#c6ccbe; font-size:14px; line-height:1.5; }
.film-detail dl { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin:30px 0 0; }
.film-detail dl div { border-top:1px solid #e5e9d62b; padding-top:14px; }
.film-detail dl div:last-child { grid-column:1 / -1; }
.film-detail dt { font-size:10px; color:#98a28b; margin-bottom:9px; }
.film-detail dd { margin:0; font-size:16px; line-height:1.5; }

.film-detail-watch { display:inline-flex; align-items:center; justify-content:space-between; gap:28px; margin-top:30px; min-width:min(100%,320px); padding:15px 18px; border:1px solid #dfe6cc45; color:#f2f4ea; text-decoration:none; text-transform:uppercase; letter-spacing:.12em; font-size:10px; background:#dfe6cc0a; transition:background .25s ease,border-color .25s ease,transform .25s ease; }
.film-detail-watch:hover,.film-detail-watch:focus-visible { background:#dfe6cc14; border-color:#dfe6cc88; transform:translateY(-2px); outline:none; }
.film-detail-watch[hidden] { display:none; }
body.film-detail-open,body.film-detail-open * { cursor:auto!important; }
body.film-detail-open .cursor,body.film-detail-open .cursor-dot { display:none!important; }
.director-credit-disclosure { margin-top:18px; border-top:1px solid #25292025; }
.director-credit-disclosure summary { padding:19px 0; font-size:13px; cursor:pointer; color:#34412a; }
.director-skills h3 { font-size:17px; font-weight:500; }
.director-skills dl { display:grid; grid-template-columns:1fr 1fr; gap:22px 35px; }
.director-skills dl div { border-top:1px solid #25292025; padding-top:14px; }
.director-skills dt { font-size:10px; color:#626b57; margin-bottom:9px; }
.director-skills dd { margin:0; font-size:13px; line-height:1.65; }
@media(max-width:767px){
  .filmography-heading { display:block; padding-bottom:18px; }
  .filmography-heading h2 { font-size:55px; margin-top:17px; }
  .filmography-heading p { margin-top:17px; max-width:none; font-size:9px; }
  .filmography-filters { gap:7px; margin:0 0 19px; }
  .filmography-filters button { padding:10px 13px; min-height:42px; font-size:9px; }
  .filmography-meta { gap:12px; font-size:8px; line-height:1.5; }
  .filmography-meta #filmographyPreview { max-width:65%; }
  .film-title-button { grid-template-columns:32px minmax(0,1fr) 20px; gap:10px; padding:22px 0; }
  .film-project-title { font-size:clamp(29px,8.5vw,55px); letter-spacing:-.052em; }
  .film-project-format { font-size:8px; letter-spacing:.05em; }
  .film-year { font-size:9px; margin-top:6px; }
  .film-entry-arrow { font-size:23px; }
  .is-previewing .film-project-title { transform:translateX(2px); }
  .film-backdrop-shade { background:linear-gradient(90deg,#050707ce,#05070755),linear-gradient(0deg,#050707bd,transparent 60%,#05070790); }
  .film-detail { width:calc(100% - 20px); max-height:calc(100dvh - 24px); }
  .film-detail-content { padding:25px 22px 30px; }
  .film-detail-close { padding:14px 20px; }
  .film-detail dl { grid-template-columns:1fr; gap:20px; }
  .director-skills dl { grid-template-columns:1fr; gap:18px; }
}
@media(prefers-reduced-motion:reduce){.film-backdrop-image,.film-project-title,.film-entry-arrow { transition:none;transform:none!important; }}