/* Storefront performance / CLS helpers */

/* AOS is disabled on the SPA — keep animated nodes visible (aos.css defaults to opacity:0) */
html body [data-aos],
html body [data-aos][data-aos],
html body [data-aos].aos-animate {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    pointer-events: auto !important;
    visibility: visible !important;
}

.banner-item {
    min-height: 420px;
}

@media screen and (max-width: 767px) {
    .banner-item {
        min-height: 360px;
    }
}

.banner-item__thumb {
    min-width: 280px;
    min-height: 280px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.banner-item__thumb img {
    width: 420px;
    max-width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: contain;
}

.product-card__thumb img {
    width: 160px;
    height: 160px;
    object-fit: contain;
}

@media (prefers-reduced-motion: reduce) {
    .animate-left-right,
    .animate-scale {
        animation: none !important;
        transition: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}
