.vs__banner {
    background-image:url('/templates/images/vityajnoy-shkaf/background.png');
    height:486px;
    background-size:cover;
    position:relative;
    border-radius:5px;
    margin-bottom:30px;
}

.vs__banner-content {
    display:flex;
    flex-direction:column;
    position:absolute;
    left:0;
    right:0;
    max-width:413px;
    width:100%;
    margin:auto;
    top:74px;
}

.vs__banner-title {
    color: #FFF;
    text-align: center;
    font-size: 27.766px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: 1.944px;
    text-transform: uppercase;
    margin-bottom:10px;
}    

.vs__banner-text {
    color: #FFF;
    text-align: center;
    font-size: 17px;
    font-style: normal;
    font-weight: 500;
    line-height: 120%;
    margin-bottom:43px;
}

.vs__banner-subtitle {
    margin-bottom:15px;
}

.vs__banner-function-visual {
    position:relative;
}

.vs__banner-function-logo {
    position:absolute;
    left:10px;
    top:10px;
    width:45px !important;
}

.vs__banner-button {
    width:fit-content;
    margin:auto;
}

.vs__banner-function {
    height:100%;
}

.vs__banner-function-image {
    max-width:100%;
    border: 1.035px solid rgba(255, 255, 255, 0.10);
    background: lightgray 50% / cover no-repeat;
    box-shadow: 0 31.038px 62.077px 0 rgba(0, 0, 0, 0.10), 0 31.038px 62.077px 0 rgba(0, 0, 0, 0.50);
    border-radius: 7px;
    position:relative;
    max-height:206px;
    height:100%;
}

.vs__banner-function-video {
    max-width:100%;
    border: 1.035px solid rgba(255, 255, 255, 0.10);
    background: lightgray 50% / cover no-repeat;
    box-shadow: 0 31.038px 62.077px 0 rgba(0, 0, 0, 0.10), 0 31.038px 62.077px 0 rgba(0, 0, 0, 0.50);
    border-radius: 7px;
    position:relative;
    max-height:206px;
}

.vs__banner-function:before {
    content: '';
    border-radius: 9.462px;
    background: conic-gradient(from 90deg at 40.63% 50.41%, rgba(249, 123, 6, 0.00) 117.69230604171753deg, rgba(249, 123, 6, 0.70) 285.5769181251526deg, rgba(239, 127, 26, 0.00) 320.19230604171753deg);
    filter: blur(30px);
    display: block;
    width: 100%;
    height: 200px;
    position: absolute;
    left: 0;
    top: 0;
    user-select:none;
    pointer-events:none;
}

.vs__banner-function {
    width:269px;
    padding:10px;
    border-radius: 10.508px;
    border: 1.035px solid rgba(255, 255, 255, 0.10);
    background: linear-gradient(193deg, rgba(255, 255, 255, 0.60) 9.18%, rgba(255, 255, 255, 0.50) 99.07%);
    box-shadow: 0 5.173px 10.346px 0 rgba(0, 0, 0, 0.10), 0 15.519px 31.038px 0 rgba(0, 0, 0, 0.10), 0 20.692px 41.385px 0 rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(10.346153259277344px);
}

.vs__banner-functions {
    position: absolute;
    left: 137px;
    top: 33px;
    width:369px;
    padding: 50px;
    margin: -50px;
    overflow:hidden;
}

.vs__banner-function-num {
    display:flex;
    align-items:center;
    position:relative;
    padding-top:10px;
    color: rgba(255, 255, 255, 0.70);
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 190%;
    padding-bottom:14.38px;
    padding-left:20px;
}

.vs__banner-function-num img {
    margin-right:8px;
    width:fit-content;
}

.vs__banner-function-title {
    color: #000;
    font-size: 14.485px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;
    padding-bottom:5px;
    padding-left:10px;
}

.vs__banner-function-content {
    color: rgba(0, 0, 0, 0.70);
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 110%; 
    padding-bottom:10px;
    padding-left:10px;
}

.vs__banner-functions-swiper .swiper-wrapper {
    align-items:stretch;
}

.vs__banner-functions-swiper .swiper-slide {
    height:auto;
    opacity:0;
    transition:all ease-out .2s;
}

.vs__banner-functions-swiper {
}

.vs__banner-functions-swiper .swiper-slide.swiper-slide-active {
    opacity:1;
}

.vs__banner-swiper-pagination .swiper-pagination-bullet {
    background-color: #b1b3b5;
    border-color: #b1b3b5;
    transition:all ease-out .2s;
}

.vs__banner-swiper-pagination .swiper-pagination-bullet-active {
    background: #F97B06;
    border-color: #F97B06;
}

@media (max-width:1400px) {
    .vs__banner-functions {
        left:9vw;
    }
    
    .vs__banner {
        background-position:right;
    }
}

@media (max-width:1250px) {
    .vs__banner-functions {
        left:3vw;
    }
    
    .vs__banner {
        background-position: center;
    }
}

@media (max-width:1100px) {
    .vs__banner-content {
        right:auto;
        left:3vw;
        max-width: 60vw;
        top: 40px;
    }
    
    .vs__banner-title {
        text-align:left;
        font-size:24px;
    }    
    
    .vs__banner-subtitle {
        text-align:left;
    }
    
    .vs__banner-text {
        text-align:left;
        margin-bottom: 12px;
        font-size:14px;
    }
    
    .vs__banner-button {
        margin-left:0;
        margin-top:5px;
    }
    
    .vs__banner {
        background-position: 60%;
    }
    
    .vs__banner-functions {
        top:250px;
    }
    
    .vs__banner-title br {
        display:none;
    }
    
    .vs__banner-functions {
        width:100%;
    }
    
    .vs__banner-function {
        width:100%;
        flex-direction: row;
        display: flex;
    }
    
    .vs__banner-function-num {
        padding-left:4px;
    }
    
    .vs__banner-function-title {
        padding-left:0px;
    }
    
    .vs__banner-function-content {
        padding-left:0px;
    }
    
    .vs__banner-function-inner {
        padding-left:15px;
        max-width:50%;
    }    
    
    .vs__banner-function-image, .vs__banner-function-video {
        max-height:140px;
    }
    
    .vs__banner-functions-swiper .swiper-slide.swiper-slide-next {
        opacity:1;
    }
    
    .vs__banner-swiper-pagination {
    margin-top:5px;
    }
    
    .vs__banner-functions {
        padding: 50px;
        margin: -50px;
        right: 0;
        width: calc(100% + 50px);
    }
}

@media (max-width:1000px) {
    .vs__banner {
        height:550px;
    }
    
    .vs__banner-function:before {
        max-width:200px;
    }
    
    .vs__banner-functions-swiper .swiper-slide.swiper-slide-next {
        opacity:0;
    }
}

@media (max-width:793px) {
    .vs__banner-functions {
        top:270px;
    }
    .vs__banner {
        background-image:url('/templates/images/vityajnoy-shkaf/background-mobile.png');
        overflow:hidden;
    }
    
    .vs__banner-content {
        width:100%;
        max-width:calc(100% - 6vw);
    }
    
    .vs__banner {
        height:500px;
    }
}

@media (max-width:600px) {
    .vs__banner-button {
        display:none;
    }
    
    .vs__banner-title {
        text-align:center;
        letter-spacing: 1.47px;
        font-size:21px;
        margin-bottom:8px;
    }
    
    .vs__banner-text {
        text-align:center;
        font-size:12px;
        margin-bottom:4px;
    }
    
    .vs__banner-functions {
        top:172px;
        width: calc(100% + 70px);
    }    
    
    .vs__banner-function-inner {
        max-width:56%;
    }
    
    .vs__banner-function-image, .vs__banner-function-video {
        max-height:145px;
    }
    
    .vs__banner-function-content {
        font-size:11px;
    }
    
    .vs__banner {
        height: 400px;
    }
    
    .vs__banner-content {
        top:25px;
    }
}

@media (max-width:400px) {
    .vs__banner-function {
        flex-direction:column;
    }
    
    .vs__banner {
        height: 550px;
    }
    
    .vs__banner-function-image, .vs__banner-function-video {
        width: 100%;
        max-height: 170px;
        object-fit: cover;
    }
    
    .vs__banner-function-inner {
        width:100%;
        max-width:100%;
    }
    
    .vs__banner-function-content {
        font-size:12px;
    }
    
    .vs__banner-title br {
        display:block;
    }    
    
    .vs__banner-function-title br {
        display:none;
    }
}