html {
    box-sizing: border-box;
    scroll-behavior: smooth;
    overflow-x:hidden; 
}

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

a,
p,
span,
h1,
h2,
h3,
h4 {
    margin: 0;
    padding: 0;
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    max-width: 100%;
}

@font-face {
    font-family: "Inter";
    src: local("InterLight"), 
    url("../fonts/Inter-Light.woff2") format("woff2"),
    url("../fonts/Inter-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: local("InterRegulat"), 
    url("../fonts/Inter-Regular.woff2") format("woff2"),
    url("../fonts/Inter-Regular.woff") format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: local("InterMedium"), 
    url("../fonts/Inter-Medium.woff2") format("woff2"),
    url("../fonts/Inter-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: local("InterBold"), 
    url("../fonts/Inter-SemiBold.woff2") format("woff2"),
    url("../fonts/Inter-SemiBold.woff") format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

/*#bx_incl_area_1 {*/
/*    display: flex;*/
/*    align-items: center;*/
/*}*/

/*#bx_incl_area_4 {*/
/*    display: flex;*/
/*    align-items: center;*/
/*}*/
body {
    min-width: 320px;
    font-family: "Inter", sans-serif;
    font-weight: 400;
    color: var(--black-color);
    overflow-x:hidden; 
}

.container {
    max-width: 1250px;
    padding: 45px 25px;
    margin: 0 auto;
}

.list-resert {
    margin: 0;
    padding: 0;
    list-style: none;
}

.btn-resert {
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    
}

:root {
    --white-color: #FFFFFF;
    --black-color: #000000;
    --tifany-color: #1DCEC9;
    --forest-color: #0A6375;
    --grey-color: #999999;
    --dark-grey-color: #B9B9B9;
    --bg-color: #2C2D33;

    --violet-cl: #C6C3FD;
    --blue-cl: #A2CCF1;
    --orange-cl: #FBD488;
    --pink-cl: #FFC6C6;
    --green-cl: #D0FFDB;
}

.btn-tif {
    display: inline-block;
    color: var(--tifany-color);
    cursor: pointer;
    background: #1DCEC9;
    border: 1px solid #FFFFFF;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    border-radius: 52px;
    font-weight: 500;
    font-size: 23px;
    line-height: 28px;
}

.title {
    width: 70%;
    font-weight: 400;
    font-size: 40px;
    line-height: 48px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.main {
    background-image: url(../img/bg-black.jpg);
    background-repeat: no-repeat;
    background-position: center 55%;
    background-size: 102%;
}

.main-animation {
    animation: wipe-enter 4s 1
  }
  @keyframes wipe-enter {
    0% {
        background-position:  center 55%;
    }
    100% {
        background-position: center 50%;
    }
}

/* header */

.header__container {
    padding: 20px 10px;
    display: flex;
    align-items: center;
}

.header__logo {
    margin-right: auto;
}

.nav {
    margin-right: 30px;
}

.nav__list {
    display: flex;
}

.nav__link {
    display: block;
    padding: 7px 12px;
    border: 1px solid black;
    border-radius: 42px;
    font-weight: 400;
    font-size: 15px;
    line-height: 18px;
    transition: background-color .3s ease-in-out, color .3s ease-in-out;
}

.nav__link:focus,
.nav__link:hover,
.nav__link:active {
    background-color: var(--forest-color);
    color: var(--white-color);

}

.nav__list li:not(:last-child) {
    margin-right: 33px;
}

.nav__link:focus {
    outline: none;
    outline-offset: 0;
}

.header__contacts  {
    display: flex;
    align-items: center;
}
.header__contacts div  {
    display: flex;
    align-items: center;
}

.header__link:not(:last-child) {
    margin-right: 10px;
}

.header__phone {
    font-weight: 500;
    font-size: 18px;
    line-height: 22px; 
}

.burger {
    display: none;
}

/* hero */


.hero__container {
    padding-top: 100px;
    padding-bottom: 50px;
}

.hero__content {
    width: 70%;
}

.hero__title {
    margin-bottom: 35px;
    font-weight: 500;
    font-size: 46px;
    line-height: 56px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.hero__text {
    font-weight: 400;
    font-size: 30px;
    line-height: 36px;
    letter-spacing: 0.02em;
    margin-bottom: 60px;
}

.hero__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 45%;
    margin-bottom: 15px;
    font-weight: 500;
    font-size: 22px;
    line-height: 27px;
    letter-spacing: 0.02em;
}

.hero__btns {
    text-align: center;
}

.hero__btn { 
    position: relative;
    display: inline-block;
    background-color: transparent;
    padding: 8px 20px;
    font-weight: 400;
    font-size: 22px;
    line-height: 27px;
    border: none;
    border: 1px solid #000000;
    border-radius: 47px;
    transition: background-color .3s ease-in-out, color .3s ease-in-out;
}

.hero__btn:not(:last-child) {
    margin-right: 18px;
}

.hero__btn::before {
    transition: all .5s ease-in-out;
}

.hero__btn:focus,
.hero__btn:hover,
.hero__btn:active {
    background-color: var(--forest-color);
    color: var(--white-color);
    outline: none;
}

.hero__btn:active.hero__btn::before {
    position: absolute;
    content: '';
    bottom: -15px;
    left: 42%;
    background-image: url(../img/hero-star.svg);
    width: 30px;
    height: 30px;
    z-index: 1;
    transition: all .5s ease-in-out;
}



.hero {
    background-image: url(../img/r1.svg), url(../img/r2.svg), url(../img/r3.svg), url(../img/r4.svg), url(../img/r5.svg), url(../img/r6.svg), url(../img/r7.svg), url(../img/r1.svg), url(../img/r2.svg), url(../img/r3.svg), url(../img/r4.svg), url(../img/r5.svg), url(../img/r6.svg), url(../img/r7.svg), url(../img/r1.svg), url(../img/r2.svg), url(../img/r3.svg), url(../img/r4.svg), url(../img/r5.svg), url(../img/r6.svg), url(../img/r7.svg), url(../img/r1.svg), url(../img/r2.svg);
    background-repeat: no-repeat;
    /* background-size: 471px 321px; */
    -webkit-animation: slise 60s linear infinite;
    -moz-animation: slise 60s linear infinite;
    -o-animation: slise 60s linear infinite;
    -ms-animation: slise 60s linear infinite;
    animation: slise 10s linear infinite;
    
}

@keyframes slise {
    0% {
        background-position: 0 0, 0 87%, 0 173%, -40% 47%, -23% -60%, 41% -46%, 41% 41%, 41% 128%, 82% -5%, 81% 82%, 82% -90%, -41% 133%, 80% 169%, 122% -52%, 120% 124%, 121% 37%;
    }

    100% {
        background-position: -20% 20%, -20% 107%, -20% 193%, -60% 67%, -43% -40%, 21% -26%, 21% 61%, 21% 148%, 62% 15%, 61% 102%, 62% -70%, -61% 153%, 60% 189%, 102% -32%, 100% 144%, 101% 57%;
    }
}

  
/* Animations */


/* result */

.result {
    background-color: var(--bg-color);
}

.result__container {
    padding: 30px 10px;
    display: flex;
}
.swiper-res {
    display: none;
    overflow: hidden;
}

.result__cont {
    color: var(--white-color);
}
/* 
.result__cont:not(:first-child) {
    padding-left: 30px;
} */

.result__cont {
    border-right: 1px solid #757575;
    height: auto;
}

.result__cont:first-child {
    width: 27%;
}

.result__cont:nth-child(2) {
    width: 33%;
}

.result__cont:last-child {
    width: 40%;
}
.result__num {
    margin: 0 auto;
    width: 80%;
    display: block;
    font-weight: 500;
    font-size: 84px;
    line-height: 102px;
    letter-spacing: 0.02em;
    
}

.result__text {
    margin: 0 auto;
    width: 80%;
    display: block;
    font-weight: 400;
    font-size: 32px;
    line-height: 39px;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

/* problem */

.problem {
    background-image: url(../img/bg-star.svg);
    background-repeat: no-repeat;
    background-size: 880px 930px;
    background-position: 87% -358px;
}

.problem__container {
    padding-bottom: 66px;
}

.problem__title {
    margin-bottom: 75px;
}

.problem__content {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    margin-bottom: 40px;
}

.problem__item {
    position: relative;
    width: 50%;
    border-radius: 35px;
    padding: 60px 80px;
    color: var(--white-color);
    transition: all .3s ease-in-out;
}

.problem__item::before {
    content: '';
    position: absolute;
    background-size: 95px;
    width: 95px;
    height: 95px;
    z-index: 1;
}
.item1 {
    background-color: var(--tifany-color);
    
}

.item1::before {
    background-image: url(../img/Star.svg);
    right: -43px;
    top: 14%;
}

.item1:hover {
    top: -15px;
    left: -15px;
    transition: all .3s ease-in-out;
}

.item2 {
    background-color: var(--forest-color);
}

.item2::before {
    background-image: url(../img/Star12.svg);
    right: 10%;
    bottom: -43px;
}

.item2:hover {
    top: -15px;
    right: -15px;
    transition: all .3s ease-in-out;
}

.item3 {
    color: var(--black-color);
    box-shadow: 0px 5px 15px rgba(66, 85, 255, 0.13);
}

.item3:hover {
    bottom: -15px;
    left: -15px;
    transition: all .3s ease-in-out;
}

.item4 {
    background-color: var(--bg-color);
}

.item4::before {
    background-image: url(../img/Star13.svg);
    left: -43px;
    top: 41%;
}

.item4:hover {
    bottom: -15px;
    right: -15px;
    transition: all .3s ease-in-out;
}

.problem__subtitle {
    margin-bottom: 25px;
    font-weight: 400;
    font-size: 36px;
    line-height: 44px;
    letter-spacing: 0.02em;
}

.problem__text {
    font-weight: 400;
    font-size: 20px;
    line-height: 28px;
    letter-spacing: 0.02em;
}

.same-form {
    text-align: center;
}

.same-form__title {
    margin-bottom: 40px;
    font-weight: 500;
    font-size: 30px;
    line-height: 36px;
    letter-spacing: 0.04em;
}

.form {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  
}

.form__label {
    width: 50%;
    margin-bottom: 40px;
    position: relative;
}

.form__input {
    width: 65%;
    border: none;
    border-bottom: 1px solid var(--grey-color);
    color: var(--grey-color);
    font-weight: 300;
    font-size: 22px;
    line-height: 38px;
    padding: 6px;
    background-color: transparent;
}

.form__button {
    text-align: center;
}

.form__btn {
    display: inline-block;
    padding: 13px 40px;
    background: var(--tifany-color);
    border: 1px solid var(--white-color);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    border-radius: 52px;
    color: var(--white-color);
    font-weight: 500;
    font-size: 23px;
    line-height: 28px;
    letter-spacing: 0.02em;
    transition: background-color .3s ease-in-out;
}

.form__btn:hover {
    background-color: var(--forest-color);
}

.just-validate-error-label {
    position: absolute;
    bottom: -41%;
    left: 18%;
}

.just-validate-error-field {
    border-bottom: 2px solid rgb(255, 92, 0);
}

/* pluses */

.pluses__title {
    margin-bottom: 50px;
}

.card {
    margin-bottom: 60px;
}

.card--hidden {
    display: none;
}

.card__item {
    position: relative;
    width: 65%;
    margin: 0 auto;
    padding: 78px 60px 60px 136px;
    box-shadow: 0px 1px 36px rgba(0, 0, 0, 0.25), 0px 6.38126px 90.933px rgba(0, 0, 0, 0.12);
    border-radius: 43px;
    background-image: url(../img/Star\ 28.svg), url(../img/Star\ 29.svg), url(../img/Star\ 29.svg), url(../img/mouse.svg);
    background-repeat: no-repeat;
    background-position: 95% 0, 100% 11%, 20% 117%, 93% 88%;
}

.card__item::before {
    position: absolute;
    content: '';
    left: 0;
    top: 48px;
    background-image: url(../img/card1.svg);
    background-repeat: no-repeat;
    width: 90px;
    height: 294px;
}


.card__text {
    margin-bottom: 14px;
    font-weight: 500;
    font-size: 33px;
    line-height: 40px;
    letter-spacing: 0.02em;
}

.card__more {
    margin-top: 10px;
    font-weight: 500;
    font-size: 31px;
    line-height: 42px;
    letter-spacing: 0.02em;
    border-bottom: 2px solid var(--black-color);
    transition: color .3s ease-in-out, border .3s ease-in-out;
}

.card__more:hover {
    color: var(--forest-color);
    border-bottom: 2px solid var(--forest-color);
    transition: color .3s ease-in-out, border .3s ease-in-out;
}



/* swiper */

.swip {
    overflow: visible;
    /* margin-bottom: 60px; */
    display: none;
}

.swiper-pagination {
    display: none;
}

.swip--active {
    display: block;
}
.swip__item {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    position: relative;
    width: 327px;
    height: 164px;
    padding-left: 90px;
    padding-right: 10px;
    box-shadow: 0px 2.69504px 38.4043px rgba(0, 0, 0, 0.06);
    border-radius: 18px;
}

.swip__item:nth-child(2n) {
    background-image: url(../img/Star-2.svg), url(../img/Star-2-big.svg);
    background-repeat: no-repeat;
    background-position: 95% 0, 100% 11%;
}

.swip__item:nth-child(2n-1) {
    background-image: url(../img/haif-of-star.svg), url(../img/Star-2-big.svg);
    background-repeat: no-repeat;
    background-position: 93% 0,  100% 99%;
}

.swip__item::before {
    position: absolute;
    content: '';
    left: 0;
    top: 17px;
    background-repeat: no-repeat;
    width: 85px;
    height: 130px;
}

.swip1 {
    display: block;
    padding: 20px 30px 30px 60px;
}
.swip1::before {
    background-image: url(../img/1.svg);
}
.swip2::before {
    background-image: url(../img/2.svg);
}
.swip3::before {
    background-image: url(../img/3.svg);
}
.swip4::before {
    background-image: url(../img/4.svg);
}
.swip5::before {
    background-image: url(../img/5.svg);
}
.swip6::before {
    background-image: url(../img/6.svg);
}
.swip7::before {
    background-image: url(../img/7.svg);
}
.swip7 {
    padding-left: 80px;
}
.swip8::before {
    background-image: url(../img/8.svg);
}
.swip9::before {
    background-image: url(../img/9.svg);
}

.swip__text {
    font-weight: 500;
    font-size: 15px;
    line-height: 19px;
    letter-spacing: 0.02em;
}

.swip1>.swip__text {
    margin-bottom: 10px;
    font-weight: 500;
    font-size: 13px;
    line-height: 19px;
    letter-spacing: 0.02em;
}

.swip__more {
    font-weight: 400;
    /* font-size: 12px;
    line-height: 15px; */
    font-size: 20px;
        line-height: 21px;
    letter-spacing: 0.02em;
    border-bottom: 1px solid var(--black-color);
    transition: color .3s ease-in-out, border .3s ease-in-out;
}

.swip__more:hover {
    color: var(--forest-color);
    border-bottom: 1px solid var(--forest-color);
    transition: color .3s ease-in-out, border .3s ease-in-out;
}

/* modal */

.modal {
    position:fixed;
    display: none;
    width:100%;
    height:100%;
    justify-content:center;
    align-items:center;
    background:rgba(0,0,0,.7);

}

.plus__modal {
    position: relative;
    box-shadow: 0px 0.782216px 11.7332px rgba(0, 0, 0, 0.2);
    border-radius: 14px;
    background-color: var(--white-color);
    padding: 4% 1% ;
    
}

.modal--active {
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    
}

/* .plus__modal-content {
    margin: 0 auto;
} */

.plus__modal-title {
    padding-left: 76px;
    margin-bottom: 5%;
}

.plus__modal-cont {
    position: relative;
    max-width: 1000px;
    padding-left: 70px;
    padding-right: 70px;
    margin: 0 auto;
}

.plus__modal-cont::before {
    position: absolute;
    content: url(../img/closes.svg);
    top: 27%;
    left:  35%;
    width: 30px;
    height: 30px;
    transform: rotateZ(45deg);
}

.top-m {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 70px;
}

.top-m__names {
    width: 100%;
    margin-bottom: 23px;
}

.example {
    margin-bottom: 15px;
    font-weight: 600;
    font-size: 19px;
    line-height: 23px;
    letter-spacing: 0.02em;
    text-transform: uppercase; 
}

.top-m__text {
    font-weight: 400;
    font-size: 17px;
    line-height: 21px;
    letter-spacing: 0.02em;
}

.top-m__about {
    display: flex;
    align-items: center;
    width: 29%;
    box-shadow: 0px 0.782216px 11.7332px rgba(0, 0, 0, 0.2);
    border-radius: 14px;
    margin-right: 90px;
}

.top-m__item {
    font-weight: 400;
    font-size: 14px;
    line-height: 17px;
    letter-spacing: 0.02em;
}

.top-m__info {
    width: 60%;
    display: flex;
    align-items: center;
    box-shadow: 0px 0.782216px 11.7332px rgba(0, 0, 0, 0.2);
    border-radius: 14px;
}

.bot-m {
    display: flex;
    align-items: center;
    padding: 13px 30px;
    box-shadow: 0px 0.782216px 11.7332px rgba(0, 0, 0, 0.2);
    border-radius: 14px;
}

.bot-m__descr {
    display: inline-block;
    width: 70%;
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0.02em;
}

.des {
    margin-bottom: 20px;
}

.plus__modal-close {
    position: absolute;
    top: 3%;
    right: 5%;
    width: 100px;
    height: 100px;
}

.stop-scroll {
    overflow-y: hidden;
}

/* info*/

.info__title {
    margin-bottom: 50px;
}
.iinf-c {
    display: none;
}
.st {
    display: none;
}
.info__content {
    margin-bottom: 70px;
    display: flex;
    justify-content: space-between;
}

.info__cont {
    padding: 35px;
    width: 49%;
    background: var(--white-color);
    border: 1px solid #E9E9E9;
    box-shadow: 0px 1px 18px rgba(0, 0, 0, 0.13);
    border-radius: 35px;
}

.info__text {
    display: flex;
    align-items: center;
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    min-height: 130px;
    padding: 10px 0 10px 90px;
    background-repeat: no-repeat;
    background-position: center left;
}

.inf1 {
    background-image: url(../img/11.jpg);
}
.inf2 {
    background-image: url(../img/22.jpg);
}
.inf3 {
    background-image: url(../img/33.jpg);
}
.inf4 {
    background-image: url(../img/44.jpg);
}
.inf5 {
    background-image: url(../img/55.jpg);
}
.inf6 {
    background-image: url(../img/66.jpg);
}
.inf7 {
    background-image: url(../img/77.jpg);
}
.inf8 {
    background-image: url(../img/88.jpg);
}

.sup {
    width: 70%;
    margin: 0 auto;
}

.sup__title {
    text-align: center;
    font-size: 28px;
    line-height: 40px;
    margin-bottom: 35px;
}

.sup__cont {
    display: flex;
    align-items: center;
}

.sup__btn {
    /* width: 35%; */
    font-size: 17px;
    line-height: 21px;
	color: var(--bg-color);
    border: none;
    border: 2px solid var(--tifany-color);
    border-radius: 35px;
    padding: 20px 30px;
    margin-right: 15px;
    transition: background-color .3s ease-in-out;
}

.sup__btn:focus,
.sup__btn:hover,
.sup__btn:active {
    background-color: var(--tifany-color);
}



.sup__person {
    display: flex;
    align-items: center;
    
}

.sup__person img {
    margin-right: 24px;
}

.sup__text {
    /* display: flex;
    align-items: center;
    height: 70px; */
    padding-left: 16px;
    background-image: url(../img/Vector.jpg);
    background-repeat: no-repeat;
    background-position: center left;
    font-size: 16px;
    line-height: 28px;
}


/* work */

.work {
    background-color: var(--bg-color);
}

.work__container {
    position: relative;
}

.swiper-w {
    display: none;
}

.static {
    display: flex;
    justify-content: space-around;
    align-items: center;
    height: 550px;
}

.static__left {
    width: 46%;
    background-color: var(--white-color);
    border-radius: 50%;
    height: 100%;
}

.static__right {
    width: 49%;
    display: flex;
    flex-direction: column;
    vertical-align: middle;
    color: var(--white-color);
}

.static__title {
    margin-bottom: 10px;
    font-weight: 600;
    font-size: 63px;
    line-height: 76px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    
}

.static__descr {
    margin-bottom: 10px;
    font-size: 32px;
    line-height: 36px;
    letter-spacing: 1px;
}

.static__text {
    letter-spacing: 0.02em;
    font-weight: 300;
    font-size: 19px;
    line-height: 26px;
}

.move {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 45px 25px;
}

.move__slide {
    padding-top: 100px;
    height: 100%;
}

.move__item {
    width: 50%;
    padding: 160px 55px 100px 55px;
    background-position: center top;
    background-repeat: no-repeat;
    font-weight: 600;
    font-size: 28px;
    line-height: 36px;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--bg-color);
    text-align: center;
}

/* about */

.about {
    background-image: url(../img/bg-pluses.svg);
    background-repeat: no-repeat;
    background-position: left bottom;
}

.about__title {
    margin-bottom: 55px;
}

.about__content {
    margin-bottom: 50px;
}
.about__list {
    display: flex;
    flex-wrap: wrap;
}

.about__item {
    display: flex;
    align-items: center;
    width: 50%;
    padding-left: 120px;
    margin-bottom: 20px;
    min-height: 135px;
    background-image: url(../img/done.svg);
    background-repeat: no-repeat;
    background-position: left center;
    font-size: 20px;
    line-height: 24px;
}
.about__show-more {
    display: none;
}

/* expert */

.expert {
    position: relative;
}
.expert__title {
    width: 65%;
    margin-bottom: 8px;
}
.expert__text {
    width: 50%;
    margin-bottom: 60px;
    font-weight: 300;
    font-size: 26px;
    line-height: 31px;
}
.expert__mob {
    position: relative;
    margin: auto;
    padding-top: 190px;
    padding-left: 40px;
    padding-right: 40px;
    height: 785px;
    max-width: 383px;
    background-image: url(../img/Mockup22.svg);
    background-repeat: no-repeat;
    background-position: center;
    color: var(--white-color);
    z-index: 1;
}
.expert__link {
    display: block;
    font-weight: 600;
    font-size: 32px;
    line-height: 39px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    border-bottom: 2px solid transparent;
    transition: border .3s ease-in-out;
}
.expert__link:not(:last-child) {
    margin-bottom: 30px;
}
.expert__link:hover {
    border-bottom: 2px solid var(--white-color);
}
.expert__all {
    position: absolute;
    bottom: 80px;
    left: 50px;
    padding-right: 15px;
    display: block;
    font-weight: 300;
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 0.02em;
    background-image: url(../img/стрелочка.svg);
    background-repeat: no-repeat;
    background-position: center right;
    border-bottom: 1px solid transparent;
    transition: border .3s ease-in-out;
}
.expert__all:hover {
    border-bottom: 1px solid var(--white-color);
}
.lin {
    display: none;
}
.back {
    width: 100%;
    position: absolute;
    top: 300px;
    left: 0;
    bottom: 0;
    right: 0;
    background: transparent;
    z-index: 0;
}

  .back__anim {
    width: 100%;
    height: 100%;
    position: absolute;
    background: none;
    background-image: url(../img/jbg-image/Проектирование-архитектуры-приложений.svg), url(../img/jbg-image/java.svg), url(../img/jbg-image/flutter.svg), url(../img/jbg-image/aws.svg), url(../img/jbg-image/volley.svg), url(../img/jbg-image/AndroidStudio.svg), url(../img/jbg-image/AppCompat.svg), url(../img/jbg-image/C.svg), url(../img/jbg-image/Camera.svg), url(../img/jbg-image/Confluence.svg), url(../img/jbg-image/ConstraintLayout.svg), url(../img/jbg-image/управление-проектами.svg), url(../img/jbg-image/ContentProvider.svg), url(../img/jbg-image/построение-команды.svg), url(../img/jbg-image/Corel-Draw.svg), url(../img/jbg-image/FileZilla.svg), url(../img/jbg-image/Visual\ Studio.svg), url(../img/jbg-image/Git.svg), url(../img/jbg-image/Unity3D.svg), url(../img/jbg-image/Unit.svg), url(../img/jbg-image/glide.svg), url(../img/jbg-image/Swagger.svg), url(../img/jbg-image/Golden-tests.svg), url(../img/jbg-image/Sqlite.svg), url(../img/jbg-image/Sherlock.svg), url(../img/jbg-image/google-map.svg), url(../img/jbg-image/Service.svg), url(../img/jbg-image/Gradle.svg), url(../img/jbg-image/retrofit.svg), url(../img/jbg-image/GRPC.svg), url(../img/jbg-image/REST.svg), url(../img/jbg-image/gson.svg), url(../img/jbg-image/picasso.svg), url(../img/jbg-image/iOs.svg), url(../img/jbg-image/PHP.svg), url(../img/jbg-image/Node.svg), url(../img/jbg-image/Jira.svg), url(../img/jbg-image/navigation.svg), url(../img/jbg-image/Kodein.svg), url(../img/jbg-image/LiveData.svg), url(../img/jbg-image/kotlin.svg), url(../img/jbg-image/Corel-Draw.svg), url(../img/jbg-image/Sherlock.svg), url(../img/jbg-image/Git.svg), url(../img/jbg-image/google-map.svg), url(../img/jbg-image/Service.svg), url(../img/jbg-image/volley.svg), url(../img/jbg-image/управление-проектами.svg), url(../img/jbg-image/aws.svg), url(../img/jbg-image/C.svg) ;
    background-repeat: no-repeat;
    -webkit-animation: snowy 13s linear infinite;
    -moz-animation: snowy 13s linear infinite;
    -o-animation: snowy 13s linear infinite;
    -ms-animation: snowy 13s linear infinite;
    animation: snowy 20s linear infinite;
  }

  @keyframes snowy {
    0% {
        background-position: 50% 0%, -40% 10%, -50% 20%, -30% 30%, -40% 40%, -30% 55%, -50% 60%, -40% 70%, -20% 80%, -40% 90%,     -20% 5%, -10% 15%, -20% 25%, 0 35%, -10% 45%, 10% 45%, -10% 65%, -10% 75%, 10% 85%, -10% 95%,    10% 0, 20% 10%, 10% 25%, 30% 25%, 20% 40%, 40% 50%, 10% 60%, 20% 70%, 40% 80%, 20% 90%,    40% 10%, 50% 15%, 40% 25%, 50% 35%, 50% 45%, 70% 55%, 40% 65%, 50% 75%, 70% 85%, 50% 95%,    80% 0, 70% 10%, 60% 20%, 70% 30%, 80% 40%, 90% 50%, 80% 60%, 70% 70%, 90% 80%, 75% 90%;
    }

    100% {
        background-position: 90% 0%, 0% 10%, -10% 20%, 10% 30%, 0% 40%, 10% 55%, -10% 60%, 0% 70%, 20% 80%, 0% 90%,    20% 5%, 30% 15%, 20% 25%, 40% 35%, 30% 45%, 50% 45%, 30% 65%, 30% 75%, 40% 85%, 30% 95%,    50% 0, 60% 10%, 50% 25%, 70% 30%, 60% 40%, 80% 50%, 50% 60%, 60% 70%, 80% 80%, 60% 90%,   80% 10%, 90% 15%, 80% 25%, 90% 35%, 90% 45%, 100% 55%, 80% 65%, 90% 75%, 100% 85%, 90% 95%,   120% 0, 110% 10%, 100% 20%, 110% 30%, 120% 40%, 130% 50%, 120% 60%, 120% 70%, 130% 80%, 115% 90%;
    }
}
  /* @keyframes snowy {
    0% {
      background-position: 0px 0px,  60% 60%,  -2% 20%,  40% 10%,   70% 10%,   30% 40%,   10% 90%,   20% 80%,   0 60%,   10% 40%,   50% 98%,  60% 60%,   60% 40%, -60px 0px, -50% 10%, -62% 20%, -20% 10%, 10% 10%, 80% 60%, -30% 40%, -50% 90%, -40% 80%, -60% 60%, -50% 40%;
    }
    100% {
      background-position: 60% 0px,  120% 60%,  58% 20%,  100% 10%,  130% 10%,  90% 40%,   70% 90%,   80% 80%,   60% 60%,  70% 40%,  110% 98%,  120% 60%, 120% 40%, 0px 0px,   10% 10%,   2% 20%,  40% 10%, 70% 10%, 140% 60%, 30% 40%,  10% 90%, 20% 80%,   0 60%,   10% 40%;
    }
    /* 100% {
      background-position: 120% 0px, 130% 10%, 118% 20%, 160% 10%,  190% 10%,  150% 40%,  130% 90%,  140% 80%,  120% 60%,  130% 40%, 170% 98%, 180% 60%, 180% 40%, 60% 0px,   70% 10%,  62% 20%, 100% 10%, 130% 10%, 200% 60%, 90% 40%,  70% 90%, 80% 80%, 60% 60%,   70% 40%;
    } 
  }
  @-moz-keyframes snowy {
    0% {
        background-position: 0px 0px,  60% 60%,  -2% 20%,  40% 10%,   70% 10%,   30% 40%,   10% 90%,   20% 80%,   0 60%,   10% 40%,   50% 98%,  60% 60%,   60% 40%, -60px 0px, -50% 10%, -62% 20%, -20% 10%, 10% 10%, 80% 60%, -30% 40%, -50% 90%, -40% 80%, -60% 60%, -50% 40%;
      }
      100% {
        background-position: 60% 0px,  120% 60%,  58% 20%,  100% 10%,  130% 10%,  90% 40%,   70% 90%,   80% 80%,   60% 60%,  70% 40%,  110% 98%,  120% 60%, 120% 40%, 0px 0px,   10% 10%,   2% 20%,  40% 10%, 70% 10%, 140% 60%, 30% 40%,  10% 90%, 20% 80%,   0 60%,   10% 40%;
      }
  }
  @-webkit-keyframes snowy {
    0% {
        background-position: 0px 0px,  60% 60%,  -2% 20%,  40% 10%,   70% 10%,   30% 40%,   10% 90%,   20% 80%,   0 60%,   10% 40%,   50% 98%,  60% 60%,   60% 40%, -60px 0px, -50% 10%, -62% 20%, -20% 10%, 10% 10%, 80% 60%, -30% 40%, -50% 90%, -40% 80%, -60% 60%, -50% 40%;
      }
      100% {
        background-position: 60% 0px,  120% 60%,  58% 20%,  100% 10%,  130% 10%,  90% 40%,   70% 90%,   80% 80%,   60% 60%,  70% 40%,  110% 98%,  120% 60%, 120% 40%, 0px 0px,   10% 10%,   2% 20%,  40% 10%, 70% 10%, 140% 60%, 30% 40%,  10% 90%, 20% 80%,   0 60%,   10% 40%;
      }
  }
  @-o-keyframes snowy {
    0% {
        background-position: 0px 0px,  60% 60%,  -2% 20%,  40% 10%,   70% 10%,   30% 40%,   10% 90%,   20% 80%,   0 60%,   10% 40%,   50% 98%,  60% 60%,   60% 40%, -60px 0px, -50% 10%, -62% 20%, -20% 10%, 10% 10%, 80% 60%, -30% 40%, -50% 90%, -40% 80%, -60% 60%, -50% 40%;
      }
      100% {
        background-position: 60% 0px,  120% 60%,  58% 20%,  100% 10%,  130% 10%,  90% 40%,   70% 90%,   80% 80%,   60% 60%,  70% 40%,  110% 98%,  120% 60%, 120% 40%, 0px 0px,   10% 10%,   2% 20%,  40% 10%, 70% 10%, 140% 60%, 30% 40%,  10% 90%, 20% 80%,   0 60%,   10% 40%;
      }
  } */

  /* personal */

  .personal {
    background-color: var(--bg-color);
  }

  .personal__container {
    padding-bottom: 0;
  }

  .personal__title {
    width: 41%;
    margin-bottom: 25px;
    font-weight: 400;
    font-size: 38px;
    line-height: 46px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--white-color);
  }

  .personal__text {
    font-size: 23px;
    line-height: 28px;
    letter-spacing: 0.02em;
    color: var(--white-color);
    margin-bottom: 40px;
  }

  .personal__form {
    width: 80%;
    margin: 0 auto;
    /* margin-bottom: 55px; */
  }

  .personal__label {
    display: inline-block;
    padding: 8px 30px;
    width: fit-content;
    cursor: pointer;
    font-size: 22px;
    line-height: 27px;
    color: var(--white-color);
    border: none;
    border: 1px solid var(--white-color);
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    border-radius: 47px;
    transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out ;
  }

  .personal__label:not(:last-child) {
    margin-right: 1%;
  }

.personal__input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    border: 0;
    padding: 0;
    clip: rect(0, 0, 0, 0);
    overflow: hidden;
}

.personal__label:hover {
    background-color: var(--white-color);
    color: var(--black-color);
}

.personal__input:focus .personal__label {
    background-color: var(--tifany-color);
    
}

.personal__input:checked .personal__label--active {
    background-color: var(--white-color);
    color: var(--black-color);
}

.personal__label.personal__label--active {
    background-color: var(--white-color);
    color: var(--black-color);
}

.pers {
    text-align: center;
}

.per {
    display: none;
    position: relative;
    overflow: hidden;
    padding-left: 30px;
    padding-right: 30px;
}

.per--active {
    display: block;
    position: relative;
}

.swiper-button-next:after {
    content: '';
}
.swiper-button-prev:after {
    content: '';
}

.swiper-button-next {
    background-image: url(../img/next.svg);
    background-repeat: no-repeat;
    right: 0;
}

.swiper-button-prev {
    background-image: url(../img/prev.svg);
    background-repeat: no-repeat;
    left: 0;
}

.per__card {
    height: 445px;
    display: flex;
    justify-content: space-between;
    
}

.per__item {
    position: relative;
    width: 100%;
    height: 90%;
    padding: 35px;
    background-repeat: no-repeat;
    box-shadow: 0px 3.9459px 43.4049px 10.8512px rgba(0, 0, 0, 0.06);
    border-radius: 24px;
}

.per__item1 {
    background-color: var(--white-color);
}

.per__item2 {
    margin-top: 40px;
    color: var(--white-color);
    background-color: var(--forest-color);
}

.per__item2 .per__btn,
.per__item2 .per__more-info,
.per__item2 .per__reserv {
    color: var(--white-color);
}

.per__item2 .per__more-info:hover,
.per__item2 .per__reserv:hover {
    color: var(--black-color);
} 

.per__item3 {
    background-color: var(--black-color);
    color: var(--white-color);
}

.per__item3 .per__btn,
.per__item3 .per__more-info,
.per__item3 .per__reserv {
    color: var(--white-color);
}

.per__name {
    display: block;
    font-size: 18px;
    line-height: 26px;
}

.per__posicion {
    display: block;
    margin-bottom: 25px;
    font-size: 15px;
    line-height: 22px;
}

.per__years {
    display: block;
    font-weight: 700;
    font-size: 12px;
    line-height: 17px;
}

.per__indast {
    font-size: 12px;
    line-height: 17px;
    text-indent: 75.8816px;
}

.per__more-info {
    display: block;
    margin-top: 11px;
    margin-bottom: 20px;
    font-size: 15px;
    line-height: 21px;
    color: var(--tifany-color);
    transition: color .3s ease-in-out;
}

.per__more-info:hover {
    color: var(--forest-color);
}

.per__btns {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: auto;
}

.per__btn {
    display: block;
    margin-right: 3px;
    margin-bottom: 9px;
    padding: 4px 8px;
    border: 1px solid #E7E7E9;
    border-radius: 30px;
    font-size: 12px;
    line-height: 15px;
    
    transition: background-color .3s ease-in-out;
}

.per__btn:hover {
    background-color: #1DCEC9;
}

.per__reserv {
    position: absolute;
    bottom: 15px;
    left: 35px;
    font-size: 15px;
    line-height: 21px;
    color: var(--tifany-color);
    transition: color .3s ease-in-out;
}

.per__reserv:hover {
    color: var(--forest-color);
}

.personal__send-btn {
    display: flex;
    align-items: center;
    padding: 20px 35px;
    padding-right: 80px;
    font-weight: 500;
    font-size: 23px;
    line-height: 28px;
    letter-spacing: 0.02em;
    color: var(--white-color);
    background-color: var(--tifany-color);
    border: none;
    border: 1px solid var(--white-color);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    border-radius: 52px;
    background-image: url(../img/next.svg);
    background-repeat: no-repeat;
    background-position: 87% 54% ;
    transition: background-color .3s ease-in-out;
}

.personal__send-btn:hover {
    background-color: var(--forest-color);
}


/* case */

.case {
    background-color: var(--bg-color);
}

.case__title {
    margin-bottom: 43px;
    color: var(--white-color);
}

.case__content {
    position: relative;
    overflow: hidden;
    padding-top: 35px;
}

.case__item {
    display: flex;
    justify-content: space-between;
    padding: 20px;
    height: auto;
    border: 1px solid var(--white-color);
    border-radius: 24px;
    position: relative;
    padding-bottom: 88px;
}

.case__item::before {
    position: absolute;
    border: 1px solid #FFFFFF;
    border-radius: 12px 12px 0px 0px;
    font-weight: 600;
    font-size: 20px;
    line-height: 30px;
    padding-left: 15px;
    top: -35px;
    right: 2%;
    width: 155px;
    height: 35px;
}

.case__left {
    width: 40%;
}
.case__right {
    width: 59%;
}

.case-cont {
    padding: 15px 20px;
    border-radius: 19px;
    margin-bottom: 18px;
}

.case__subtitle {
    font-weight: 700;
    font-size: 22px;
    line-height: 31px;
}

.case__text {
    font-weight: 400;
    font-size: 17px;
    line-height: 29px;
}

.case1 .case-cont {
    background-color:var(--violet-cl) ;
}

.case1::before {
    content: 'Кейс #1';
    background: var(--violet-cl);  
}

.case2 .case-cont {
    background-color:var(--green-cl) ;
}

.case2::before {
    content: 'Кейс #2';
    background: var(--green-cl);  
}

.case3 .case-cont {
    background-color:var(--blue-cl) ;
}

.case3::before {
    content: 'Кейс #3';
    background: var(--blue-cl);  
}
.case4::before {
    content: 'Кейс #4';  
}
.case5::before {
    content: 'Кейс #5';  
}
.case6::before {
    content: 'Кейс #6';  
}
.case7::before {
    content: 'Кейс #7';  
}

.swiper-next {
    position: absolute;
    bottom: 3%;
    left: 10%;
    width: 80px;
    height: 80px;
    background-image: url(../img/right.svg);
    background-repeat: no-repeat;
    background-position: center;
    border: 3px solid var(--white-color);
    border-radius: 50%;
    cursor: pointer;
    z-index: 1;
}
.swiper-prev {
    position: absolute;
    bottom: 3%;
    left: 2%;
    width: 80px;
    height: 80px;
    background-image: url(../img/left.svg);
    background-repeat: no-repeat;
    background-position: center;
    border: 3px solid var(--white-color);
    border-radius: 50%;
    cursor: pointer;
    z-index: 1;
}

/* review */

.review__top {
    display: none;
}

.review {
    background-color: var(--bg-color);
}

.review__container {
    display: flex;
    justify-content: space-evenly;
    padding-left: 30px;
    padding-right: 30px;
    position: relative;
}

.review__left {
    width: 51%;
}

.review__text {
    margin-bottom: 20px;
    font-size: 23px;
    line-height: 28px;
    color: var(--white-color);
}

.review__comment {
    display: flex;
    align-items: center;
}

.review__comment img {
    margin-right: 30px;
    border-radius: 7px;
}

.review-com {
    display: block;
    font-size: 18px;
    line-height: 21px;
    color: var(--white-color);
    margin-bottom: 5px;
}

.review__comm {
    font-size: 14px;
    line-height: 21px;
    color: var(--white-color);
}

.review__right {
    width: 40%;
    border-radius: 10px;
    background-color: transparent;
    overflow: hidden;

    
}

.review__item::before {
    content: '';
    position: absolute;
    top: 10px;
    left: 10px;
    bottom: -10px;
    right: -10px;
    background-color: var(--tifany-color);
    border-radius: 35px;
    z-index: -1;
}


.review__item {
    border-radius: 10px;
    overflow: hidden;
    border-radius: 10px;
    position: relative;
}

.review__item img {
    width: 98%;
    height: 98%;
    display: flex;
    align-items: flex-start;
    border-radius: 10px;
    /* border: 5px solid var(--white-color); */
}

.rev2 {
    right: 0;
    z-index: 1;
}

.rev1 {
    left: 0;
    z-index: 1;
}


/* question */

.question {
    background-color: var(--white-color);
    background-image: url(../img/bg-starlight.svg);
    background-repeat: no-repeat;
    background-position: left center;
}

.question__container {
    padding-bottom: 60px;
}
.question__title {
    margin-bottom: 60px;
}

.accordion-list .accordion {
    position: relative;
}

.accordion-list .accordion .accordion__control {
    position: relative;
    cursor: pointer;
}

.accordion__content {
    position: relative;
    height: 0;
    overflow: hidden;
    visibility: hidden;
    border-bottom: 1px solid var(--black-color);
    transition-property: height, visibility, padding;
    transition-timing-function: ease;
}

.accordion--active .accordion__content {
    visibility: visible;
    min-height: fit-content;
    padding: 20px 0;
}

.question__btn {
    width: 100%;
    min-height: 100px;
    display: flex;
	color: var(--bg-color);
    text-align: left;
    align-items: center;
    font-size: 24px;
    line-height: 35px;
    letter-spacing: 1px;
    border-bottom: 1px solid var(--black-color);
    padding: 10px;
    transition: color 0.3s ease-in-out, border 0.3s ease-in-out, fill 0.3s ease-in-out;
}

.question__text {
    margin-right: auto;
    width: 60%;
}

.question__img {
    flex-shrink: 0;
    transition: fill 0.3s ease-in-out, transform 0.3s ease-in-out;
}

.question__btn:focus .question__img path {
    fill: var(--tifany-color);
}

.question__btn:hover .question__img path {
    fill: var(--tifany-color);
}

.question__btn:active  .question__img path{
    fill: var(--tifany-color);
}

.accordion--active .question__img {
    transform: rotate(45deg);
}

.accordion__content p {
    font-size: 22px;
    line-height: 27px;
    letter-spacing: 0.5119px;
    color: var(--grey-color);
}

/* team */

.team__title {
   margin-bottom: 34px; 
}

.team__text {
    display: block;
    margin-bottom: 25px;
    font-size: 26px;
    line-height: 37px;
    letter-spacing: 1px;
    color: var(--dark-grey-color);
}

.team__cont {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
}

.team__input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    border: 0;
    padding: 0;
    clip: rect(0, 0, 0, 0);
    overflow: hidden;
}

.team__labell {
    display: inline-flex;
}

.team__label {
    padding: 20px 50px;
    width: fit-content;
    cursor: pointer;
    border: none;
    border: 2px solid var(--forest-color);
    border-radius: 71px;
    font-size: 30px;
    line-height: 36px;
    margin-bottom: 25px;
    background-color: var(--white-color);
    transition: background-color .3s ease-in-out, color .3s ease-in-out;
}

.team__label:hover {
    background-color: var(--forest-color);
    color: var(--white-color);
}

.team__input:focus .team__label {
    background-color: var(--tifany-color);
    
}

.team__input:checked + .team__label {
    background-color: var(--forest-color);
    color: var(--white-color);
}

.team__input:active + .team__label {
    background-color: var(--forest-color);
    color: var(--white-color);
}

.team__info {
    display: flex;
    align-items: center;
    font-size: 26px;
    line-height: 37px;
    justify-content: space-between;
    margin-bottom: 60px;
}

.team__info-left {
    padding-top: 45px;
    width: 78%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

.inff {
    width: 100%;
    padding: 14px;
    margin-bottom: 50px;
    border: none;
    border-bottom: 1px solid var(--dark-grey-color);

}

.team__lab {
    position: relative;
}

.team__lab .just-validate-error-field {
    border-bottom: 2px solid rgb(255, 92, 0);
}

.team__lab .just-validate-error-label {
    left: 1%;
    bottom: 11%;
}

.team__info-name {
    width: 100%;
}

.team__info-tel {
    width: 48%;
}

.team__file {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    border: 0;
    padding: 0;
    clip: rect(0, 0, 0, 0);
    overflow: hidden;
    
}

.team__label-file {
    display: flex;
    align-items: center;
    width: 42%;
    margin-bottom: 0;
    padding: 20px 30px;
    font-size: 27px;
}

.team__label-file img {
    margin-right: 10px;
    
}

.team__label-check {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.team__label-check .just-validate-error-label {
    bottom: 0;
}

.team__info-check {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    border: 0;
    padding: 0;
    clip: rect(0, 0, 0, 0);
    overflow: hidden;
}

.team__s {
    position: relative;
    width: 30px;
    height: 30px;
    border: none;
    border: 1px solid var(--dark-grey-color);
    border-radius: 50%;
    margin-right: 15px;
}

.team__s::before {
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    border-radius: 50%;
    height: 15px;
    width: 15px;
    background-color: var(--forest-color);
    transform: translate(-50%, -50%);
    visibility: hidden;
}


.team__info-check:checked + .team__s::before {
    visibility: visible;
}


.team__checkbox {
    font-weight: 300;
font-size: 21px;
line-height: 25px;
color: var(--dark-grey-color);
}

.team__checkbox a {
    color: var(--forest-color);
}


.team__info-right {
    display: flex;
    align-items: center;
    width: 17%;
}

.team__btn {
    width: 210px;
    height: 210px;
    border-radius: 50%;
    background-color: var(--tifany-color);
    transition: background-color .3s ease-in-out;
}

.team__btn span {
    font-size: 23px;
    line-height: 28px;
    color: var(--white-color);
    display: block;
}

.team__btn:hover {
    background-color: var(--forest-color);
}

.team__bottom {
    display: flex;
    align-items: center;
}

.team__bottom-text {
    display: inline-block;
    margin-right: auto;
    font-size: 27px;
    line-height: 33px;
}

.team__buttom-link{
    display: flex;
    margin-left: 15px;
    
}


/* map */

.map1 {
    width: 100%;
    height: 400px;
}

/* footer */

.footer {
    background-color: var(--bg-color);
}

.footer__container {
padding-top: 50px;
color: rgba(182, 209, 214, 0.54);
}

.top {
display: flex;
align-items: center;
border-bottom: 1px solid var(--dark-grey-color);
padding-bottom: 60px;
}

.top__left {
margin-right: auto;
width: 20%;
}

.footer__logo {
display: block;
margin-bottom: 34px;
}

.fot {
display: block;
font-size: 13px;
line-height: 17px;
}

.top__center {
padding-top: 60px;
width: 30%;
margin-right: auto;
}

.top__center a {
transition: color .3s ease-in-out;
}

.top__center a:hover {
    color: var(--tifany-color);
}


.top__adress {
margin-bottom: 30px;
}


.top__right {
padding-top: 64px;
}

.top__right div {
display: flex;
align-items: center;
margin-bottom: 54px;
}

.top__numb {
margin-right: 16px;
font-weight: 500;
font-size: 23px;
line-height: 25px;
letter-spacing: -2px;
color: var(--white-color);
transition: color .3s ease-in-out;
}
.top__numb:hover {
color: var(--tifany-color);
}

.top__link{
display:flex;
margin-right: 10px;
}

.top__conf {
display: block;
font-size: 14px;
line-height: 21px;
text-align: right;
transition: color .3s ease-in-out;
}
.top__conf:hover {
color: var(--tifany-color);
}

.footer__bottom {
padding-top: 25px;
padding-bottom: 25px;
display: flex;
align-items: center;
color: rgba(182, 209, 214, 0.54);
}

.footer__copy {
display: block;
font-size: 14px;
line-height: 23px;
margin-right: auto;
}

.footer__creat {
display: block;
font-size: 15px;
line-height: 23px;
margin-right: 4px;
}

.footer__creat-link {
display: block;
font-size: 15px;
line-height: 23px;
color: var(--tifany-color);
}


/* window - modal */

.window {
    position:fixed;
    display:flex;
    width:100%;
    height:100%;
    justify-content:center;
    align-items:center;
    background:rgba(0,0,0,.7);
    display: none;
}

.window__c {
    padding-left: 100px;
    padding-right: 100px;
    position: relative;
    box-shadow: 0px 0.782216px 11.7332px rgba(0, 0, 0, 0.2);
    border-radius: 0px 35.4077px;
    
    background-color: var(--white-color);
    background-image: url(../img/Starwind.svg), url(../img/Starwind2.svg);
    background-repeat: no-repeat;
    background-position: 9% 77%, 0 100%;
    z-index: 1;
    /* padding-bottom: 100px; */
}

.window--active {
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    padding: 4%;
}

.window__content {
    margin: 0 auto;
}

.window__title {
    margin-bottom: 40px;
    font-size: 30px;
    line-height: 36px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-align: center;
}

.window__close {
    top: 3%;
    right: 3%;
    position: absolute;
    width: 100px;
    height: 100px;
}

.window__top {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    margin-bottom: 30px;
}

.window__label {
    position: relative;
    width: 45%;
    margin-bottom: 10px;
}

.window__label .just-validate-error-label {
    left: 0;
}

.window__input {
    width: 100%;
    padding: 10px;
    border: none;
    font-weight: 300;
    font-size: 18px;
    line-height: 36px;
    color: var(--grey-color);
    background-color: transparent;
    border-bottom: 1px solid var(--grey-color);
}

.window__bottom {
    text-align: center;
}

.window__btn {
    margin-bottom: 30px;
}

.window__check {
    justify-content: center;
}

.form-success-h {
    display: none;
}

/* .form-success{
    position: fixed;
    top: 50%;
    width: 50%;
    text-align: center;
    background-color: white;
    margin-top: 10px;
    border-radius: 0px 35.4077px;
    height: 40px;
    display: flex;
    align-items: center;
    font-size: 30px;
    justify-content: center;
} */

.mod {
    display: none;
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    
}

.mod--active {
    display: block;
    z-index: 100;
}

.mod__cont {
    position: relative;
    margin: 0 auto;
    width: 50%;
    height: 300px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    background-color: var(--white-color);
    padding: 40px;
    border-radius: 0px 35.4077px;
    background-image: url(../img/Star13.svg), url(../img/Starwind.svg), url(../img/mod.svg);
    background-position: -5% 12%, 2% 57%, 100% 95%;
    background-repeat: no-repeat;
    box-shadow: 0px 5.48148px 5.48148px rgba(0, 0, 0, 0.25);
}

.mod__cont svg {
    position: absolute;
    top: 12%;
    right: 4%;
    width: 25px;
    height: 25px;
}

.mod__text {
    font-size: 30px;
line-height: 36px;
letter-spacing: 0.04em;
text-transform: uppercase;
}

.hero404 {
    height: 60vh;
}