/* cyrillic-ext */
@font-face {
    font-family: Timess;
    src: url(./fonts/TimesNewRomanItalic.ttf);
}



@font-face {
    font-family: Gilroy400;
    src: url(./fonts/Gilroy-Regular.ttf);
}
@font-face {
    font-family: Gilroy500;
    src: url(./fonts/Gilroy-Medium.ttf);
}
@font-face {
    font-family: Gilroy600;
    src: url(./fonts/Gilroy-Semibold.ttf);
}
@font-face {
    font-family: Gilroy700;
    src: url(./fonts/Gilroy-Bold.ttf);
}

input {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}

abbr,
address,
article,
aside,
audio,
b,
blockquote,
body,
canvas,
caption,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
p,
pre,
q,
samp,
section,
small,
span,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
ul,
var,
video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: 0 0
}

body {
    line-height: 1;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}

nav ul {
    list-style: none
}

blockquote,
q {
    quotes: none
}

blockquote:after,
blockquote:before,
q:after,
q:before {
    content: '';
    content: none
}

html {
    overflow-x: hidden
}

a {
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: 0 0;
    color: #1b1b1c;
}

ins {
    background-color: #ff9;
    color: #000;
    text-decoration: none
}

mark {
    background-color: #ff9;
    color: #000;
    font-style: italic;
    font-weight: 700
}

del {
    text-decoration: line-through
}

abbr[title],
dfn[title] {
    border-bottom: 1px dotted;
    cursor: help
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0
}

input,
select {
    vertical-align: middle
}

html {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -ms-overflow-style: scrollbar
}

*,
::after,
::before {
    -webkit-box-sizing: inherit;
    box-sizing: inherit
}




a {
    font-size: 15px;
    display: inline-block;
    text-decoration: none;
    transition: .3s;
}



.flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.container {
    max-width: 1300px;
    width: 100%;
    margin: 0 auto;
    padding: 0px 15px;
}
header{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding-top: 60px;
    padding-bottom: 43px;
}
.promo{
    padding-top: 173px;
    padding-bottom: 83px;
    background: url(./img/promo.png) no-repeat;
    background-size: cover;
}
.promo .left-col{
    max-width: 630px;
    width: 100%;
}
.promo .left-col .top{
    width: fit-content;
    padding: 28px 27px 28px 88px;
    border-radius: 45px;
background: linear-gradient(90deg, rgba(0, 204, 242, 0.35) 6.06%, rgba(245, 248, 255, 0.35) 98.61%);
position: relative;
}
.promo .left-col .top .img{
    left: -60px;
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    height: 121px;
    width: 120px;
}
.promo .left-col .text{
    margin-top: 70px;
    margin-bottom: 55px;
    flex-direction: column;
    gap: 15px;
}
.promo .left-col .text p{
    color: #6C7178;
font-family: Gilroy500, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 155%;
}
.promo .left-col .top .img img{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.promo .left-col .top p{
      color: #333A4A;
    font-family: Gilroy600, sans-serif;
font-size: 30px;
font-style: normal;
font-weight: 600;
line-height: normal;
}
.btn{
    width: fit-content;
}
.btn a{
    width: fit-content;
    display: block;
    padding: 20px 48px;
    border-radius: 100px;
background: #7636FF;
box-shadow: 0px 4px 19px 0px rgba(0, 0, 0, 0.25);
}
.btn a span.p{
    color: #FFF;
text-align: center;
font-family: Gilroy600, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: 600;
line-height: normal;
}
.btn .free{
    margin-top: 14px;
    text-align: center;
    color: rgba(0, 204, 242, 0.75);
text-align: center;
font-family: Gilroy600, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: 600;
line-height: normal;
}
.block2{
    position: relative;
}
.block2 .right-col{
    position: absolute;
    top: -59px;
    right: 0;
    width: 67%;
    gap: 20px;
}
.block2 .right-col .item{
    border-radius: 16px;
background: rgba(255, 255, 255, 0.55);
box-shadow: 0px 30px 80px 0px rgba(51, 58, 74, 0.06);
backdrop-filter: blur(10px);
width: 31.7%;
max-width: 270px;
height: 220px;
padding: 30px 18px 0 30px;
}
.block2 .left-col{
    width: 33%;
    max-width: 385px;
}
.right-col .item .item-top{
    width: fit-content;
    gap: 40px;
    margin-bottom: 36px;
}
.right-col .item .item-top h4{
    color: #333A4A;
font-family: Gilroy700, sans-serif;
font-size: 20px;
font-style: normal;
font-weight: 700;
line-height: normal;

}
.block2{
    padding-top: 23px;
}
.block2 .left-col .title{
    color: #333A4A;
font-family: Gilroy600, sans-serif;
font-size: 35px;
font-style: normal;
font-weight: 600;
line-height: normal;
text-transform: uppercase;
margin-bottom: 10px;
}.block2 .left-col p{
    color: #333A4A;
font-family: Gilroy500, sans-serif;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 24px;
}
.block2 .container{
    position: relative;
}
.right-col .item .item-top .img{
    position: absolute;
    top: 0;
    left: 0;
width: 100%;
height: 100%;
background: #989CAC;
border-radius: 50%;
}
.right-col .item .text{
    color: #333A4A;
font-family: Gilroy500, sans-serif;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 24px;
}
.img-wrapper{
    position: relative;
    width: 30px;
    height: 30px;
}
.right-col .item .item-top .abs{
    position: absolute;
    top: 13px;
    left: 13px;
}
.right-col .item .item-top .img .abs img{
    width: 24px;
    height: 24px;
}
.block3{
    padding-top: 125px;
    background: url(./img/bg2.png) no-repeat;
    background-size: cover;
}
.block3 .title img, .block5 .title img{
    display: block;
    margin: 0 auto;
}
.block3 .title h4, .block5 .title h4{
    color: #333A4A;
font-family: Gilroy600, sans-serif;
font-size: 55px;
font-style: normal;
font-weight: 600;
line-height: normal;
text-transform: uppercase;
margin-top: 21px;
margin-bottom: 10px;
text-align: center;
}
.block3 .title p, .block5 .title p{
    color: #333A4A;
font-family: Gilroy400, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: normal;
text-align: center;
}
.block3-block{
    max-width: 1000px;
    margin: 0 auto;
    width: 100%;
    margin-top: 105px;
    flex-direction: column;
    gap: 42px;
}
.block3-block .item{
    width: 26%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 18px;
}
.block3-block .item p{
    color: #333A4A;
text-align: center;
font-family: Gilroy500, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 26px;
}
.block3-block .item img{
    display: block;
    margin: 0 auto;
}
.item-wrap{
    width: 100%;
    flex-wrap: wrap;
    row-gap: 42px;
}
.block4{
    margin-top: 110px;
   
}
.block4 .container{
     padding: 56px 135px 40px 135px;
    border-radius: 45px;
background: #F5F8FF;
}
.block4 .title{
    color: #333A4A;
text-align: center;
font-family: Gilroy600, sans-serif;
font-size: 35px;
font-style: normal;
font-weight: 600;
line-height: 26px;
text-transform: uppercase;
}
.block4 .pre-title{
    color: #000;
text-align: center;
font-family: Gilroy400, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 25px;
    margin-top: 28px;
    margin-bottom: 65px;
}
.block4-block .item{
    max-width: 290px;
    width: 100%;
    gap: 30px;
}
.block4-block .item img{
    width: 60px;
}
.block4-block .item h4{
    color: #333A4A;
font-family: Gilroy700, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: normal;
margin-bottom: 2px;
}
.block4-block .item p{
    font-family: Gilroy500, sans-serif;
    color: #333A4A;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: normal;
}
.block4-block {
    margin-bottom: 78px;
}
.block4 .btn{
    margin: 0 auto;
}
.slider .item{
    width: 100%;
    margin: 0 15px;

}
.slider .item .left-col{
    max-width: 535px;
    width: 100%;
}
.slider .item .img{
    width: 538px;
}
.slider .item .img img{
    display: block;
    width: 100%;
    height: auto;
}
.slider .item .title{
    color: #333A4A;
font-family: Gilroy600, sans-serif;
font-size: 55px;
font-style: normal;
font-weight: 600;
line-height: normal;
text-transform: uppercase;
margin-bottom: 18px;
}
.slider{
    margin-top: 110px;
}
.slider .item .title span{
    color: #00CCF2;
}
.slider .item-wrpper{
    width: 100%;
}
.slider .item .title .pre-title{
     color: #333A4A;
     margin-top: 11px;
    font-family: Gilroy700, sans-serif;
font-size: 20px;
font-style: normal;
font-weight: 700;
line-height: 24px;
}
.slider .item .text{
    color: #333A4A;
    padding: 28px 27px;
    border-radius: 16px;
background: #F5F6FA;
font-family: Gilroy500, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 26px
}

.custom-arrows{
    width: 100%;
    gap: 20px;
    margin: 0 auto;
    margin-top: 81px;
}
.slick-dots{
    position: unset;
    display: flex;
    align-items: center;
}
.custom-btn{
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: rgb(51 58 74 / 10%);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.custom-arrows .arrows{
    gap: 10px;
}
.custom-dots, .slick-dots, .slick-dots li{
    width: 100%;
}
.slick-dots li{
    margin: 0;
}
.slick-dots li button{
    padding: 0;
width: 100%;
height: 2px;
background: #EDF0F3;
}
.slick-dots li{
    height: auto;
}
.slick-dots li.slick-active button{
    height: 6px;
    border-radius: 4px;
background: #00CCF2;
}
.slick-dots li.slick-active button:before, .slick-dots li button:before{
    display: none;
}
.block5{
    padding-top: 110px;
}
.block5-block{
    margin-top: 57px;
    flex-direction: column;
    gap: 10px;
}
.block5-block .item{
    width: 100%;
    padding: 30px 40px 35px 50px;
    border-radius: 45px;
background: rgb(239 239 239);
cursor: pointer;
}
.block5-block .item h4{
    color: #333A4A;
text-align: center;
font-family: Gilroy600, sans-serif;
font-size: 20px;
font-style: normal;
font-weight: 600;
line-height: normal;
}
.block5-block .item img{
    width: 40px;
    height: 40px;
}
.block5-block .item .arrow-pos{
    transition: .3s;
}
.rotated {
  transform: rotate(180deg) !important;
}
.block5-block .item-bottom{
    margin-top: 40px;
    color: #000;
font-family: Gilroy400, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 1.2;
}
.block6{
    padding-top: 110px;

}
.block6-block   {
    padding: 50px 60px 30px 60px;
    border-radius: 45px;
background: #F5F8FF;
}
.block6-block .title{
    color: #333A4A;
text-align: center;
font-family: Gilroy600, sans-serif;
font-size: 35px;
font-style: normal;
font-weight: 600;
line-height: 26px;
text-transform: uppercase;
margin-bottom: 23px;
}
.block6-block .text{
    color: #333A4A;
font-family: Gilroy400, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 30px;
}
.inputs{
    flex-direction: column;
    gap: 30px;
        padding: 35px 50px;
    border-radius: 25px;
background: rgba(215, 219, 228, 0.24);
backdrop-filter: blur(17.5px);
max-width: 500px;
width: 100%;
}
.inp label{
    color: #333A4A;
font-family: Gilroy600, sans-serif;
font-size: 15px;
font-style: normal;
font-weight: 600;
line-height: normal;
display: block;
margin-bottom: 5px;
}
.inp{
    width: 100%;
}
.inp input{
    border-radius: 10px;
background: rgba(176, 169, 190, 0.13);
border: 0;
width: 100%;
padding: 14px 18px 14px 18px;
color: #11262B;
font-family: Gilroy400, sans-serif;
font-size: 15px;
font-style: normal;
font-weight: 400;
line-height: normal;
}
.block7{
    padding-top: 111px;
}
.block7 .container{
    max-width: 1125px;
}
button{
    border: 0;
    background: unset;
        display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    cursor: pointer;
}
button .free{
    margin: 0;
    margin-top: 0 !important;
}
.form-wrapper{
    align-items: flex-start;
}
.form-wrapper .right-col{
    max-width: 535px;
    width: 100%;
}
.form-wrapper .right-col h2{
    color: #333A4A;
font-family: Gilroy600, sans-serif;
font-size: 55px;
font-style: normal;
font-weight: 600;
text-transform: uppercase;
max-width: 440px;
}
.form-wrapper .right-col h2 span{
color: #00CCF2;
}
.form-wrapper .right-col .text{
    border-radius: 16px;
background: rgba(215, 219, 228, 0.24);
box-shadow: 0px 4px 15px 0px rgba(0, 0, 0, 0.20);
backdrop-filter: blur(13px);
padding: 27px 36px;
color: #333A4A;
font-family: Gilroy500, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 26px;
margin-bottom: 34px;
margin-top: 15px;
}

footer{
    margin-top: 135px;
background: #F5F6FA;
padding: 58px 0 45px 0;
}
footer a{
    display: block;
    color: #121212;
font-family: Gilroy500, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: normal;
}
footer .col{
    flex-direction: column;
    gap: 18px;
    align-items: flex-start;
}
footer p{
    color: #121212;
font-family: Gilroy600, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: 600;
line-height: normal;
}
footer .right-col p, footer .right-col a{
    display: block;
    margin-left: auto;
}
.block7{
    position: relative;
    z-index: 9;
}
.mob{
    display: none !important;
}
.gif{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 50%;
    z-index: -1;
    transform: translateY(-50%);
}
.gif img{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.iti{
    width: 100%;
}
.footer-block .left-col a{
position: relative;
padding-left: 22px;
}
.footer-block .left-col a:before{
    content: '';
    display: block;
    width: 18px;
    height: 18px;
    background: url(./img/ph.svg) no-repeat;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}


.lv1, .lv2 {
top: 0;
    position: absolute;
    left: 0px;
}
.lv2{
    left: unset;
    right: 0px;
    z-index: -1;
}
.lv {
  -webkit-animation: levitation 3s ease-in-out infinite;
          animation: levitation 3s ease-in-out infinite;
  font-size: 60px !important;
  color: var(--color-primary);
}


@-webkit-keyframes shadow {
  0%, 100% {
    transform: scale(1) rotateX(100deg);
  }
  50% {
    transform: scale(0.7) rotateX(100deg);
  }
}

@keyframes shadow {
  0%, 100% {
    transform: scale(1) rotateX(100deg);
  }
  50% {
    transform: scale(0.7) rotateX(100deg);
  }
}
@-webkit-keyframes levitation {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-25px);
  }
}
@keyframes levitation {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-25px);
  }
}
.block5{
    position: relative;
}
.block5 .container *{
    position: relative;
    z-index: 999;
}
@media (max-width: 1150px){
.promo{
        background: url(./img/bg1m.png) no-repeat;
    background-size: cover;
}
header .logo img{
    display: block;
    max-width: 132px;
    margin: 0 auto;
}
.promo{
    padding-top: 105px;
    padding-bottom: 460px;
}
.promo .left-col .top .img{
    width: 80px;
    height: 80px;left: -15px;
}
.promo .left-col .top{
    margin: 0 auto;
    padding: 11px 40px 14px 70px;
}
.promo .left-col .top p{
    font-size: 15px;

}
header{
    padding-top: 35px;

padding-bottom: 10px;}
.promo .left-col{
    max-width: unset;
}
.btn a span.p, .btn .free, .right-col .item .text{
    font-size: 11px;
}
.promo .left-col .text{
    max-width: 324px;
    width: 100%;
    margin: 0 auto;
    margin-top: 41px;
    margin-bottom: 25px;
}
.promo .left-col .text p{
    text-align: center;
    font-size: 11px;
}
.btn{
    margin: 0 auto;
}
.btn a span.svg{
    display: block;
    width: 12px;
}
.btn a span.svg svg{
    width: 12px;
    height: 11px;
}
.btn a{
    display: flex;
    gap: 7px;
}
.block2 .right-col{
    position: unset;
    width: 100%;
    gap: 15px;
}
.block2 .right-col .item{
    padding: 20px 15px;
    max-width: unset;
    width: 190px;
    height: 155px;
}
.right-col .item .item-top h4{
    font-size: 15px;
}
.right-col .item .text{
line-height: 16.5px;
}
.block2, .block3{
    padding-top: 76px;
}.block3 .title img, .block5 .title img{
    max-width: 70px;
}
.block3 .title h4, .block5 .title h4{
    font-size: 30px;
    margin-top: 21px;
    margin-bottom: 11px;
}
.block3 .title p, .block5 .title p{
    font-size: 11px;
}
.block2 .left-col .title{
    max-width: unset;
    font-size: 25px;
    margin-bottom: 5px;
}
.block2 .left-col p{
    font-size: 11px;
}
.block2 .left-col{
    width: 100%;
    max-width: unset;
    margin-bottom: 20px;
}
.block3-block{
    margin-top: 41px;
}
.block3-block .item{
    width: 39%;
}
.block3-block .item p{
    font-size: 11px;
    line-height: 13.5px;
}
.block4 {
    margin-top: 76px;
}
.block6, .block7, .block5{
    padding-top: 76px;
}
footer, .slider{
    margin-top: 76px;
}
.block4 .container{
    padding: 43px 11px;
}
.block4 .title{
        font-size: 25px;
}
.block4 .pre-title{
    font-size: 11px;
    margin-top: 17px;
    margin-bottom: 38px;
    line-height: 14.5px; 
}
.block4-block{
    flex-direction: column;
    gap: 33px;
    margin-bottom: 38px;
}
.slider .item-wrpper{
    flex-direction: column;
    gap: 25px;
}
.slider .item .title{
    font-size: 25px;
}
.slider .item .title .pre-title{
    font-size: 15px;
}
.slider .item .text{
    padding: 20px 16px;
    font-size: 11px;
font-style: normal;
font-weight: 500;
line-height: 21px;
}
.slider .item .img, .slider .item .left-col{
    max-width: unset;
    width: 100%;
}
.block5-block{
    margin-top: 35px;
}
.block5-block .item h4{
    font-size: 15px;
}
.block5-block .item-bottom{
    font-size: 11px;
    margin-top: 10px;
    padding: 0px 20px 0px 0px;
}
.block5-block .item img{
    width: 20px;
    height: 20px;
}
.block5-block .item{
    padding: 12px 26px;
}
.block6-block .title{
    font-size: 20px;
    margin-bottom: 16px;
}
.block6-block{
padding: 34px 26px;
}
.inputs{padding: 30px;}
.block6-block .text{
    font-size: 11px;
    line-height: 20px;
}
.form-wrapper{
    flex-direction: column;
    gap: 66px;
}
.form-wrapper .right-col{
    margin: 0 auto;
}
.form-wrapper .right-col h2{
    font-size: 25px;
    max-width: 200px;
}
.form-wrapper .right-col .text{
    padding: 18px 20px;
    font-size: 11px;
    line-height: 20px;
}
button.mob .free{
    margin-top: 10px !important;
}
.mob{
    display: block !important;
}
.desc{
    display: none !important;
}
.inputs{
    order: 2;
    margin: 0 auto;
}
.footer-block{
        flex-direction: column;
        gap: 27px;
     }
     footer p{
        font-size: 15px;
     }
      footer a{
        font-size: 18px;
      }
     footer p,footer a{
        text-align: center;
        margin: 0 auto;
     }
     footer .col{
        align-items: center;
     }
     .block2 .right-col .item{
        min-width: 190px;
     }
     .block2 .right-col{
        overflow-x: scroll;
     }
     .block5{
        overflow: hidden;
     }
     .lv2{
        right: -85px;
     }
     .lv1{
            top: -200px;
    position: absolute;
    left: -142px;
     }
     .block2 .right-col{
        min-height: 160px;
     }
     /* Скрыть стандартный скроллбар */
     .block2 .right-col::-webkit-scrollbar {
  width: 0;
  height: 0;
}

/* Основной стиль скроллбара */
     .block2 .right-col::-webkit-scrollbar-track {
  background-color: #f1f1f1;
}

     .block2 .right-col::-webkit-scrollbar-thumb {
  background-color: #888;
}

/* При наведении курсора на скроллбар */
     .block2 .right-col::-webkit-scrollbar-thumb:hover {
  background-color: #555;
}
.block4-block .item{
    gap: 30px;
}
.block5-block .item h4{
    text-align: left;
}
}












