/* Original SJH film interactions and case-study composition, refined. */
.card-veil,.card-edge,.card-cue{display:none}
.home-work .project-card,.featured-grid .project-card{position:relative;display:block;overflow:hidden;background:#191919;padding:0!important;isolation:isolate}
.home-work .project-card .card-media,.featured-grid .card-media{aspect-ratio:16/9!important}
.home-work .project-card .card-media:after{display:none}
.home-work .card-veil,.featured-grid .card-veil{display:block;position:absolute;inset:0;background:rgba(231,64,35,.72);z-index:1;transform:translate3d(0,101%,0);transition:transform .6s var(--ease-out)}
.home-work .card-edge,.featured-grid .card-edge{display:block;position:absolute;background:white;z-index:3;opacity:0;transition:transform .5s var(--ease-out),opacity .2s}
.home-work .edge-top,.featured-grid .edge-top{left:0;right:0;top:0;height:2px;transform:scaleX(0);transform-origin:left}
.home-work .edge-right,.featured-grid .edge-right{right:0;top:0;bottom:0;width:2px;transform:scaleY(0);transform-origin:top;transition-delay:65ms}
.home-work .edge-bottom,.featured-grid .edge-bottom{left:0;right:0;bottom:0;height:2px;transform:scaleX(0);transform-origin:right;transition-delay:130ms}
.home-work .edge-left,.featured-grid .edge-left{left:0;top:0;bottom:0;width:2px;transform:scaleY(0);transform-origin:bottom;transition-delay:195ms}
.home-work .project-card .card-info,.featured-grid .project-card .card-info{position:absolute;left:clamp(20px,2vw,32px);right:clamp(20px,2vw,32px);bottom:clamp(20px,2vw,32px);z-index:2;display:block;margin:0;color:#fff;opacity:0;transform:translate3d(0,26px,0);transition:transform .7s var(--ease-out),opacity .4s}
.home-work .project-card .card-info h3,.featured-grid .project-card .card-info h3{font-family:var(--serif);font-weight:400;font-size:clamp(30px,2.8vw,49px);line-height:1.04;letter-spacing:-.035em;color:white;text-shadow:none;transform:none;max-width:95%;overflow-wrap:anywhere;transition:none}
.home-work .project-card .card-info .eyebrow,.featured-grid .project-card .card-info .eyebrow{display:none}
.home-work .card-cue,.featured-grid .card-cue{display:flex;align-items:center;gap:12px;font-size:14px;line-height:1.4;letter-spacing:.015em;margin-top:18px;opacity:0;transform:translate3d(0,9px,0);transition:transform .55s var(--ease-out),opacity .35s;transition-delay:100ms}
.card-cue>span{display:inline-block;font-size:22px;line-height:1;transition:transform .5s var(--ease-out)}
.home-work .card-play,.featured-grid .card-play,.featured-grid .card-deck{display:none}
.home-work .project-card:is(:hover,:focus-visible) .card-veil,.featured-grid .project-card:is(:hover,:focus-visible) .card-veil{transform:none}
.home-work .project-card:is(:hover,:focus-visible) .card-info,.featured-grid .project-card:is(:hover,:focus-visible) .card-info,.home-work .project-card:is(:hover,:focus-visible) .card-cue,.featured-grid .project-card:is(:hover,:focus-visible) .card-cue{transform:none;opacity:1}
.home-work .project-card:is(:hover,:focus-visible) .card-edge,.featured-grid .project-card:is(:hover,:focus-visible) .card-edge{transform:none;opacity:1}
.home-work .project-card:is(:hover,:focus-visible) .card-cue>span,.featured-grid .project-card:is(:hover,:focus-visible) .card-cue>span{transform:translate3d(3px,-3px,0)}
.home-work .project-card:focus-visible,.featured-grid .project-card:focus-visible{outline:3px solid var(--ink);outline-offset:6px}
/* The film stays behind the opaque story panel, as on the original. */
.film-page #main{isolation:isolate}.film-page .header{position:fixed;inset:0 0 auto;background:transparent;border:0}.film-page .header:not(.scrolled){height:96px}.film-page .header:not(.scrolled) .brand-normal{display:none}.film-page .header:not(.scrolled) .brand-light{display:block}
.film-page .header.scrolled,.film-page:has(.mobile-nav:not([hidden])) .header{background:#fff}.film-page:has(.mobile-nav:not([hidden])) .brand-normal{display:block}.film-page:has(.mobile-nav:not([hidden])) .brand-light{display:none}
.film-page .project-hero{position:sticky;top:0;z-index:0;margin:0;height:100svh;min-height:560px;max-height:none;aspect-ratio:auto;overflow:hidden;background:#202020}
.film-page .project-hero>img{height:100%;width:100%;object-fit:cover;transform:translate3d(0,var(--project-drift,0px),0) scale(var(--project-scale,1.04));will-change:transform}
.project-hero:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#00000038,transparent 26%,transparent 60%,#00000066)}
.project-hero-controls{position:absolute;z-index:2;inset:auto var(--gutter) 38px;display:flex;align-items:center;justify-content:space-between;gap:24px;color:white}
.film-page .project-hero-controls .watch-button{position:relative;left:auto;bottom:auto;transform:none;padding:8px 22px 8px 8px;background:#fff;color:var(--ink);border-radius:80px;gap:14px;font-size:17px;box-shadow:0 4px 24px #00000018;transition:background .3s,color .3s}
.project-hero-controls .play-symbol{width:48px;height:48px;border-color:var(--red);background:var(--red);color:white}
.project-scroll{display:flex;align-items:center;gap:22px;font-size:16px;line-height:1.4}.project-scroll>span:last-child{display:grid;place-items:center;width:45px;height:45px;border:1px solid #ffffff90;border-radius:50%;transition:transform .4s,background .4s}.project-scroll:hover>span:last-child{transform:translateY(4px);background:#ffffff15}
.film-page .project-story{position:relative;z-index:2;background:white;padding-block:clamp(80px,7vw,120px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(55px,6vw,120px);align-items:start;scroll-margin-top:80px}
.project-sidebar{position:sticky;top:112px;align-self:start;max-height:calc(100svh - 142px);overflow:auto;scrollbar-width:thin;scrollbar-color:#e7402340 transparent;padding:0 10px 6px 0;outline-offset:8px}
.project-sidebar h1{color:var(--red);font-size:clamp(48px,4.6vw,86px);line-height:1.04;letter-spacing:-.045em;overflow-wrap:anywhere;text-wrap:balance}
.project-sidebar .breadcrumbs{margin-top:30px;color:#686868;font-size:14px;gap:9px;line-height:1.7}
.project-sidebar .project-summary{font-size:clamp(21px,1.55vw,27px);line-height:1.4;color:var(--red);margin-top:35px;max-width:40ch;text-wrap:pretty}
.project-sidebar .pill{margin-top:32px;font-size:15px;min-height:46px;padding:11px 21px;border-color:var(--red);color:var(--red);--button-fill:var(--red)}.project-sidebar .pill:is(:hover,:focus-visible){color:#fff}
.project-copy{font-size:clamp(19px,1.25vw,23px);line-height:1.65}.project-copy h2{font-size:clamp(38px,3.1vw,56px);line-height:1.08;color:var(--red);margin:0 0 30px}.project-copy p{margin:0 0 30px;max-width:70ch}.project-copy p:last-child{margin-bottom:0}.project-copy img{margin-block:30px}.project-copy a{color:var(--red);text-decoration:underline;text-underline-offset:4px}
.project-ribbon-stage{position:sticky;top:80px;z-index:3;background:#fff;isolation:isolate}
.project-ribbon{background:var(--red);color:white;text-align:center;padding-block:90px 125px;clip-path:polygon(0 0,100% 0,100% 84%,50% 100%,0 84%)}
.project-ribbon p{max-width:1100px;margin:auto;font-size:clamp(25px,2.2vw,38px);line-height:1.4;text-wrap:balance}.project-ribbon .pill{margin-top:38px}
.film-page .related{position:relative;z-index:4;background:white;padding-top:95px;padding-bottom:100px}.film-page .related .section-heading{align-items:end;margin-bottom:50px}.film-page .related h2{font-size:clamp(44px,5vw,80px)}.film-page .related .work-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.featured-grid .project-card .card-info h3{font-size:clamp(28px,2.4vw,40px)}.film-page .related .project-card:last-child{display:block}
/* Original red footer, with a clearer hierarchy and usable controls. */
.footer{position:relative;z-index:5;background:var(--red);color:#fff;padding-block:70px 28px}
.footer-top{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1.35fr);gap:clamp(35px,4vw,72px);padding-bottom:55px;align-items:start}
.footer .footer-top>div{grid-column:auto}.footer-logo{width:100%;max-width:330px;filter:none}.footer-identity p{margin-top:25px;font-size:19px;letter-spacing:-.015em}
.footer .eyebrow{font-size:13px;letter-spacing:.12em;color:#fff;opacity:.85;margin-bottom:22px}.footer address{font-style:normal;font-size:17px;line-height:1.65}
.footer a{transition:color .3s,opacity .3s}.footer a:hover{text-decoration:none}.footer .footer-email{display:flex!important;align-items:center;gap:14px;font-size:clamp(18px,1.7vw,29px);letter-spacing:-.025em;line-height:1.35;margin-bottom:15px;overflow-wrap:anywhere}
.footer-email>span{transition:transform .4s var(--ease-out);font-size:25px}.footer-email:hover>span{transform:translate3d(3px,-3px,0)}
.footer-socials{display:flex;gap:10px;flex-wrap:wrap;margin-top:27px}
.footer .social-icon{position:relative;display:grid!important;place-items:center;width:44px!important;height:44px;border:1px solid #ffffff85;border-radius:8px;overflow:visible;color:white;transition:background .35s,color .35s,transform .5s var(--ease-out),border-color .35s}
.social-icon svg{width:22px;height:22px}.footer .social-icon:is(:hover,:focus-visible){background:white;color:var(--red);transform:translateY(-4px);border-color:white}
.footer .social-icon:after{display:none!important}.social-label{position:absolute;bottom:calc(100% + 10px);background:white;color:var(--red);font-size:12px;line-height:1;padding:7px 9px;border-radius:4px;opacity:0;transform:translateY(4px);transition:opacity .25s,transform .35s;pointer-events:none}.social-icon:is(:hover,:focus-visible) .social-label{opacity:1;transform:none}
.footer-navigation{border-block:1px solid #ffffff45;padding-block:27px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.footer-navigation nav{display:flex;gap:clamp(25px,3vw,52px);flex-wrap:wrap}.footer-navigation nav a{font-family:var(--serif);font-size:28px;line-height:1.2;letter-spacing:-.02em}
.back-top{width:46px;height:46px;flex-shrink:0;border:1px solid #ffffff85;background:transparent;color:white;border-radius:50%;font-size:25px;display:grid;place-items:center;transition:background .35s,color .35s,transform .5s var(--ease-out)}.back-top:hover{background:white;color:var(--red);transform:translateY(-3px)}
.footer-bottom{border:0;padding-top:26px;color:#fff;font-size:14px;align-items:center}.footer-bottom>div{margin:0;gap:24px}.footer-bottom a,.footer-bottom button{font-size:14px;color:#fff}.footer .link-button{text-decoration:none;position:relative;padding-block:4px}
.footer .link-button:after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:white;transform:scaleX(0);transform-origin:right;transition:transform .4s}.footer .link-button:hover:after{transform:scaleX(1);transform-origin:left}.footer :is(a,button):focus-visible{outline-color:white}
@media(max-width:1100px){.footer-top{grid-template-columns:1fr 1fr;gap:40px}.footer-contact{grid-column:2!important}.footer-identity{grid-row:1/3}.footer-logo{max-width:300px}.film-page .related .work-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.project-sidebar h1{font-size:clamp(44px,5vw,64px)}.project-sidebar .project-summary{font-size:21px}}
@media(max-width:800px){.film-page .project-hero{height:100svh;min-height:520px}.film-page .project-story{grid-template-columns:1fr;gap:50px;padding-block:65px}.project-sidebar{position:relative;top:auto;max-height:none;overflow:visible;padding:0}.project-sidebar h1{font-size:clamp(48px,8vw,68px);max-width:90%}.project-sidebar .project-summary{max-width:44ch;font-size:23px;margin-top:27px}.project-sidebar .breadcrumbs{margin-top:24px}.project-copy{font-size:20px;line-height:1.65}.project-copy h2{font-size:44px}.project-ribbon-stage{position:relative;top:0}.project-ribbon{padding-block:65px 100px}.film-page .related{padding-block:65px}.project-hero-controls{bottom:28px;gap:16px}.project-scroll{font-size:14px;gap:12px}.film-page .header:not(.scrolled){height:80px}.footer{padding-top:55px}.footer-navigation nav{gap:24px}.footer-navigation nav a{font-size:26px}.footer-bottom{display:flex;align-items:start;gap:25px}.footer-bottom>div{gap:15px}}
@media(max-width:500px){.home-work .project-card .card-info,.featured-grid .project-card .card-info{opacity:1;transform:none;left:20px;right:20px;bottom:22px}.home-work .project-card .card-info h3,.featured-grid .project-card .card-info h3{font-size:clamp(27px,7.7vw,34px)}.home-work .card-veil,.featured-grid .card-veil{transform:none;background:linear-gradient(0deg,#000000aa,transparent 80%)}.home-work .card-cue,.featured-grid .card-cue{opacity:1;transform:none;margin-top:12px;font-size:13px}.film-page .project-hero{min-height:500px}.film-page .project-hero-controls .watch-button{font-size:14px;padding:6px 15px 6px 6px;gap:10px}.project-hero-controls .play-symbol{width:40px;height:40px}.project-scroll>span:first-child{display:none}.project-scroll>span:last-child{width:40px;height:40px}.project-sidebar h1{font-size:clamp(43px,12vw,54px);max-width:100%}.project-sidebar .project-summary{font-size:21px;line-height:1.45}.project-sidebar .breadcrumbs{font-size:13px}.film-page .project-story{padding-block:50px;gap:45px}.project-copy{font-size:19px}.project-copy h2{font-size:38px}.project-ribbon p{font-size:24px}.project-ribbon{padding-block:60px 100px}.film-page .related .work-grid{grid-template-columns:1fr;gap:22px}.film-page .related .section-heading{display:block}.film-page .related h2{font-size:46px}.film-page .related .text-link{font-size:16px;margin-top:22px}.footer-top{grid-template-columns:1fr;gap:34px;padding-bottom:38px}.footer .footer-top>div{grid-column:auto!important;grid-row:auto}.footer-logo{max-width:290px}.footer-identity p{margin-top:16px;font-size:18px}.footer .eyebrow{margin-bottom:16px}.footer .footer-email{font-size:23px}.footer address{font-size:16px}.footer-socials{margin-top:24px}.footer-navigation{align-items:start;padding-block:27px;gap:20px}.footer-navigation nav{display:grid;grid-template-columns:1fr 1fr;gap:21px 30px}.footer-navigation nav a{font-size:27px}.footer-bottom{display:block}.footer-bottom>div{margin-top:18px;gap:14px 20px}.footer-bottom a,.footer-bottom button{font-size:13px}}
@media(hover:none) and (min-width:501px){.home-work .project-card .card-info,.featured-grid .project-card .card-info,.home-work .card-cue,.featured-grid .card-cue{opacity:1;transform:none}.home-work .card-veil,.featured-grid .card-veil{transform:none;background:linear-gradient(0deg,#000000ae,transparent 80%)}}
@media(prefers-reduced-motion:reduce){.film-page .project-hero,.project-sidebar,.project-ribbon-stage{position:relative;top:0}.project-sidebar{max-height:none;overflow:visible}.film-page .project-hero>img{transform:none}.card-edge,.card-veil,.card-info,.card-cue,.social-icon,.project-scroll{transition:none!important}}
.project-motion{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none;opacity:0;transition:opacity .85s}.project-motion iframe{position:absolute;left:50%;top:50%;width:max(100vw,177.78svh);height:max(100svh,56.25vw);transform:translate(-50%,-50%);border:0;pointer-events:none}.project-motion.is-playing{opacity:1}.project-hero:after{z-index:2}.project-hero-controls{z-index:3}.project-controls-left{display:flex;align-items:center;gap:16px}.project-preview-control{display:grid;place-items:center;width:46px;height:46px;border:1px solid #ffffffa0;border-radius:50%;background:#00000018;color:white;font-size:17px;transition:background .3s,transform .4s}.project-preview-control:hover{background:#ffffff20;transform:scale(1.05)}.project-preview-control[hidden]{display:none!important}
@media(prefers-reduced-motion:reduce){.project-motion{display:none}}