.swiper {
    width: 100%;
    /* display: flex;
    height: 100%;*/
}


.swiper-slide {
    height: auto !important;
}

.swiper,
.swiper-pagination {
    position: relative !important;
}

.swiper-pagination {
    padding-top: var(--m-space) !important;
}

.swiper-pagination-bullet-active {
    background-color: var(--m3-color) !important;
}



.full-swiper .swiper-slide img {
    display: block;
    width: 80%;
    height: 100%;
    /* object-fit: cover; */
    margin: 0 auto;
}

.full-swiper .swiper-slide-prev,
.full-swiper .swiper-slide-next {
    opacity: 0.4;
}

.swiper-slide {
    transition: all 0.3s ease;
}

.why-df-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding-top: var(--m-space);
}

.why-df-nav .swiper-pagination {
    padding-top: 0 !important;
}

.why-df-btn-prev,
.why-df-btn-next {
    cursor: pointer;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1px solid var(--m3-color);
    color: var(--m3-color);
    flex-shrink: 0;
    transition: background-color 0.2s, color 0.2s;
}

.why-df-btn-prev:hover,
.why-df-btn-next:hover {
    background-color: var(--m3-color);
    color: #fff;
}

.why-df-btn-prev.swiper-button-disabled,
.why-df-btn-next.swiper-button-disabled {
    opacity: 0.35;
    cursor: default;
    pointer-events: none;
}