.page-home { --cinema-dark: #0c0d0e; }
.cinema-layers { display: none; }
.brand-inverse { display: none; }

.cinema-enabled {
  --hero-opacity: 1;
  --overlay-opacity: 0;
  --content-opacity: 0;
  --intro-offset: 0px;
  --content-offset: 20px;
  --header-height: 136px;
  --header-darkness: 0;
}
.cinema-enabled .site-header { position: fixed; top: 0; left: 0; width: 100%; }
.cinema-enabled .site-header::before { content: ''; position: absolute; inset: 0 0 -28px; background: linear-gradient(var(--cinema-dark) 85%, transparent); opacity: var(--header-darkness); pointer-events: none; }
.cinema-enabled .header-inner { position: relative; }
.cinema-enabled .brand { position: relative; }
.cinema-enabled .brand > img:first-child { opacity: calc(1 - var(--header-darkness)); }
.cinema-enabled .brand .brand-inverse { display: block; position: absolute; inset: 0; opacity: var(--header-darkness); mix-blend-mode: normal; }
.cinema-enabled .site-nav { transition: opacity .3s, transform .3s, visibility .3s; }
.cinema-enabled.header-on-dark:not(.menu-open) .site-nav { color: white; }
.cinema-enabled.header-on-dark:not(.menu-open) .menu-toggle span { background: white; }
.cinema-enabled.menu-open .brand > img:first-child { opacity: 1; }
.cinema-enabled.menu-open .brand .brand-inverse { opacity: 0; }
.cinema-enabled .hero-transition { height: var(--transition-height, 380svh); position: relative; background: var(--cinema-dark); }
.cinema-enabled .hero-sticky { position: sticky; top: 0; height: 100svh; overflow: hidden; isolation: isolate; background: white; }
.cinema-enabled .hero-original { padding-top: var(--header-height); transform: translate3d(0, calc(-1 * var(--intro-offset)), 0); }
.cinema-enabled .home-hero h1,
.cinema-enabled .hero-foot { opacity: var(--hero-opacity); }
.cinema-enabled .home-visual { opacity: 1; }
.cinema-enabled .home-visual img { transform: scale(var(--hero-image-scale, 1)); }
.cinema-enabled .hero-foot[inert] { pointer-events: none; }
.cinema-enabled .cinema-layers { display: block; position: absolute; inset: 0; pointer-events: none; }
.cinema-mask { position: absolute; inset: 0; width: 100%; height: 100%; opacity: var(--overlay-opacity); overflow: hidden;}
.cinema-photo { opacity: var(--photo-opacity); overflow: hidden; }
.cinema-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 52% 57%; transform: scale(var(--photo-scale)); }
.cinema-mask { opacity: var(--overlay-opacity); overflow: hidden; }
.cinema-curtain { fill: var(--cinema-dark); }
#hero-logo-window { mask-type: luminance; }
.mask-scale { transform: scale(var(--logo-scale, 10)); }
.cinema-dim { background: var(--cinema-dark); opacity: var(--photo-darkness); }
.cinema-enabled .home-following {
  position: relative;
  z-index: 2;
  margin-top: -100svh;
  min-height: 100svh;
  padding-top: var(--header-height);
  background: var(--cinema-dark);
  opacity: var(--content-opacity);
  transform: translate3d(0, var(--content-offset), 0);
}
.cinema-enabled .home-following::before { content: ''; position: absolute; inset: -90px 0 auto; height: 90px; background: linear-gradient(transparent, var(--cinema-dark)); pointer-events: none; }
.cinema-enabled .home-following .trade-skyline { color: white; }
.cinema-enabled .home-following[inert] { pointer-events: none; }
.cinema-enabled .home-following .reveal { opacity: 1; transform: none; transition: none; }
.cinema-enabled #one-team { scroll-margin-top: var(--header-height); }

@media (max-width: 700px) {
  .cinema-enabled { --header-height: 108px; }
  .cinema-photo img { object-position: 53% 58%; }
}
@media (prefers-reduced-motion: reduce) {
  .cinema-layers { display: none !important; }
}