/*
 * Shared rendering safeguards.
 * These rules reduce main-thread and GPU work without reducing image quality.
 */
img,
video {
    max-width: 100%;
}

img {
    height: auto;
}

main > section:not(.hero),
footer {
    content-visibility: auto;
    contain-intrinsic-size: 600px;
}

@media (max-width: 768px) {
    .hero-video {
        background: #19081e url("/images/home-poster.jpg") center / cover no-repeat !important;
    }

    .hero-video-element {
        display: none !important;
    }
}

@media (prefers-reduced-motion: reduce), (max-width: 768px) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/*
 * Low-power devices keep the same sharp poster and layout, but avoid
 * expensive blur, translucent backdrops, and continuous animation.
 */
.low-power-mode *,
.low-power-mode *::before,
.low-power-mode *::after {
    animation-play-state: paused !important;
}

.low-power-mode [style*="backdrop-filter"],
.low-power-mode header.nav-white,
.low-power-mode header.nav-transparent {
    backdrop-filter: none !important;
}

.low-power-mode .hero::after {
    filter: none !important;
    animation: none !important;
}

@media (min-width: 769px) {
    .image-visual iframe {
        content-visibility: auto;
        contain-intrinsic-size: 16px 9px;
    }
}