/* Fallback styles for when slick carousel fails to initialize */
        .slick-general:not(.slick-initialized) {
            display: flex !important;
            flex-wrap: nowrap !important;
            gap: 12px !important;
            padding: 0 !important;
            margin: 0 !important;

        }

        .slick-general:not(.slick-initialized)>* {
            flex: 0 0 260px !important;
            /* desktop card width */
            width: 260px !important;
            min-width: 260px !important;
            max-width: 260px !important;
            display: block !important;
        }

        /* Hide slick arrows and dots when not initialized */
        .slick-general:not(.slick-initialized) .slick-arrow,
        .slick-general:not(.slick-initialized) .slick-dots {
            display: none !important;
        }

        /* Responsive fallback - match slick breakpoints */

        @media (max-width: 768px) {
            .slick-general:not(.slick-initialized)>* {
                flex-basis: 180px !important;
                width: 180px !important;
                min-width: 180px !important;
                max-width: 180px !important;
            }
        }

        @media (max-width: 576px) {
            .slick-general:not(.slick-initialized)>* {
                flex-basis: 160px !important;
                width: 160px !important;
                min-width: 160px !important;
                max-width: 160px !important;
            }
        }

        /* Ensure proper spacing for card-style-slider */
        .card-style-slider .slick-general:not(.slick-initialized) {
            margin-bottom: 3.75rem !important;
            overflow: visible !important;
            /* add bottom space between sections */
        }

        .card-style-slider .slick-general:not(.slick-initialized)>* {
            margin: 0 6px !important;
        }