.catalog-related-wrap { width: 100%; position: relative; padding: 20px 0; }
            .related-card { text-align: center; }
            .product-title { display: block; margin-top: 10px; font-weight: 500; color: #333; }
            /* Styling for arrows to ensure they are visible */
            .catalog-related-wrap .swiper-button-next, 
            .catalog-related-wrap .swiper-button-prev { color: #000; }
            .catalog-related-wrap {
            display: block;      /* Ensure it's not a flex item itself */
            width: 100%;
            max-width: 100vw;    /* Hard limit to viewport width */
            overflow: hidden;    /* Critical for Swiper calculations */
        }

        /* 2. Lock the Swiper container */
        .related-swiper {
            width: 100% !important;
            min-width: 0;        /* This "breaks" the flexbox expansion loop */
            max-width: 100%;
        }

        /* 3. Ensure slides don't push the container */
        .swiper-slide {
            width: auto; 
            flex-shrink: 0;      /* Prevent slides from trying to expand the track */
        }



        /* Ensure News Slides are consistent */
.news-swiper-container {
    width: 100%;
    overflow: hidden;
    padding: 30px 0;
}

.news-swiper .swiper-slide {
    height: auto; 
    display: flex;
}

/* Optional: Make the news cards inside slides take full height */
.news-swiper .swiper-slide > div {
    width: 100%;
    display: flex;
    flex-direction: column;
}

/* Prevent Bootstrap columns from squeezing Swiper slides */
.featured-swiper .swiper-slide > div[class*="col-"],
.featured-swiper .swiper-slide > .row,
.featured-swiper .swiper-slide > .item {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 10px !important;  /* Add your desired gutter here */
    padding-right: 10px !important;
}

/* Ensure the swiper container itself doesn't shrink */
.featured-swiper {
    width: 100%;
    display: block;
}


/* Swiper specific wrapper */
.card-menu-slider-container {
    width: 100%;
    overflow: hidden;
    position: relative;
    padding-bottom: 30px; /* Space for pagination */
}

/* Ensure equal height cards inside Swiper */
.card-menu-slider-container .swiper-slide {
    height: auto;
    display: flex;
}

.card-menu-slider-container .card-link {
    width: 100%;
    text-decoration: none;
    display: flex;
}

/* Fix for squeezed items: if the original card-menu-item had hardcoded widths */
.card-menu-slider-container .card {
    width: 100%;
    margin: 0;
}