.carousel-wrapper {
            width: 100%;
            position: relative;
         }
 a {
            text-decoration: none;
            outline: none;
        }
        .carousel-container {
            overflow: hidden;
            width: 100%;
            padding: 20px;
           
        }

        .carousel-track {
            display: flex;
            transition: transform 0.5s ease;
            width: 100%;
        }

        .slide {
            flex: 0 0 100%; /* Mobile = 1 slide */
            padding: 5px;   /* ★ 5px padding added */
            box-sizing: border-box;
        }

        /* Tablet: 2 slides */
        @media (min-width: 768px) {
            .slide {
                flex: 0 0 50%;
            }
        }

        /* Desktop: 4 slides */
        @media (min-width: 1024px) {
            .slide {
                flex: 0 0 25%;
            }
        }

        /* Card FULL view 16:9 */
        .ratio {
            width: 100%;
            aspect-ratio: 16/9;
            border-radius: 12px;
            overflow: hidden;
            display: block;
        }

        .ratio img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }