/* Eternal War - видеофон внутри .l-main. Разметку вставляет js/video-bg.js.
   Слой прибит к экрану: высота ровно во вьюпорт, при скролле не тянется. */

:root:root .l-main {
    isolation: isolate;
    background:
        radial-gradient(120% 80% at 50% 0%, rgba(174, 210, 79, .05), transparent 60%),
        linear-gradient(180deg, #12151a 0%, #0d1014 55%, #0a0c10 100%);
    box-shadow:
        inset 0 0 0 1px var(--ew-line),
        0 0 2rem rgba(0, 0, 0, .55);
}

/* overflow: clip, а не hidden — hidden сделал бы обёртку скроллпортом и убил sticky */
:root:root .ew-bg-wrap {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: clip;
    border-radius: inherit;
    pointer-events: none;
}

:root:root .ew-bg-stick {
    position: sticky;
    top: 0;
    display: block;
    width: 100%;
    height: 100vh;
}

@supports (height: 100dvh) {
    :root:root .ew-bg-stick {
        height: 100dvh;
    }
}

:root:root .ew-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity 1.2s ease;
}

:root:root .ew-bg.is-ready {
    opacity: 1;
}

:root:root .ew-bg-veil {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(6, 7, 10, .68) 0%, rgba(6, 7, 10, .84) 55%, rgba(6, 7, 10, .90) 100%);
}

:root:root .l-page {
    position: relative;
    z-index: 2;
}