@import url(reset.css);
html,body{
	min-height: 100dvh;
	scroll-behavior: smooth;
	&.overlay{overflow: hidden;}
}
body{
	background-color: var(--bg);
	color: var(--gray);
	display: flex;
	flex-direction: column;
	font-size: 16px;
	line-height: 140%;
}
.flexbox{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
}
.block-title{
	color: var(--black);
	font-size: 32px;
	line-height: 100%;
	margin-bottom: 60px;
	text-align: center;
	width: 100%;
}
.subtitle{
	font-size: 20px;
	font-weight: 300;
	margin: -40px 0 60px;
	text-align: center;
}

.promo-container{
	background: #000 url(../images/promo_triangles.svg) bottom no-repeat;
	min-height: 800px;
	overflow: hidden;
	position: relative;
	&:after,&:before{
		background: url(../images/promo_white.svg) no-repeat;
		background-size: 100% auto;
		content: "";
		height: 800px;
		left: 0;
		position: absolute;
		top: 0;
		width: 1207px;
	}
	&:after{
		background-image: url(../images/promo_orange.svg);
		bottom: 0;
		left: auto;
		right: 0;
		top: auto;
		width: 1720px;
	}
}
	.wrapper{
		margin: 0 auto;
		max-width: 100%;
		padding: 0 80px;
		position: relative;
		width: 1440px;
		z-index: 9;
	}
		.header{
			align-items: center;
			display: flex;
			flex-direction: row;
			flex-wrap: wrap;
			gap: 40px;
			justify-content: space-between;
			margin-bottom: 120px;
			padding: 20px 0;
			position: relative;
			&:before{
				background-color: var(--gray);
				content: "";
				height: 1px;
				left: 280px;
				position: absolute;
				top: 50%;
				width: calc(100% - 876px);
			}
		}
			.logo{
				background: url(../images/logo.svg) no-repeat;
				background-size: 100% auto;
				height: 40px;
				width: 241px;
			}
			.nav{
				display: flex;
				flex-direction: row;
				flex-wrap: wrap;
				gap: 40px;
				justify-content: flex-end;
				a{
					color: var(--gray);
					transition: all .3s linear;
					&:hover{color: var(--orange);}
				}
			}
			.mob-menu-btn,.mob-menu{display: none;}
		.promo{
			align-items: center;
			color: #fff;
			display: flex;
			flex-direction: column;
			justify-content: center;
			max-width: 100%;
			.flexbox{gap: 20px;}
		}
			.promo-title{
				font-size: 40px;
				line-height: 100%;
				margin-bottom: 40px;
				text-align: center;
			}
			.promo-text{
				color: var(--gray);
				font-size: 20px;
				font-weight: 300;
				line-height: 140%;
				margin-bottom: 80px;
				text-align: center;
			}
			.promo-list{
				display: flex;
				flex-direction: row;
				gap: 32px;
				justify-content: center;
				margin-bottom: 80px;
				max-width: 100%;
				position: relative;
				&:before{
					background-color: var(--gray);
					content: "";
					height: 1px;
					left: 10px;
					position: absolute;
					top: 50%;
					width: calc(100% - 20px);
				}
				.promo-list__item{
					border-radius: 16px;
					font-weight: 300;
					max-width: 100%;
					padding: 1px;
					position: relative;
					width: 300px;
					span{
						align-items: center;
						background-color: #000;
						border-radius: 16px;
						color: var(--gray);
						display: flex;
						height: 54px;
						flex-direction: row;
						flex-wrap: wrap;
						justify-content: center;
						position: relative;
						width: 100%;
						z-index: 1;
					}
					&:not(:last-child):after,&:not(:first-child):before{
						background: linear-gradient(to right, rgba(153,153,153,0) 0%,rgba(153,153,153,.5) 50%,rgba(153,153,153,1) 100%);
						border-radius: 16px;
						content: "";
						height: 100%;
						position: absolute;
						right: 0;
						top: 0;
						width: 50%;
					}
					&:not(:first-child):before{
						background: linear-gradient(to left, rgba(153,153,153,0) 0%,rgba(153,153,153,.5) 50%,rgba(153,153,153,1) 100%);
						left: 0;
						right: auto;
					}
				}
			}
			.promo__btn{
				align-items: center;
				background-color: #fff;
				border-radius: 24px;
				color: #000;
				display: flex;
				flex-direction: row;
				flex-wrap: wrap;
				height: 48px;
				justify-content: center;
				padding: 0 23px;
				transition: all .3s linear;
				&:hover{
					background-color: var(--orange);
					color: #fff;
				}
			}
			.promo__more{
				align-items: center;
				color: #fff;
				display: flex;
				flex-direction: row;
				flex-wrap: wrap;
				padding: 0 20px 0 14px;
				position: relative;
				transition: all .3s linear;
				&:hover{color: var(--orange);}
				&:before,&:after{
					background: url(../images/arrow_right.svg) no-repeat;
					content: "";
					height: 14px;
					position: absolute;
					right: 0;
					top: 18px;
					transition: all .3s linear;
					width: 8px;
				}
				&:after{background-image: url(../images/arrow_right_orange.svg);}
				&:hover:before,&:not(:hover):after{opacity: 0;}
			}
@media (max-width: 1600px){
.promo-container:after{right: -50vw;}
}/* END 1600px */
@media (max-width: 1200px){
.promo-container{
	&:after{right: -80vw;}
	.wrapper{
		display: flex;
		flex-direction: column;
		min-height: 100dvh;
	}
}
	.header{
		margin-bottom: auto;
		&:before{width: calc(100% - 816px);}
	}
		.nav{gap: 20px;}
	.wrapper{padding: 0 60px;}
	.promo{margin: 0 auto auto;}
	.promo-list{
		gap: 20px;
		.promo-list__item{width: 288px;}
	}
}/* END 1200px */
@media (max-width: 1023px){
.block-title{
	font-size: 24px;
	margin-bottom: 40px;
}
.subtitle{
	font-size: 16px;
	margin: -20px 0 40px;
	br{display: none;}
}
.wrapper{padding: 0 40px;}
	.header:before{
		left: 62px;
		width: calc(100% - 134px);
	}
	.logo{
		background-image: url(../images/logo_mob.svg);
		height: 24px;
		width: 42px;
	}
	.nav{display: none;}
	.mob-menu-btn{
		background: url(../images/mob_btn.svg) center no-repeat;
		display: block;
		height: 24px;
		width: 24px;
	}
	.mob-menu{
		background: rgba(0, 0, 0, 0.12);
		backdrop-filter: blur(10px);
		left: 0;
		height: 100dvh;
		padding: 20px 40px;
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 9999;
		&:before{
			background-color: var(--gray);
			content: "";
			height: 104px;
			left: 40px;
			position: absolute;
			top: 84px;
			width: 1px;
		}
		.nav{
			display: flex;
			gap: 24px;
			flex-direction: column;
			font-size: 20px;
		}
	}
		.mob-logo{
			background: url(../images/logo.svg) no-repeat;
			background-size: 100% auto;
			display: block;
			height: 24px;
			margin-bottom: 184px;
			width: 148px;
		}
		.close-menu{
			background: url(../images/mob_close.svg) center no-repeat;
			display: block;
			height: 24px;
			position: absolute;
			right: 40px;
			top: 20px;
			width: 24px;
		}
.promo-container{
	background-image: none;
	&:before{left: -300px;}
	&:after{right: -1200px;}
	.wrapper{
		background: url(../images/promo_triangles.svg) bottom no-repeat;
	}
}
	.promo-title{
		font-size: 32px;
		margin-bottom: 20px;
	}
	.promo-text{
		font-size: 16px;
		margin-bottom: 100px;
	}
	.promo-list{
		align-items: center;
		gap: 24px;
		flex-direction: column;
		&:before{
			height: calc(100% - 2px);
			left: 50%;
			top: 1px;
			width: 1px;
		}
		.promo-list__item{
			width: 240px;
			span{
				font-size: 12px;
				height: 44px;
				text-align: center;
			}
			&:not(:last-child):after,&:not(:first-child):before{
				background: linear-gradient(to bottom, rgba(153,153,153,0) 0%,rgba(153,153,153,.5) 50%,rgba(153,153,153,1) 100%);
				border-radius: 16px;
				content: "";
				height: 100%;
				position: absolute;
				right: 0;
				top: 0;
				width: 100%;
			}
			&:not(:first-child):before{
				background: linear-gradient(to top, rgba(153,153,153,0) 0%,rgba(153,153,153,.5) 50%,rgba(153,153,153,1) 100%);
				bottom: 0;
				left: 0;
				top: auto;
			}
		}
		.promo-list__item:nth-child(2){width: 335px;}
	}
}/* END 1023px */
@media (max-width: 768px){
.wrapper{padding: 0 20px;}
.promo .flexbox{
	gap: 20px;
	flex-direction: column;
}
	.promo-title{font-size: 28px;}
	.promo__more{height: 48px;}
.mob-menu{
	padding: 20px;
	&:before{left: 20px;}
}
.close-menu{right: 20px;}
}/* END 768px */
/* END promo */
/* Stack */
.stack{
	padding: var(--padding);
	.grid{
		display: grid;
		grid-template-columns: repeat(3, 1fr);
	}
}
	.stack-column{
		display: flex;
		flex-direction: column;
		gap: 60px;
		padding: 0 50px;
		position: relative;
		&:first-child{
			padding-left: 0;
			&:before{
				background: url(../images/stack_separate.svg) repeat-y;
				content: "";
				height: calc(100% - 28px);
				position: absolute;
				right: -1px;
				top: 14px;
				width: 2px;
			}
			&:after{
				background-color: var(--lgray);
				border-radius: 50%;
				content: "";
				height: 12px;
				position: absolute;
				right: -6px;
				top: 12px;
				width: 12px;
			}
		}
		&:nth-child(2){
			&:before{
				background: url(../images/stack_separate.svg) repeat-y;
				content: "";
				height: calc(100% - 28px);
				position: absolute;
				right: -1px;
				top: 14px;
				width: 2px;
			}
			&:after{
				background-color: var(--lgray);
				border-radius: 50%;
				bottom: 12px;
				content: "";
				height: 12px;
				left: -6px;
				position: absolute;
				
				width: 12px;
			}
		}
		&:last-child{
			padding-right: 0;
			&:before{
				background-color: var(--lgray);
				border-radius: 50%;
				bottom: 12px;
				content: "";
				height: 12px;
				left: -6px;
				position: absolute;
				width: 12px;
			}
			&:after{
				background-color: var(--lgray);
				border-radius: 50%;
				content: "";
				height: 12px;
				left: -6px;
				position: absolute;
				top: 12px;
				width: 12px;
			}
		}
	}
		.stack-block{
			background: url(../images/ico_stack_1.svg) no-repeat;
			padding-top: 60px;
			&.ico-2{background-image: url(../images/ico_stack_2.svg);}
			&.ico-3{background-image: url(../images/ico_stack_3.svg);}
			&.ico-4{background-image: url(../images/ico_stack_4.svg);}
			&.ico-5{background-image: url(../images/ico_stack_5.svg);}
			&.ico-6{background-image: url(../images/ico_stack_6.svg);}
			p{font-family: Roboto;}
		}
			.stack-block__title{
				color: var(--black);
				margin-bottom: 12px;
			}
@media (max-width: 1200px){
.stack .grid{
	gap: 80px;
	grid-template-columns: 100%;
}
	.stack-column{
		display: grid;
		gap: 80px;
		grid-template-columns: repeat(2, 1fr);
		padding: 0;
		&:first-child{
			&:before{
				background: url(../images/border.svg) center repeat-x;
				bottom: -40px;
				height: 2px;
				right: auto;
				top: auto;
				width: 100%;
			}
			&:after{
				bottom: -45px;
				right: 0;
				top: auto;
			}
		}
		&:nth-child(2){
			&:before{
				background: url(../images/border.svg) center repeat-x;
				bottom: -40px;
				height: 2px;
				right: auto;
				top: auto;
				width: 100%;
			}
			&:after{
				bottom: auto;
				left: 0;
				top: -47px;
			}
		}
		&:last-child{
			&:before{
				left: auto;
				right: 0;
				top: -47px;
			}
			&:after{
				bottom: auto;
				left: 0;
				top: -47px;
			}
		}
	}
@media (max-width: 768px){
.stack{overflow: hidden;}
.stack-column{
	gap: 40px;
	grid-template-columns: 100%;
	&:first-child:after,&:last-child:before{display: none;}
	&:first-child:before,&:nth-child(2):before{width: calc(100% + 20px);}
}
}/* END 768px */
}/* END 1200px */
/* END stack */
/* Technologies */
.technologies{
	padding: var(--padding);
	.flexbox{align-items: center;}
}
	.tabs{
		background: url(../images/border.svg) bottom no-repeat;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		margin-bottom: 60px;
		width: 100%;
		li{
			border-bottom: 2px transparent solid;
			cursor: pointer;
			line-height: 100%;
			padding: 16px 40px;
			position: relative;
			transition: all .3s linear;
			z-index: 1;
			&.active{
				background: linear-gradient(180deg, rgba(255,117,18,0) 49.83%, rgba(255,117,18,.12) 100%);
				border-color: var(--orange);
				color: var(--orange);
			}
		}
	}
	.technologies-content{
		display: flex;
		flex-direction: column;
		gap: 12px;
		width: calc(62.34% - 30px);
	}
		.technologies-block{
			align-items: center;
			background-color: #fff;
			border: 1px var(--lgray) solid;
			border-radius: 20px;
			display: flex;
			justify-content: flex-start;
			padding: 24px;
			p{
				background: url(../images/stack_separate.svg) left no-repeat;
				font-family: Roboto;
				margin-left: 24px;
				padding-left: 24px;
			}
		}
			.technologies-block__title{
				color: var(--black);
				white-space: nowrap;
			}
	.technologies-brands{
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		gap: 60px;
		justify-content: space-between;
		width: calc(37.66% - 30px);
	}
	.box:not(.visible){display: none;}
@media (max-width: 1400px){
.technologies-brands{gap: 30px;}
}/* END 1400px */
@media (max-width: 1200px){
.technologies-content{
	margin-bottom: 60px;
	width: 100%;
}
.technologies-brands{
	display: grid;
	gap: 46px;
	grid-template-columns: repeat(8, 1fr);
	width: 100%;
}
}/* END 1200px */
@media (max-width: 1023px){
.tabs{
	flex-wrap: nowrap;
	justify-content: center;
	margin-bottom: 40px;
	overflow: auto;
	li{
		font-size: 12px;
		padding: 12px;
		white-space: nowrap;
	}
}
.technologies-content{margin-bottom: 40px;}
.technologies-block{
	flex-wrap: wrap;
	padding: 12px 16px;
}
	.technologies-block__title{
		width: 100%;
	}
	.technologies-block p{
		background: url(../images/border.svg) top no-repeat;
		margin: 16px 0 0;
		padding: 16px 0 0;
		width: 100%;
	}
.technologies-brands{
	gap: 30px;
	grid-template-columns: repeat(6, 1fr);
}
}/* END 1023px */
@media (max-width: 768px){
.technologies-brands{
	grid-template-columns: repeat(4, 1fr);
	img{
		height: 60px;
		width: 60px;
	}
}
}/* END 768px */
@media (max-width: 510px){
.tabs{justify-content: flex-start;}
}/* END 1023px */
/* END technologies */
/* AI */
.ai{
	padding: var(--padding);
	position: relative;
	&:after{
		background-color: var(--black);
		bottom: 0;
		content: "";
		height: 200px;
		position: absolute;
		right: 0;
		width: 100%;
	}
	.flexbox{
		align-items: flex-start;
		background: url(../images/ai_bg.webp) center no-repeat;
		background-size: 100% auto;
		position: relative;
		z-index: 1;
	}
}
	.ai-left{
		display: grid;
		grid-gap: 16px;
		grid-template-columns: repeat(2, 1fr);
		max-width: calc(100% - 324px);
		width: 632px;
		p{
			background-color: #fff;
			border: 1px var(--lgray) solid;
			border-radius: 20px;
			color: var(--black);
			font-weight: 300;
			padding: 32px;
			strong{
				color: var(--gray);
				font-weight: 300;
			}
		}
	}
	.ai-column{
		align-items: center;
		background-color: var(--black);
		border-radius: 20px;
		display: flex;
		flex-direction: column;
		min-height: 576px;
		padding: 32px 32px 60px;
		position: relative;
		width: 308px;
		&:before{
			background: linear-gradient(180deg, rgba(153,153,153,0) 0%, var(--gray) 100%);
			content: "";
			height: calc(100% - 290px);
			left: calc(50% - 1px);
			position: absolute;
			top: 100px;
			width: 2px;
		}
		p{
			font-family: Roboto;
			margin-top: auto;
			text-align: center;
		}
	}
		.btn{
			align-items: center;
			background-color: var(--orange);
			border: none;
			border-radius: 28px;
			box-shadow: 0 8px 20px rgba(255,117,18,.25);
			color: #fff;
			display: flex;
			flex-direction: row;
			flex-wrap: wrap;
			justify-content: center;
			height: 48px;
			padding: 0 16px;
			position: relative;
			transition: all .3s linear;
			&:before{
				border: 3px  var(--black) solid;
				border-radius: 28px;
				box-sizing: border-box;
				content: "";
				height: 46px;
				left: 1px;
				position: absolute;
				top: 1px;
				transition: all .3s linear;
				width: calc(100% - 2px);
			}
			&:hover:before{border-color: var(--orange);}
		}
@media (max-width: 1200px){
.ai .flexbox{
	align-items: stretch;
	background-position: center 80px;
}
.ai-left{
	grid-template-columns: 100%;
	width: 308px;
}
}/* END 1200px */
@media (max-width: 1023px){
.ai .flexbox{
	background: none;
	flex-direction: column;
}
	.ai-left{
		background: url(../images/ai_bg.webp) bottom no-repeat;
		background-size: auto 353px;
		margin: 0 -40px 20px;
		max-width: none;
		padding: 0 40px 260px;
		width: calc(100% + 80px);
		p{padding: 24px;}
	}
	.ai-column{
		margin: 0 auto;
		max-width: 100%;
		min-height: 500px;
		width: 360px;
	}
}/* END 1023px */
@media (max-width: 768px){
.ai-left{
	background-size: auto 260px;
	margin: 0 -20px 20px;
	padding: 0 20px 260px;
	width: calc(100% + 40px);
}
}/* END 768px */
/* END ai */
/* Lawyers */
.lawyers{
	background-color: var(--black);
	overflow: hidden;
	padding: var(--padding);
	.block-title{color: #fff;}
	.grid{
		display: grid;
		grid-gap: 16px;
		grid-template-columns: repeat(4, 1fr);
		position: relative;
		&:before{
			background: url(../images/lawyers_bg.svg) no-repeat;
			content: "";
			height: 103px;
			position: absolute;
			right: -60px;
			top: -64px;
			width: 197px;
			z-index: 9;
		}
	}
}
	.lawyers-block{
		background-color: #282828;
		border: 1px #404040 solid;
		border-radius: 20px;
		display: flex;
		flex-direction: column;
		justify-items: flex-end;
		padding-bottom: 32px;
		p{padding: 0 32px;}
		&:nth-child(2){
			background: #fff url(../images/lawyers_4.svg) 32px 32px no-repeat;
			p{
				color: var(--black);
				font-size: 20px;
				font-weight: 300;
				line-height: 140%;
				margin-top: auto;
				strong{
					color: var(--gray);
					font-weight: 300;
				}
			}
		}
	}
		.lawyers-block-img{
			margin-bottom: 36px;
			position: relative;
			img{
				border-radius: 20px 20px 0 0;
				height: auto;
				width: 100%;
			}
			&:before{
				background: linear-gradient(180deg, rgba(40, 40, 40, 0) 0%, #282828 100%);
				bottom: 0;
				content: "";
				height: 80px;
				left: 0;
				position: absolute;
				width: 100%;
				z-index: 1;
			}
		}
		.lawyers-block__title{
			border-bottom: 2px #404040 dashed;
			color: #fff;
			font-size: 20px;
			line-height: 140%;
			margin: 0 32px 12px;
			padding-bottom: 12px;
		}
@media (max-width: 1200px){
.lawyers .grid{grid-template-columns: repeat(2, 1fr);}
	.lawyers-block-img img{
		height: 260px;
		object-fit: cover;
		object-position: center;
		max-width: 100%;
	}
}/* END 1200px */
@media (max-width: 1023px){
.lawyers-block__title{margin: 0 24px 12px;}
.lawyers-block p{padding: 0 24px;}
}/* END 1023px */
@media (max-width: 768px){
.lawyers .grid:before{top: -35px;}
}/* END 768px */
@media (max-width: 580px){
.lawyers .grid{grid-template-columns: 100%;}
.lawyers-block:nth-child(2){padding-top: 200px;}
}/* END 580px */
/* END lawyers */
/* Work */
.work{
	padding: var(--padding);
	.grid{
		display: grid;
		grid-gap: 16px;
		grid-template-columns: repeat(4, 1fr);
	}
}
	.work-block{
		background-color: #fff;
		border: 1px var(--lgray) solid;
		border-radius: 20px;
		padding: 32px;
		&:nth-child(1){
			background: #fff url(../images/work_1.webp) top no-repeat;
			padding-top: 280px;
		}
		&:nth-child(2){margin-top: auto;}
		&:nth-child(3){
			background: #fff url(../images/work_2.webp) top no-repeat;
			padding-top: 280px;
		}
		&:nth-child(4){margin-bottom: auto;}
		p{font-family: Roboto;}
	}
		.work-block__title{
			color: var(--black);
			margin-bottom: 12px;
		}
@media (max-width: 1200px){
.work .grid{grid-template-columns: 100%;}
	.work-block{
		min-height: 240px;
		&:nth-child(1){
			background: #fff url(../images/work_4.webp) 0 0 no-repeat;
			padding: 32px 32px 32px calc(50% + 32px);
		}
		&:nth-child(2){
			margin: 0 0 0 auto;
			width: 50%;
		}
		&:nth-child(3){
			background: #fff url(../images/work_3.webp) 0 0 no-repeat;
			padding: 32px 32px 32px calc(50% + 32px);
		}
		&:nth-child(4){
			margin: 0 auto 0 0;
			width: 50%;
		}
	}
}/* END 1200px */
@media (max-width: 768px){
.work .grid{grid-template-columns: repeat(2, 1fr);}
	.work-block{
		min-height: 100px;
		padding: 24px;
		&:nth-child(1){
			background: #fff url(../images/work_1.webp) top no-repeat;
			padding: 224px 24px 24px;
		}
		&:nth-child(2){
			margin: 0;
			width: 100%;
		}
		&:nth-child(3){
			background: #fff url(../images/work_2.webp) top no-repeat;
			padding: 224px 24px 24px;
		}
		&:nth-child(4){
			margin: 0;
			width: 100%;
		}
	}
}/* END 768px */
@media (max-width: 560px){
.work .grid{grid-template-columns: 100%;}
.work-block:nth-child(1),.work-block:nth-child(3){background-size: 100% auto;}
}/* END 560px */
/* END work */
/* Steps */
.steps{
	padding: var(--padding);
	position: relative;
	&:before{
		background: url(../images/border.svg) no-repeat;
		content: "";
		height: 1px;
		left: 0;
		position: absolute;
		top: 250px;
		width: 100%;
	}
	.flexbox{
		align-items: flex-start;
		justify-items: flex-start;
		gap: 16px;
	}
	.btn{
		margin: 54px 0 0 auto;
		&:not(:hover):before{border-color: #fff;}
	}
}
	.steps-block{
		padding-left: 60px;
		position: relative;
		width: calc(25% - 12px);
		&:before{
			background-color: var(--orange);
			border-radius: 50%;
			content: "";
			height: 12px;
			left: 18px;
			position: absolute;
			top: 10px;
			width: 12px;
			z-index: 1;
		}
		&:after{
			background-color: var(--orange);
			content: "";
			height: 120px;
			left: 23px;
			opacity: .12;
			position: absolute;
			top: 20px;
			width: 1px;
		}
		p{font-family: Roboto;}
	}
		.steps-block__number{
			color: var(--black);
			font-size: 32px;
			line-height: 100%;
			margin-bottom: 112px;
		}
		.steps-block__title{
			color: var(--black);
			margin-bottom: 12px;
			position: relative;
			&:before{
				background: url(../images/ico_steps1.svg) no-repeat;
				content: "";
				height: 48px;
				left: -60px;
				position: absolute;
				top: -4px;
				width: 48px;
			}
		}
		.ico-2 .steps-block__title:before{background-image: url(../images/ico_steps2.svg);}
		.ico-3 .steps-block__title:before{background-image: url(../images/ico_steps3.svg);}
@media (max-width: 1200px){
.steps:before{
	background: url(../images/stack_separate.svg) center repeat-y;
	height: calc(100% + 80px);
	left: calc(50% - 52px);
	top: -80px;
	width: 2px;
}
.steps .btn{margin: -20px auto 0;}
.steps .flexbox{
	gap: 60px;
	justify-items: center;
	margin: 0 auto;
	max-width: 100%;
	width: 640px;
}
	.steps-block{
		padding: 0 0 0 288px;
		width: 100%;
		&:before{
			left: 10px;
			top: 14px;
		}
		&:after{
			height: 1px;
			left: 22px;
			top: 20px;
			width: 178px;
		}
	}
		.steps-block__number{
			left: 0;
			position: absolute;
			top: 50%;
			transform: translate(0,-50%);
		}
		.steps-block__title:before{left: -88px;}
}/* END 1200px */
@media (max-width: 768px){
.steps:before{left: 128px;}
.steps .btn{margin: -20px 0 0;}
.steps-block{
	padding-left: 88px;
	&:before{
		left: 18px;
		top: 10px;
	}
	&:after{
		height: 43px;
		left: 24px;
		top: 22px;
		width: 1px;
	}
}
.steps-block__number{
	font-size: 24px;
	margin-bottom: 36px;
	position: static;
	transform: none;
}
}/* END 768px */
/* END steps */
/* Popup */
.popup{
	display: none;
	.block-title{
		color: #fff;
		display: block;
		margin-bottom: 40px;
	}
}
.popup.fancybox-content{
	background-color: #282828;
	border: 1px #404040 solid;
	border-radius: 20px;
	padding: 40px 32px;
	width: 420px;
}
.popup-thx .block-title{
	font-size: 24px;
}
	.form fieldset{
		display: block;
		margin-bottom: 20px;
		position: relative;
	}
		.form label{
			left: 20px;
			position: absolute;
			top: -10px;
		}
		.input{
			background-color: var(--black);
			border: none;
			border-radius: 16px;
			color: #fff;
			display: block;
			font-weight: 300;
			height: 56px;
			padding: 0 20px;
			width: 100%;
		}
	.form .btn{margin: 40px auto 0;}
@media (max-width: 768px){
.popup.fancybox-content{
	padding: 32px 24px;
	width: 360px;
}
}/* END 768px */
/* END popup */
/* Footer */
.footer{
	background-color: var(--black);
	padding: 40px 0;
	.flexbox{
		flex-wrap: nowrap;
		gap: 40px;
		margin-bottom: 40px;
		p:last-child{text-align: right;}
	}
	p{
		color: var(--gray);
		font-size: 16px;
		font-weight: 300;
		line-height: 120%;
		opacity: .8;
	}
	a{
		color: #fff;
		&:hover{text-decoration: underline;}
	}
	.footer__email{
		color: #fff;
		font-size: 100px;
		line-height: 100%;
		margin-bottom: 40px;
	}
}
@media (max-width: 1400px){
.footer .footer__email{font-size: 80px;}
.footer .flexbox p:first-child br{display: none;}
.footer .flexbox p:last-child{white-space: nowrap;}
}/* END 1400px */
@media (max-width: 1023px){
.footer .flexbox{
	flex-wrap: wrap;
	gap: 24px;
	p:first-child{width: 100%;}
}
.footer .footer__email{font-size: 60px;}
}/* END 1023px */
@media (max-width: 768px){
.footer .footer__email{font-size: 32px;}
}/* END 768px */
@media (max-width: 600px){
.footer p{font-size: 12px;}
}/* END 600px */
/* END footer */