.sms-carousel-item>div {
    text-align: left;
    display: flex;
    flex-direction: column;
    border-radius: 20px;
    border: 1px solid #e7e8ec;
    position: relative;
    padding: 20px;
    width: 357px;
}

.sms-carousel-item:first-child {
    margin-left: 0;
}

.sms-carousel-img {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #F6F6F8;
    border-radius: 12px;
    min-height: 180px;
    width: 100%;
}

.sms-carousel-img img {
    transition: .6s;
}

.sms-carousel-item>div:hover .sms-carousel-img img {
    transform: rotate(16deg) scale(1.12);

}

.sms-carousel-item>div:hover::before {
    border: 6px solid #E7E8EC;
}

.sms-carousel-item>div::before {
    content: "";
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    position: absolute;
    border: 6px solid #F6F6F8;
    top: -7px;
    left: -7px;
    right: 0;
    bottom: 0;
    margin: 0 auto;
    border-radius: 26px;
    transition: .6s;
}

.sms-carousel-item>div::after {
    content: "";
    width: calc(100% + 14px);
    height: calc(100% + 14px);
    position: absolute;
    border: 1px solid #e7e8ec;
    top: -8px;
    left: -8px;
    right: 0;
    bottom: 0;
    margin: 0 auto;
    border-radius: 26px;
}

.sms-carousel .slick-list::before {
    content: "";
    position: absolute;
    right: 0px;
    top: 0;
    width: 150px;
    height: 100%;
    background: linear-gradient(270deg, #fff 20%, #fff0);
    z-index: 5;
    pointer-events: none;
}

.sms-carousel .slick-list {
    padding: 0 17% 0 0 !important;
    z-index: 3;
}

.sms-carousel-box .slick-arrow.slick-prev {
    top: -79px;
    right: 84px;
    left: auto;
}

.sms-carousel-box .slick-arrow.slick-next {
    top: -79px;
    right: 27px;
    left: auto;
}

.sms-carousel .slick-arrow {
    border-radius: 50%;
    box-shadow: none;
    border: 1px solid #E7E8EC;
    width: 48px;
    height: 48px;
}

.sms-carousel .slick-track {
    padding: 10px 7px;
}

.sms-carousel h3 {
    font: 800 44px/64px "Manrope";
    margin-bottom: 18px;
    color: #292424;
}

.sms-carousel h3 span {
    color: #F04259;
}

.sms-carousel .subtitle {
    font: 400 16px/19px "Manrope";
    width: 50%;
    display: block;
}

.sms-carousel {
    padding: 40px 0;
}

.sms-carousel-box {
    padding: 35px 0;
}

.sms-carousel-item span {
    font: 700 19px / 25px "Manrope";
    margin: 20px 0 15px;
    color: #292424;
    display: inline-block;
}

.sms-carousel-item small {
    font: 400 15px/22px "Manrope";
    margin-bottom: 15px;
    color: #595757;
    display: inline-block;
    min-height: 88px;
}

.slick-slide {
    outline: none;
}


@media (min-width: 1200px) {
    .sms-carousel--no-desktop-slider h3 {
        text-align: center;
    }

    .sms-carousel--no-desktop-slider .sms-carousel-item small {
        min-height: 45px;
    }

    .sms-carousel--no-desktop-slider .sms-carousel-box {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 30px;
        padding: 35px 0;
    }
    .sms-carousel--no-desktop-slider .sms-carousel-item span {
        font: 700 15px / 23px "Manrope";
    }

    .sms-carousel--no-desktop-slider .sms-carousel-item {
        margin: 0;
    }

    .sms-carousel--no-desktop-slider .sms-carousel-item>div {
        width: 100%;
    }

    .sms-carousel--no-desktop-slider .slick-list,
    .sms-carousel--no-desktop-slider .slick-track {
        all: unset;
    }

    .sms-carousel--no-desktop-slider .slick-arrow,
    .sms-carousel--no-desktop-slider .slick-list::before {
        display: none !important;
    }

}



@media (max-width: 1500px) {
    .sms-carousel-item>div {
        text-align: left;
        display: flex;
        flex-direction: column;
        border-radius: 20px;
        border: 1px solid #e7e8ec;
        position: relative;
        padding: 20px;
        width: 90%;
    }
}

@media (min-width: 1200px) and (max-width: 1500px) {
        .sms-carousel--no-desktop-slider .sms-carousel-item span {
        min-height: 50px;
    }
}

@media (min-width: 1200px) and (max-width: 1400px) {
    .sms-carousel--no-desktop-slider .sms-carousel-item small {
        min-height: 65px;
    }
}


@media (max-width: 991px) {
    .sms-carousel {
        padding: 20px 0;
    }

    .sms-carousel .slick-list {
        padding: 0 !important;
    }

    .sms-carousel h3 {
        font: 800 28px / 34px "Manrope";
    }

    .sms-carousel .slick-list::before {
        display: none;
    }

    .sms-carousel-box .slick-arrow.slick-prev {
        right: 95px;
    }

    .sms-carousel-item>div {
        margin: 0 auto;
    }

    .sms-carousel .subtitle {
        width: 70%;
    }

}

@media (max-width: 767px) {
    .sms-carousel-box .slick-arrow.slick-prev {
        top: 45%;
        right: auto;
        left: 0;
        z-index: 4;
    }

    .sms-carousel-box .slick-arrow.slick-next {
        top: 45%;
        right: 0;
        left: auto;
        z-index: 4;
    }

    .sms-carousel-item>div {
        width: 300px !important;
        opacity: .6;
    }

    .sms-carousel-item.slick-current>div {
        opacity: 1;
    }

    .sms-carousel h3 {
        text-align: center;
    }

    .sms-carousel .subtitle {
        text-align: center;
        width: 100%;
    }

    .sms-carousel .slick-track {
        padding: 10px 0px;
    }


}