/* Adaptive overrides for hero carousel sizing and slide media.
   Order mirrors the previous cascade: media geometry first, size rules after.
*/

@media (max-width: 1200px) {
    .hero-slide__media-frame {
        width: 100%;
        min-height: 460px;
    }
}

@media (max-width: 920px) {
    .hero-slide__media-cluster--promo {
        transform: translateY(-8px);
    }

    .hero-slide__media-cluster--catalog .hero-slide__media-card--2,
    .hero-slide__media-cluster--catalog .hero-slide__media-card--3,
    .hero-slide__media-cluster--promo .hero-slide__media-card--2,
    .hero-slide__media-cluster--promo .hero-slide__media-card--3 {
        width: 170px;
        height: 150px;
    }

    .hero-slide__media-cluster--catalog .hero-slide__media-card--1 {
        left: auto;
        right: -2%;
        width: min(100%, 500px);
    }

    .hero-slide__media-cluster--catalog .hero-slide__media-card--1 .hero-slide__media-image {
        object-position: center bottom;
    }

    .hero-slide__media-cluster--catalog .hero-slide__media-card--2 {
        left: 0;
    }

    .hero-slide__media-cluster--catalog .hero-slide__media-card--3 {
        left: 86px;
    }
}

@media (max-width: 640px) {
    .hero-slide__media-frame {
        padding: 18px 14px;
        border-radius: 28px;
    }

    .hero-slide__media-cluster--promo {
        transform: none;
    }

    .hero-slide__media-cluster--catalog .hero-slide__media-card--1,
    .hero-slide__media-cluster--promo .hero-slide__media-card--1 {
        width: min(100%, 320px);
        height: 260px;
    }

    .hero-slide__media-cluster--catalog .hero-slide__media-card--2,
    .hero-slide__media-cluster--catalog .hero-slide__media-card--3,
    .hero-slide__media-cluster--promo .hero-slide__media-card--2,
    .hero-slide__media-cluster--promo .hero-slide__media-card--3 {
        width: 124px;
        height: 110px;
    }
}

@media (max-width: 1200px) {
    .hero-carousel,
    .hero-slide {
        min-height: 710px;
        height: 710px;
    }

    .hero-slide__media-frame,
    .hero-slide__media-cluster {
        min-height: 420px;
        height: 420px;
    }
}

@media (max-width: 920px) {
    .hero-carousel,
    .hero-slide {
        min-height: 790px;
        height: 790px;
    }

    .hero-slide__media-frame,
    .hero-slide__media-cluster {
        min-height: 320px;
        height: 320px;
    }
}

@media (max-width: 640px) {
    .hero-carousel,
    .hero-slide {
        min-height: 850px;
        height: 850px;
    }
}