/* The homepage video reaches both frame edges and continues behind the menu. */
.grey-site.glass-depth.has-home-video { --home-header-height: 68px; }
.has-home-video .site-stage { padding: 0; }
.grey-site.glass-depth.has-home-video .site-frame {
    width: 100%;
    min-height: 100vh;
    border-radius: 0;
}

.has-home-video .frame-header { margin-bottom: calc(-1 * var(--home-header-height)); }
.grey-site.glass-depth.has-home-video .frame-header:not(.has-cleared-hero) {
    background: transparent;
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

.grey-site.glass-depth .signal-hero--video {
    isolation: isolate;
    overflow: hidden;
    padding-top: var(--home-header-height);
    background: url('/assets/images/site/pc-hero-poster-v2.jpg') center / cover no-repeat;
}

.hero-background-video {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    pointer-events: none;
}

.signal-hero--video::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(255, 255, 255,.96) 0%, rgba(255, 255, 255,.88) 28%, rgba(255, 255, 255,.34) 56%, rgba(255, 255, 255,.06) 78%, transparent 100%),
        linear-gradient(118deg, rgba(252, 254, 255,.22), transparent 36%),
        var(--material-reflection);
    background-size: 100% 100%, 100% 100%, 720px 720px;
    background-blend-mode: normal, screen, soft-light;
}

.signal-hero--video .signal-copy { grid-column: 1; }

@media (max-width: 960px) {
    .grey-site.glass-depth .signal-hero--video { min-height: 660px; }
    .signal-hero--video .signal-copy { padding-bottom: 100px; }
}

@media (max-width: 900px) {
    .grey-site.glass-depth.has-home-video { --home-header-height: 62px; }
}

@media (max-width: 600px) {
    .grey-site.glass-depth .signal-hero--video { min-height: 640px; }
    .signal-hero--video .signal-copy { padding-bottom: 100px; }
}

@media print {
    .hero-background-video { display: none !important; }
}
