/* Full-width transparent navigation; a quiet glass surface appears on scroll. */
:root{--header-height:88px;--header-gutter:max(5.5vw,calc((100vw - 1320px)/2 + 5.5vw))}
html{scroll-padding-top:100px}
body:has(>.header){padding-top:var(--header-height)}
body:has(.cinema-hero){padding-top:0}
html body>.header.container{position:fixed;inset:0 0 auto;width:100%;max-width:none;height:var(--header-height);padding-inline:var(--header-gutter);margin:0;background:transparent;box-shadow:none;z-index:90;border:0;isolation:isolate}
html body>.header:before{content:'';position:absolute;inset:0;z-index:-1;background:#151515ed;opacity:0;box-shadow:0 8px 28px #0002;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);pointer-events:none}
html body>.header.is-scrolled{height:70px}
html body>.header.is-scrolled:before,html body>.header:has(nav.open):before,html body>.header:has(.services-menu[open]):before{opacity:1}
html body>.header .nav-contact{background:transparent;border-color:#ffffff38;box-shadow:none;border-radius:5px}
html body>.header .nav-contact:hover{background:#ff8b4212;border-color:#ff8b4280}
html body>.header .services-panel{top:calc(100% - 3px);left:var(--header-gutter);right:var(--header-gutter)}
html .silver-hero.cinema-hero{padding-top:170px}
html .cinema-hero .hero-reel{mask-image:linear-gradient(to bottom,transparent 0,transparent 72px,#000 220px);-webkit-mask-image:linear-gradient(to bottom,transparent 0,transparent 72px,#000 220px)}
html[data-motion=full] body>.header{transition:height .3s ease!important}
html[data-motion=full] body>.header:before{transition:opacity .3s ease!important}
@media(min-width:761px) and (max-width:1050px){html .silver-hero.cinema-hero{padding-top:152px}html body>.header{gap:20px}}
@media(max-width:760px){
 :root{--header-height:72px;--header-gutter:5.5vw}
 html{scroll-padding-top:82px}
 html body>.header.is-scrolled{height:64px}
 html body>.header nav{top:calc(100% + 6px);left:16px;right:16px;background:#191919;box-shadow:0 18px 35px #0007;border:1px solid #ffffff18;max-height:calc(100dvh - 94px);overscroll-behavior:contain}
 html body>.header .services-panel{position:static;background:transparent;border:0;box-shadow:none}
 html .silver-hero.cinema-hero{padding-top:107px}
 html .cinema-hero .hero-reel{mask-image:none;-webkit-mask-image:none}
}
@media print{html body>.header.container{position:relative}body:has(>.header){padding-top:0}}