.navSwiper{
    position: relative;
}

        .nav-slider-wrapper {
            background: #b30000;
            position: relative;
        }

        /* 👇 Add proper inner spacing */
        .navSwiper {
            padding: 0 60px;
            /* increase from 40 → 60 */
        }

        /* Slides */
        .nav-slider-wrapper .swiper-slide {
            color: #fff;
            text-transform: uppercase;
            width: auto;
            padding: 12px 20px;
            white-space: nowrap;
            font-size: 16px;
            cursor: pointer;
        }

        /* 👇 Arrows as overlay */
        .custom-arrow {
            color: #fff;
            width: 60px;
            height: 100%;
            top: 0;
            margin-top: 0;
            background: #b30000;
            /* same as navbar */
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 10;
        }

        /* Position properly */
        .swiper-button-prev {
            left: 0;
        }

        .swiper-button-next {
            right: 0;
        }

        /* Optional: subtle shadow for separation */
        .swiper-button-prev::before,
        .swiper-button-next::before {
            content: "";
            position: absolute;
            width: 20px;
            height: 100%;
            top: 0;
        }

        .swiper-button-prev::before {
            right: -20px;
            background: linear-gradient(to right, #b30000, transparent);
        }

        .swiper-button-next::before {
            left: -20px;
            background: linear-gradient(to left, #b30000, transparent);
        }

        .swiper-button-next::after,
        .swiper-button-prev::after {
            font-size: 20px;
        }

        .nav-slider-wrapper.sticky {
            position: fixed;
            top: 0;
            left: 0;
            z-index: 999;
            width: 100%;
        }