/* The navigation belongs to the scene. A solid surface appears only after scrolling. */
body{background:#080d12;background-image:none}
.utility{position:absolute;inset:0 0 auto;z-index:51;background:transparent;border:0;color:#e4edf0}
.utility .container{height:37px;border-bottom:1px solid #f0f6f426}
.header-social a{color:#e4edf0}
.site-header{position:fixed;top:37px;inset-inline:0;background:transparent;border:0;box-shadow:none;backdrop-filter:none;transition:top .3s,background .3s,backdrop-filter .3s;z-index:50}
.site-header:after{display:none}
.nav-wrap{height:87px;border-bottom:1px solid #edf6f32b}
.site-header .brand img{width:218px;height:auto;filter:brightness(0) invert(1);opacity:1}
.nav-wrap nav a,.header-phone{color:#f2f6f5;text-shadow:0 1px 15px #0009}
.header-cta{background:#ecf2e910;color:#fff;border-color:#ffffff70;border-radius:0;backdrop-filter:blur(10px)}
.is-scrolled .site-header,.menu-open .site-header{top:0;background:#080d12e8;backdrop-filter:blur(18px)}
.is-scrolled .nav-wrap{height:76px;border-bottom-color:#e4edf019}
.nojs-nav{padding-top:128px}
.inner-hero,.work-intro,.project-detail-hero{padding-top:178px}
.inner-hero.with-image{min-height:85svh;display:flex;align-items:flex-end;padding-bottom:75px}
.inner-hero.with-image>.container{position:static;display:block}
.inner-hero.with-image .inner-copy{max-width:780px;position:relative;z-index:2}
.inner-hero.with-image h1{font-size:clamp(52px,6.6vw,102px);max-width:830px}
.inner-hero.with-image h1 em{color:#d5edec}
.inner-hero.with-image .inner-copy>p{max-width:510px;color:#e4edef}
.inner-hero.with-image figure{position:absolute;z-index:-1;inset:0;margin:0;overflow:hidden;border:0;border-radius:0;width:100%;height:100%;min-height:0;max-height:none;box-shadow:none}
.inner-hero.with-image figure:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#061017ed 5%,#06101780 52%,#06101728),linear-gradient(0deg,#080d12b3,transparent 65%)}
.inner-hero.with-image figure img{width:100%;height:100%;max-height:none;object-fit:cover;object-position:65% 45%;opacity:.92}
.inner-hero.with-image figcaption{position:absolute;bottom:12px;right:32px;z-index:1;max-width:430px;background:#080d1299;color:#d6e0e4;padding:7px 12px;font-size:9px}
.cinema-hero{--cinema-header:0px}
.cinema-pin{min-height:680px;height:100svh}
.cinema-scroll-ready{height:240svh}
.cinema-scroll-ready .cinema-pin{top:0}
.cinema-content{padding-top:190px;padding-bottom:160px;justify-content:center}
.cinema-content h1{max-width:850px;font-size:clamp(58px,6.6vw,108px);letter-spacing:-.065em;line-height:1.025}
.cinema-content h1 em{color:#e0eee9}
.cinema-intro{font-size:18px;max-width:410px;line-height:1.65;color:#dde7e7}
.cinema-local{font-size:11px;color:#d3e0e0}
.cinema-primary{background:#dcece4;color:#122725;min-height:53px}
.cinema-primary:hover{background:#f1faf6}
.cinema-shade{background:linear-gradient(90deg,#071016b8 0%,#07101678 35%,#07101615 72%),linear-gradient(0deg,#080d12eb 0%,transparent 34%,transparent 68%,#061018ac 100%)}
.cinema-poster,.cinema-video{object-position:60% 50%}
.cinema-bottom{min-height:105px;border-top-color:#d7e5df40;bottom:0}
.cinema-caption{font-size:9px;max-width:110px;line-height:1.5}
.cinema-controls button{border:0;border-bottom:1px solid #abcbd177;background:transparent;color:#e9f3f2;backdrop-filter:none}
.cinema-status{color:#ccdfe1}
.cinema-progress{background:#ffffff20}
.cinema-progress>span{background:#9fe8e7}
.service-grid{gap:0;border-top:1px solid var(--line)}
.service-card{border-radius:0;background:transparent;box-shadow:none;border:0;border-bottom:1px solid var(--line);padding:36px 28px}
.service-card:hover{background:#d9f6ef06;box-shadow:none;transform:none}
.guide-card{background:transparent;border-radius:0;box-shadow:none}
.guide-art{border-radius:0}
.closing-cta{background:#112325;color:#edf6f0;border-top:1px solid #84b6b338}
.closing-cta h2 em{color:#b8ddd4}
.closing-cta .button{background:#dcece4;border-color:#dcece4}
.site-footer{background:#070c10}
.floating-text{border-radius:0}
.message-page{padding-top:190px}
@media(max-width:1050px){.nav-wrap{gap:17px}.site-header .brand img{width:185px}.cinema-content h1{max-width:660px;font-size:74px}.cinema-content{padding-top:170px}.cinema-status{display:none}}
@media(max-width:760px){
 .utility .container{height:31px}.utility .container>span{display:none}.header-social{width:100%;justify-content:space-between}.header-social a{font-size:8px;min-height:29px}
 .site-header{top:31px}.nav-wrap{height:70px}.site-header .brand img{width:174px}.is-scrolled .nav-wrap{height:65px}
 .site-header #main-nav.open{top:69px;background:#0a151ef7;backdrop-filter:blur(18px);border-radius:0;border-color:#d3ebe32b}
 .is-scrolled .site-header #main-nav.open,.menu-open .site-header #main-nav.open{top:64px}
 .inner-hero,.work-intro,.project-detail-hero{padding-top:148px}
 .inner-hero.with-image{min-height:790px;padding-bottom:90px;align-items:flex-end}
 .inner-hero.with-image h1{font-size:clamp(45px,10.3vw,75px)}
 .inner-hero.with-image figure{inset:0}
 .inner-hero.with-image figure:after{background:linear-gradient(0deg,#071016f5 0%,#071016bb 32%,#07101633 77%,#07101699)}
 .inner-hero.with-image figcaption{right:12px;left:12px;bottom:12px;max-width:none;font-size:8px}
 .cinema-pin,.cinema-scroll-ready .cinema-pin{min-height:900px;height:100svh}
 .cinema-content{height:100%;min-height:inherit;padding-top:190px;padding-bottom:150px;justify-content:flex-end}
 .cinema-content h1{font-size:clamp(47px,11.5vw,82px);max-width:600px}
 .cinema-eyebrow{font-size:8px;margin-bottom:19px;letter-spacing:.07em}
 .cinema-intro{margin-top:24px;font-size:15px;line-height:1.55;max-width:280px}
 .cinema-local{font-size:10px;max-width:280px;line-height:1.7}
 .cinema-media{inset:0}.cinema-poster,.cinema-video{height:100%;object-position:65% 50%}
 .cinema-shade{background:linear-gradient(0deg,#071016f5 0%,#071016a8 38%,#07101610 76%,#071016a6 100%)}
 .cinema-actions{gap:22px;margin-top:23px}.cinema-primary{font-size:11px;gap:23px}.cinema-call{font-size:10px}
 .cinema-credentials{font-size:10px;margin-top:18px}
 .cinema-bottom{padding-top:16px;padding-bottom:20px;min-height:110px;gap:14px;align-items:center}
 .cinema-caption{display:none}.cinema-work-link{font-size:10px;gap:14px}.cinema-controls{gap:6px;margin-left:auto}.cinema-controls button{padding:8px;font-size:9px}.cinema-controls [data-cinema-replay]{font-size:21px}
 .service-card{padding:28px 15px}.message-page{padding-top:150px}
}
@media(max-width:365px){.cinema-content h1{font-size:43px}.cinema-actions{gap:14px}.cinema-primary{padding:15px;font-size:10px}.cinema-bottom{gap:8px}.cinema-work-link{font-size:9px;gap:8px}}
@media(prefers-reduced-motion:reduce){.site-header{transition:none}.cinema-scroll-ready{height:auto;min-height:0}}

/* Keep the cinematic header clear of editorial page titles. */
.flow-projects .work-intro,.flow-project-detail .project-detail-hero{padding-top:180px}
.inner-hero.with-image:before,.inner-hero.with-image:after{display:none}
.house-stage{isolation:isolate;overflow:hidden}
.house-stage .possibility-poster,.house-stage .hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:65% center;opacity:1}
.house-stage .hero-video{opacity:0}.house-stage .hero-video.is-playing{opacity:1}
.house-stage:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#061019a6,transparent 35%,transparent 80%,#0610198c);pointer-events:none}
.house-stage .scene-tag,.house-stage .scene-caption,.house-stage .scene-motion{z-index:2}
@media(min-width:761px) and (max-height:800px){.cinema-content{padding-top:155px;padding-bottom:120px}.cinema-content h1{font-size:clamp(56px,5.8vw,85px)}.cinema-eyebrow{margin-bottom:20px}.cinema-intro{margin-top:22px}.cinema-local{margin-top:10px}.cinema-actions{margin-top:22px}.cinema-credentials{margin-top:14px}.cinema-bottom{min-height:85px}}
@media(max-width:760px){.flow-projects .work-intro,.flow-project-detail .project-detail-hero{padding-top:148px}.house-stage .scene-caption{font-size:8px;max-width:210px}.cinema-pin,.cinema-scroll-ready .cinema-pin{min-height:860px}}

.inner-hero:not(.with-image):before{background:linear-gradient(90deg,#080d12f2 5%,#080d12df 40%,#080d1270),url('/assets/guardian-coastal-poster.webp') right center / cover;mask-image:none}
.inner-hero:not(.with-image):after{display:none}
.floating-photo{background:#e0eee6;border-color:#e0eee6;color:#15231f;border-radius:0;box-shadow:0 10px 35px #0003}
.cinema-bottom{padding-right:165px}
@media(max-width:1050px){.cinema-bottom{padding-right:125px}}
@media(max-width:760px){.cinema-bottom{padding-right:0}.inner-hero:not(.with-image):before{background-image:linear-gradient(90deg,#080d12f2,#080d12c9),url('/assets/guardian-coastal-poster.webp')}}

.menu-open .utility{visibility:hidden}
.customer-dock>a:last-child,.quote-next,.quote-submit{background:#dcece4;border-color:#dcece4;color:#122725}
#main-nav.open .mobile-nav-contact{color:#dcece4}
.site-header .brand{width:218px;overflow:visible}.site-header .brand img{width:100%;height:auto}
@media(max-width:1050px){.site-header .brand{width:185px}}
@media(max-width:760px){.site-header .brand{width:174px}}
@media(max-width:365px){.site-header .brand{width:155px}}

/* One uninterrupted scene under the brand, navigation, and opening copy. */
.utility,.site-header,.nav-wrap,.utility .container{border:0;box-shadow:none}
.utility .container,.nav-wrap{border-bottom:0}
.in-opening .site-header,.in-opening.is-scrolled .site-header{background:transparent;backdrop-filter:none;box-shadow:none}
.in-opening .nav-wrap,.is-scrolled.in-opening .nav-wrap{border:0}
.site-header .header-cta{background:transparent;border:0;box-shadow:none;backdrop-filter:none;padding-right:0}
.page-heading-film{position:absolute;inset:0;z-index:-2;overflow:hidden;pointer-events:none;background:url('/assets/guardian-lighting-poster.webp') 62% center/cover}
.page-heading-film .hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% center;opacity:0}
.page-heading-film .hero-video.is-playing{opacity:1}
.inner-hero.with-film{background:#080d12;min-height:650px;display:flex;align-items:center;padding-top:165px;padding-bottom:105px}
.inner-hero.with-film:before{background:linear-gradient(90deg,#080d12a8 0%,#080d1259 48%,#080d1215),linear-gradient(0deg,#080d12b3,transparent 60%,#080d1244);inset:0;z-index:-1;mask-image:none}
.inner-hero.with-film:after{display:none}
.inner-hero.with-film .inner-copy>p:not(.eyebrow){color:#e0e9e9}
.inner-hero.with-film .breadcrumbs{color:#ccd9df}
.inner-hero.with-film .eyebrow{color:#c5e5e8}
.inner-hero.with-film h1 em{color:#d9eee8}
@media(max-width:760px){
 .inner-hero.with-film{min-height:690px;padding-top:175px;padding-bottom:90px;align-items:flex-end}
 .inner-hero.with-film:before{background:linear-gradient(0deg,#080d12dc 0%,#080d1273 48%,#080d120a 75%,#080d124d)}
 .page-heading-film,.page-heading-film .hero-video{object-position:61% center;background-position:61% center}
 .inner-hero.with-film .breadcrumbs{margin-bottom:42px}
 .menu-open .site-header{background:#080d12f0}
}

.cinema-bottom{padding-right:180px}.cinema-caption{display:block;max-width:none;font-size:9px}
.page-film-caption{position:absolute;right:30px;bottom:20px;color:#e1e9e9;font-size:9px;z-index:2}
.menu-open.in-opening.is-scrolled .site-header,.menu-open.in-opening .site-header{background:#080d12f0}
@media(max-width:760px){.cinema-bottom{padding-right:0}.cinema-caption{display:block;font-size:8px;max-width:90px}.page-film-caption{right:20px;bottom:20px;font-size:8px}}

/* Native-scroll media depth keeps copy, navigation and controls in normal flow. */
[data-parallax-ready]{translate:0 var(--parallax-y,0px);scale:var(--parallax-scale,1);transform-origin:center}
[data-parallax-ready].is-parallax-visible{will-change:translate,scale}
.inner-hero.with-image figure{transform:none}
@media(prefers-reduced-motion:reduce){[data-parallax-ready]{translate:none;scale:1;will-change:auto}}
