/* The film and project sequence use native scroll timelines. Regular layouts are the fallback. */
:root{--bg:#10110f;--panel:#1b1c19;--ink:#f1f1e9;--muted:#a1a39a;--accent:#ff7045;--line:#f1f1e933;--pad:clamp(22px,4.2vw,80px)}
body{background:var(--bg)}
.site-header{position:fixed;height:86px;border:0;padding:0 var(--pad);z-index:40;background:#10110fe8;backdrop-filter:blur(12px)}
body[data-page=home] .site-header{background:#10110fc9;backdrop-filter:blur(12px)}
.brand{gap:16px}.brand-mark{font-size:32px;font-weight:800;letter-spacing:-2.6px}.brand-name{font-size:8px;letter-spacing:1.4px;border:0;padding:0;line-height:1.5}
.site-header nav{gap:34px;font-size:11px}.site-header nav a{color:var(--ink)}
.header-contact{font-size:11px;border-bottom:0;gap:24px}.header-contact span{font-size:23px}
.hero.hero-runway{height:auto;min-height:0;max-height:none;display:block;overflow:clip;isolation:auto;background:var(--bg)}
.hero-stage{height:100svh;min-height:640px;position:relative;overflow:hidden;isolation:isolate;background:var(--bg)}
.hero-visual{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero .hero-media,.hero .hero-still{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;animation:none;translate:none;transform:none;z-index:0}
.hero-shade{z-index:1;background:linear-gradient(180deg,#10110f55,transparent 30%,transparent 65%,#10110f99)}
.hero-shutter{position:absolute;inset:0;z-index:2;background:url('assets/bsk-shutter.svg') center/100% 100% no-repeat;transform-origin:55% 47%;pointer-events:none}
.hero-discipline{position:absolute;top:98px;left:var(--pad);z-index:4;display:flex;gap:32px;font-size:9px;letter-spacing:1.1px;line-height:1.5}
.hero-copy{position:absolute;left:var(--pad);right:var(--pad);bottom:34px;z-index:5;width:auto;padding:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:40px}
.hero .hero-copy h1{font-size:clamp(18px,1.8vw,29px);font-weight:450;line-height:1.17;letter-spacing:-.6px;max-width:300px;animation:none}
.reel-button{display:flex;flex-direction:column;align-items:center;gap:13px;padding:0;font-size:8px;letter-spacing:1px}
.reel-play{width:74px;height:74px;display:grid;place-items:center;border:1px solid #ffffff80;border-radius:50%;font-size:27px;transition:background .4s,scale .4s var(--ease)}
.reel-button:hover .reel-play{background:var(--accent);border-color:var(--accent);scale:1.12;color:var(--bg)}
.scene-picker{justify-self:end;text-align:right}.scene-name{display:block;font-size:10px;margin-bottom:10px}.scene-options{display:flex;gap:8px}.scene-options button{width:72px;height:45px;padding:0;opacity:.5;position:relative;transition:opacity .3s,transform .4s}
.scene-options img{width:100%;height:100%;object-fit:cover}.scene-options button[aria-pressed=true]{opacity:1}.scene-options button[aria-pressed=true]::after{content:'';position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--accent)}.scene-options button:hover{opacity:1;transform:translateY(-4px)}
.hero-stage>.playback{position:absolute;right:var(--pad);top:88px;z-index:5;font-size:8px;letter-spacing:1px;padding:4px 0}.hero-stage>.playback span{border:0;font-size:16px}
.scene-status{position:absolute;z-index:6;right:var(--pad);bottom:145px;font-size:12px;background:var(--bg)}
.scene-status:empty{display:none}
.hero-open-label{position:absolute;left:var(--pad);top:40%;z-index:3;font-size:clamp(60px,9vw,150px);font-weight:600;letter-spacing:-.07em;line-height:.92;opacity:0;pointer-events:none}
.project-intro{padding:130px var(--pad) 80px;display:flex;justify-content:space-between;align-items:end;gap:30px;overflow:hidden}
.project-intro .small-label{font-size:9px;letter-spacing:1.6px;margin-bottom:30px;color:var(--muted)}
.project-intro h2{font-size:clamp(64px,12vw,200px);line-height:.85;letter-spacing:-.08em;font-weight:500;text-transform:uppercase}.project-intro h2 span{color:var(--accent)}
.index-link{display:inline-flex;align-items:center;gap:35px;padding:15px 0;font-size:12px;border-bottom:1px solid var(--line);white-space:nowrap}.index-link span{font-size:25px;transition:transform .3s}.index-link:hover span{transform:translate(5px,-5px)}
.project-runway{position:relative}.project-stage{position:relative;overflow:hidden}.project-track{display:flex;flex-direction:column}
.project-scene{position:relative;min-height:100svh;isolation:isolate;overflow:hidden}.project-scene>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.project-scene-shade{position:absolute;inset:0;background:linear-gradient(0deg,#080b07d9,transparent 65%,#080b0770);z-index:-1}
.project-scene-meta{position:absolute;top:110px;left:var(--pad);right:var(--pad);display:flex;justify-content:space-between;font-size:11px;letter-spacing:.5px}
.project-scene-caption{position:absolute;bottom:115px;left:var(--pad);right:var(--pad);display:flex;align-items:end;justify-content:space-between;gap:30px}
.project-scene-caption h2{font-size:clamp(66px,10vw,170px);max-width:900px;font-weight:500;line-height:.9;letter-spacing:-.075em}
.project-open{flex-shrink:0;display:flex;flex-direction:column-reverse;align-items:center;gap:15px;padding:0;font-size:10px}
.project-open>span[aria-hidden]{display:grid;place-items:center;width:92px;height:92px;border-radius:50%;background:var(--accent);color:#11130e;font-size:48px;transition:transform .4s var(--ease),background .4s}
.project-open:hover>span[aria-hidden]{transform:rotate(45deg);background:var(--ink)}
.chapter-navigation{position:absolute;bottom:24px;left:var(--pad);right:var(--pad);z-index:4;display:flex;gap:0;border-top:1px solid #ffffff50;padding-top:12px}
.chapter-navigation button{width:33.333%;text-align:left;font-size:10px;padding:12px 10px 12px 0;color:#e4e5dc;transition:color .25s}.chapter-navigation button:hover{color:var(--accent)}
.film-intro{padding:130px var(--pad) 50px;display:flex;justify-content:space-between;align-items:end;gap:30px}.film-intro h2{font-size:clamp(55px,9vw,148px);letter-spacing:-.075em;font-weight:500;line-height:.92;position:relative}.film-count{font-size:14px;color:var(--accent);letter-spacing:-.3px;vertical-align:top;padding-left:10px;display:inline-block;margin-top:12px}.film-intro>p{max-width:220px;font-size:12px;line-height:1.6;color:var(--muted)}
.film-reel{min-height:85svh;margin:0 var(--pad);position:relative;isolation:isolate;overflow:hidden}.film-background{position:absolute;inset:-10% 0;width:100%;height:120%;object-fit:cover;z-index:-2}.film-reel-shade{position:absolute;inset:0;background:linear-gradient(0deg,#0c100bcf,transparent 75%);z-index:-1}
.film-reel-play{position:absolute;top:40%;left:50%;transform:translate(-50%,-50%);width:130px;height:130px;border:1px solid #ffffff9c;border-radius:50%;background:#ffffff0a;backdrop-filter:blur(6px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;transition:background .4s,scale .4s}.film-reel-play>span:first-child{font-size:40px;line-height:1}.film-reel-play>span:last-child{font-size:8px;letter-spacing:1px}.film-reel-play:hover{scale:1.1;background:var(--accent);color:var(--bg);border-color:var(--accent)}
.film-reel-caption{position:absolute;left:36px;right:36px;bottom:32px;display:flex;justify-content:space-between;align-items:end;gap:24px}.film-reel-caption h3{font-size:clamp(48px,6vw,95px);font-weight:450;line-height:.94;letter-spacing:-.055em}
.studio-outro{display:grid;grid-template-columns:1fr 2.4fr;gap:60px;padding:145px var(--pad)}.studio-outro>.small-label{font-size:10px}.studio-outro h2{font-size:clamp(65px,8vw,130px);font-weight:400;letter-spacing:-.07em;line-height:1.04}.studio-outro-bottom{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-top:40px}.studio-outro-bottom p{color:var(--muted);max-width:260px;font-size:13px;line-height:1.7}
footer{background:var(--bg);padding-top:65px;border-color:var(--line);overflow:hidden}.footer-top>p{font-size:9px;letter-spacing:1px}.footer-top>a{font-size:clamp(55px,11vw,180px);font-weight:450;line-height:1;letter-spacing:-.07em;padding-bottom:70px}.footer-top>a>span{font-size:.85em;color:var(--accent)}.footer-wordmark{font-size:26px;font-weight:700;letter-spacing:-2px}.footer-bottom{font-size:10px;padding:25px 0}
.page-head{padding-top:160px;padding-bottom:65px}.page-head h1{font-size:clamp(66px,11vw,180px);font-weight:500;letter-spacing:-.075em;line-height:.98}.page-head p:not(.eyebrow){font-size:13px;max-width:420px}.section-title h2{font-size:clamp(35px,5vw,80px);line-height:1}.project-info h3{font-size:27px}.project-info p,.project-info>span{font-size:10px}.project-card:nth-child(3){width:100%}.project-grid{gap:80px 35px}.image-wrap img{aspect-ratio:1.15}.project-card:nth-child(3) .image-wrap img{aspect-ratio:1.95}
.archive-grid{grid-template-columns:repeat(3,1fr);grid-auto-rows:clamp(180px,23vw,350px);gap:12px}.archive-item:nth-child(7n+1){grid-column:span 2}.archive-item img{height:100%;aspect-ratio:auto}.archive-head{margin-top:130px}.films-grid{gap:80px 35px}.film-card h2{font-size:26px}.film-card:first-child .film-image>span span{width:110px;height:110px;font-size:30px}.film-image>span span{background:#10110f33;backdrop-filter:blur(5px)}
.studio-image{max-height:80svh;aspect-ratio:1.8}.studio-copy{padding:100px 0}.studio-copy h2{font-size:clamp(40px,5vw,80px);letter-spacing:-.055em;line-height:1.05}.people{gap:60px}.person{grid-template-columns:150px 1fr}.person img{width:150px;height:190px;filter:none}.person h3{font-size:30px}.person p{font-size:12px}.quote{font-size:clamp(30px,4vw,64px);line-height:1.2;max-width:1000px;margin-top:120px}.quote cite{margin-top:30px}
.offers{gap:30px}.offer{background:transparent;border-top:1px solid var(--line);padding:35px 0}.offer h2{font-size:clamp(48px,5vw,78px);margin:10px 0 30px}.offer ul{margin-top:45px}.offer li{padding:17px 0}.offer:first-child{padding-right:35px}.offer:nth-child(2){padding-left:35px;border-top-color:var(--accent)}.offer:nth-child(2)>h2{color:var(--accent)}.offer>p{min-height:52px}.contact-layout{padding-bottom:140px}.contact-details h2{font-size:40px;line-height:1.12;letter-spacing:-1px}.contact-details>a{font-size:14px}.contact-form{gap:32px}.solid-link{background:var(--accent);padding:18px 24px}.solid-link:hover{background:var(--ink)}
.viewer{width:100vw;height:100dvh;max-height:100dvh;max-width:100vw;margin:0;border:0;padding:28px var(--pad);background:#10110ff5}.viewer-top{margin-bottom:20px}.viewer-top h2{font-size:23px;letter-spacing:-.5px}#viewer-media img,#viewer-media video{height:calc(100dvh - 180px);object-fit:contain;background:transparent}.viewer-bottom{margin-top:18px}.viewer-controls button{border-radius:50%}.close-viewer span{font-size:32px}
.motion .reveal{transition-duration:.65s}.motion .reveal.seen{opacity:1;transform:none}
@keyframes shutter-open{0%{transform:scale(1);opacity:1}65%{opacity:1}100%{transform:scale(18);opacity:0}}
@keyframes hero-depth{from{transform:scale(1.14)}to{transform:scale(1)}}
@keyframes studio-title{0%,32%{opacity:0;translate:0 35px}62%,100%{opacity:1;translate:0 0}}
@keyframes project-pan{0%,10%{transform:translateX(0)}40%,50%{transform:translateX(-33.333333%)}80%,100%{transform:translateX(-66.666667%)}}
@keyframes reel-depth{from{translate:0 -6%}to{translate:0 6%}}
@keyframes title-rise{from{transform:translateY(70px);opacity:.1}to{transform:translateY(0);opacity:1}}
@supports(animation-timeline:view()){
 @media(prefers-reduced-motion:no-preference){
  .hero.hero-runway{height:210svh;view-timeline:--hero-story block}
  .hero-stage{position:sticky;top:0}
  .hero-shutter{animation:shutter-open linear both;animation-timeline:--hero-story;animation-range:contain 0% contain 80%}
  .hero-visual{animation:hero-depth linear both;animation-timeline:--hero-story;animation-range:contain 0% contain 100%}
  .hero-open-label{animation:studio-title linear both;animation-timeline:--hero-story;animation-range:contain 0% contain 100%}
  .project-intro{view-timeline:--project-intro block}.project-intro h2{animation:title-rise linear both;animation-timeline:--project-intro;animation-range:entry 0% entry 100%}
  .film-reel{view-timeline:--reel-depth block}.film-background{animation:reel-depth linear both;animation-timeline:--reel-depth;animation-range:cover 0% cover 100%}
 }
 @media(min-width:768px) and (prefers-reduced-motion:no-preference){
  .project-runway{height:360svh;view-timeline:--projects block}
  .project-stage{position:sticky;top:0;height:100svh}
  .project-track{flex-direction:row;width:300%;height:100%;animation:project-pan linear both;animation-timeline:--projects;animation-range:contain 0% contain 100%}
  .project-scene{width:33.333333%;flex-shrink:0;height:100%;min-height:0}
 }
}
@media(min-width:1600px){main>section.project-runway,main>section.hero-runway{max-width:none}}
@media(max-width:1024px){.site-header nav{gap:20px}.hero-copy{gap:20px}.project-intro{padding-top:100px}.project-intro h2{font-size:12vw}.project-scene-caption h2{font-size:11vw;max-width:78%}.project-open>span[aria-hidden]{width:75px;height:75px;font-size:38px}.person{grid-template-columns:95px 1fr}.person img{width:95px;height:135px}}
@media(max-width:767px){
 .site-header{height:76px}.brand-mark{font-size:29px}.brand-name{display:block;font-size:7px}.brand{gap:10px}.header-contact{font-size:9px;gap:12px}.header-contact span{font-size:21px}.menu-toggle{width:31px;padding-left:7px}.site-header.menu-open{mix-blend-mode:normal!important;background:var(--bg)!important}.site-header nav{top:76px;height:calc(100dvh - 76px);padding-top:55px}.site-header nav a{font-size:43px;letter-spacing:-2px}
 .hero-stage{min-height:620px}.hero-shutter{background-image:url('assets/bsk-shutter-mobile.svg');transform-origin:55% 46%}.hero-discipline{top:100px;font-size:8px;gap:12px}.hero-discipline span:last-child{display:none}.hero-stage>.playback{top:85px;font-size:0}.hero-stage>.playback span{font-size:15px}.hero-copy{bottom:28px;grid-template-columns:1fr 1fr;gap:28px 15px;align-items:end}.hero .hero-copy h1{font-size:20px;letter-spacing:-.7px;max-width:none;align-self:start}.reel-button{align-items:end;justify-self:end;font-size:7px;gap:10px}.reel-play{width:55px;height:55px;font-size:23px}.scene-picker{grid-column:1/-1;justify-self:stretch;display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:15px;border-top:1px solid #ffffff38}.scene-name{font-size:9px;text-align:left;margin:0}.scene-options button{width:59px;height:37px}.scene-options{gap:6px}.hero-open-label{font-size:13vw;top:39%;line-height:.96}.scene-status{bottom:190px;font-size:11px;left:var(--pad)}
 .project-intro{padding:75px var(--pad) 45px;display:block}.project-intro .small-label{font-size:8px;margin-bottom:25px}.project-intro h2{font-size:17vw;line-height:.89}.project-intro .index-link{margin-top:28px;font-size:10px}.index-link{font-size:10px;gap:20px}.project-track{gap:8px}.project-scene{min-height:82svh}.project-scene-meta{top:28px;font-size:9px}.project-scene-caption{bottom:44px;gap:15px;align-items:end}.project-scene-caption h2{font-size:15vw;max-width:75%;line-height:.96;letter-spacing:-.065em}.project-open{font-size:8px;gap:9px}.project-open>span[aria-hidden]{width:49px;height:49px;font-size:26px}.chapter-navigation{display:none}
 .film-intro{padding:80px var(--pad) 30px;display:block}.film-intro h2{font-size:14vw;letter-spacing:-.07em}.film-count{font-size:9px;padding-left:5px;margin-top:4px}.film-intro>p{margin-top:22px;font-size:11px;max-width:none}.film-reel{min-height:75svh;margin:0 12px}.film-reel-play{width:92px;height:92px}.film-reel-play>span:first-child{font-size:30px}.film-reel-play>span:last-child{font-size:7px}.film-reel-caption{left:22px;right:22px;bottom:28px;display:block}.film-reel-caption h3{font-size:15vw}.film-reel-caption .index-link{margin-top:20px}
 .studio-outro{display:block;padding:80px var(--pad)}.studio-outro>.small-label{font-size:9px;margin-bottom:32px}.studio-outro h2{font-size:16vw;line-height:1.06}.studio-outro-bottom{display:block;margin-top:28px}.studio-outro-bottom p{font-size:12px;max-width:270px}.studio-outro-bottom .index-link{margin-top:15px}
 footer{padding-top:50px}.footer-top>a{font-size:12vw;padding-bottom:45px;gap:15px}.footer-bottom{font-size:8px;gap:25px 15px}.footer-wordmark{font-size:28px}.footer-top>p{font-size:8px;margin-bottom:25px}.page-head{padding-top:135px;padding-bottom:45px}.page-head h1{font-size:17vw}.page-head p:not(.eyebrow){font-size:12px;margin-top:25px}.project-grid{gap:40px}.project-info h3{font-size:24px}.project-card:nth-child(3) .image-wrap img{aspect-ratio:1.15}.archive-grid{grid-template-columns:1fr 1fr;grid-auto-rows:160px;gap:8px}.archive-item:nth-child(7n+1){grid-column:span 2}.archive-head{margin-top:75px}.section-title h2{font-size:32px;max-width:240px}.films-grid{gap:38px}.film-card:first-child .film-image>span span{width:65px;height:65px;font-size:22px}.film-card h2{font-size:23px}.studio-copy{padding:50px 0}.studio-copy h2{font-size:42px}.person{grid-template-columns:90px 1fr}.person img{width:90px;height:125px}.person h3{font-size:26px}.people{gap:38px}.quote{font-size:30px;margin-top:70px}.offers{gap:35px}.offer:first-child,.offer:nth-child(2){padding:25px 0}.offer h2{font-size:55px;margin-top:5px}.contact-layout{padding-bottom:70px}.contact-details h2{font-size:35px}.contact-details>a{font-size:13px}.viewer{padding:18px 18px}.viewer-top h2{font-size:17px}#viewer-media img,#viewer-media video{height:calc(100dvh - 225px)}
}
@media(prefers-reduced-motion:reduce){.hero-shutter{transform:none}.hero-open-label{display:none}.project-track{transform:none}.hero-visual,.film-background{animation:none;translate:none}.project-scene-caption{bottom:60px}.chapter-navigation{position:static;padding:20px var(--pad);border:0;background:var(--bg)}.hero.hero-runway{height:auto}}
@media(prefers-reduced-transparency:reduce){.film-reel-play{background:var(--bg);backdrop-filter:none}.site-header{background:var(--bg);backdrop-filter:none}}
