/* A film dossier: one image plane, a clear idea, then a sequence of scenes. */
@font-face { font-family:'Replica Pro'; src:url('/assets/fonts/replica-pro-regular.woff') format('woff'); font-weight:400; font-style:normal; font-display:swap; }
.case-study { --case-inset:clamp(20px,4.2vw,80px); --case-space:clamp(64px,8vw,128px); color:#eee; }
.case-study .film-intro,.project-body .case-study .film-intro { display:grid; grid-template-columns:minmax(0,1fr) minmax(190px,250px); align-items:center; gap:28px 42px; padding:38px var(--case-inset) 0; }
.case-heading { display:grid; gap:14px; min-width:0; }
.case-utility { display:grid; justify-items:end; gap:0; text-align:right; }
.case-study .film-meta-line { margin:0; padding:0; font:500 12px/1.45 var(--display); color:#aaa; }
.case-study .film-intro h1,.project-body .case-study .film-intro h1 { max-width:26ch; margin:0; font:400 clamp(36px,4.5vw,70px)/1.08 'Replica Pro',Helvetica,Arial,sans-serif; letter-spacing:-.018em; overflow-wrap:anywhere; text-wrap:balance; }
.case-facts { display:grid; align-content:start; gap:22px; margin:0; font:400 12px/1.6 var(--display); color:#bbb; }
.case-facts dt { margin:0 0 6px; color:#777; font:500 9px/1.5 var(--display); letter-spacing:.04em; }
.case-facts dd { margin:0; }
.case-jumps { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px 26px; font:700 11px/1.4 var(--display); color:#bbb; }
.case-jumps a { display:flex; align-items:center; min-height:44px;   transition:color .25s,opacity .25s; }
.case-jumps a:hover,.case-jumps a:focus-visible { color:#fff; text-decoration:none; }
.case-study .film-watch { margin:0; padding:0; width:100%; }
.case-study .film-watch-button { display:block; width:100%; background:#000; }
.case-study .film-watch-button .film-image { width:100%; max-height:78svh; height:auto; aspect-ratio:var(--frame-ratio); border:0; box-shadow:none; }
.case-study .film-image img,.case-study .film-image video { object-fit:contain; }
.case-study .watch-label { inset:auto auto 28px var(--case-inset); z-index:2; isolation:isolate; display:inline-flex; flex-direction:row; align-items:center; justify-content:flex-start; gap:14px; width:auto; min-width:144px; min-height:54px; padding:8px 0 12px; transform:none; color:#f5f5f2; border:0; background:none; font:500 13px/1.3 var(--display); letter-spacing:.06em; text-shadow:0 1px 5px #000,0 2px 18px #000; transition:transform .2s; }
.case-study .watch-label::before { content:''; position:absolute; z-index:-1; inset:-14px -30px -12px; background:radial-gradient(ellipse,#0009 0%,#0004 38%,transparent 72%); pointer-events:none; }
.watch-icon { display:grid; place-items:center; width:18px; height:20px; }
.watch-icon svg { display:block; width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.1; stroke-linejoin:round; filter:drop-shadow(0 1px 3px #000); transition:transform .55s cubic-bezier(.22,1,.36,1); }
.watch-copy { display:block; white-space:nowrap; transition:transform .55s cubic-bezier(.22,1,.36,1); }
.case-study .film-watch-button:hover .watch-icon svg,.case-study .film-watch-button:focus-visible .watch-icon svg { transform:translateX(2px); }
.case-study .film-watch-button:hover .watch-copy,.case-study .film-watch-button:focus-visible .watch-copy { transform:translateX(2px); }
.case-study .film-watch-button:active .watch-label { transform:translateY(1px); }
.case-study .film-under { display:flex; align-items:center; justify-content:space-between; gap:22px; min-height:40px; padding:0; font:500 10px/1.4 var(--display); color:#999; }
.case-study .film-under a,.case-study .film-under button { min-height:40px; }
.case-study .film-statement,.project-body .case-study .film-statement { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1.25fr) minmax(150px,.55fr); gap:clamp(30px,4.8vw,80px); align-items:start; margin:var(--case-space) var(--case-inset); }
.case-study .film-concept h2 { max-width:20ch; margin:0; font:400 clamp(27px,2.7vw,42px)/1.18 var(--display); letter-spacing:-.025em; text-wrap:balance; }
.case-study .film-description { max-width:660px; margin:0; color:#aaa; }
.case-study .film-description p,.project-body .case-study .film-description p { margin:0; font:400 14px/1.85 var(--display); letter-spacing:0; }
.case-study .film-description p+p { margin-top:22px; }
.case-study .film-award { margin-top:30px; max-width:35ch; font:700 12px/1.6 var(--display); color:#ddd; }
.case-study .award-note { margin-top:10px; max-width:44ch; font:400 11px/1.7 var(--display); color:#888; }
.case-study .film-frames { display:block; width:calc(100% - var(--case-inset)*2); max-width:var(--gallery-width,1200px); margin-inline:auto; padding:0; }
.case-section-label { margin-bottom:24px; font:700 11px/1.5 var(--display); color:#999; }
.frame-row { display:grid; grid-template-columns:var(--frame-columns); align-items:start; gap:clamp(14px,2.2vw,32px); margin-bottom:clamp(30px,4.2vw,64px); }
.frame-row--full { width:100%; margin-inline:0; }
.frame-row--inset { width:100%; }
.case-study .film-frame,.case-study .film-frame:first-child { grid-column:auto; margin:0; width:100%; max-width:min(var(--preview-max-width,100%),var(--portrait-limit,100%)); justify-self:center; }
.case-study .film-frame>a { display:block; }
.frame-media { position:relative; width:100%; aspect-ratio:var(--frame-ratio); overflow:hidden; background:#000; }
.case-study .frame-media img,.case-study .frame-media video { position:absolute; inset:0; display:block; width:100%; height:100%; margin:0; object-fit:contain; transform:none; }
.case-study .frame-media iframe { position:absolute; inset:0; width:100%; height:100%; border:0; pointer-events:none; opacity:0; transition:opacity .7s; }
.case-study .frame-media.has-crop img,.case-study .frame-media.has-crop iframe { width:var(--still-width,100%); height:var(--still-height,100%); top:var(--still-top,0); left:var(--still-left,0); object-fit:fill; }
.case-study .frame-media iframe.ready { opacity:1; }
.case-study .frame-media video { opacity:0; background:#000; transition:opacity .7s cubic-bezier(.45,0,.55,1); }
.case-study .frame-media video.ready { opacity:1; }
.case-study .film-frame a:hover img { transform:none; }
.case-study .frame-caption { margin-top:10px; padding-inline:2px; font:400 10px/1.5 var(--display); color:#888; text-transform:none; }
.case-study .frame-row--full .frame-caption { padding-inline:2px; }
.case-study .credits-section { display:grid; grid-template-columns:minmax(0,.6fr) minmax(0,2fr); gap:clamp(36px,6vw,100px); margin:var(--case-space) var(--case-inset); padding-top:0; border:0;  }
.case-study .credits-section>h2 { margin:0; font:400 clamp(26px,2.7vw,40px)/1.1 var(--display); letter-spacing:-.035em; }
.case-credits-body { min-width:0; }
.case-study .credits-section dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px 30px; margin:0; padding:2px 0 30px; }
.case-study .credits-section dt { margin-bottom:5px; color:#777; font:500 10px/1.5 var(--display); }
.case-study .credits-section dd { margin:0; color:#ccc; font:500 12px/1.7 var(--display); overflow-wrap:anywhere; }
.case-study .credits-section summary { display:flex; align-items:center; justify-content:space-between; list-style:none; min-height:52px; padding:8px 0 18px; font:700 11px/1.5 var(--display); color:#aaa; }
.case-study .credits-section summary::-webkit-details-marker { display:none; }
.credit-disclosure { font-size:20px; transition:transform .25s; }
.case-study .credits-section details[open] .credit-disclosure { transform:rotate(45deg); }
.case-study .credit-group h3 { margin:28px 0 20px; font:700 11px/1.5 var(--display); color:#999; }
.case-study .next-film { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:clamp(32px,6vw,90px); align-items:center; margin:0; padding:30px var(--case-inset) 70px;  }
.case-study .next-film .eyebrow { display:block; margin:0 0 22px; color:#777; font:700 10px/1.4 var(--display); }
.case-study .next-film h2 { margin:0 0 16px; font:500 clamp(32px,4vw,66px)/1.04 var(--display); letter-spacing:-.035em; overflow-wrap:anywhere; }
.case-study .next-film p { margin:0; text-align:left; font:500 11px/1.5 var(--display); color:#999; }
.case-study .next-film>img { display:block; width:100%; height:auto; max-height:500px; aspect-ratio:auto; object-fit:contain; background:#000; }
.page-film .case-study section[id] { scroll-margin-top:160px; }
.project-body .case-study section[id] { scroll-margin-top:96px; }
@media(max-width:760px) {
  .case-study { --case-inset:20px; --case-space:58px; }
  .case-study .film-intro,.project-body .case-study .film-intro { grid-template-columns:minmax(0,1fr); gap:20px; padding:25px var(--case-inset) 0; }
  .case-heading { gap:10px; }
  .case-utility { justify-items:start; gap:4px; text-align:left; }
  .case-study .film-meta-line { font-size:11px; padding:0; }
  .case-study .film-intro h1,.project-body .case-study .film-intro h1 { font-size:clamp(30px,8.2vw,46px); line-height:1.12; letter-spacing:-.012em; }
  .case-facts { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 24px; margin-top:30px; font-size:11px; }
  .case-jumps { justify-content:flex-start; gap:22px; font-size:10px; margin-bottom:-6px; }
  .case-study .film-watch-button .film-image { max-height:74svh; }
  .case-study .watch-label { bottom:18px; min-width:138px; min-height:48px; padding-inline:0; gap:12px; font-size:12px; }
  .case-study .film-under { min-height:40px; padding-top:0; font-size:9px; }
  .case-study .film-statement,.project-body .case-study .film-statement { display:block; }
  .case-study .film-concept h2 { font-size:clamp(26px,7.2vw,36px); line-height:1.2; }
  .case-study .film-description { margin-top:28px; }
  .case-study .film-description p,.project-body .case-study .film-description p { font-size:14px; line-height:1.85; }
  .case-study .film-award { font-size:11px; }
  .case-study .award-note { font-size:10px; }
  .case-section-label { margin-bottom:20px; font-size:10px; }
  .frame-row { grid-template-columns:minmax(0,1fr); gap:26px; margin-bottom:26px; }
  .frame-row--inset { width:100%; }
  .case-study .frame-caption { font-size:9px; margin-top:8px; }
  .case-study .credits-section { display:block; padding-top:0; }
  .case-study .credits-section>h2 { margin-bottom:28px; font-size:28px; }
  .case-study .credits-section dl { grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 20px; }
  .case-study .credits-section dd { font-size:12px; }
  .case-study .next-film { display:flex; flex-direction:column-reverse; align-items:stretch; gap:30px; padding:30px var(--case-inset) 46px; }
  .case-study .next-film h2 { font-size:clamp(32px,8.2vw,48px); }
  .case-study .next-film .eyebrow { margin-bottom:17px; }
  .case-study .next-film>img { max-height:54svh; }
  .page-film .case-study section[id] { scroll-margin-top:132px; }
}
@media(prefers-reduced-motion:reduce) { .case-study .frame-media video,.case-study .frame-media iframe { display:none; } .case-study .watch-label,.case-study .watch-icon svg,.case-study .watch-copy { transition:none; } .case-study .watch-label,.case-study .watch-icon svg,.case-study .watch-copy { transform:none!important; } }

@media(min-width:761px) and (max-width:1050px) { .case-study .film-statement { grid-template-columns:1fr 1.25fr; } .case-study .case-facts { grid-column:2; grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:360px) { .case-study { --case-inset:16px; } .case-study .credits-section dl { grid-template-columns:1fr; gap:18px; } }
/* Names are reading content; preserve each contributor's published capitalization. */
.case-study .credits-section dd { text-transform:none; }
@media(max-width:760px) {
  .case-study .case-utility { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:0 18px; }
}
