.swiper-button-next.swiper-button-arrow,
.swiper-button-prev.swiper-button-arrow {
    position: static;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin: 0;
    cursor: pointer;
    border-radius: 50%;
    background-color: #f0f2f5;
    border: 1px solid transparent;
    color: #14B8A6;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease
}

.swiper-button-next.swiper-button-arrow svg,
.swiper-button-prev.swiper-button-arrow svg {
    width: 9px;
    height: 15px
}

.swiper-button-next.swiper-button-arrow:hover,
.swiper-button-prev.swiper-button-arrow:hover {
    background-color: var(--soft-sand);
    border-color: #2dd4bf;
    color: #2dd4bf
}

.swiper-button-next.swiper-button-arrow:active,
.swiper-button-prev.swiper-button-arrow:active {
    background-color: #14B8A6;
    border-color: #0f766e;
    color: #fff
}

.swiper-button-next.swiper-button-arrow.swiper-button-disabled,
.swiper-button-prev.swiper-button-arrow.swiper-button-disabled {
    background-color: #f0f2f5;
    cursor: not-allowed;
    opacity: .6;
    color: #adb5bd
}

.carousel-arrows {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 16px;
    margin-top: 32px;
}

@media (min-width: 768px) {
    .carousel-arrows.md\:hidden {
        display: none !important;
    }
}

@media (min-width: 1024px) {
    .carousel-arrows.lg\:hidden {
        display: none !important;
    }
}