/* Shared cinematic direction. Native scroll timelines progressively enhance every route. */
@view-transition{navigation:none}
.cinema-hero{position:relative;isolation:isolate;height:100svh;min-height:640px;overflow:clip;background:#131313;color:#fff;display:grid;place-items:center;padding:130px 5vw 110px}
.cinema-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.cinema-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0005,#0005 55%,#000a);z-index:-1}
.cinema-heading{text-align:center;width:100%;max-width:1400px}
.cinema-heading .eyebrow{color:#fff;letter-spacing:.18em;margin-bottom:28px}
.cinema-heading h1{font-family:Barlow,sans-serif;font-size:clamp(70px,10.5vw,170px);font-weight:800;line-height:.88;text-transform:uppercase;letter-spacing:-.025em;color:transparent;-webkit-text-stroke:1.5px #fff;text-wrap:balance;margin:0}
.cinema-bottom{position:absolute;bottom:32px;left:5vw;right:5vw;display:flex;justify-content:space-between;align-items:center;gap:24px;font-size:13px}
.cinema-bottom a{display:flex;gap:35px;align-items:center;color:#fff}.cinema-bottom a span{font-size:30px}.cinema-bottom small{font-size:9px;letter-spacing:.12em}.cinema-bottom .motion-switch{color:#fff;border-color:#ffffff66}
.cinema-legal{height:65svh;min-height:460px}.cinema-legal h1{font-size:clamp(60px,8vw,120px);color:#fff;-webkit-text-stroke:0}
#page-content{scroll-margin-top:75px}.inner-page #page-content>.detail-hero,.inner-page #page-content>.label-hero,.inner-page #page-content>.catalogue,.inner-page #page-content>.brief-page{padding-top:90px}
.detail-hero h2,.label-hero h2{font-family:Barlow,sans-serif;font-size:clamp(55px,6vw,96px);line-height:.95;letter-spacing:-.02em;font-weight:800;margin:35px 0}.detail-hero h2 em,.label-hero h2 em{font-style:normal;color:#c9252b}
.catalogue>.section-heading h2,.brief-layout>aside>h2{font-family:Barlow,sans-serif;font-size:clamp(50px,5vw,80px);line-height:.95}
.detail-blocks article{transition:background .35s,color .35s}.detail-blocks article:hover{background:#f4f2ef}
.detail-hero figure{overflow:clip}.detail-hero figure img{transition:transform 1.2s cubic-bezier(.22,1,.36,1)}.detail-hero figure:hover img{transform:scale(1.035)}
.js .reveal{transition-duration:1s;transition-timing-function:cubic-bezier(.22,1,.36,1)}
.catalogue-card{transition:opacity .6s,transform .6s}.catalogue-card img{transition:transform 1.1s cubic-bezier(.22,1,.36,1)}.catalogue-card:hover img{transform:scale(1.06)}
.route-curtain{position:fixed;inset:0;z-index:9999;background:#c9252b;pointer-events:none;transform:translateY(-101%);transition:transform .38s cubic-bezier(.76,0,.24,1)}
.route-curtain:after{content:'BFD®';position:absolute;inset:0;display:grid;place-items:center;font:800 clamp(100px,22vw,300px)/1 Barlow,sans-serif;color:white}.route-leaving .route-curtain{transform:translateY(0)}
@keyframes cinema-image-out{from{transform:scale(1.04) translateY(0)}to{transform:scale(1.18) translateY(15%)}}
@keyframes cinema-heading-out{from{transform:translateY(0);opacity:1}to{transform:translateY(110px);opacity:0}}
@keyframes cinema-image-in{from{clip-path:inset(12% 8%);transform:scale(.94)}to{clip-path:inset(0);transform:scale(1)}}
@supports(animation-timeline:view()){@media(prefers-reduced-motion:no-preference){
 html:not(.paused) .cinema-hero,html:not(.paused) .opening{view-timeline-name:--hero;view-timeline-axis:block}
 html:not(.paused) .cinema-image,html:not(.paused) .opening-visual>img{animation:cinema-image-out linear both;animation-timeline:--hero;animation-range:exit 0% exit 100%}
 html:not(.paused) .cinema-heading,html:not(.paused) .opening-heading{animation:cinema-heading-out linear both;animation-timeline:--hero;animation-range:exit 0% exit 85%}
 html:not(.paused) .detail-hero figure,html:not(.paused) .visual-band,html:not(.paused) .label-visual{animation:cinema-image-in linear both;animation-timeline:view();animation-range:entry 0% entry 90%}
}}
@media(min-width:901px){.journey{display:grid;grid-template-columns:1fr 1fr;column-gap:7vw;align-items:start}.journey>.section-kicker{grid-column:1/-1}.journey>.section-heading{position:sticky;top:145px;display:block}.journey>.section-heading p{margin-top:35px}.journey-steps{display:block}.journey-steps>li{min-height:50vh;padding:70px 0;border-top:1px solid #ccc}.journey-steps h3{font-size:38px}.journey-steps>li>span{font-size:70px;line-height:1;color:#c9252b}.journey-steps>li p{max-width:400px}}
@media(max-width:700px){.cinema-hero{min-height:590px;padding-inline:22px}.cinema-heading h1{font-size:clamp(60px,16vw,100px);-webkit-text-stroke:1px #fff}.cinema-bottom{left:22px;right:22px;bottom:25px;flex-wrap:wrap;gap:16px}.cinema-bottom small{width:100%;order:3}.cinema-heading .eyebrow{font-size:10px}.cinema-hero .cinema-image{object-position:55% center}.cinema-legal{min-height:450px}.inner-page #page-content>.detail-hero,.inner-page #page-content>.label-hero,.inner-page #page-content>.catalogue,.inner-page #page-content>.brief-page{padding-top:48px}}
.paused .route-curtain{transition:none}.paused .cinema-image,.paused .cinema-heading,.paused .opening-heading{animation:none!important}.paused .journey>.section-heading{position:static}
@media(prefers-reduced-motion:reduce){.route-curtain{display:none}.cinema-image,.cinema-heading,.opening-heading{animation:none!important}.journey>.section-heading{position:static}}

.inner-page:not(.experience-home) .site-header{position:fixed;background:transparent;color:white;mix-blend-mode:difference}.inner-page:not(.experience-home) .site-header .brand>span{color:white}.inner-page:not(.experience-home) .mobile-menu{inset:0;padding-top:130px;background:#050505;animation:immersive-menu 650ms var(--ease)}
.inner-page:not(.experience-home) .mobile-group>summary,.inner-page:not(.experience-home) .mobile-menu>a{text-transform:uppercase;font-size:clamp(35px,5vw,76px)}
@media(max-width:760px){.inner-page:not(.experience-home) .mobile-menu{top:0;padding-top:110px}.inner-page:not(.experience-home) .mobile-group>summary,.inner-page:not(.experience-home) .mobile-menu>a{font-size:36px}}
.inner-page:not(.experience-home) .site-header .brand,.inner-page:not(.experience-home) .site-header .menu-toggle{color:#fff}
@media(prefers-reduced-motion:reduce){.inner-page:not(.experience-home) .mobile-menu{animation:none}}
.paused .mobile-menu{animation:none!important}
@keyframes title-arrival{from{opacity:0;transform:translateY(45px);clip-path:inset(100% 0 0)}to{opacity:1;transform:translateY(0);clip-path:inset(0)}}
@media(prefers-reduced-motion:no-preference){html:not(.paused) .cinema-heading h1,html:not(.paused) .opening-heading h1{animation:title-arrival 1.1s cubic-bezier(.22,1,.36,1) both}}
@media(max-width:700px){.cinema-heading h1{font-size:clamp(32px,12vw,84px);overflow-wrap:normal}.detail-hero h2,.label-hero h2{font-size:clamp(38px,14vw,64px)}}

.experience-home .opening-visual>.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s;pointer-events:none}.experience-home .opening-visual>.hero-video.is-playing{opacity:1}.paused .opening-visual>.hero-video{opacity:0!important}.opening-visual .visual-scroll,.opening-visual figcaption{z-index:2}
@media(prefers-reduced-motion:reduce){.experience-home .opening-visual>.hero-video{display:none}}