/* Will Smith: an expanded viewing experience within the existing portfolio. */
dialog.case-study {
  width:100%; max-width:none; height:100dvh; max-height:100dvh;
  margin:0; border:0; background:#111310; scroll-padding-top:88px;
}
.case-study .dialog-shell {padding:0 0 36px;}
.case-study .dialog-bar {
  position:sticky; top:0; z-index:5; padding:17px var(--gutter);
  background:#111310f5; backdrop-filter:blur(16px);
}
.case-study .dialog-bar > .eyebrow {font-size:12px;}
.case-study .dialog-close {font-size:14px;}
.case-study .dialog-intro,
.case-study .dialog-media,
.case-study .screening-caption,
.case-study #film-selector-heading,
.case-study .video-list,
.case-study .dialog-bottom {
  width:calc(100% - var(--gutter) * 2); max-width:1280px; margin-inline:auto;
}
.case-study .dialog-intro {
  display:grid; grid-template-columns:1fr 1fr; column-gap:8%;
  padding:48px 0 40px; align-items:end;
}
.case-study #dialog-category {grid-column:1; font-size:12px; margin-bottom:16px;}
.case-study #dialog-title {grid-column:1; font-size:clamp(64px,8vw,116px); letter-spacing:-.065em; line-height:1;}
.case-study #dialog-subtitle {grid-column:2; grid-row:1 / 3; font-size:clamp(18px,1.6vw,23px); line-height:1.5; color:#c5cabe; max-width:38ch; margin:0 0 4px;}
.case-study .dialog-media {scroll-margin-top:90px; background:#080a07;}
.case-study .dialog-media > img {object-fit:cover;}
.case-study .play-project {background:linear-gradient(0deg,#0005,transparent 65%);}
.case-study .play-circle {width:82px; height:82px; font-size:27px; box-shadow:0 0 0 12px #ffffff12; transition:transform .2s,background .2s;}
.case-study .play-project:hover .play-circle {transform:scale(1.06);}
.case-study .screening-caption {display:flex; justify-content:space-between; gap:32px; padding:26px 0 32px;}
.case-study #film-context {max-width:780px;}
.case-study #film-number {color:var(--accent); font-size:12px; margin:0 0 10px;}
.case-study #film-title {font-size:clamp(25px,2.5vw,36px); letter-spacing:-.035em; font-weight:450; margin:0 0 10px; line-height:1.2;}
.case-study #film-description {color:var(--muted); font-size:16px; line-height:1.55; margin:0;}
.case-study .video-fallback {margin:3px 0 0; white-space:nowrap; font-size:14px;}
.case-study #film-selector-heading {display:flex; justify-content:space-between; color:var(--muted); border-top:1px solid var(--line); padding:28px 0 0; font-size:12px;}
.case-study #film-selector-heading span {text-transform:none; letter-spacing:0;}
.case-study .video-list {display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:18px; margin-top:20px; margin-bottom:50px;}
.case-study .video-list .film-choice {display:grid; grid-template-columns:24px 1fr; gap:12px 7px; align-content:start; padding:0 0 16px; background:transparent; border:0; border-bottom:2px solid transparent; color:var(--muted); font-size:14px; line-height:1.35; transition:color .2s,border-color .2s;}
.case-study .film-choice img {grid-column:1 / -1; width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; opacity:.65; transition:opacity .2s;}
.case-study .film-choice-number {font-size:12px; padding-top:2px;}
.case-study .film-choice-name {color:var(--paper);}
.case-study .video-list .film-choice[aria-pressed=true] {color:var(--accent); border-color:var(--accent);}
.case-study .film-choice[aria-pressed=true] img,.case-study .film-choice:hover img {opacity:1;}
.case-study .film-choice[aria-pressed=true] .film-choice-name {color:var(--accent);}
.case-study .dialog-details[hidden] {display:none;}
.case-study .dialog-bottom {font-size:14px;}
.case-study .next-project {font-size:14px;}
@media(max-width:700px) {
  dialog.case-study {scroll-padding-top:74px;}
  .case-study .dialog-bar {padding-block:14px;}
  .case-study .dialog-bar > .eyebrow {font-size:10px; letter-spacing:.04em;}
  .case-study .dialog-close {gap:12px;}
  .case-study .dialog-intro {display:block; padding:32px 0 26px;}
  .case-study #dialog-category {font-size:11px; margin-bottom:14px;}
  .case-study #dialog-title {font-size:64px;}
  .case-study #dialog-subtitle {font-size:17px; line-height:1.5; margin:22px 0 0;}
  .case-study .dialog-media {width:100%; min-height:220px; aspect-ratio:16/10; scroll-margin-top:72px;}
  .case-study .dialog-media > img {object-fit:contain;}
  .case-study .play-circle {width:60px; height:60px; font-size:22px;}
  .case-study .screening-caption {display:block; padding:22px 0 28px;}
  .case-study #film-number {font-size:11px;}
  .case-study #film-title {font-size:27px;}
  .case-study #film-description {font-size:16px;}
  .case-study .video-fallback {margin-top:18px; font-size:14px;}
  .case-study #film-selector-heading {padding-top:22px; font-size:11px;}
  .case-study .video-list {grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 14px; margin-top:18px; margin-bottom:32px;}
  .case-study .video-list .film-choice {font-size:14px; grid-template-columns:20px 1fr;}
  .case-study .dialog-bottom {align-items:flex-start; font-size:12px;}
  .case-study .next-project {font-size:13px;}
}
@media(prefers-reduced-motion:reduce) {
  .case-study .film-choice img,.case-study .play-circle {transition:none;}
}