/* Фон блоку «Ми дбаємо про наших клієнтів»: колишня our-clients.png розрізана на шари
   (docker/dump/home-review/tools/split-clients-bg.py), кожен шар повільно рухається.
   Шари мають той самий розмір і cover/center, що й старий фон, тож у спокої картинка та сама. */
.our-clients { position: relative; background-image: none !important; }
.our-clients > .max-container,
.our-clients > .clients-site { position: relative; z-index: 1; }
.clients-bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.clients-bg i {
    position: absolute;
    inset: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    will-change: transform;
}
.clients-bg .l-base { background-image: url(/img/clients-bg/base.webp); }
.clients-bg .l-leaf { background-image: url(/img/clients-bg/leaf.webp); transform-origin: 34% 94%; animation: cbg-sway 9s ease-in-out infinite alternate; }
.clients-bg .l-squiggle { background-image: url(/img/clients-bg/squiggle.webp); transform-origin: 45% 24%; animation: cbg-float 6s ease-in-out infinite alternate; }
.clients-bg .l-ring { background-image: url(/img/clients-bg/ring.webp); animation: cbg-drift 11s ease-in-out infinite alternate; }
.clients-bg .l-half { background-image: url(/img/clients-bg/halfcircle.webp); animation: cbg-breathe 8s ease-in-out infinite alternate; }
.clients-bg .l-dots { background-image: url(/img/clients-bg/dots.webp); animation: cbg-twinkle 5s ease-in-out infinite alternate; }

@keyframes cbg-sway { from { transform: rotate(-1.2deg); } to { transform: rotate(1.2deg); } }
@keyframes cbg-float { from { transform: translate(0, 0) rotate(0); } to { transform: translate(6px, -10px) rotate(2deg); } }
@keyframes cbg-drift { from { transform: translate(0, 0); } to { transform: translate(-10px, -8px); } }
@keyframes cbg-breathe { from { transform: translateY(0); } to { transform: translateY(-10px); } }
@keyframes cbg-twinkle { from { opacity: 1; } to { opacity: .45; } }

@media (prefers-reduced-motion: reduce) {
    .clients-bg i { animation: none !important; }
}
