/* ═══════════════════════════════════════
   Video background styles
   ═══════════════════════════════════════ */

.video-bg-layer {
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: #000;
}

.video-bg-layer video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    will-change: opacity;
}

.video-bg-layer video.active {
    opacity: 1;
}

/* Fade-in on first load */
.video-bg-layer.is-ready video.active {
    opacity: 1;
}

/* When video is active, hide the CSS blur layers on landing hero */
.video-bg-active .landing-hero::before,
.video-bg-active .landing-hero::after,
.video-bg-active .landing-dark-plate {
    display: none !important;
}