/* Match the first rendered frame before Slick builds its single-slide viewport.
   The ratio comes from that frame, never from a guessed product-photo shape.
   Without JavaScript the remaining frames stay reachable by native scrolling. */
@media (max-width: 1200px) {
    .card-slider:not(.slick-initialized) {
        position: relative;
        display: flex;
        align-items: flex-start;
        aspect-ratio: var(--product-gallery-ratio, auto);
        max-height: var(--product-gallery-max-height, none);
        min-height: 0;
        overflow: auto;
    }

    .card-slider:not(.slick-initialized) > .card-slide {
        flex: 0 0 100%;
        min-width: 0;
    }
}