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

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

:root {
	--v_padding: 80px;
	--white: #FFFDF9;
	--black: #3D5456;
	--gray: #CBAC9D;
	--corp: #C68944;
	--accent: #7D989D;
	--light_gray: #FAF3EA;
	--text: 16px;
	--h1: 50px;
}

* {
	margin: 0px;
	padding: 0px;
	box-sizing: border-box;

	-webkit-text-size-adjust: none;
	   -moz-text-size-adjust: none;
		-ms-text-size-adjust: none;
			text-size-adjust: none;
}

html {
	display: block;
}

body {
	margin: 0;
	padding: 80px 0 0;
	color: var(--black);
	font-size: 15px;
	font-weight: 400;
	font-family: 'Carrois', sans-serif;
	line-height: 1.15;
	background-color: var(--white);

	-webkit-font-smoothing: subpixel-antialiased;
}

img {
	display: block;

	width: 100%;
	height: auto;
}

a,
a:hover {
	text-decoration: none;
	cursor: pointer;
}

.bone {
	max-width: 1400px;
	margin: 0 auto;
	padding: 0 80px;
}

/* button */

.button {
	position: relative;

	padding: 13px 28px;
	color: var(--white);
	font-size: 12px;
	text-align: center;
	text-transform: uppercase;
	background-color: var(--accent);
	border-radius: 100px;
	box-shadow: none;
	cursor: pointer;

	transition: background-color .23s ease-out;
}

.button:hover {
	background-color: var(--corp);
}

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

.button.white:hover {
	color: var(--white);
	background-color: var(--corp);
}

.button.corp {
	background-color: var(--corp);
}

.button.corp:hover {
	background-color: var(--accent);
}

/* button */



/* input */

.input {
	display: block;

	width: 100%;
	height: 60px;
	padding: 20px 28px;
	color: var(--black);
	font-size: 18px;
	font-weight: 400;
	line-height: 19px;
	background-color: transparent;
	border: 1px solid var(--corp);
	border-radius: 20px;
	/*box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, .08);*/
	box-shadow: none;
	outline: none;

	transition: background-color .13s linear, border-color .13s linear;

	-webkit-appearance: none;
}

.input.err {
	border-color: #EE0C0C;
}

/*.input:hover {
	border-color: var(--boring);
}*/

.input:focus {
	background-color: var(--white);
	box-shadow: none;
}

.error {
	
}

.error span {
	display: block;

	padding: 8px 0 0 28px;
	color: #EE0C0C;
}

.input:-moz-placeholder {
	color: var(--gray) !important;
	line-height: normal;
}

.input::-webkit-input-placeholder {
	color: var(--gray);
	line-height: normal;
}

::-webkit-input-placeholder {
	color: var(--gray);
	line-height: normal;
}

:-ms-input-placeholder {
	color: var(--gray);
	line-height: normal;
}

::-moz-placeholder {
	color: var(--gray);
	line-height: normal;
}

:-moz-placeholder {
	color: var(--gray);
	line-height: normal;
}

/* input */



/* select */

.select {
	position: relative;

	height: 48px;
	padding: 12px 20px 12px;
	color: var(--black);
	font-size: 14px;
	font-weight: 400;
	line-height: 19px;
	background-color: var(--white);
	border: 4px solid rgba(0, 0, 0, .04);
	border-radius: 16px;
	box-shadow: none;
	cursor: pointer;
	z-index: 1;

	transition: background-color .23s ease-out, border-color .23s ease-out, box-shadow .23s ease-out;
}

.select:hover {
	border-color: rgba(0, 0, 0, .08);
}

.select.active {
	background-color: var(--white);
	border-color: rgba(0, 0, 0, .08);
	border-radius: 16px 16px 0 0;
	z-index: 2;
}

.select:before {
	content: '';
	pointer-events: none;
	position: absolute;
	top: 13px;
	right: 20px;

	width: 12px;
	height: 12px;
	background: url('../images/arrow_left.svg') center center no-repeat;
	background-size: 12px auto;

	transition: transform .23s ease-out;
	transform: rotate(270deg) translateX(-1px);
}

.select.active:before {
	transform: rotate(450deg);
}

.select_ul {
	display: none;
	position: absolute;
	top: calc(100% + 4px);
	left: -2px;
	right: -2px;

	padding: 8px 0;
	background-color: var(--white);
	border: 1px solid rgba(0, 0, 0, .08);
	border-top: 0 none;
	border-radius: 0 0 16px 16px;
	box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .08);
}

.select.active .select_ul {
	display: block;
	overflow-y: scroll;

	max-height: 350px;
}

.select_li {
	padding: 8px 20px 8px;
	cursor: pointer;

	transition: color .23s ease-out;
}

.select_li:hover {
	color: var(--corp);
}

/* select */



/* global */

.global_header {
	margin-bottom: 40px;
}

.global_header.center {
	text-align: center;
}

.global_title {
	color: var(--black);
	font-size: var(--h1);
	font-family: 'Cavas', sans-serif;
	line-height: 140%;
}

.global_descr {
	padding-top: 20px;
	color: var(--accent);
	font-size: var(--text);
	line-height: 160%;
}

/* global */



/* star */

.star {
	position: fixed;
	top: 0;
	left: calc(-50vh + 50px);

	height: 100vh;
	opacity: .8;
	z-index: -1;

	transition: transform .23s ease-out;
}

.star img {
	width: auto;
	height: 100%;
}

/* star */



/* bar */

.bar {
	overflow: hidden;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;

	max-width: 600px;
	width: 100%;

	background-color: var(--bg);
	z-index: 998;

	transition: transform .25s ease-out;
	transform: translateX(100%);
}

.bar.active {
	transform: translateX(0) !important;
}

.bar_scroll {
	overflow-y: scroll;
	display: flex;
	flex-direction: column;
	position: relative;

	width: calc(100% + 30px);
	height: 100vh;
	padding: 0 30px 0 0px;

	-webkit-overflow-scrolling: touch;
}

.bar_scroll::-webkit-scrollbar {
	width: 0;
}

.bar_scroll {
	-ms-overflow-style: none;
}

.bar_scroll {
	overflow: -moz-scrollbars-none;
}

.bar_nav {
	flex-grow: 1;

	padding: 120px 20px 40px;
}

.bar_nav_li {
	padding: 8px 0;
	text-align: center;
}

.bar_nav_li a {
	color: var(--black);
	font-size: 21px;
	text-align: center;
	line-height: 160%;

	transition: color .23s ease-out;
}

.bar_nav_li a:hover {
	color: var(--corp);
}

.bar_bottom {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	align-items: center;
	gap: 24px;

	padding-bottom: 80px;
}

/* bar */



/* header */

.header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;

	background-color: var(--white);
	z-index: 999;
}

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

	padding: 20px 0;
}

.header_logo {

}

.header_logo img {
	width: 280px;
}

.header_logo img:last-child {
	display: none;
}

.header_nav {
	display: flex;
	flex-wrap: wrap;
	gap: 44px;
}

.header_nav a {
	color: var(--black);
	font-size: 12px;
	text-transform: uppercase;

	transition: color .23s ease-out;
}

.header_nav a:hover {
	color: var(--corp);
}

.header_button {

}

/* header */



/* general */

.general {

}

.general_group {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 40px;
}

.general_info {
	width: calc(50% - 20px);
}

.general_title {
	color: var(--black);
	font-size: var(--h1);
	font-family: 'Cavas', sans-serif;
	line-height: 140%;
}

.general_descr {
	margin-top: 20px;
	color: var(--accent);
	font-size: var(--text);
	line-height: 160%;
}

.general_button {
	display: flex;

	margin-top: 40px;
}

.general_image {
	width: calc(50% - 20px);
}

.general_image img {
	border-radius: 20px;
}

/* general */



/* mission */

.mission {
	padding: var(--v_padding) 0;
}

.mission_group {

}

.mission_header {

}

.mission_row {
	display: flex;
	flex-wrap: wrap;
}

.mission_col {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	align-items: center;
	position: relative;

	width: 50%;
	padding: 60px 0;
}

.mission_col:before {
	content: '';
	position: absolute;
	top: 0;
	left: 50%;
	bottom: 0;

	width: 1px;
	background: linear-gradient(180deg, rgba(198, 137, 68, 0) 0%, #C68944 50%, rgba(198, 137, 68, 0) 100%);
	z-index: 2;
}

.mission_block {
	position: relative;

	max-width: 340px;
	padding: 8px 8px 16px;
	background-color: var(--light_gray);
	border-radius: 20px;
	z-index: 3;
}

.mission_block.m_l {
	margin-left: 60px;
}

.mission_block.m_t {
	margin-top: 160px;
}

.mission_block.m_r {
	margin-right: 60px;
}

.mission_block_image {

}

.mission_block_image img {
	border-radius: 16px;
}

.mission_block_label {
	padding: 16px 16px 0;
	color: var(--black);
	font-size: var(--text);
	line-height: 160%;
}

/* mission */



/* services */

.services {
	padding: var(--v_padding) 0;
}

.services_group {
	position: relative;
}

.services_group:before {
	content: '';
	position: absolute;
	top: -60px;
	left: -60px;
	right: -60px;
	bottom: -60px;

	background-color: var(--light_gray);
	border-radius: 20px;
	z-index: -1;
}

.services_header {

}

.services_blocks {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	gap: 40px;
}

.services_block {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.services_image {
	overflow: hidden;

	width: 400px;
}

.services_image img {
	object-fit: cover;

	height: 100%;
	border-radius: 20px;
}

.services_info {
	width: calc(100% - 400px);
	padding-left: 80px;
}

.services_block:nth-child(even) .services_info {
	order: -1;

	padding-left: 0;
	padding-right: 80px;
}

.services_title {
	color: var(--black);
	font-size: 32px;
	line-height: 140%;
	font-family: 'Cavas', sans-serif;
}

.services_price {
	margin-top: 20px;
	color: var(--corp);
	font-size: 32px;
	line-height: 140%;
	font-family: 'Cavas', sans-serif;
}

.services_subprice {
	color: var(--corp);
	font-size: var(--text);
	line-height: 160%;
}

.services_descr {
	margin-top: 20px;
	color: var(--accent);
	font-size: var(--text);
	line-height: 160%;
}

.services_ul {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	gap: 12px;

	margin-top: 20px;
}

.services_ul_li {
	position: relative;

	padding-left: 44px;
	color: var(--black);
	font-size: var(--text);
	line-height: 160%;
}

.services_ul_li:before {
	content: '';
	position: absolute;
	top: -2px;
	left: 0;

	width: 28px;
	height: 28px;
	background-image: url('../images/ul_li.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100% auto;
}

.services_buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;

	margin-top: 20px;
}

/* services */



/* about */

.about {
	padding: 60px 0 0;
}

.about_group {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.about_info {
	width: calc(100% - 400px);
	padding-right: 80px;
}

.about_title {
	color: var(--black);
	font-size: var(--h1);
	font-family: 'Cavas', sans-serif;
	line-height: 140%;
}

.about_descr {
	margin-top: 20px;
	color: var(--accent);
	font-size: var(--text);
	line-height: 160%;
}

.about_button {
	display: flex;

	margin-top: 20px;
}

.about_image {
	width: 400px;
}

.about_image img {
	border-radius: 20px;
}

/* about */



/* reviews */

.reviews {
	padding: var(--v_padding) 0;
}

.reviews_group {

}

.reviews_slider {
	padding: 40px 0;
	background-color: var(--light_gray);
	border-radius: 20px;
}

.reviews_slider .swiper-slide {
	width: 100%;
}

.reviews_slide {
	padding: 0 240px;
}

.reviews_image {
	width: 120px;
	margin: 0 auto;
}

.reviews_image img {
	border: 1px solid var(--corp);
	border-radius: 50%;
}

.reviews_descr {
	margin-top: 20px;
	color: var(--black);
	font-size: 21px;
	text-align: center;
	line-height: 160%;
}

.reviews_name {
	margin-top: 40px;
	color: var(--corp);
	font-size: var(--text);
	text-align: center;
	line-height: 160%;
}

.reviews_who {
	margin-top: 4px;
	color: var(--accent);
	font-size: var(--text);
	text-align: center;
	line-height: 160%;
}

/* reviews */



/* insta */

.insta {

}

.insta_slider {

}

.insta_slider .swiper-slide {
	width: 300px;
}

.insta_slide {
	width: 300px;

	transform: rotate(2deg);
	transition: transform .63s ease-out;
}

.insta_slider .swiper-slide:nth-child(even) .insta_slide {
	transform: rotate(-2deg);
	transition: transform .23s ease-out;
}

.insta_slide img {
	border-radius: 20px;
}

/* insta */



/* faq */

.faqs {
	padding: var(--v_padding) 0;
}

.faqs_group {
	padding: 0 var(--v_padding);
}

.faqs_header {

}

.faqs_blocks {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	gap: 16px;
}

.faqs_block {
	background-color: var(--light_gray);
	border: 1px solid var(--light_gray);
	border-radius: 20px;

	transition: background-color .23s ease-out, border-color .23s ease-out;
}

.faqs_title {
	position: relative;

	padding: 20px 20px 20px 40px;
	color: var(--black);
	font-size: 21px;
	line-height: 160%;
	cursor: pointer;

	transition: color .23s ease-out;
}

.faqs_title:hover {
	color: var(--corp);
}

.faqs_block.active {
	background-color: var(--white);
	border-color: var(--accent);
}

.faqs_title:before {
	content: '';
	position: absolute;
	top: 50%;
	right: 20px;

	width: 24px;
	height: 24px;
	margin-top: -12px;
	background-image: url('../images/faqs_arrow.svg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100% auto;

	transition: transform .23s ease-out;
}

.faqs_block.active .faqs_title:before {
	transform: rotate(-90deg);
}

.faqs_descr {
	display: none;

	padding: 0 20px 20px 40px;
	color: var(--accent);
	font-size: var(--text);
	line-height: 160%;
}

/* faq */



/* footer */

.footer {

}

.footer_group {
	position: relative;
}

.footer_group:before {
	content: '';
	position: absolute;
	top: 0px;
	left: -60px;
	right: -60px;
	bottom: 20px;

	background-color: var(--light_gray);
	border-radius: 20px;
	z-index: -1;
}

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

	padding: 20px 0;
}

.footer_newslatter_title {
	color: var(--black);
	font-size: 32px;
	line-height: 140%;
}

.footer_newslatter_form {
	display: flex;
	gap: 16px;
}

.footer_newslatter_input {
	flex-grow: 1;
}

.footer_newslatter_button .button {
	padding: 23px 28px;
	border-radius: 20px 40px 40px 20px;
}

.footer_blocks {
	display: flex;
	flex-wrap: wrap;
	gap: 80px;

	padding: 40px 0 60px;
	border-top: 1px solid var(--corp);
}

.footer_block {

}

.footer_block:first-child {
	flex-grow: 1;
}

.footer_logo {

}

.footer_logo a {
	color: var(--corp);
	font-size: 24px;
	font-weight: 700;
}

.footer_descr {
	margin-top: 28px;
	color: var(--accent);
	font-size: 14px;
	line-height: 160%;
}

.footer_socs {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;

	margin-top: 28px;
}

.footer_socs_soc {
	padding: 10px 30px;
	background-color: var(--corp);

	transition: background-color .23s ease-out;
}

.footer_socs_soc:hover {
	background-color: var(--accent);
}

.footer_socs_soc:first-child {
	border-radius: 40px 20px 20px 40px;
}

.footer_socs_soc:last-child {
	border-radius: 20px 40px 40px 20px;
}

.footer_socs_soc img {
	width: 20px;
}

.footer_label {
	color: var(--black);
	font-size: 12px;
	text-transform: uppercase;
}

.footer_nav {

}

.footer_nav a {
	display: block;

	margin-top: 16px;
	color: var(--corp);
	font-size: var(--text);
	line-height: 160%;

	transition: color .23s ease-out;
}

.footer_nav a:hover {
	color: var(--accent);
}

.footer_buttons {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	align-items: flex-end;
	gap: 20px;
}

.footer_copy {
	margin-top: 54px;
	color: var(--black);
	font-size: var(--text);
	line-height: 160%;
}

/* footer */



/* animation */

.animation_up {
	overflow: hidden;
	display: inline-block;
}

.animation_up span {
	display: inline-block;

	font-size: var(--h1);
	text-transform: uppercase;
	line-height: 100%;
	opacity: 0;

	will-change: transform, opacity;
	transform-origin: bottom left;
	transform: translate3d(0, 150%, 0) skew(0, 20deg);
	transition: opacity .23s ease-in-out, transform .63s ease-in-out;
}

.animation_up.active span {
	opacity: 1;

	transform: translate3d(0, 0, 0);
}

.animation_line.active:before {
	width: 100%;
}

.animation_opacity {
	opacity: 0;

	transform: translate3d(40px, 0, 0);
	transition: opacity .63s ease-in-out, transform .63s ease-in-out;
}

.animation_opacity.active {
	opacity: 1;

	transform: translate3d(0, 0, 0);
}

.animation_top {
	opacity: 0;

	transform: translate3d(0, 40px, 0);
	transition: opacity .63s ease-in-out, transform .63s ease-in-out;
}

.animation_top.active {
	opacity: 1;

	transform: translate3d(0, 0, 0);
}

.animation_rotate {
	opacity: 0;

	transform: rotate(-90deg);
	transition: opacity 1.1s ease-in-out, transform 1.1s ease-in-out;
}

.animation_rotate.active {
	opacity: 1;

	transform: rotate(90deg);
}

.animation_rotate_2 {
	opacity: 0;

	transform: rotate(-25deg);
	transition: opacity 1.1s ease-in-out, transform 1.1s ease-in-out;
}

.animation_rotate_2.active {
	opacity: 1;

	transform: rotate(0);
}

.animation_levitate {
	will-change: transform;

	animation: levitate-animation 8s ease-in-out infinite alternate;
}

@keyframes levitate-animation {
	0% {
		transform: translate3d(0, 0, 0);
	}
	50% {
		transform: translate3d(3%, -5%, 0);
	}
	100% {
		transform: translate3d(0, -7%, 0);
	}
}

/* animation */




@media only screen and (max-width: 1024px) {
	:root {
		--v_padding: 40px;
		--text: 14px;
		--h1: 32px;
	}

	.bone {
		max-width: 600px;
		padding: 0 20px;
	}

	.button {
		padding: 10px 20px;
	}

	.header_logo img {
		width: 80px;
	}

	.header_logo img:first-child {
		display: none;
	}

	.header_logo img:last-child {
		display: block;
	}

	.header_nav {
		display: none;
	}

	.general_info {
		width: 100%;
		padding: 40px 0;
	}

	.general_image {
		width: 100%;
	}

	.mission_row {
		gap: 40px;
	}

	.mission_col {
		gap: 40px;

		width: 100%;
		padding: 0;
	}

	.mission_block {
		max-width: 100%;
	}

	.mission_block.m_l {
		margin-left: 0;
	}

	.mission_block.m_t {
		margin-top: 0;
	}

	.mission_block.m_r {
		margin-right: 0;
	}

	.services_group {
		padding-top: 20px;
	}

	.services_group:before {
		top: -10px;
		left: -10px;
		right: -10px;
		bottom: -10px;
	}

	.services_block {
		gap: 40px;
	}

	.services_image {
		width: 100%;
	}

	.services_info {
		width: 100%;
		padding: 0;
	}

	.services_block:nth-child(2n) .services_info {
		order: 1;
	}

	.about {
		padding-top: 20px;
	}

	.about_group {
		gap: 40px;
	}

	.about_info {
		width: 100%;
		padding: 0;
	}

	.about_image {
		width: 100%;
	}

	.swiper-button-next,
	.swiper-button-prev {
		width: 40px;
	}

	.reviews_slide {
		padding: 60px;
	}

	.reviews_descr {
		font-size: 16px;
	}

	.reviews_name {
		margin-top: 20px;
	}

	.faqs_group {
		padding: 0;
	}

	.faqs_blocks {
		gap: 8px;
	}

	.faqs_title {
		padding: 20px 44px 20px 20px;
		font-size: 16px;
	}

	.faqs_descr {
		padding: 0 20px 20px;
	}

	.footer_group:before {
		top: -10px;
		left: -10px;
		right: -10px;
		bottom: 10px;
	}

	.footer_descr br {
		display: none;
	}

	.footer_blocks {
		justify-content: space-between;
		gap: 20px;

		padding: 20px 10px 40px;
	}

	.footer_newslatter {
		flex-wrap: wrap;
		gap: 16px;

		padding: 20px 10px;
	}

	.footer_newslatter_form {
		flex-grow: 1; 
	}
}
