@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Manrope:wght@200..800&display=swap');
:root{
	--white: #F7F6F8;
	--white_2: #FFFFFF;
	--black: #171717;
	--red: #B80100;

	--h1: max(58px, 200rem);
	--h2: max(48px, 150rem);
	--h3: max(48px, 100rem);
	--h4: max(24px, 32rem);
	--h5: max(20px, 28rem);
	--h6: max(24px, 24rem);
	--body: max(14px, 20rem);
	--big_body: max(18px, 20rem);
	--button: max(14px, 20rem);
	--caption: max(12px, 18rem);

	--ease-out-expo: cubic-bezier(0.19, 1, 0.22, 1);
}
/************************* reset *************************/
html{
	height: 100%;
	margin: 0;
	padding: 0;width: 100%;
	background: var(--white);
	font-size: 0.052vw;
}
body{
	height: 100%;
	width: 100%;
	position: relative;
	margin: 0;
	padding: 0;
	color: var(--black);
	font-size: var(--body);
	font-weight: 400;
	font-family: 'Inter', Arial, Helvetica, sans-serif;
	line-height: 120%;
	letter-spacing: -0.03em;
	min-width: 320px;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}
h1, h2, h3, h4, h5, h6, p, ul, li, a, span, div, input, textarea, select, form, fieldset, button, dl, dd, dt, figure, figcaption, blockquote, caption, aside, section {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	box-sizing: border-box;
}
img {
	margin: 0;
	padding: 0;
	border-style: none;
	vertical-align: bottom;
}
input, textarea, select, button {
	font-weight: 400;
	font-family: 'Inter', Arial, Helvetica, sans-serif;
	vertical-align:middle;
	border: 0;
	outline: 0;
	background: none;
}
a:hover {text-decoration: none;}
ul li {list-style: none;}
::selection {
	color: var(--white_2);
	background-color: var(--red);
}
/************************* common styles *************************/
.holder {
	padding: 0 16px;
}
@media (min-width: 768px){
	.holder {
		padding: 0 20px;
	}
}
.holder:after {
	display: block;
	content: '';
	clear: both;
}
h1, .h1 {
	display: block;
	font-family: 'Bebas Neue';
	font-weight: 400;
	font-size: var(--h1);
	line-height: 90%;
	letter-spacing: -0.02em;
	text-transform: uppercase;
}
h2, .h2 {
	display: block;
	font-family: 'Bebas Neue';
	font-weight: 400;
	font-size: var(--h2);
	line-height: 90%;
	letter-spacing: -0.02em;
	text-transform: uppercase;
}
h3, .h3 {
	display: block;
	font-family: 'Bebas Neue';
	font-weight: 400;
	font-size: var(--h3);
	line-height: 100%;
	letter-spacing: -0.02em;
	text-transform: uppercase;
}
h4, .h4 {
	display: block;
	font-weight: 400;
	font-size: var(--h4);
	line-height: 120%;
	letter-spacing: -0.05em;
}
h5, .h5 {
	display: block;
	font-weight: 400;
	font-size: var(--h5);
	line-height: 120%;
	letter-spacing: -0.05em;
}
h6, .h6 {
	display: block;
	font-weight: 400;
	font-size: var(--h6);
	line-height: 120%;
	letter-spacing: -0.05em;
}
a {transition: all .3s linear;}
p {margin: 0 0 max(17px, 24rem);}
p:last-child {margin: 0;}
.center {text-align: center;}
.upper {text-transform: uppercase;}
.button-holder {text-align: center;}
.button {
	position: relative;
	display: inline-block;
	padding: max(17px, 22rem) max(50px, 60rem);
	color: var(--white);
	font-size: var(--button);
	line-height: 120%;
	letter-spacing: -0.03em;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	background: var(--red);
	border: 1px solid var(--red);
	transition: all .25s linear;
}
.button::before {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 0%;
	content: '';
	background: var(--white);
	opacity: 0;
	transition: all .25s linear;
}
.button span {
	position: relative;
}
.button:hover::before {
  	width: 100%;
	opacity: 1;
}
.button:hover {
	color: var(--black);
	border: 1px solid var(--black);
}
.button-dark {
	background: none;
}
.button-dark::before {
	left: auto;
	right: 0;
	width: 100%;
	opacity: 1;
	background: var(--red);
	transition: all 0.25s linear, opacity 0.25s linear 0.1s;
}
.button-dark:hover {
	color: var(--white);
	border: 1px solid var(--white);
}
.button-dark:hover::before {
  	width: 0%;
	opacity: 0;
}
.button-icon {
	display: inline-flex;
	align-items: center;
	gap: max(12px, 20rem);
	padding: 5px;
}
.button-icon span {
	padding: 1px 30px 0 0;
}
.icon-wrap {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: max(42px, 54rem);
	height: max(42px, 54rem);
}
.icon-wrap svg {
	width: max(19px, 24rem);
	height: max(19px, 24rem);
}
.icon-wrap path {
	transition: all .25s linear;
}
.button-icon:hover path {
	stroke: var(--black);
}
/************************* form-block *************************/
.wpcf7-form-control-wrap input {
	display: block;
	width: 100%;
	height: max(53px, 70rem);
	padding: 0 max(23px, 39rem);
	margin: 0 0 max(8px, 16rem);
	font-size: max(14px, 20rem);
	color: var(--black);
	background: #f0eff1;
	border: 1px solid #f0eff1;
}
.wpcf7-form-control-wrap textarea {
	display: block;
	width: 100%;
	height: max(166px, 267rem);
	padding: max(18px, 26rem) max(23px, 39rem);
	margin: 0 0 max(8px, 16rem);
	font-size: max(14px, 20rem);
	color: var(--black);
	resize: vertical;
	background: #f0eff1;
	border: 1px solid #f0eff1;
}
.inactive {
	opacity: 0.4;
	pointer-events: none;
}
::-webkit-input-placeholder {color: rgba(23, 23, 23, 0.5);}
:-moz-placeholder {color: rgba(23, 23, 23, 0.5); opacity: 1;}
::-moz-placeholder {color: rgba(23, 23, 23, 0.5); opacity: 1;}
:-ms-input-placeholder {color: rgba(23, 23, 23, 0.5);}
.wpcf7-form-control-wrap.error input,
.wpcf7-form-control-wrap.error textarea {
	color: rgba(184, 1, 0, 0.5);
	border: 1px solid #b80100;
}
.wpcf7-form-control-wrap.error ::-webkit-input-placeholder {color: rgba(184, 1, 0, 0.5);}
.wpcf7-form-control-wrap.error :-moz-placeholder {color: rgba(184, 1, 0, 0.5); opacity: 1;}
.wpcf7-form-control-wrap.error ::-moz-placeholder {color: rgba(184, 1, 0, 0.5); opacity: 1;}
.wpcf7-form-control-wrap.error :-ms-input-placeholder {color: rgba(184, 1, 0, 0.5);}
.form-button {
	padding: max(8px, 24rem) 0 0;
}
.error-msg {
	display: none;
	margin: 0 0 max(8px, 16rem);
	font-size: max(12px, 14rem);
	color: var(--red);
}
.error .error-msg {
	display: block;
}
/************************* wrapper *************************/
#wrapper {
	position: relative;
	overflow: hidden;
}
/************************* header *************************/
.header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 300;
	padding: 0 20px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.2);
	transition: background-color 0.2s linear, top 0.2s linear;
}
.header-block {
	display: flex;
	align-items: center;
	position: relative;
	height: max(90px, 110rem);
}
.header-logo {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
.header-logo img {
	width: max(141px, 198rem);
	transition: all 0.2s linear;
}
.logo-black {display: none;}
.logo-mob {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
}
.header-nav .button {
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	background: none;
	border-color: var(--white_2);
}
.header-nav {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1;
}
.header-nav-bg {display: none;}
.header-nav-list {
	display: flex;
	align-items: center;
	gap: max(36px, 48rem);
}
.header-nav-list a {
	position: relative;
	font-size: var(--button);
	line-height: 90%;
	letter-spacing: -0.03em;
	color: var(--white_2);
	text-decoration: none;
}
.header-nav-list a::after {
	position: absolute;
	left: 0;
	bottom: -1px;
	content: '';
	height: 1px;
	background: var(--white_2);	
	transform: scaleX(0);
    transform-origin: right;
    transition: transform 1s var(--ease-out-expo);
    width: 100%;
}
.header-nav-list a:hover {
	opacity: 1;
}
.header-nav-list a:hover::after {
	transform: scaleX(1);
	transform-origin: left;
}
.header-nav-list a {
	opacity: 0.5;
}
.header-nav-list > li > .active {
	opacity: 1;
}
.header-nav-list > li > .active::after,
.subnav-list a.active::after {
	display: none;
}
.subnav {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	height: max(60px, 78rem);
	margin: 1px -20px 0;
	display: flex;
	align-items: center;
	justify-content: center;
	border-bottom: 1px solid rgba(255, 255, 255, 0.2);
	transition: background-color 0.2s linear;
}
.subnav-list {
	display: flex;
	align-items: center;
	gap: max(36px, 48rem);
}
.subnav-title {
	position: absolute;
	top: 50%;
	left: 20px;
	transform: translateY(-50%);
	font-size: var(--button);
	line-height: 90%;
	letter-spacing: -0.03em;
	color: var(--white_2);
	opacity: 0.7;
}
.header.header-black,
.header-black .subnav {
	border-bottom: 1px solid rgba(23, 23, 23, 0.1);
}
.header-black .header-nav-list a {
    color: var(--black);
}
.header-black .header-nav-list > li > a {
	opacity: 0.5;
}
.header-black .header-nav-list > li > a:hover {
	opacity: 1;
}
.header-black .header-nav-list > li > .active,
.header-black .subnav-list a.active {
	opacity: 1;
}
.header-black .header-nav-list a::after {
	background: var(--black);	
}
.header-black .subnav-title {
    color: var(--black);
}
.header-black .logo-white {display: none;}
.header-black .logo-black {display: block;}
.header-black .header-nav .button {
	color: var(--black);
    border-color: var(--black);
}
.header-black .button::before {
	background: var(--black);
}
.header-black .header-nav .button:hover {
	color: var(--white);
	border: 1px solid var(--black);
}

.header-up {
	top: min(-91px, -111rem);
}
.header-fixed,
.header-fixed .subnav {
	background: var(--white);
	border-bottom: 1px solid rgba(23, 23, 23, 0.1);
}
.header-fixed .header-nav-list a {
    color: var(--black);
}
.header-fixed .header-nav-list a::after {
	background: var(--black);	
}
.header-fixed .subnav-title {
    color: var(--black);
}
.header-fixed .logo-white {display: none;}
.header-fixed .logo-black {display: block;}
.header-fixed .header-nav .button {
	color: var(--black);
    border-color: var(--black);
}
.header-fixed .button::before {
	background: var(--black);
}
.header-fixed .header-nav .button:hover {
	color: var(--white);
	border: 1px solid var(--black);
}


.mob-nav-icon {
	position: relative;
	z-index: 550;
	display: none;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border: 1px solid var(--white_2);
}
.mob-nav-block {
    position: relative;
	display: block;
    width: 18px;
    height: 1px;
	transition: all .3s linear;
}
.mob-nav-block:after {
    content: "";
    position: absolute;
    top: -3px;
    left: 0;
    width: 18px;
    height: 1px;
    background: var(--white_2);
	transition: all .3s linear;
}
.mob-nav-block:before {
    content: "";
    position: absolute;
    top: 3px;
    left: 0;
    width: 18px;
    height: 1px;
    background: var(--white_2);
	transition: all .3s linear;
}
.mob-nav-icon.active .mob-nav-block {
    background: none;
}
.mob-nav-icon.active .mob-nav-block:before {
    top: 0;
    transform: rotate(45deg);
}
.mob-nav-icon.active .mob-nav-block:after {
    top: 0;
    transform: rotate(-45deg);
}
.header-black .mob-nav-block:after,
.header-black .mob-nav-block:before {
	background: var(--black);
}
.header-black .mob-nav-icon {
	border: 1px solid rgba(23, 23, 23, 0.5);
}
.header-black .mob-nav-icon.active .mob-nav-block:after,
.header-black .mob-nav-icon.active .mob-nav-block:before {
	background: var(--white_2);
}
.header-fixed .mob-nav-block:after,
.header-fixed .mob-nav-block:before {
	background: var(--black);
}
.header-fixed .mob-nav-icon {
	border: 1px solid rgba(23, 23, 23, 0.5);
}
.header-fixed .mob-nav-icon.active .mob-nav-block:after,
.header-fixed .mob-nav-icon.active .mob-nav-block:before {
	background: var(--white_2);
}
/************************* hero *************************/
.hero {
	position: relative;
	height: max(680px, 1150rem);
	max-height: 100dvh;
	margin: 0 0 max(96px, 210rem);
}
.hero-bg {
	width: 100%;
	height: max(680px, 1150rem);
	max-height: 100dvh;
	object-fit: cover;
}
.hero::before {
	position: absolute;
	inset: 0;
	content: '';
	background: linear-gradient(1.02deg, rgba(0, 0, 0, 0.06) 83.12%, rgba(0, 0, 0, 0.6) 99.02%), linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
}
.hero-wrap {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
	padding: 0 20px max(36px, 60rem);
	color: var(--white);
	text-align: center;
}
.hero-wrap h1 {
	width: 100%;
	padding: 0 0 11px;
}
.hero-wrap h1:last-child {padding: 0;}
.hero-text {
	max-width: max(440px, 614rem);
	margin: 0 0 max(24px, 60rem);
}
.hero-text:last-child {margin: 0;}
.hero-text-2 {
	max-width: max(360px, 506rem);
}
.hero-3 h1 {
	max-width: max(480px, 1500rem);
}

/************************* main-catalog *************************/
.main-catalog-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 0 0 max(36px, 40rem);
}

/************************* locations *************************/
.loc {
	padding: max(96px, 210rem) 0 0;
	color: var(--white_2);
	text-align: center;
	background: var(--black);
}
.loc h2 {
	margin: 0 0 max(24px, 30rem);
	font-size: max(58px, 150rem);
}
.loc-text {
	max-width: max(300px, 426rem);
	margin: 0 auto max(30px, 40rem);
	color: rgba(255, 255, 255, 0.5);
}
.loc-text::selection {
	color: var(--white_2);
}
.loc-map img {
	width: max(800px, 1180rem);
}
.loc-button {
	position: relative;
	z-index: 10;
	margin: 0 0 min(-30px, -40rem);
}

/************************* year *************************/
.year {
	text-align: center;
}
.year-logo {
	margin: 0 0 max(24px, 36rem);
}
.year-logo img {
	width: max(145px, 260rem);
}
.year-text {
	margin: 0 0 max(14px, 17rem);
	font-size: var(--caption);
	color: rgba(23, 23, 23, 0.5);
}
.year h2 {
	margin: 0 0 10px;
	font-size: max(58px, 150rem);
}
.year-img {
	margin: 0 -20px;
}
.year-img img {
	width: 100%;
	min-height: 232px;
	object-fit: cover;
}

/************************* box *************************/
.box {
	position: relative;
}
.box-item {
	display: flex;
	justify-content: flex-end;
}
.box-next {
	position: absolute;
	top: 0;
	right: 0;
	width: 0%;
	overflow: hidden;
}
.box-inner {
	position: relative;
	width: 100dvw;
	min-width: 100dvw;
	height: 100dvh;
}
.box-bg {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.box-wrap {
	position: absolute;
	inset: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	color: var(--white_2);
	text-align: center;
}
.box-caption {
	margin: 0 0 max(18px, 30rem);
	font-size: var(--caption);
	color: rgba(255, 255, 255, 0.7);
}
.box-wrap h2 {
	width: 100%;
	margin: 0 0 max(24px, 30rem);
    font-size: max(58px, 150rem);
}
.box-text {
	max-width: max(320px, 460rem);
}
.box-line {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	z-index: 20;
	width: 30px;
	background: var(--white_2);
}




/************************* section *************************/
.section {
	margin: 0 0 max(96px, 210rem);
}

/************************* steps *************************/
.steps-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 0 max(36px, 50rem);
}
.steps-top h3 {
	flex: 1;
	width: 100%;
}
.steps-block {
	display: flex;
	flex-wrap: wrap;
	gap: 36px 0;
	margin: 0 -10px;
	counter-reset: steps;
}
.steps-col {
	width: 33.33%;
	padding: 0 10px;
	counter-increment: steps;
}
.steps-col h5 {
	padding: max(24px, 30rem) 0;
	border-top: 1px solid rgba(23, 23, 23, 0.1);
}
.steps-col h5::before {
	padding-right: max(8px, 16rem);
	content: counter(steps, decimal-leading-zero) '.';
	color: rgba(23, 23, 23, 0.4);
}
.steps-img {
	margin: 0 0 max(24px, 30rem);
}
.steps-img img {
	width: 100%;
	height: max(332px, 500rem);
	min-height: 332px;
	object-fit: cover;
}
.steps-text {
	max-width: max(330px, 450rem);
}

/************************* banner *************************/
.banner {
	position: relative;
}
.banner-img {
	width: 100%;
	height: max(490px, 760rem);
	min-height: 680px;
	object-fit: cover;
}
.banner-product .banner-img {
	min-height: 490px;
}
.banner-wrap {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 20px;
	color: var(--white);
	text-align: center;
}
.banner-wrap h2 {
	width: 100%;
}

/************************* form-block *************************/
.form-block {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 36px 0;
}
.form-col {
	width: calc(50% - 10px);
}
.form-col h3 {
	margin: 0 0 max(24px, 30rem);
}
.form-text {
	max-width: max(360px, 510rem);
	color: rgba(23, 23, 23, 0.6);
}

/************************* side-block *************************/
.side-block {
	display: flex;
}
.side-content {
	width: 37.2%;
	padding: 0 40px 0 0;
}
.side-content h3 {
	width: 100%;
	max-width: max(240px, 500rem);
	margin: 0 0 max(24px, 60rem);
}
.side-photo {
	width: 62.8%;
}
.side-photo img {
	width: 100%;
	height: max(490px, 760rem);
	min-height: 490px;
	object-fit: cover;
}
.side-text {
	max-width: max(310px, 450rem);
}
.side-text a {
	color: #b80100;
	text-decoration: none;
}

/************************* info *************************/
.info-top {
	margin: 0 0 max(48px, 160rem);
	text-align: center;
}
.info-top-note {
	margin: 0 0 max(18px, 30rem);
	font-size: var(--caption);
	line-height: 120%;
	color: rgba(23, 23, 23, 0.3);
}
.info-top h2 {
	margin: 0 0 max(24px, 40rem);
}
.info-top-note:last-child,
.info-top h2:last-child {margin: 0;}
.info-top-text {
	max-width: max(360px, 512rem);
	margin: 0 auto;
}
.info-block {
	display: flex;
	flex-wrap: wrap;
	gap: 32px 0;
	margin: 0 -16px;
	padding: 0 0 max(48px, 70rem);
	counter-reset: steps;
}
.info-col {
	position: relative;
	width: 33.33%;
	padding: 0 16px;
	counter-increment: steps;
}
.info-col::before {
	display: block;
	padding-left: max(14px, 28rem);
	margin: 0 0 max(24px, 30rem);
	content: counter(steps, decimal-leading-zero);
}
.info-col::after {
	position: absolute;
	top: 3px;
	left: 16px;
	content: '';
	width: max(8px, 16rem);
	height: max(8px, 16rem);
	background: var(--red);
	border-radius: 50%;
}
.info-col h5 {
	padding: max(24px, 30rem) 0 max(12px, 20rem);
	border-top: 1px solid rgba(23, 23, 23, 0.1);
}
.info-text {
	max-width: max(270px, 373rem);
	color: rgba(23, 23, 23, 0.5);
}
.info-banner {
	margin: 0 -20px;
}
.info-banner img {
	width: 100%;
	height: max(490px, 760rem);
	min-height: 490px;
	object-fit: cover;
}
.info-video {
	width: 100%;
	height: max(490px, 760rem);
	min-height: 490px;
	object-fit: cover;
}

/************************* why *************************/
.why h3 {
	margin: 0 0 max(36px, 50rem);
}
.why-block {
	display: flex;
	flex-wrap: wrap;
	gap: 20px 0;
	margin: 0 -10px;
	counter-reset: steps;
}
.why-col {
	width: 50%;
	padding: 0 10px;
	counter-increment: steps;
}
.why-item {
	display: flex;
	flex-direction: column;
	height: 360px;
	padding: max(18px, 30rem);
	background: #f0eff1;
}
.why-item::before {
	display: flex;
	align-items: center;
	justify-content: center;
	width: max(48px, 83rem);
	height: max(48px, 83rem);
	padding: 2px 0 0;
	box-sizing: border-box;
	font-family: 'Bebas Neue';
    font-weight: 400;
    font-size: max(24px, 32rem);
	line-height: 90%;
	letter-spacing: -0.02em;
	content: counter(steps, decimal-leading-zero);
	background: var(--white_2);
}
.why-item h4 {
	margin: auto 0 19px;
}
.why-text {
	max-width: max(480px, 646rem);
	color: rgba(23, 23, 23, 0.5);
}

/************************* benefit *************************/
.benefit h3 {
	margin: 0 0 max(36px, 50rem);
}
.benefit-block {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.benefit-col {
	width: calc(50% - 10px);
}
.benefit-img {
	max-width: max(400px, 475rem);
}
.benefit-img img {
	width: 100%;
}
.benefit-list {
	counter-reset: steps;
	border-top: 1px solid rgba(23, 23, 23, 0.1);
}
.benefit-item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	counter-increment: steps;
	padding: max(17px, 20rem) 0;
	border-bottom: 1px solid rgba(23, 23, 23, 0.1);
}
.benefit-item::after {
	display: flex;
	align-items: center;
	justify-content: center;
	width: max(48px, 83rem);
	height: max(48px, 83rem);
	padding: 2px 0 0;
	box-sizing: border-box;
	font-family: 'Bebas Neue';
    font-weight: 400;
    font-size: max(24px, 32rem);
	line-height: 90%;
	letter-spacing: -0.02em;
	content: counter(steps, decimal-leading-zero);
	background: var(--white_2);
}

/************************* contact *************************/
.contact {
	padding: max(220px, 297rem) 0 0;
}
.contact h2 {
	margin: 0 0 max(16px, 30rem);
	font-size: max(58px, 130rem);
	line-height: 90%;
	letter-spacing: -0.02em;
}
.contact-text {
	max-width: max(307px, 510rem);
	font-size: max(12px, 20rem);
}
.input-line {
	display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: max(10px, 20rem);
}
.form-result {
	display: none;
	text-align: center;
}
.form-result .contact-text {
	margin: 0 auto;
}
.form-sent .form-block {
	display: none;
}
.form-sent .form-result {
	display: block;
}

/************************* catalog *************************/
.catalog h3 {
	margin: 0 0 max(36px, 40rem);
}
.catalog-block {
	display: flex;
	flex-wrap: wrap;
	gap: 20px 0;
	margin: 0 -10px;
}
.catalog-col {
	width: 50%;
	padding: 0 10px;
}
.catalog-col-big {
	width: 100%;
}
.catalog-item {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	height: max(426px, 660rem);
	padding: max(18px, 30rem);
	color: var(--black);
	text-decoration: none;
	background: rgba(23, 23, 23, 0.03);
}
.catalog-photo {
	max-width: max(400px, 594rem);
	width: 100%;
}
.catalog-col-big .catalog-photo {
	max-width: max(700px, 1130rem);
}
.catalog-photo img {
	width: 100%;
	transition: all 0.5s ease-in-out;
	transform-origin: 50% 0%;
}
.catalog-item:hover .catalog-photo img {
	transform: scale(1.1);
}
.catalog-col-big .catalog-item:hover .catalog-photo img {
	transform: scale(1.05);
}
.catalog-spec {
	position: absolute;
	top: max(18px, 30rem);
	left: max(18px, 30rem);
	right: max(18px, 30rem);
	z-index: 10;
}
.catalog-spec-text {
	margin: 0 0 max(12px, 18rem);
	font-size: max(12px, 20rem);
	line-height: 120%;
	letter-spacing: -0.03em;
	opacity: 0.3;
}
.catalog-spec-block {
	display: flex;
	flex-wrap: wrap;
	gap: max(4px, 16rem);
}
.catalog-spec-item {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: max(38px, 48rem);
	padding: 2px 12px 0;
	line-height: 120%;
	letter-spacing: -0.03em;
	background: var(--white_2);
	transition: all 0.3s linear;
}
.main-catalog .catalog-spec-item:hover {
	color: var(--white_2);
	background: var(--black);
}
.catalog-name {
	position: absolute;
	bottom: max(18px, 30rem);
	left: max(18px, 30rem);
	right: max(18px, 30rem);
	z-index: 10;
	font-size: var(--h5);
	line-height: 110%;
	letter-spacing: -0.05em;
}
.catalog-models {display: none;}
.catalog-banner {
	flex-direction: column;
	text-align: center;
	color: var(--white_2);
	background: var(--black);
}
.catalog-banner-icon {
	height: max(51px, 76rem);
	margin: 0 0 max(19px, 45rem);
	margin-top: min(-70px, -111rem);
}

/************************* review *************************/
.review {
	position: relative;
}
.review-top {
	position: absolute;
	top: 0;
	left: 0;
	width: 33.33%;
	padding: max(30px, 60rem) 0 0;
}
.review-top-text {
	margin: 0 0 max(18px, 32rem);
	font-size: var(--caption);
	color: rgba(23, 23, 23, 0.3);
}
.review-block {
	display: flex;
	flex-direction: row-reverse;
	margin: 0 -20px;
	padding: 0 20px;
	border-top: 1px solid rgba(23, 23, 23, 0.1);
	border-bottom: 1px solid rgba(23, 23, 23, 0.1);
}
.review-main {
	width: 66.66%;
	padding: 20px 0 20px 20px;
}
.review-side {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	width: 33.33%;
	padding: 20px 20px 20px 0;
	border-right: 1px solid rgba(23, 23, 23, 0.1);
}
.review-photo {
	width: calc(100% + 20px);
}
.review-photo-slide {
	padding: 0 20px 0 0;
}
.review-photo img {
	width: max(460px, 760rem);
	height: max(475px, 675rem);
	object-fit: cover;
}
.review-slider {
	margin: 0 0 max(24px, 36rem);
}
.review-name {
	font-size: max(24px, 28rem);
	margin: 0 0 max(12px, 16rem);
}
.review-text {
	max-width: max(290px, 390rem);
	opacity: 0.5;
}
.review-controls {
	display: flex;
	align-items: flex-end;
	gap: 10px;
}
.review-arrow {
	position: relative;
	width: max(48px, 50rem);
	height: max(48px, 50rem);
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--black);
	border: 1px solid var(--black);
}
.review-arrow::before {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 0%;
	content: '';
	background: var(--white);
	opacity: 0;
	transition: all .25s linear;
}
.review-arrow:hover::before {
	width: 100%;
	opacity: 1;
}
.review-arrow svg {
	position: relative;
}
.review-arrow path {
	transition: all .25s linear;
}
.review-arrow:hover path {
	stroke: var(--black);
}
.review-num {
	display: flex;
	align-items: center;
	margin: 0 0 0 auto;
	font-size: max(14px, 18rem);
	opacity: 0.3;
}

/************************* specs *************************/
.specs h3 {
	margin: 0 0 max(36px, 60rem);
}
.specs-block {
	border-top: 1px solid rgba(23, 23, 23, 0.1);
}
.specs-item {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: max(20px, 30rem) 0;
	border-bottom: 1px solid rgba(23, 23, 23, 0.1);
}
.specs-col {
	width: calc(50% - 10px);
}
.specs-col h5 {
	font-size: max(20px, 24rem);
}
.specs-subtitle {
	margin: 0 0 12px;
	font-size: var(--big_body);
	color: rgba(23, 23, 23, 0.5);
}
.specs-list {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0 0 max(20px, 30rem);
	font-size: var(--big_body);
}
.specs-list:last-child {margin: 0;}

/************************* specs *************************/
.keys h3 {
	max-width: max(240px, 760rem);
	margin: 0 0 max(36px, 40rem);
}
.keys .keys-slider {
	margin: 0 -20px;
	padding: 0 20px;
}
.keys-slider .swiper-slide {
	width: calc(max(343px, 457rem) + 20px);
}
.keys-slider .swiper-slide:last-child {
	width: max(343px, 457rem);
}
.swiper-button-disabled {
	opacity: 0.3;
	pointer-events: none;
}
.keys-item {
	display: flex;
	flex-direction: column;
	width: max(343px, 457rem);
	height: max(358px, 500rem);
	padding: max(18px, 30rem);
	background: #f0eff1;
}
.keys-num {
	display: flex;
	align-items: center;
	justify-content: center;
	width: max(48px, 83rem);
	height: max(48px, 83rem);
	padding: 2px 0 0;
	box-sizing: border-box;
	font-family: 'Bebas Neue';
    font-weight: 400;
    font-size: max(24px, 32rem);
	line-height: 90%;
	letter-spacing: -0.02em;
	background: var(--white_2);
}
.keys-item h4 {
	margin: auto 0 19px;
}
.keys-text {
	max-width: max(310px, 440rem);
	color: rgba(23, 23, 23, 0.5);
}
.keys-wrap {
	position: relative;
}
.keys-arrows {
	display: flex;
	gap: 10px;
	position: absolute;
	right: 0;
	top: min(-90px, -145rem);
}
.keys-arrow {
	position: relative;
	width: max(48px, 70rem);
	height: max(48px, 70rem);
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--black);
	border: 1px solid var(--black);
}
.keys-arrow::before {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 0%;
	content: '';
	background: var(--white);
	opacity: 0;
	transition: all .25s linear;
}
.keys-arrow:hover::before {
	width: 100%;
	opacity: 1;
}
.keys-arrow svg {
	position: relative;
}
.keys-arrow path {
	transition: all .25s linear;
}
.keys-arrow:hover path {
	stroke: var(--black);
}

/************************* product-info *************************/
.product-info {
	display: flex;
}
.product-info-side {
	width: 33.7%;
	padding: 0 20px 0 0;
	display: flex;
	flex-direction: column;
}
.product-info-side h3 {
	margin: 0 0 max(24px, 30rem);
}
.product-info-text {
	max-width: max(380px, 510rem);
	margin: 0 0 48px;
}
.product-info-img {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 66.3%;
	height: max(620px, 820rem);
	background: #f0eff1;
}
.product-info-img img {
	width: 100%;
	max-width: max(550px, 1055rem);
}
.faq {
	margin: auto 0 0;
	border-bottom: 1px solid rgba(23, 23, 23, 0.1);
}
.faq-item {
	padding: max(14px, 18rem) 0;
	border-top: 1px solid rgba(23, 23, 23, 0.1);
}
.faq-top {
	display: block;
	position: relative;
	padding: 10px 30px 10px 0;
	font-size: max(20px, 24rem);
	color: #171717;
	text-decoration: none;
	-webkit-tap-highlight-color: transparent;
}
.faq-top::before {
	position: absolute;
	top: 50%;
	right: 0;
	content: '';
	width: max(24px, 28rem);
	height: max(24px, 28rem);
	margin-top: min(-11px, -13rem);
	background: url(../images/chevron-down.svg) 50% 50% no-repeat;
	background-size: contain;
	transition: all 0.3s linear;
}
.faq-top.active::before {
	transform: rotate(180deg);
}
.faq-top:focus {
	background: none;
}
.faq-hidden {
	display: none;
	max-width: max(300px, 370rem);
	padding: 10px 0;
	color: rgba(23, 23, 23, 0.5);
}
.faq-hidden.vis {
	display: block;
}

/************************* allspecs *************************/
.allspecs {
	text-align: center;
}
.allspecs h3 {
	width: 100%;
}
.allspecs-top {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: max(24px, 36rem);
	margin: 0 0 max(36px, 60rem);
}
.allspecs-text {
	width: 100%;
	max-width: max(400px, 520rem);
}

/************************* footer *************************/
.product {
	padding: max(200px, 257rem) 0 0;
}
.product-category {
	margin: 0 0 max(18px, 50rem);
	font-size: max(12px, 20rem);
	text-align: center;
}
.product-category a {
	position: relative;
	color: rgba(23, 23, 23, 0.5);
	text-decoration: none;
}
.product-category a::after {
	position: absolute;
	left: 0;
	bottom: -1px;
	content: '';
	height: 1px;
	background: var(--black);	
	transform: scaleX(0);
    transform-origin: right;
    transition: transform 1s var(--ease-out-expo);
    width: 100%;
	opacity: 0.5;
}
.product-category a:hover::after {
	transform: scaleX(1);
	transform-origin: left;
}
.product h2 {
	margin: 0 0 20px;
	text-align: center;
}
.product-stat {
	display: flex;
	justify-content: center;
	gap: 10px;
}
.product-stat-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: max(80px, 138rem);
	text-align: center;
}
.product-stat-icon {
	margin: 0 0 17px;
}
.product-stat-icon img {
	display: block;
	width: max(48px, 64rem);
}
.product-stat-text {
	font-size: max(12px, 20rem);
}
.product-stat-text span {
	display: block;
	opacity: 0.5;
}
.product-img {
	padding: 32px 0 0;
	margin: 0 -20px;
}
.product-img img {
	width: 100%;
	min-height: 270px;
	object-fit: cover;
}
.fixed-bar {
	position: fixed;
	left: 16px;
	right: 16px;
	bottom: max(16px, 60rem);
	z-index: 200;
	display: flex;
	justify-content: center;
}
.fixed-bar-block {
	display: flex;
	max-width: max(720px, 906rem);
	width: 100%;
	gap: 12px;
}
.fixed-bar-trigger {display: none;}
.fixed-bar-nav {
	flex: 1;
	padding: max(18px, 23rem) 10px;
	background: #f0eff1;
}
.fixed-bar-wrap {
	display: flex;
	align-items: center;
}
.fixed-bar-item {
	flex: 1;
	text-align: center;
	border-left: 1px solid rgba(23, 23, 23, 0.1);
}
.fixed-bar-item:first-child {
	border-left: 0;
}
.fixed-bar-item a {
	font-size: var(--button);
	line-height: 90%;
	letter-spacing: -0.03em;
	text-align: center;
	color: rgba(23, 23, 23, 0.6);
	text-decoration: none;
}
.fixed-bar-item a:hover,
.fixed-bar-item.active a {
	color: rgba(23, 23, 23, 1);
}

/************************* page-404 *************************/
.page-404 {
	position: relative;
	padding: max(136px, 280rem) 0 max(376px, 662rem);
	text-align: center;
}
.page-404-bg {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 73px;
	height: max(308px, 714rem);
	background: url(../images/404-bg.jpg) 50% 50% no-repeat;
	background-size: cover;
}
.page-404-bg::before {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	content: '';
	height: max(100px, 200rem);
	background: linear-gradient(180deg, #F7F6F8 0%, rgba(255, 255, 255, 0) 100%);
}
.page-404 .holder {
	position: relative;
}
.page-404-num {
	margin: 0 0 20px;
	padding: 0 15px 0 0;
	font-family: 'Bebas Neue';
    font-weight: 400;
    font-size: max(140px, 400rem);
    line-height: 90%;
    letter-spacing: -0.02em;
    text-transform: uppercase
}

/************************* footer *************************/
.policy {
	padding: max(230px, 297rem) 0 0;
}
.policy h2 {
	margin: 0 0 max(72px, 110rem);
	text-align: center;
}
.policy-wrap {
	max-width: max(500px, 654rem);
	margin: 0 auto;
}
.policy h6 {
	margin: 0 0 24px;
	padding: 26px 0 0;
	font-size: max(24px, 28rem);
}
.policy ul {
	padding: 0 0 0 20px;
	margin: 0 0 max(17px, 24rem);
}
.policy ul li {
	list-style-type: disc;
}

/************************* footer *************************/
.footer {
	padding: 0 0 20px;
}
.footer-top {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 0 0 max(72px, 116rem);
}
.footer-col {
	width: calc(50% - 10px);
}
.footer-webs {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.footer-web {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: max(36px, 48rem);
	height: max(36px, 48rem);
	border: 1px solid rgba(23, 23, 23, 0.1);
}
.footer-web::before {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 0%;
	content: '';
	background: var(--red);
	opacity: 0;
	transition: all .25s linear;
}
.footer-web svg {
	position: relative;
	width: max(20px, 24rem);
	height: max(20px, 24rem);
}
.footer-web:hover::before {
  	width: 100%;
	opacity: 1;
}
.footer-web:hover {
	border: 1px solid var(--red);
}
.footer-web path {
	transition: all 0.25s linear;
}
.footer-web:hover path {
	stroke: var(--white);
}
.footer-nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.footer-nav-item.hidden {
	display: none;
}
.footer-title {
	margin: 0 0 max(16px, 24rem);
	font-size: var(--big_body);
}
.footer-nav-list {
	display: flex;
	flex-direction: column;
	gap: max(6px, 8rem);
}
.footer-nav-list a {
	position: relative;
	color: rgba(23, 23, 23, 0.5);
	text-decoration: none;
}
.footer-nav-list a::after {
	position: absolute;
	left: 0;
	bottom: -1px;
	content: '';
	height: 1px;
	background: var(--black);	
	transform: scaleX(0);
    transform-origin: right;
    transition: transform 1s var(--ease-out-expo);
    width: 100%;
}
.footer-nav-list a:hover {
	color: var(--black);
}
.footer-nav-list a:hover::after {
	transform: scaleX(1);
	transform-origin: left;
}
.footer-main {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 0 0 max(50px, 90rem);
}
.footer-col h3 {
	max-width: max(320px, 700rem);
	margin: 0 0 max(24px, 40rem);
	font-size: max(36px, 80rem);
}
.footer-video-wrap {
	overflow: hidden;
	position: relative;
	width: max(215px, 566rem);
	height: max(140px, 369rem);
	margin: min(-25px, -50rem) 0 0 min(-25px, -50rem);
	box-shadow: 0 0 5px #f3f3f5;
}
.footer-video {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 240%;
	height: 240%;
	transform: translate(-50%, -50%);
}
.footer-bottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-end;
}
.footer-info {
	display: flex;
	align-items: flex-end;
	gap: max(25px, 35rem);
}
.footer-link {
	position: relative;
	color: #171717;
	text-decoration: none;
}
.footer-link::after {
	position: absolute;
	left: 0;
	bottom: -1px;
	content: '';
	height: 1px;
	background: var(--black);	
	transform: scaleX(0);
    transform-origin: right;
    transition: transform 1s var(--ease-out-expo);
    width: 100%;
}
.footer-link:hover::after {
	transform: scaleX(1);
	transform-origin: left;
}
.footer-link img {
	display: inline-block;
	vertical-align: top;
	width: max(17px, 25rem);
	margin: 0 1px;
}
.footer-studio::after {
	display: none;
}
.footer-studio span {
	position: relative;
}
.footer-studio span::after {
	position: absolute;
	left: 0;
	bottom: -1px;
	content: '';
	height: 1px;
	background: var(--black);	
	transform: scaleX(0);
    transform-origin: right;
    transition: transform 1s var(--ease-out-expo);
    width: 100%;
}
.footer-studio:hover span::after {
	transform: scaleX(1);
	transform-origin: left;
}
.footer-icons {
	display: flex;
	align-items: center;
	gap: max(16px, 29rem);
	margin: 0 0 0 auto;
}
.footer-icons img {
	height: max(29px, 51rem);
}

/************************* animations *************************/
.fade {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.5s ease-in-out, transform 0.6s ease-in-out;
}
.fade.ani_start {
	opacity: 1;
	transform: translateY(0px);
}
.reveal {opacity: 0;}
.reveal.ani_start {opacity: 1;}
.text-wrap {
	overflow: hidden;
}
.text-inner {
	transition: transform 0.6s ease-in-out;
	transform: translateY(calc(100% + 20px));
}
.ani_start .text-inner {
	transform: translateY(0%);
}



/************************* media *************************/
@media screen and (max-width: 1480px) {
	
}
@media screen and (max-width: 1300px) {
	.footer-top .footer-col {
		width: 65%;
	}
	.footer-top .footer-col:first-child {
		width: 35%;
	}

}
@media screen and (max-width: 1024px) {
	.header {
		border-bottom: 0;
	}
	.header-up {
		top: 0;
	}
	.header-block {
		height: 80px;
		justify-content: space-between;
	}
	.header.header-black, .header-black .subnav {
		border-bottom: 0;
	}
	.header-logo {
		position: relative;
		top: auto;
		transform: none;
		z-index: 550;
	}
	.header-logo.vis img {
		opacity: 0;
		transition-delay: 0.3s;
	}
	.header-logo.vis .logo-mob {
		opacity: 1;
		transition-delay: 0.3s;
	}
	.mob-nav-icon {
		display: flex;
	}
	.mob-nav-icon.active {
		border: 1px solid rgba(255, 255, 255, 0.3);
	}
	body.lock {overflow: hidden;}
	.header-nav {
		display: flex;
        flex-direction: column;
		align-items: flex-start;
    	justify-content: flex-start;
        position: fixed;
        top: 0;
        left: 0;
		right: 0;
        margin: 0;
		z-index: 500;
		width: auto;
		height: 100%;
		transform: none;
        transition: all 0.5s ease-in-out;
        pointer-events: none;
        max-height: 0;
        overflow: hidden;
    }
	.header-nav.vis {
        pointer-events: all;
        max-height: 100dvh;
        padding: 36px 16px;
    }
	.header-nav-bg {
		position: absolute;
		top: 40px;
		right: 40px;
		width: 1px;
		height: 1px;
		display: block;
	}
	.header-nav-round {
		display: block;
		position: absolute;
		border-radius: 50%;
		width: 284vmax;
		height: 284vmax;
		top: -142vmax;
		left: -142vmax;
		transform: scale(0);
		transform-origin: 50% 50%;
		transition: transform 0.5s cubic-bezier(0.755, 0.05, 0.855, 0.06);
		will-change: transform;
		background: var(--red);
	}
	.header-nav.vis .header-nav-round {
		transform: scale(1);
	}
	.header-nav-list {
		flex-direction: column;
		align-items: flex-start;
		gap: 24px;
		width: 100%;
		margin: auto 0;
		opacity: 0;
        transform: translateY(-30px);
		transition: all 0.5s linear;
	}
	.header-nav.vis .header-nav-list {
		transition-delay: 0.4s;
		opacity: 1;
        transform: translateY(0);
	}
	.subnav {
		position: relative;
		top: auto;
		left: auto;
		right: auto;
		height: auto;
		margin: 0;
		flex-direction: column;
		border-bottom: 0;
	}
	.subnav-list {
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
		padding: 8px 0 0;
	}
	.header-nav .button {
		position: relative;
		top: auto;
		right: auto;
		transform: none;
		color: var(--black);
		background: var(--white_2);
		opacity: 0;
        transform: translateY(-30px);
		transition: all 0.5s linear;
	}
	.header-nav.vis .button {
		transition-delay: 0.4s;
		opacity: 1;
        transform: translateY(0);
	}
	.header-nav-list > li > a {
		font-family: 'Bebas Neue';
		font-weight: 400;
		font-size: 48px;
		line-height: 90%;
		letter-spacing: -0.02em;
		text-transform: uppercase;
	}
	.header-nav-list a {
		opacity: 1;
	}
	.header-nav-list a::after {
		display: none;
	}
	.subnav-list a {
		font-size: 18px;
		line-height: 120%;
	}
	.subnav-title {display: none;}
	.header-black .header-nav-list a {
		color: var(--white_2);
	}
	.header-black .header-nav-list > li > a {
		opacity: 1;
	}
	.header-black .header-nav .button {
		border-color: var(--white_2);
	}
	.header-black .button::before {
		background: var(--white_2);
	}
	.header-black .header-nav .button:hover {
		color: var(--black);
		border: 1px solid var(--white_2);
	}
	.header-fixed .header-nav-list a {
		color: var(--white_2);
	}
	.header-fixed .header-nav .button {
		border-color: var(--white_2);
	}
	.header-fixed .button::before {
		background: var(--white_2);
	}
	.header-fixed .header-nav .button:hover {
		color: var(--black);
		border: 1px solid var(--white_2);
	}
	.header-fixed .subnav {
		background: none;
		border-bottom: 0;
	}
	.footer-top .footer-col {
		width: 100%;
	}
	.footer-top .footer-col:first-child {
		display: none;
	}
	.footer-nav-item.hidden {
		display: block;
	}
	.footer-nav {
		flex-wrap: wrap;
		gap: 36px 0;
	}
	.footer-nav-item {
		width: 33.33%;
	}
	.footer-bottom .footer-col {
		width: 100%;
	}
	.steps-col {
		width: 50%;
	}
	.benefit-img {
		display: none;
	}
	.benefit-col {
		width: 100%;
	}
	.catalog-col {
		width: 100%;
	}
	.catalog-col-big .catalog-item:hover .catalog-photo img {
		transform: scale(1.1);
	}
	.review-top {
		position: static;
		width: auto;
		padding: 0 0 36px;
	}
	.review-block {
		display: block;
		border: 0;
	}
	.review-main {
		width: auto;
		padding: 0 0 24px;
	}
	.review-side {
		width: auto;
		padding: 0;
		border-right: 0;
	}
	.review-num {display: none;}
	.product-info {
		display: block;
	}
	.product-info-side {
		width: auto;
		padding: 0 0 48px;
	}
	.product-info-img {
		width: auto;
		height: max(286px, 820rem);
		padding: 7px;
	}
	.product {
		padding: max(136px, 257rem) 0 0;
	}
	.policy {
		padding: max(136px, 297rem) 0 0;
	}
	.box-line {
		width: 8px;
	}
	.contact {
		padding: 136px 0 0;
	}
	.contact .form-col {
		width: 100%;
	}

	
}
@media screen and (max-width: 767px) {
	.header {
		padding: 0 16px;
	}
	.footer {
		position: relative;
		padding: max(170px, 400rem) 0 5px;
	}
	.footer-col {
		width: 100%;
	}
	.footer-video-wrap {
		position: absolute;
		top: 0;
		left: 0;
		margin: 0 0 0 min(-5px, -20rem);
	}
	.side-block {
		display: block;
	}
	.side-content {
		width: auto;
		padding: 0 0 48px;
	}
	.side-photo {
		width: auto;
		margin: 0 -16px;
	}
	.info-col {
		position: relative;
		width: 100%;
		padding: 0 16px;
		counter-increment: steps;
	}
	.info-top {
		text-align: left;
	}
	.info-top-text {
		max-width: none;
		margin: 0;
	}
	.info-text {
		max-width: none;
	}
	.info-banner {
		margin: 0 -16px;
	}
	.loc-map {
		margin: 0 -16px;
	}
	.loc-map img {
		width: 100%;
		object-fit: cover;
		object-position: 50% 0%;
	}
	.steps-col {
		width: 100%;
	}
	.form-col {
		width: 100%;
	}
	.why-col {
		width: 100%;
	}
	.steps-top .button {
		display: none;
	}
	.catalog-block {
		gap: 16px 0;
	}
	.catalog-spec {display: none;}
	.catalog-models {display: block;}
	.review-photo {
		width: auto;
		margin: 0 -16px 0 0;
	}
	.review-photo-slide {
		padding: 0 16px 0 0;
	}
	.review-photo img {
		width: 100%;
		height: auto;
		min-height: 386px;
	}
	.keys-slider {
		margin: 0 -16px;
		padding: 0 16px;
	}
	.keys-slider .swiper-slide {
		width: calc(max(343px, 457rem) + 8px);
	}
	.keys-slider .swiper-slide:last-child {
		width: max(343px, 457rem);
	}
	.keys-item {
		width: 343px;
		height: 358px;
	}
	.keys-arrows {
		justify-content: center;
		position: relative;
		right: auto;
		top: auto;
		padding: 36px 0 0;
	}
	.specs-block {
		border-top: 0;
	}
	.specs-item {
		padding: 0 0 18px;
		margin: 0 0 36px;
	}
	.specs-item:last-child {
		margin: 0;
	}
	.specs-col {
		width: 100%;
	}
	.specs-col h5 {
		padding: 0 0 18px;
		margin: 0 0 18px;
		border-bottom: 1px solid rgba(23, 23, 23, 0.1);
	}
	.specs-list {
		margin: 0 0 32px;
	}
	.main-catalog {
		position: relative;
		padding: 0 0 89px;
	}
	.main-catalog-button {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
	}
	.main-catalog .catalog-spec {
        display: block;
    }
	.policy h2 {
		text-align: left;
	}
	.policy-wrap {
		max-width: none;
	}
	.policy h6 {
		padding: 33px 0 0;
	}
	.year-img {
		margin: 0 -16px;
	}
	.year h2 {
		margin: 0 0 20px;
	}
	.fixed-bar-block {
		justify-content: space-between;
		gap: 0;
	}
	.fixed-bar-block .button {
		width: calc(50% - 6px);
		padding: max(17px, 22rem) 10px;
	}
	.fixed-bar-nav {
		position: relative;
		width: calc(50% - 6px);
		flex: none;
		padding: 0;
	}
	.fixed-bar-wrap {
		display: none;
		position: absolute;
		left: 0;
		right: 0;
		bottom: 45px;
		padding: 15px 0 0;
		background: #f0eff1;
	}
	.fixed-bar-item {
		padding: 5px 0;
		border-left: 0;
	}
	.fixed-bar-item.active {display: none;}
	.fixed-bar-item a {
		display: block;
		padding: 5px 20px;
		text-align: left;
	}
	.fixed-bar-trigger {
		display: block;
		position: relative;
		padding: max(18px, 23rem) 20px;
		font-size: var(--button);
		line-height: 120%;
		letter-spacing: -0.03em;
		color: rgba(23, 23, 23, 1);
		text-decoration: none;
	}
	.fixed-bar-trigger::after {
		position: absolute;
		right: 14px;
		top: 50%;
		margin-top: -12px;
		width: 24px;
		height: 24px;
		content: '';
		background: url(../images/chevron-down.svg) 50% 50% no-repeat;
		background-size: contain;
		transform: rotate(180deg);
		transition: all 0.3s linear;
	}
	.fixed-bar-trigger.active::after {
		transform: rotate(0deg);
	}
	

}
@media screen and (max-width: 576px) {
	.footer-nav-item {
        width: 50%;
    }
	.button {
		width: 100%;
	}
	.button-icon {
		justify-content: center;
	}
	.footer-info {
		flex-direction: column;
		align-items: flex-start;
		gap: 6px;
		padding: 6px 0 0;
	}
	.footer-icons {
		padding: 15px 0 10px;
		margin: 0;
	}
	.page-404-bg {
		bottom: 86px;
	}
	.review-text {
		max-width: 85%;
	}
	.side-text,
	.steps-text {
		max-width: 90%;
	}
	.form-text {
		max-width: none;
	}
	.loc {
		position: relative;
	}
	.loc-text {
		margin: 0 auto;
	}
	.loc-map {
		display: flex;
		justify-content: center;
	}
	.loc-map img {
        width: auto;
		height: 462px;
    }
	.loc-button {
		position: absolute;
		left: 16px;
		right: 16px;
		bottom: 30px;
		z-index: 20;
		margin: 0;
	}
	.input-line {display: block;}
	.allspecs {
		text-align: left;
	}
	.allspecs h3 {
		max-width: 300px;
	}
	.allspecs-top {
		align-items: flex-start;
	}
	.allspecs-text {
		max-width: 320px;
	}

}
@media screen and (max-height: 780px) and (max-width: 576px) {
	.header-nav.vis {
        padding: 50px 16px 16px;
    }
	.header-nav-list {
        gap: 20px;
    }
	.header-nav-list > li > a {
        font-size: 40px;
    }
}
@media screen and (max-height: 700px) and (max-width: 576px) {
	.header-nav.vis {
        padding: 50px 16px 16px;
    }
	.header-nav-list > li > a {
        font-size: 32px;
    }
}