/**
 * SLIDER LAYOUT FIX
 * Предотвращение Layout Shift для WebP изображений
 * Добавлено: 03.11.2025
 * 
 * Проблема: WebP изображения загружаются с задержкой и могут вызвать "прыжок" контента
 * Решение: Фиксированное aspect-ratio и object-fit для сохранения размеров
 */

.promotion-slider__img {
    width: 100%;
    height: auto;
    aspect-ratio: 1920 / 600; /* Фиксированное соотношение сторон */
    object-fit: cover; /* Обрезка изображения по контейнеру */
    display: block;
}

/* Для мобильных (375x600) */
@media (max-width: 480px) {
    .promotion-slider__img {
        aspect-ratio: 375 / 600;
    }
}

/* Для планшетов (1000x600) */
@media (min-width: 481px) and (max-width: 1200px) {
    .promotion-slider__img {
        aspect-ratio: 1000 / 600;
    }
}

/* Для десктопа (1920x600) */
@media (min-width: 1201px) {
    .promotion-slider__img {
        aspect-ratio: 1920 / 600;
    }
}

/* Fallback для старых браузеров без поддержки aspect-ratio */
@supports not (aspect-ratio: 1 / 1) {
    .promotion-slider__img {
        min-height: 400px; /* Минимальная высота для старых браузеров */
    }
}

