.lazy-bg {
position: relative;
display: block;
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
overflow: hidden;
filter: blur(0.5px);
transition: filter 0.5s ease;
}
.lazy-bg.loaded {
filter: blur(0);
} .lazy-bg-shimmer::before {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0) 100%);
animation: shimmer 3s ease-in-out infinite;
z-index: 1;
pointer-events: none;
}
.lazy-bg-shimmer.loaded::before {
display: none;
}
@keyframes shimmer {
0% {
transform: translateX(-100%);
}
100% {
transform: translateX(100%);
}
} .lazy-video-bg {
position: relative;
overflow: hidden;
}
.lazy-video-bg video {
width: 100%;
height: 100%;
object-fit: cover;
opacity: 0;
transition: opacity 0.5s ease;
}
.lazy-video-bg.video-loaded video {
opacity: 1;
}