
@import "assets/fonts/fonts.css";
@import "assets/css/normalize.css";

body{
	font-family: "Montserrat", sans-serif;
	font-weight: 400;
}
.container {
  max-width: 1621px;
  margin: 0 auto;
  width: 100%;
  padding-left: 15px;
  padding-right: 15px;
}




header{
	background-image:url(assets/img/helpbg.png);
	background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding:75px 70px;
}
.header{
	display: flex;
	background: rgba(255, 255, 255, 0.1);
	padding:17px 30px;
	border-radius: 30px;
	justify-content: space-between;
	position: relative;
}
.header__logo{
	color:rgba(255, 255, 255, 1);
	font-size: 30px;
	font-weight: 700;
}
.header ul{
	display: flex;
	align-items: center;
	gap:30px;
}
.header ul li a{
	color:#fff;
	font-size:18px;
	font-weight: 600;
	transition: all .3s;
}
.header ul li a:hover{
	text-decoration-line: underline;
}
.header__phone{
	color:#fff;
	font-size:18px;
	font-weight: 800;
}
.header__banner{
	display: grid;
	grid-template-columns: 1.3fr 1fr;
	margin-top:165px;
}
.header__text{
	position: relative;
}
.header__text h1{
	color:rgba(255, 255, 255, 1);
	font-size: 90px;
	font-weight: 700;
	text-transform: uppercase;
}
.header__text p{
	color:rgba(255, 255, 255, 1);
	font-size: 48px;
	font-weight: 500;
	text-transform: uppercase;
}
.header__text>span{
	color:rgba(255, 255, 255, 1);
	font-size: 24px;
	font-weight: 400;
	display: block;
	padding:75px 0;
}
.header__text a{
	background: rgba(255, 255, 255, 1);
	height: 93px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	max-width: 446px;
	border-radius: 93px;
	gap:30px;
	padding:0 10px 0 25px;
	transition: all .3s;
  border: solid 1px transparent;
}
.header__text a>span{
	color:rgba(0, 108, 238, 1);
	font-size: 24px;
	font-weight: 700;
	text-transform: uppercase;
}
.header__text a:hover{
    border: solid 1px rgba(0, 108, 238, 1);
}
.header__star_big{
	position: absolute;
  top: -30px;
  left: -70px;
  animation: pulse 4s infinite ease-in-out;
  animation: rotateStar 8s linear infinite;
}

.header__star_nomral{
		position: absolute;
    bottom: -80px;
    left: 65%;
    transform: translate(-50%, -50%);
    animation: pulse 4s infinite ease-in-out;
    animation: rotateStar 6s ease-in-out infinite alternate;

}
.header__star_small{
	position: absolute;
  top: -30px;
  right: -20px;
  animation: pulse 4s infinite ease-in-out;
  animation: rotateStar 6s ease-in-out infinite alternate;

}
@keyframes pulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.2); opacity: 0.6; }
}
@keyframes rotateStar {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}
.header__cards{
	position: relative;
}
.header__card{
	  border-radius: 20px;
    padding: 25px;
    max-width: 370px;
    position: absolute;
/*    opacity: 0;*/
/*    transform: scale(0.8);*/
    transition: all 0.8s ease;
}
/* начальные позиции (за экраном) */
.header__card:nth-child(1) {
    background: rgba(233, 255, 236, 1);
    top: 10px;
    left: 180px;
    transform: translate(0px, -100px) rotate(30deg); 
}

.header__card:nth-child(2) {
    background: rgba(233, 235, 255, 1);
     top: 200px;
    left: 50px;
    transform: translate(-100px, 0px) rotate(-30deg); 
}

.header__card:nth-child(3) {
    background: rgba(255, 255, 255, 1);
    bottom: 10px;
    right: 60px;
    transform: translate(0px, 100px) rotate(30deg); 
}

.header__card:nth-child(1){
	background: rgba(233, 255, 236, 1);
	  top: 10px;
    left: 180px;
    rotate: -10deg;
}
.header__card:nth-child(2){
	background: rgba(233, 235, 255, 1);
	  top: 200px;
    left: 50px;
    rotate: 15deg;
}
.header__card:nth-child(3){
	background: rgba(255, 255, 255, 1);
	  bottom: 10px;
    right: 60px;
    rotate: -15deg;
}
.header__cards.active .header__card {
    opacity: 1;
    transform: rotate(0deg) scale(1);
}



.header__card:nth-child(1) { transition-delay: 0.2s; }
.header__card:nth-child(2) { transition-delay: 0.4s; }
.header__card:nth-child(3) { transition-delay: 0.6s; }

.header__card h4{
	color:rgba(0, 108, 238, 1);
	font-size: 18px;
	font-weight: 700;
	text-transform: uppercase;
}
.header__card strong{
	color:rgba(50, 41, 41, 1);
	font-size: 18px;
	font-weight: 700;
	display: block;
	padding:5px 0;
}
.header__card p{
	color:rgba(50, 41, 41, 1);
	font-size: 16px;
	font-weight: 400;
}


#partnors{
	margin:165px 0 100px 0;
}
.partnors h2{
	color:rgba(0, 108, 238, 1);
	font-size: 48px;
	font-family: 'AkzidenzGroteskPro';
	text-align: center;
	text-transform: uppercase;
	margin-bottom:85px;
}
.partnors__logo{
	display: flex;
	align-items: center;
	gap:15px;
	justify-content: space-between;
}
.partnors__logo img{
	filter: grayscale(100%) brightness(0.9) contrast(0.9);
	transition: all .3s;
	cursor: pointer;
}
.partnors__logo img:hover{
	filter: none;
}
.partnors__box{
	background-image:url(assets/img/helpbg.png);
	background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding:75px 70px;
  border-radius: 30px;
  margin-top:50px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap:100px;
}
.partnors__box-left h3{
	color:rgba(255, 255, 255, 1);
	font-size: 48px;
	font-weight: 700;
	text-transform: uppercase;
	max-width: 450px;
	margin-bottom:50px;
}
.partnors__box-left p{
	color:rgba(255, 255, 255, 1);
	font-size: 24px;
	font-weight: 400;
}
.partnors__box-right ul{
	display: flex;
	flex-direction: column;
	gap:50px;
}
.partnors__box-right ul li span{
	 color:rgba(255, 255, 255, 1);
	 font-size: 24px;
	 font-weight: 400;
}
.partnors__box-right ul li p{
	 color:rgba(255, 255, 255, 1);
	 font-size: 48px;
	 font-weight: 500;
	 font-family: 'AkzidenzGroteskPro';
}






.texnologia{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap:45px;
}

.texnologia__menu{
	display: flex;
	justify-content: space-between;
	margin-bottom:30px;
}
.texnologia__menu h3{
	color:rgba(0, 108, 238, 1);
	font-size: 20px;
	font-weight: 700;
	text-transform: uppercase;
}
.texnologia__menu p{
	color:rgba(50, 41, 41, 1);
	font-size: 20px;
}
.texnologia__card{
	background-image:url(assets/img/helpbg.png);
	background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding:75px 70px;
  border-radius: 30px;
  text-align: center;
}
.texnologia__card h2{
	color:rgba(255, 255, 255, 1);
	font-size: 48px;
	font-weight: 500;
}
.texnologia__card p{
	color:rgba(255, 255, 255, 1);
	font-size: 24px;
	margin:20px 0;
}
.texnologia__card a{
		width: 180px;
		height: 50px;
		background: rgba(255, 255, 255, 1);
		border-radius: 50px;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin:0 auto;
		padding:0 5px 0 10px;
		transition: all .3s;
		border: solid 1px transparent;
}
.texnologia__card a:hover{
	border: solid 1px rgba(0, 108, 238, 1);
}
.texnologia__card a span{
	color:rgba(0, 108, 238, 1);
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
}
.texnologia__box{
	display: grid;
	grid-template-columns: 175px 1fr;
	gap:15px;
}
.texnologia__items{
	display: grid;
}
.texnologia__item{
	display: grid;
	grid-template-columns: 43px 1fr;
	gap:10px;
	align-items: center;
}
.texnologia__item-lines{
	display: flex;
	flex-direction: column;
	gap:5px;
}
.texnologia__item-lines span{
	width: 100%;
	height: 7px;
	background:rgba(0, 108, 238, 0.3);
	display: block;
	border-radius: 5px;
}
.texnologia__right h2{
	color:rgba(183, 183, 183, 1);
	font-size: 48px;
	font-weight: 700;
}
.texnologia__right h3{
	color:rgba(0, 108, 238, 1);
	font-size: 48px;
	font-weight: 700;
	margin:31px 0 26px 0;
}
.texnologia__right strong{
	color:rgba(50, 41, 41, 1);
	font-size: 24px;
	font-weight: 500;
}
.texnologia__right p{
	color:rgba(50, 41, 41, 1);
	font-size: 24px;
	font-weight: 400;
	margin:30px 0;
}
.texnologia__right b{
	color:rgba(50, 41, 41, 1);
	font-size: 24px;
	font-weight: 700;
}

#clients{
	background-image:url(assets/img/fon.png);
	background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
	padding:378px 0 175px 0;
	border-bottom-left-radius: 80px;	
	border-bottom-right-radius: 80px;	
}
.clients h2{
	color:#fff;
	font-size: 48px;
	font-family: 'AkzidenzGroteskPro';
	text-align: center;
	text-transform: uppercase;
	margin-bottom:60px;
}
.clients__items{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	gap:25px;
}
.clients__item{
	border-radius: 20px;
	background: rgba(255, 255, 255, 1);
	padding:15px 20px 0px 20px;
	position: relative;
}
.clients__item {
    opacity: 0;
    transform: translateY(50px);
    transition: all 0.6s ease;
}

/* когда появляется */
.clients__item.show {
    opacity: 1;
    transform: translateY(0);
}
.clients__item:nth-child(1) { transition-delay: 0.1s; }
.clients__item:nth-child(2) { transition-delay: 0.3s; }
.clients__item:nth-child(3) { transition-delay: 0.5s; }
.clients__item:nth-child(4) { transition-delay: 0.7s; }


.clients__number span{
	color:rgba(0, 108, 238, 1);
	font-size: 54px;
	font-weight: 700;
}
.clients__number sub{
	font-size: 18px;
	color:rgba(50, 41, 41, 1);
}
.clients__text{
	margin:8px 0;
}
.clients__text p{
	color:rgba(50, 41, 41, 1);
	font-size: 16px;
}
.clients__text p b{
	font-weight: 600;
}
.clients__img{
	margin-top:30px;
	text-align: center;
}
.clients__img img{
	vertical-align: bottom;
}



#robot{
	padding:175px 0;
}
.robot h2{
	color:rgba(0, 108, 238, 1);
	font-size: 48px;
	font-family: 'AkzidenzGroteskPro';
	text-align: center;
	text-transform: uppercase;
	margin-bottom:45px;
}
.robot__box{
	display: grid;
	grid-template-columns: 1.2fr 1fr;
	gap:15px;
	align-items: center;
}
.robot__img img{
	width: 100%;
}
.robot__texts{
	display: flex;
	flex-direction: column;
	gap:25px;
}
.robot__text{
	background: rgba(0, 108, 238, 1);
	border-radius: 30px;
	padding:25px;
	display: flex;
	justify-content: center;
	align-items: center;
	gap:23px;
}
.robot__text span{
	color:rgba(255, 255, 255, 1);
	font-size: 24px;
	font-weight: 600;
}
.robot__text:nth-child(1){
	max-width: 596px;
}
.robot__text:nth-child(2){
	max-width: 463px;
}
.robot__text:nth-child(3){
	max-width: 344px;
}
.robot__text:nth-child(4){
	max-width: 524px;
}
.robot__text:nth-child(5){
	max-width: 536px;
}
.robot__text:nth-child(6){
	max-width: 596px;
}


.help{
	background-image:url(assets/img/helpbg.png);
	background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 40px;
    padding:85px;
}
.help h2{
	color:#fff;
	font-size: 48px;
	font-family: 'AkzidenzGroteskPro';
	text-align: left;
	text-transform: uppercase;
}
.help__items{
	display: grid;
	grid-template-columns:1.1fr 1fr;
	gap:30px;
	margin-top:50px;
}
.help__item-left{
	display: grid;
	gap:10px;
}
.help__item{
	background: rgba(255, 255, 255, 1);
	border-radius: 30px;
	padding:30px 20px;
	display: flex;
	gap:20px;
}
.help__number{
	color: rgba(0, 108, 238, 1);
	font-size: 54px;
	font-weight: 700;
	display: flex;
    align-items: center;
}
.help__text h3{
	color: rgba(0, 108, 238, 1);
	font-size: 24px;
	font-weight: 700;
}
.help__text p{
	color: rgba(50, 41, 41, 1);
	font-size: 24px;
	font-weight: 400;
	margin-top:5px;
}
.help__item-right{
	background: rgba(0, 0, 0, 0.05);
	border-radius: 30px;
	padding: 44px 38px;
	position: relative;
}
.help__item-right h4{
	color:rgba(255, 255, 255, 1);
	font-size: 24px;
	font-weight: 700;
	text-transform: uppercase;
	margin-bottom:25px;
}
.help__item-right ul{
	list-style: unset;
	display: grid;
	gap:20px;
	margin-left: 25px;
}
.help__item-right ul li::marker {
  color: #fff;
}
.help__item-right ul li strong{
	color:rgba(255, 255, 255, 1);
	font-size: 24px;
	font-weight: 700;
	text-transform: uppercase;
}
.help__item-right ul li p{
	color:rgba(255, 255, 255, 1);
	font-size: 24px;
	font-weight: 400;
}
.help__item-right img{
	position: absolute;
    bottom:0px;
    left: 50%;
	transform: translateX(-50%);
}




#partnership{
	padding:165px 0 100px 0;
}
.partnership h2{
	color:rgba(0, 108, 238, 1);
	font-size: 48px;
	font-family: 'AkzidenzGroteskPro';
	text-align: center;
	text-transform: uppercase;
}

.partnership__items{
	margin-top:45px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap:27px;
}

.partnership__item{
	background: rgba(243, 243, 243, 1);
	border-radius: 40px;
	padding:85px 60px 0 60px;
	min-height: 750px;
	position: relative;
}
.partnership__item h3{
	color:rgba(0, 108, 238, 1);
	font-size: 48px;
	text-align: center;
	text-transform: uppercase;
}

.partnership__item p{
	color:rgba(50, 41, 41, 1);
	font-size: 24px;
	margin:30px 0;
}
.partnership__item strong{
	font-size: 24px;
	text-transform: uppercase;
	font-weight: 700;
	color:rgba(50, 41, 41, 1);
}
.partnership__item strong span{
	color:rgba(0, 108, 238, 1);
	display: block;
}
.partnership__item strong{
	display: block;
	margin-bottom: 60px;
}
.partnership__item img{
    position: absolute;
    bottom:0px;
    left: 50%;
	transform: translateX(-50%);
}







#case{
	background-image:url(assets/img/fon.png);
	background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
	padding:337px 0 175px 0;
}
.case h2{
	color:rgba(255, 255, 255, 1);
	font-size: 48px;
	font-family: 'AkzidenzGroteskPro';
	text-align: center;
	text-transform: uppercase;
}
.case__items{
	margin-top:40px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap:27px;
}
.case__item{
	background: rgba(255, 255, 255, 1);
	border-radius: 40px;
	padding:38px 45px;
	display: grid;
	gap:92px;
}
.case__title{
	display: flex;
	flex-direction: column;
	gap:20px;

}
.case__title h3{
	color:rgba(0, 108, 238, 1);
	font-size: 48px;
	font-weight: 700;
	text-transform: uppercase;
}
.case__title p{
	color:rgba(50, 41, 41, 1);
	font-size: 24px;
	font-weight: 400;
}
.case__tabs{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap:50px;
}
.case__tab{
	display: flex;
	flex-direction: column;
	gap:4px;
}
.case__tab span{
	color:rgba(50, 41, 41, 1);
	font-size: 24px;
}
.case__tab p{
	color:rgba(0, 108, 238, 1);
	font-size: 24px;
	font-weight: 700;
}





#form{
	padding:160px 0 175px 0;
}
.form h2{
	color:rgba(0, 108, 238, 1);
	font-size: 48px;
	font-family: 'AkzidenzGroteskPro';
	text-align: center;
	text-transform: uppercase;
}
.form form{
	margin-top:80px;
	display: grid;
	grid-template-columns: 604px 536px 446px;
	gap:15px;
}
.form input{
	background: rgba(241, 241, 241, 1);
	color:rgba(0, 0, 0, 1);
	font-size: 24px;
	height: 93px;
}
.form input{
	width: 100%;
	text-align: center;
	border-radius: 93px;
}

.form button{
	background: rgba(0, 108, 238, 1);
	color:rgba(255, 255, 255, 1);
	text-transform: uppercase;
	width: 100%;
	height: 93px;
	vertical-align: bottom;
	border-radius: 93px;
	display: flex;
	align-items: center;
	font-weight: 700;
	font-size: 24px;
    justify-content: space-between;
    padding: 15px;	
}

.form input::placeholder {
	color:rgba(0, 0, 0, 1);
	text-transform: uppercase;
}

footer{
	background: rgba(43, 41, 48, 1);
	padding:109px 0 138px 0;
}
.footer{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap:50px;
	align-items: flex-start;
}
.footer__item_1{
	display: grid;
	gap:20px;
}
.footer__item_1 a{
	color:#fff;
	font-size: 25px;
}	
.footer__item_1 p{
	color:#fff;
	font-size: 25px;
}
.footer__item_2 ul{
	display: grid;
	gap:20px;
    list-style: unset;	
}
.footer__item_2 li::marker {
  color: #fff;
}
.footer__item_2 a{
	color:#fff;
	font-size: 25px;
	font-weight: 600;
	color:#fff;
}
.footer__item_3{
	display: grid;
	gap:20px;
}
.footer_phone{
	display: flex;
	align-items: center;
	gap:10px;
}
.footer_phone a{
	font-weight: 700;
	font-size: 25px;
	color:#fff;
}
.footer__item_3 p{
	font-size: 25px;
	color:#fff;
}


@media only screen and (max-width: 1600px) {
 	.header__text h1{
 		font-size: 80px;
 	}
 	.form form{
 		grid-template-columns: 1fr 1fr 1fr;
 	}
 	.partnors__logo{
 		flex-wrap: wrap;
 	}
}
@media only screen and (max-width: 1500px) {
 	.partnership__item h3{
 		font-size: 36px;
 	}
 	.header ul{
 		gap:20px;
 	}
	.header__text h1 {
      font-size: 70px;
  }
}
@media only screen and (max-width: 1300px) {
 	.header__text h1 {
        font-size: 60px;
    }
    .header__text p{
    	font-size: 30px;
    }
    .header__cards{
    	display: grid;
    	gap:30px;
    }
    .header__card{
    	position: unset;
    }
    .header__card:nth-child(1),.header__card:nth-child(2), 
    .header__card:nth-child(3){
    	rotate: 0deg;
    	max-width: 100%;
    }
    .header__card {
	    transform: none !important;
	    transition: none !important;
	  }
}
@media only screen and (max-width: 1200px) {
		.header__cards{
			margin-top:50px;
		}
		.header__banner{
			grid-template-columns: 1fr;
		}
 		.partnors__box{
 			grid-template-columns: 1fr;
 		}
 		.texnologia, .help__items, .partnership__items, .case__items{
 			grid-template-columns: 1fr;
 		}
 		.help__item-right{
 			min-height: 550px;
 		} 
 		.clients__items{
 			grid-template-columns: 1fr 1fr;
 		}
 		.robot__box{
 			grid-template-columns: 1fr;
 		}
 		.robot__text{
 			max-width: 100%!important;
 		}
 		.header{
 			flex-wrap: wrap;
 		}
 		.header ul{
 			flex-wrap: wrap;
 		}
 		.header__logo{
 			margin-bottom:15px;
 		}
}
@media only screen and (max-width: 992px) {
 	.form form{
 		grid-template-columns:1fr;
 	}
 	.footer{
 		grid-template-columns: 1fr;
 	}
}
@media only screen and (max-width: 768px) {
	 .clients h2, .robot h2, .help h2{
	 	font-size: 42px;
	 }
	  .clients__items {
        grid-template-columns: 1fr;
    }
    .case__tabs{
    	grid-template-columns: 1fr 1fr;
    }
    .help__item-right img{
    	display: none;
    }
    .help{
    	padding:40px;
    }
    .partnors__box{
    	padding:45px;
    }
}
@media only screen and (max-width: 576px) {
 	.texnologia__right h2, .texnologia__right h3{
 		font-size: 38px;
 	}
 	.partnership h2{
 		font-size: 42px;
 	}
 header{
 	padding:45px;
 }
 	.texnologia__menu p{
 		font-size: 14px;
 	}
	    .header__text h1 {
      font-size: 42px;
  }
  .texnologia__box{
  	grid-template-columns: 1fr;
  }
      .header__text p {
        font-size: 24px;
    }
    .header__text a>span{
    	font-size: 14px;
    }
    .partnors h2{
    	font-size: 42px;
    }
    .case__tabs {
        grid-template-columns: 1fr;
    }
    .case__title h3{
    	font-size: 42px;
    }
    .form h2{
    	font-size: 42px;
    }
    .partnership__item{
    	padding:40px 40px 0 40px;
    }
    .partnors h2 {
        font-size: 30px;
    }
    .partnors__box-left h3{
    	font-size: 32px;
    }
    .partnors__box-right ul li p{
    	font-size: 32px;
    }
    .texnologia__menu{
    	flex-wrap: wrap;
    }
    .texnologia__card h2{
    	font-size: 32px;
    }
    .texnologia__card p{
    	font-size: 20px;
    }
    .texnologia__right h2, .texnologia__right h3 {
        font-size: 30px;
    }
        .clients h2, .robot h2, .help h2 {
        font-size: 26px;
    }
    .help__text p{
    	font-size: 18px;
    }
    .help__item{
    	flex-direction: column;
    }
    .partnership h2 {
        font-size: 30px;
    }
    .partnership__item h3 {
        font-size: 24px;
    }
    .partnership__item p{
    	font-size: 20px;
    }
    .partnership__item{
    	min-height: 630px;
    }
        .form h2 {
        font-size: 25px;
    }
    .form input{
    	font-size: 20px;
    }
    .form  button span{
    	font-size: 16px;
    }
    .footer__item_1 p{
    	font-size: 20px;
    }
    .footer__item_2 a{
    	padding-left: 15px;
    	font-size: 20px;
    }
    .footer_phone a {
    	font-size: 21px;
    }
    .case__title h3{
    	font-size: 30px;
    }
    footer{
    	padding:60px 0;
    }
    #form{
    	padding:60px 0;
    }
    #case, #robot{
    	padding:100px 0;
    }
    #partnership{
    	padding:60px 0;
    }
    .case h2{
    	color: rgb(0 108 238);
    }
    .help__number{
    	font-size: 42px;
    }
    .robot__text span{
    	font-size: 16px;
    }
    .partnors__box-left p{
    	font-size: 20px;
    }
}