/* The paired films scroll beside phrases that resolve into the full line. */
.films-section{--film-media-top:96px;--film-media-bottom:20px;position:relative;background:#e2e0e0;color:#101010;height:360svh;padding:0;scroll-margin-top:0;isolation:isolate}
#services + .films-section{margin-top:clamp(48px,7.3vw,140px)}
.films-stage{position:sticky;top:0;height:100svh;overflow:clip;isolation:isolate}
.films-section #films-title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.films-type{position:absolute;z-index:1;top:calc(50% + (var(--film-media-top) - var(--film-media-bottom)) / 2);left:50%;width:max-content;transform:translate(-50%,-50%);font:400 clamp(22px,min(4.6vw,calc((100svh - 224px) / 3.12)),84px)/1.04 Arial,Helvetica,sans-serif;letter-spacing:-.04em;pointer-events:none}
.films-phrase-window{display:none;position:absolute;inset:50% 0 auto;transform:translateY(-50%);height:1.24em;line-height:1.2;overflow:hidden;white-space:nowrap;opacity:var(--films-phrase-opacity,1)}
.films-phrase-window span{position:absolute;inset:0;transform:translateY(var(--films-current-offset,110%))}
.films-phrase-window span+span{transform:translateY(var(--films-next-offset,110%))}
.films-enhanced:not(.films-static) .films-phrase-window{display:block}
.films-enhanced:not(.films-static) .films-sentence{opacity:var(--films-final,0);clip-path:inset(calc((1 - var(--films-final,0)) * 100%) 0 0)}
.films-section .film-projects{display:block;position:absolute;z-index:2;inset:var(--film-media-top) 0 var(--film-media-bottom);overflow:clip}
.films-section .film-project{position:absolute;top:0!important;left:0;display:block;padding:0;margin:0;border:0;border-radius:14px;overflow:hidden;background:#d5dade;box-shadow:0 12px 30px #17171712;aspect-ratio:var(--film-ratio);text-align:initial;transition:box-shadow .35s}
.films-section .film-project>img,.films-section .film-project>video{display:block;width:100%;height:100%;object-fit:contain;aspect-ratio:auto;border-radius:inherit;background:transparent;pointer-events:none}
.films-section .film-project>video{position:absolute;inset:0;opacity:0}
.films-section .film-project.is-playing>video{opacity:1}
.films-section .film-project:hover{box-shadow:0 24px 55px #172b3b33}
.films-section .film-project:hover img{filter:none}
.films-section .film-project:focus-visible{outline:3px solid #243746;outline-offset:5px}
.films-section:not(.films-enhanced),.films-section.films-static{height:auto;padding:100px var(--gutter) 80px;background:#edf0f2!important}
.films-section:not(.films-enhanced) .films-stage,.films-static .films-stage{position:relative;top:auto;height:auto;overflow:visible}
.films-section:not(.films-enhanced) #films-title,.films-section.films-static #films-title{position:relative;inset:auto;width:auto;height:auto;clip-path:none;white-space:normal;font:700 clamp(40px,7vw,100px)/.95 Arial,sans-serif;letter-spacing:-.07em;margin:0 0 24px}
.films-section:not(.films-enhanced) .films-type,.films-static .films-type{position:static;width:auto;transform:none;margin-bottom:40px}
.films-section:not(.films-enhanced) .films-sentence br,.films-static .films-sentence br{display:none}
.films-section:not(.films-enhanced) .film-projects,.films-section.films-static .film-projects{position:relative;inset:auto;overflow:visible;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;align-items:center}
.films-section:not(.films-enhanced) .film-project,.films-section.films-static .film-project{position:relative;left:auto;top:auto!important;width:100%!important;height:auto!important;transform:none!important;will-change:auto;box-shadow:none}
@media(max-width:700px){
 .films-section{--film-copy-size:clamp(24px,min(7.2vw,calc((100svh - 195px) / 2.2)),42px);--film-media-top:calc(100px + 2.2 * var(--film-copy-size));height:400svh}
 .films-type{top:88px;left:18px;transform:none;font-size:var(--film-copy-size)}
 .films-phrase-window{top:0;transform:none}
 .films-desktop-break{display:none}
 .films-section .film-project{border-radius:10px}
 .films-section:not(.films-enhanced),.films-section.films-static{padding-top:80px;padding-bottom:60px}
 .films-section:not(.films-enhanced) .film-projects,.films-section.films-static .film-projects{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}
}

#work-dialog.film-dialog .work-visual{display:grid;align-content:center;padding:clamp(12px,2vw,24px)}
#work-dialog.film-dialog .work-media{
 width:min(100%,calc(68svh * var(--film-ratio)));height:auto;max-height:none;min-height:0;
 aspect-ratio:var(--film-ratio);margin-inline:auto;overflow:hidden;border-radius:12px;
}
#work-dialog.film-dialog .work-media video{width:100%;height:100%;max-height:none}
#work-dialog.film-dialog .work-thumbnails:empty{display:none}
@media(max-width:700px){#work-dialog.film-dialog .work-media{width:min(100%,calc(57svh * var(--film-ratio)))}}