@font-face {
	font-family: 'HelveticaNeueCyr-Bold';
	src: url('fonts/HelveticaNeueCyr-Bold.eot');
	src: url('fonts/HelveticaNeueCyr-Bold.eot?#iefix') format('embedded-opentype'),
		 url('fonts/HelveticaNeueCyr-Bold.woff') format('woff'),
		 url('fonts/HelveticaNeueCyr-Bold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: 'HelveticaNeueCyr-Roman';
	src: url('fonts/HelveticaNeueCyr-Roman.eot');
	src: url('fonts/HelveticaNeueCyr-Roman.eot?#iefix') format('embedded-opentype'),
		 url('fonts/HelveticaNeueCyr-Roman.woff') format('woff'),
		 url('fonts/HelveticaNeueCyr-Roman.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

h1 {font-family: 'HelveticaNeueCyr-Bold'; font-size: 52px; line-height: 52px;}
h2 {font-family: 'HelveticaNeueCyr-Bold'; font-size: 49px; line-height: 52px;}
h3 {font-family: 'HelveticaNeueCyr-Bold'; font-size: 29px; line-height: 35px;}
h4 {font-family: 'HelveticaNeueCyr-Bold'; font-size: 21px; line-height: 24px;}

a, a:link, a:visited {color: #E92677; text-decoration: underline;}
	a:hover {text-decoration: none;}

.maintext {line-height: 30px;}

body {
	margin: 0;
	padding: 0; 
	color: #000;
	font-size: 18px;
	font-family: HelveticaNeueCyr-Roman;
}

/* HERO-SECTION */
#hero-section {
	background: radial-gradient(13.93% 26.84% at 0.76% 34.84%, #3E3155 0%, #1B1B1C 100%);
	background-attachment: fixed;
	color: #fff;
	margin-bottom: 114px;
}
	#hero-section-img {
		background:  url(img/hero.webp) no-repeat calc(50% + 400px) 0; 
		background-size: 781px auto;
		background-attachment: fixed;
		padding: 35px 0 83px 0;
	}
	@media screen and (max-width: 1250px) { #hero-section-img {padding: 35px 25px 83px 25px; } }
	/* head */
	#hero-header {
		max-width: 1200px;
		margin: 0 auto 163px auto;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
		#hero-header #logo {}
			#hero-header #logo img {width: 84px; height: auto;}
		#hero-header #logo-right {display: flex; align-items: center}
			#hero-header #slogan {
				margin-right: 30px;
				font-size: 15px; color: #8D8D8D;
			}
			#hero-header #cta-button {}
				#hero-header #cta-button a {
					display: inline-block;
					background: linear-gradient(146.96deg, #E84C0E 13.38%, #E912AD 121.07%);
					border-radius: 35px;
					color: #FFFFFF; text-decoration: none;
					padding: 15px 31px 13px 31px;
				}
	/* hero-content */
	#hero-content {
		max-width: 1200px;
		margin: 0 auto;
	}
		#hero-content h1 {}
		#hero-content .intro-text {
			max-width: 650px;
			margin: 11px 0 48px 0;
			line-height: 28px; 
		}
		#hero-content #cta-button-2 {}
			#hero-content #cta-button-2 a {
				display: inline-block;
				background: #444445;
				border-radius: 35px;
				color: #FFFFFF; text-decoration: none;
				padding: 15px 31px 13px 31px;
				margin: 0 0 137px 0;
			}
	#hero-items {
		display: flex; justify-content: space-between; gap: 20px;
		max-width: 1280px; margin: 0 auto;
	}
		#hero-items .hero-item {
			background: #fff;
			border-radius: 20px;
			padding: 32px 22px 42px 22px; 
			color: #000;
			width: 25%;
		}
			#hero-items .hero-item .hero-item-head {
				font-family: HelveticaNeueCyr-Bold; font-size: 21px; margin: 0 0 22px 0;}
			#hero-items .hero-item .hero-item-cont {
				font-size: 15px; line-height: 20px;
			}
	
/* Mega text 1 */
#mega-1 {max-width: 1200px; margin: 0 auto 107px auto;
	display: flex; justify-content: space-between; align-items: center;
}
	@media screen and (max-width: 1250px) { #mega-1 {padding: 0 25px;} }
	#mega-1 #mega-1-left {
		max-width: 350px;
	}
		#mega-1 #mega-1-left #big-digit {
			font-family: HelveticaNeueCyr-Bold;
			font-size: 149px;
			line-height: 182px;			
			background: linear-gradient(116.34deg, #0EA7E8 -7.46%, #E912AD 95.15%);
			-webkit-background-clip: text;
			-webkit-text-fill-color: transparent;
			background-clip: text;
			text-fill-color: transparent;
		}
		#mega-1 #mega-1-left #describer {font-size: 15px; line-height: 20px; color: #8D8D8D; margin-top: -20px;}
	#mega-1 #mega-1-right {
		max-width: 690px;
	}
		#mega-1 #mega-1-right h3 {margin-bottom: 57px;}

/* Uslugi */
#uslugi {
	display: flex; justify-content: space-between; gap: 24px;
	max-width: 1200px; margin: 0 auto 110px auto;
	color: #fff; font-size: 15px; line-height: 24px;
}
	@media screen and (max-width: 1250px) { #uslugi {padding: 0 25px;} }
	#uslugi #usluga-1 {
		padding: 57px 60px 65px 40px;
		width: 50%;
		background: radial-gradient(105.13% 127.43% at 44.05% -7.69%, #476B0D 0%, #222225 42.38%, #1F2534 94.21%);
		box-shadow: 0px 0px 34px rgba(10, 74, 27, 0.35);
		border-radius: 20px;
	}
	#uslugi #usluga-2 {
		padding: 57px 60px 65px 40px;
		width: 50%;
		background: radial-gradient(108.55% 197.11% at 73.3% -11.4%, #6B0D45 0%, #2E1D34 39.32%, #222225 78.04%, #1F2534 95.98%) /* warning: gradient uses a rotation that is not supported by CSS and may not behave as expected */;
		box-shadow: 0px 0px 34px rgba(148, 13, 78, 0.35);
		border-radius: 20px;
	}
	#uslugi h3 {font-size: 21px; margin: 0 0 26px 0;}

/* Mega text 2 */
#mega-2 {max-width: 1200px; margin: 0 auto 107px auto;
	display: flex; justify-content: space-between;
}
	@media screen and (max-width: 1250px) { #mega-2 {padding: 0 25px;} }
	#mega-2 #mega-2-left {
		max-width: 490px;
	}
		#mega-2 #mega-2-left h3 {margin-top: 0;}
	#mega-2 #mega-2-right {
		max-width: 588px;
		line-height: 27px;
	}

/* Link to test */
#test {
	background: radial-gradient(111.57% 247.32% at 85.07% -3.3%, #6B0D45 0%, #2E1D34 39.32%, #222225 78.04%, #503182 95.98%);
	box-shadow: 0px 0px 34px rgba(148, 13, 78, 0.35);
	background-attachment: fixed;
	padding: 205px 0 158px 0;
	text-align: center;
}
	#test h2 {font-size: 52px; line-height: 52px; color: #fff; margin: 0 0 53px 0;}
		#test h2 span {color: #5BB0FF;}
	#go-test-button {}
		#go-test-button a {
			display: inline-block;
			background: linear-gradient(146.96deg, #E84C0E 13.38%, #E912AD 121.07%);
			border-radius: 35px;
			color: #FFFFFF;
			text-decoration: none;
			padding: 15px 31px 13px 31px;
		}

/* Options */
#options {
	background: #F5F5F5;
	padding: 95px 0 80px 0;
	margin-bottom: 127px;
}
	@media screen and (max-width: 1250px) { #options {padding: 95px 25px 80px 25px;} }
	#options #options-container {max-width: 1200px; margin: 0 auto;}
		#options #options-list {
			display: flex; justify-content: space-start;
			gap: 24px 2%; flex-wrap: wrap;
		}
			#options #options-list .option {
				border-radius: 20px;
				width: 28%;
				font-size: 15px; line-height: 20px;
				padding: 70px 2% 55px 2%;
				background: #fff url(img/checked.png) no-repeat 5% 20px;
				background-size: 26px auto;
			}
			#options #options-list .option h4 {margin: 0 0 16px 0;}
				#options #options-list .option:first-child {width: 62%;
					background: #fff url(img/checked.png) no-repeat 2.5% 20px;
					background-size: 26px auto;
				}
				#options #options-list .option:last-child {
					color: #fff;
					background: linear-gradient(116.34deg, #E84C0E -7.46%, #E912AD 95.15%);
				}

/* Podhodit */
#podhodit {max-width: 1200px; margin: 0 auto 155px auto;}
	@media screen and (max-width: 1250px) { #podhodit {padding: 0 25px;} }
	#podhodit #podhodit-content {line-height: 30px; max-width: 792px;}

/* price */
#price {
	background: #F5F5F5;
	padding: 110px 0 110px 0;
}
	@media screen and (max-width: 1250px) { #price {padding: 110px 25px;} }
	#price #price-container {max-width: 1200px; margin: 0 auto;
		display: flex; justify-content: space-between; gap: 24px;
	}
		#price #price-container .price {
			background: #FFFFFF;
			box-shadow: 0px 0px 14px rgba(0, 0, 0, 0.07);
			border-radius: 20px;
			width: 380px;
			padding: 35px 30px 40px 30px;
		}
			#price #price-container .price:first-child {
				box-shadow: none;
				background: #3A4346;
				color: #fff;
			}
			#price #price-container .price:last-child {width: 790px;}
		#price #price-container .price-sum {font-family: 'HelveticaNeueCyr-Bold'; font-size: 31px; margin: 0 0 13px 0;}
		#price #price-container .price-extra {font-size: 15px; height: 167px;}
		#price #price-container .price-incl {margin: 0 0 8px 0; line-height: 24px;}
		#price #price-container .price-more {font-size: 15px; color: #8D8D8D;}
		#price #price-container .price-descr {font-size: 15px; line-height: 20px;}
			#price #price-container .price-descr h3 {
				margin: 0 0 8px 0;
				font-size: 21px; line-height: 24px;
				background: linear-gradient(116.34deg, #0EA7E8 -7.46%, #E912AD 95.15%);
				-webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-fill-color: transparent;
				display: inline-block; 
			}



/* order */
#order {
	background: #1B1B1C url(img/order.webp) no-repeat 50% 0;
	background-size: cover;
	background-attachment: fixed;
	padding: 102px 0 122px 0;
	margin: 0 0 43px 0;
}
	@media screen and (max-width: 1250px) { #order {padding: 102px 25px 122px 25px;} }
	#order #order-container {max-width: 1200px; margin: 0 auto;}
		#order h2 {color: #fff; margin-bottom: 50px;}
		#order #form-container {}
			#order #form-container form {display: flex; gap: 20px;}
				#order #form-container input[type="text"] {
					font-size: 18px; color: #fff;
					background: transparent; border: 1px solid #839BA1; border-radius: 5px;
					padding: 11px;
					width: 320px;
				}
				#order #form-container input[type="submit"] {
					background: linear-gradient(146.96deg, #E84C0E 13.38%, #E912AD 121.07%);
					border: none;
					padding: 0 55px;
					border-radius: 35px;
					font-size: 18px; color: #fff;
				}

/* footer */
#footer {
	max-width: 1200px; margin: 0 auto 41px auto; 
	display: flex; justify-content: space-between; align-items: center;
	font-size: 15px; line-height: 20px; color: #8D8D8D;
}
	@media screen and (max-width: 1250px) { #footer {padding: 0 25px;} }
	#footer #copyright {}
	#footer #footer-right {}
		#footer #footer-right a {color: #000;}



/* TEST PAGE */
body.test #hero-section {margin-bottom: 0; min-height: 850px;}
	body.test #hero-section-img {background: none;} /* deleting earth */
	body.test #hero-content {max-width: 720px;}
		body.test #hero-content h1 {margin-bottom: 73px;}
			body.test #hero-content h1 span {color: #5BB0FF;}
#megaform {}
	#megaform form#promptForm {margin: 0 0 35px 0;}
		#megaform form#promptForm input#prompt { /* prompt input */
			font-size: 21px; color: #fff; 
			border: 1px solid #839BA1;
			width: 525px; height: 43px;
			padding-left: 20px; margin-right: 18px;
			background: none;
			border-radius: 5px;
		}
			@media screen and (max-width: 760px) {
				#megaform form#promptForm input#prompt {width: 92%; margin: 0 0 20px 0;}
			}
		#megaform form#promptForm input[type="submit"] { /* submit */
			border: none;
			color: #fff; font-size: 18px;
			padding: 12px 35px 13px 35px;
			height: 46px;
			background: linear-gradient(146.96deg, #E84C0E 13.38%, #E912AD 121.07%);
			border-radius: 35px;
		}
			@media screen and (max-width: 760px) {
				#megaform form#promptForm input[type="submit"] {width: 100%;}
			}
	#megaform #prompt-options {}
		#megaform #prompt-options .optionBtn {
			margin: 0 18px 11px 0; padding: 0; background: none; border: none;
			font-size: 14px; color: #C2C2C2; border-bottom: 1px dashed;
			cursor: pointer;
		}
			@media screen and (max-width: 760px) {
				#megaform #prompt-options .optionBtn {margin: 0 10px 11px 0;}
			}
			#megaform #prompt-options .optionBtn:hover {color: #5BB0FF;}
#megaresponse {
	background: linear-gradient(116.34deg, #0EA7E8 -7.46%, #E912AD 95.15%);
	border-radius: 20px;
	padding: 75px 204px; max-width: 792px; margin: 0 auto;
	color: #fff; font-size: 18px; line-height: 30px;
	display: none;
}
@media screen and (max-width: 700px) { #megaresponse {padding: 40px 20px; font-size: 15px; line-height: 25px;} }
	#megaresponse h2 {font-size: 29px; line-height: 35px; margin: 0 0 47px 0;}
		@media screen and (max-width: 700px) { #megaresponse h2 {font-size: 22px; line-height: 25px;} }
	#response {white-space: pre-wrap;}
/* counter */
#counter {
	width: 73px; height: 52px; padding-top: 21px;
	background: rgba(0,0,0,0.5);
	border-radius:535px;
	margin: -30px 0 30px 0;
	font-size: 29px; line-height: 35px; text-align: center;
	}

/* ADAPTIVE */
@media screen and (max-width: 720px) {
/* HERO-SECTION */
#hero-section {
	margin-bottom: 60px;
}
	#hero-section-img {
		background: url(img/hero.webp) no-repeat -100px -390px;
		background-size: 781px auto;
		background-attachment: unset;
		padding: 25px 20px 63px 20px;
	}
	/* head */
			#hero-header #slogan {display: none;}
			#hero-header #cta-button {}
				#hero-header #cta-button a {
					font-size: 15px;
					padding: 15px 21px 13px 21px;
				}
	/* hero-content */
		#hero-content h1 {font-size: 38px; line-height: 38px;}
	#hero-items {flex-wrap: wrap;}
		#hero-items .hero-item {width: auto;}

/* Mega text 1 */
		#mega-1 {
			flex-wrap: wrap;
			padding: 0 20px;
		}
			#mega-1 #mega-1-left {margin-bottom: 40px;}
				#mega-1 #mega-1-left #big-digit {
					font-size: 139px;
					line-height: 172px;
				}
			#mega-1 #mega-1-right .maintext {
				line-height: 25px;
			}

/* Uslugi */
			#uslugi {
				flex-wrap: wrap;
				line-height: 22px;
				padding: 0 20px;
			}
				#uslugi #usluga-1 {
					padding: 57px 20px 65px 20px;
					width: auto;
				}
				#uslugi #usluga-2 {
					padding: 57px 20px 65px 20px;
					width: auto;
				}
			
/* Mega text 2 */
#mega-2 {
	flex-wrap: wrap;
	padding: 0 20px;
}

/* Link to test */
#test {
	padding: 155px 20px 108px 20px;
}
	#test h2 {font-size: 38px; line-height: 38px;}

/* Options */
#options {
	padding: 75px 20px 70px 20px;
}
		#options #options-container h2 {font-size: 39px; line-height: 42px;}
			#options #options-list .option {
				width: 100%;
				padding: 70px 25px 45px 20px;
			}
				#options #options-list .option:first-child {width: 100%;}

/* Podhodit */
#podhodit {margin: 0 auto 115px auto; padding: 0 20px;}
	#podhodit h2 {font-size: 39px; line-height: 42px;}
				
/* price */
#price {padding: 100px 20px;}
	#price #price-container {flex-wrap: wrap;}
		#price #price-container .price,
		#price #price-container .price:last-child {
			width: 100%;
			padding: 35px 20px 30px 25px;
		}
		#price #price-container .price-extra {height: 90px;}

/* order */
#order {padding: 80px 20px 122px 20px;}
		#order h2 {font-size: 39px; line-height: 42px;}
			#order #form-container form {flex-wrap: wrap;}
				#order #form-container input[type="text"] {
					width: 100%;
				}
				#order #form-container input[type="submit"] {
					padding: 13px 0;
					width: 100%;
				}
		
/* footer */
#footer {
	flex-wrap: wrap;
	padding: 0 20px;
}
	#footer #copyright {margin-bottom: 15px;}





}











