/* Slider-main */

.slider-main {
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    background-color: var(--lighter-blue);
}

.slider-main.grey-appearance {
    background-color: var(--light-bg);
}

.slider-main.grey-appearance .slider-main__arrow {
    border-color: var(--text-color);
}

.slider-main.grey-appearance .slider-main__arrow svg path {
    fill: var(--text-color);
}

.slider-main.grey-appearance .slider-main__text {
    color: #CDCDCD;
}

.slider-main__a_button_active {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    width: 119px;
    height: 30px;
    font-size: 14px;
    background-color: #899AAE !important;
    color: #005CFD !important;
}
.slider-main__a_button {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    width: 119px;
    height: 30px;
    font-size: 14px;
    background-color: #5B738F !important;
    color: #F1F3F7;
}

@media (any-hover: hover) {
    .slider-main.grey-appearance .slider-main__arrow:hover {
        border-color: var(--green-dark);
    }

    .slider-main.grey-appearance .slider-main__arrow:hover svg path {
        fill: var(--white);
    }
}

.slider-main__slide {
    display: flex;
    padding: clamp(var(--g10-mobile), 6vw, var(--g10-desktop));
    gap: clamp(var(--g10-mobile), 6vw, var(--g10-desktop));
}

@media (max-width: 767px) {
    .slider-main__slide {
        flex-direction: column-reverse;
    }
}

@media (max-width: 575px) {
    .slider-main__slide {
        padding: 1.5rem;
        gap: 2rem;
    }
}

.slider-main__info {
    max-width: 400px;
}

@media (max-width: 767px) {
    .slider-main__info {
        max-width: none;
        margin-bottom: 4rem;
    }
}

@media (max-width: 767px) {
    .slider-main__info {
        margin-bottom: 0;
    }
}

.slider-main__text {
    color: var(--secondary-color);
}

.slider-main__buttons {
    display: flex;
    gap: 0.75rem;
}

@media (max-width: 575px) {
    .slider-main__buttons {
        gap: 1rem;
        flex-direction: column;
    }
}

.slider-main__image {
    max-width: 576px;
}

.slider-main__image.popup-link {
    cursor: zoom-in;
}

@media (max-width: 767px) {
    .slider-main__image {
        align-self: center;
    }
}

.slider-main__image img {
    border-radius: 0;
}

.slider-main-tags {
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    padding: 0 2rem;
}

.slider-main-tags.grey-appearance .swiper-pagination-bullet {
    color: var(--text-color) !important;
    background-color: var(--light-bg) !important;
}

.slider-main-tags.grey-appearance .swiper-pagination-bullet.swiper-pagination-bullet-active {
    color: #015cfd !important;
}

@media (max-width: 1199px) {
    .slider-main-tags {
        padding: 0 1.5rem;
    }
}

@media (max-width: 767px) {
    .slider-main-tags {
        padding: 0 1rem;
    }
}

.slider-main-tags::-webkit-scrollbar {
    display: none;
}

.slider-main-tags-list {
    display: flex;
    gap: 0.5rem;
    margin: 0 auto;
    position: static;
    width: min-content !important;
}

.slider-main-tags-list .swiper-pagination-bullet {
    --swiper-pagination-bullet-horizontal-gap: 0;
    padding: 0.5rem 1rem;
    color: var(--secondary-color);
    background-color: var(--lighter-blue) !important;
    border-radius: 32px !important;
    font-weight: 500;
    font-size: var(--text-small) !important;
    line-height: var(--text-small-line-height) !important;
    width: auto !important;
    height: auto !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    opacity: 1 !important;
    white-space: nowrap;
}

.slider-main-tags-list .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: #899aae !important;
    color: #015cfd;
}

.slider-main-tags .btn {
    white-space: nowrap;
}

.slider-main__arrows {
    position: absolute;
    /*bottom: clamp(var(--g10-mobile), 6vw, var(--g10-desktop));*/
    bottom: 10px;
    left: clamp(var(--g10-mobile), 6vw, var(--g10-desktop));
    z-index: 50;
    display: flex;
    gap: 0.75rem;
}

@media (max-width: 767px) {
    .slider-main__arrows {
        display: none;
    }
}

.slider-main__arrow {
    position: static;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #899aae;
}


.slider-main__arrow svg {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
}

.slider-main__arrow svg path {
    fill: var(--white);
}

.slider-main__arrow::after {
    display: none;
}

/* General styles */
:root {
    /* Colors */
    --dark-bg: #1b224e;
    --lighter-blue: #072c65;
    --light-bg: #f5f7fc;
    --stroke: #eef1f7;
    --white: #ffffff;
    --blue-dark: #3247cb;
    --blue: #5278ff;
    --cyan: #E2ECFF;
    --blue-light: #c0d6ff;
    --green-dark: #1E803F;
    --green: #42b55b;
    --breadcrumbs-hover: #D9F0DE;
    --success: #F0F9F2;
    --fail: #FFF4F4;
    --green-light: #73db71;
    --green-secondary: rgba(66, 181, 91, 0.24);
    --orange-dark: #f84d42;
    --orange: #fe7a50;
    --orange-light: #ffc061;
    --gradient-orange: #FE8450;
    --gradient-sunny: #FFAF51;
    --title-color: #303030;
    --text-color: #55555a;
    --secondary-color: #f2f3f7;
    --disabled-bg-color: #e7eaf0;
    --active-color: #16602f;
    --overlay-color: rgba(40, 44, 49, 0.32);
    --shadow-color: rgba(38, 38, 62, 0.04);
    --shadow-cards-color: rgba(122, 133, 147, 0.18);
    --shadow-review-color: rgba(122, 133, 147, 0.35);
    --border-color-on-blue: #323B62;
    --search-highlight: rgb(217, 240, 222);
    /* Font sizes */
    /* 50px */
    --h1-desktop: 3.125rem;
    /* 34px */
    --h1-mobile: 2.125rem;
    /* 44px */
    --blog-h1-desktop: 2.75rem;
    /* 32px */
    --blog-h1-mobile: 2rem;
    /* 32px */
    --h2-desktop: 2rem;
    /* 28px */
    --h2-mobile: 1.75rem;
    /* 28px */
    --h3-desktop: 1.75rem;
    /* 24px */
    --h3-mobile: 1.5rem;
    /* 22px */
    --h4-desktop: 1.375rem;
    /* 20px */
    --h4-mobile: 1.25rem;
    /* 20px */
    --h5-desktop: 1.25rem;
    /* 18px */
    --h5-mobile: 1.125rem;
    /* 20px */
    --text-large-desktop: 1.25rem;
    /* 18px */
    --text-large-mobile: 1.125rem;
    /* 18px */
    --text-medium-desktop: 1.125rem;
    /* 16px */
    --text-medium-mobile: 1rem;
    /* 16px */
    --text-regular: 1rem;
    /* 14px */
    --text-small: 0.875rem;
    /* 12px */
    --text-micro: 0.75rem;
    /* Line heights */
    --h1-line-height: 1.28;
    --blog-h1-line-height: 1.32;
    --h2-line-height: 1.31;
    --h3-line-height: 1.43;
    --h4-line-height: 1.55;
    --h5-line-height: 1.5;
    --text-large-line-height: 1.5;
    --text-medium-line-height: 1.56;
    --text-regular-line-height: 1.62;
    --text-small-line-height: 1.43;
    --text-micro-line-height: 1.5;
    /* Gutters */
    /* 4px */
    --g1: 0.25rem;
    /* 8px */
    --g2: 0.5rem;
    /* 12px */
    --g3: 0.75rem;
    /* 16px */
    --g4: 1rem;
    /* 20px */
    --g5-desktop: 1.25rem;
    /* 16px */
    --g5-mobile: 1rem;
    /* 24px */
    --g6-desktop: 1.5rem;
    /* 20px */
    --g6-mobile: 1.25rem;
    /* 32px */
    --g7-desktop: 2rem;
    /* 24px */
    --g7-mobile: 1.5rem;
    /* 40px */
    --g8-desktop: 2.5rem;
    /* 32px */
    --g8-mobile: 2rem;
    /* 48px */
    --g9-desktop: 3rem;
    /* 32px */
    --g9-mobile: 2rem;
    /* 64px */
    --g10-desktop: 4rem;
    /* 40px */
    --g10-mobile: 2.5rem;
    /* 80px */
    --g11-desktop: 5rem;
    /* 48px */
    --g11-mobile: 3rem;
    /* 104px */
    --g12-desktop: 6.5rem;
    /* 64px */
    --g12-mobile: 4rem;
    /* 160px */
    --g13-desktop: 10rem;
    /* 96px */
    --g13-mobile: 6rem;
    /* 232px */
    --g14-desktop: 12.875rem;
    /* 144px */
    --g14-mobile: 9rem;
}