/* A photographic film, driven by the reader's pace. */
.about#david{background:#000;padding:0;}
.about-pin{padding:90px 5% 80px;}
.about#david .about-top{margin-bottom:38px;border-color:#292929;}
.portrait.portrait-video{background:#000;aspect-ratio:4/5;isolation:isolate;}
.portrait-video video{display:block;width:100%;height:100%;object-fit:contain;object-position:center;background:#000;mask-image:linear-gradient(to bottom,transparent 0%,#000 7%,#000 78%,transparent 100%);}
.portrait-video>span{z-index:1;padding:55px 22px 23px;background:linear-gradient(transparent,#000);color:#999;pointer-events:none;}
.portrait-video.video-failed video,.reduced .portrait-video video{visibility:hidden;}
.portrait-video.video-failed,.reduced .portrait-video{background:#000 url('assets/video/david-vhs-poster.jpg') center/contain no-repeat;}
@media(min-width:901px){
 .about#david.portrait-pinned{height:240svh;}
 .portrait-pinned .about-pin{position:sticky;top:0;height:100svh;padding-top:105px;padding-bottom:35px;}
 .portrait-pinned .about-top{margin-bottom:28px;}
 .portrait-pinned .about-layout{gap:9%;align-items:center;}
 .portrait-pinned .portrait-video{height:calc(100svh - 208px);max-height:700px;aspect-ratio:auto;}
 .portrait-pinned .about-copy h2{font-size:clamp(42px,4.4vw,72px);margin-bottom:23px;}
 .portrait-pinned .about-copy>p{font-size:15px;margin-bottom:15px;}
 .portrait-pinned .about-copy .underlink{margin-top:4px;}
 .portrait-pinned .experience{margin-top:23px;padding-top:18px;}
 .portrait-pinned .experience strong{font-size:72px;}
}
@media(max-width:900px){
 .about-pin{padding-top:65px;padding-bottom:65px;}
 .about#david .about-layout{grid-template-columns:1fr;gap:40px;}
 .about#david .portrait-video{width:100%;height:min(76svh,720px);min-height:300px;aspect-ratio:auto;}
 .about#david .about-copy{max-width:620px;}
 .about#david .about-copy h2{font-size:clamp(44px,8vw,65px);}
 .about#david .about-top{margin-bottom:25px;}
}
.reduced .about#david{height:auto;}
.reduced .about-pin{position:relative;height:auto;}
@media(prefers-reduced-motion:reduce){
 .about#david{height:auto!important;}
 .about-pin{position:relative!important;height:auto!important;}
}