@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Manrope:wght@200..800&display=swap');
@font-face {
    font-family: 'FreightNeo Pro';
    src: url('../fonts/FreightNeoProBook-Italic.eot');
    src: url('../fonts/FreightNeoProBook-Italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/FreightNeoProBook-Italic.woff2') format('woff2'),
        url('../fonts/FreightNeoProBook-Italic.woff') format('woff'),
        url('../fonts/FreightNeoProBook-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Newsreader';
    src: url('../fonts/Newsreader60pt-Light.eot');
    src: url('../fonts/Newsreader60pt-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Newsreader60pt-Light.woff2') format('woff2'),
        url('../fonts/Newsreader60pt-Light.woff') format('woff'),
        url('../fonts/Newsreader60pt-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
:root{
	--cream: #f4f1ed;
	--desert: #d3c9b9;
	--white: #fff;
	--deep_ocean: #123245;
	--space: #000;
	--red: #ea0000;
	--cream_30: rgba(211, 201, 185, 0.3);
	--cream_50: rgba(211, 201, 185, 0.5);
	--deep_ocean_30: rgba(18, 50, 69, 0.3);
	--deep_ocean_50: rgba(18, 50, 69, 0.5);
	--space_30: rgba(0, 0, 0, 0.3);
	--space_50: rgba(0, 0, 0, 0.5);
	--desert_50: rgba(211, 201, 185, 0.5);
	--desert_30: rgba(211, 201, 185, 0.3);

	--grad-1: linear-gradient(180deg, rgba(18, 50, 69, 0.64) 5.12%, rgba(18, 50, 69, 0.16) 45.49%, rgba(5, 24, 34, 0.8) 88.25%);
	--grad-2: linear-gradient(43.51deg, #d3c9b9 20.53%, #b1a38f 51.53%, #d3c9b9 72.16%);
	--grad-3: linear-gradient(89.38deg, rgba(244, 241, 237, 0) 2.43%, #f4f1ed 100%);

	--font-family: "Inter", sans-serif;
  	--second-family: "Manrope", sans-serif;
  	--third-family: "Newsreader", sans-serif;
	--font5: "FreightNeo Pro", sans-serif;

	--h1: max(56px, 72rem);
	--h2: max(40px, 56rem);
	--h3: max(24px, 32rem);
	--h3_min: max(24px, 24rem);
	--h4: max(16px, 18rem);
	--h4_min: max(14px, 14rem);
	--h5: max(20px, 24rem);


	--text: max(16px, 18rem);
	--button: max(16px, 16rem);
	--caption: max(18px, 32rem);
	--digits: max(60px, 110rem);

    --eleos: cubic-bezier(0.625, 0.05, 0, 1);
	--slow: cubic-bezier(0.0, 0.0, 0.58, 1.0);
}
::selection {
	color: var(--cream);
	background-color: var(--deep_ocean);
}
.footer-bottom ::selection,
.footer-banner ::selection,
.hero ::selection,
.num ::selection {
	color: var(--deep_ocean);
	background-color: var(--cream);
}
/************************* reset *************************/
html{
	height: 100%;
	margin: 0;
	padding: 0;width: 100%;
	background: var(--cream);
	font-size: 0.0625vw;
	scrollbar-gutter: stable;
}
body{
	height: 100%;
	width: 100%;
	position: relative;
	margin: 0;
	padding: 0;
	color: var(--space);
	font-weight: 400;
	font-size: var(--text);
	line-height: 120%;
	letter-spacing: -0.02em;
	font-family: var(--font-family), Arial, Helvetica, sans-serif;
	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: var(--font-family), Arial, Helvetica, sans-serif;
	vertical-align:middle;
	border: 0;
	outline: 0;
	background: none;
}
a:hover {text-decoration: none;}
ul li {list-style: none;}
/************************* common styles *************************/
.holder {
	padding: 0 max(16px, 50rem);
}
h1, .h1 {
	display: block;
	font-family: var(--third-family);
	font-weight: 300;
	font-size: var(--h1);
	line-height: 110%;
	letter-spacing: -0.04em;
	color: var(--deep_ocean_50);
	transition: color 0.5s ease-in-out;
}
h2, .h2 {
	display: block;
	font-family: var(--third-family);
	font-weight: 300;
	font-size: var(--h2);
	line-height: 110%;
	letter-spacing: -0.04em;
	color: var(--deep_ocean_50);
	transition: color 0.5s ease-in-out;
}
h3, .h3 {
	display: block;
	font-family: var(--third-family);
	font-weight: 300;
	font-size: var(--h3);
	line-height: 100%;
	color: var(--deep_ocean);
}
h4, .h4 {
	display: block;
	font-family: var(--third-family);
	font-weight: 300;
	font-size: var(--h4);
	line-height: 120%;
	color: var(--deep_ocean);
}
h5, .h5 {
	display: block;
	font-weight: 400;
	font-size: var(--h5);
	line-height: 110%;
	letter-spacing: -0.04em;
	color: var(--deep_ocean);
}
h1.ani_start, h2.ani_start {
	color: var(--deep_ocean);
}
.subheading {
	display: block;
	font-weight: 600;
	font-size: var(--text);
	line-height: 120%;
	letter-spacing: -0.04em;
}
.caption {
	display: block;
	font-family: var(--font5);
	font-weight: 400;
	font-style: italic;
	font-size: var(--caption);
	line-height: 240%;
}
.digits {
	display: block;
	font-family: var(--third-family);
	font-weight: 300;
	font-size: var(--digits);
	line-height: 110%;
	letter-spacing: -0.04em;
}
a {transition: all 0.4s ease-in-out;}
p {margin: 0 0 max(19px, 22rem);}
p:last-child {margin: 0;}
p a, .article li a {color: var(--deep_ocean);}
.center {text-align: center;}
.upper {text-transform: uppercase;}
.button-holder {text-align: center;}
.button {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: max(16px, 16rem) max(24px, 24rem);
	gap: max(4px, 4rem);	
	font-weight: 400;
	font-size: var(--button);
	line-height: 120%;
	letter-spacing: 0;
	color: var(--cream);
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	cursor: pointer;
	background: var(--deep_ocean);
	border: 1px solid var(--deep_ocean);
	white-space: nowrap;
    overflow: hidden;
    --posX: -101%;
    --posY: -101%;
}
.button::before {
    content: "";
    display: block;
    position: absolute;
    width: 102%;
    height: 102%;
    top: 0%;
    left: 0;
    background: var(--cream);
    z-index: 1;
    transform: translate(var(--posX), var(--posY));
	pointer-events: none;
}
.button:hover {
	color: var(--deep_ocean);
	background-color: var(--cream);
}
.button:hover::before {
	background-color: var(--deep_ocean);
}
.button span {
    position: relative;
    display: block;
    z-index: 2;
    overflow-y: clip;
}

/************************* form-block *************************/
.wpcf7-form-control-wrap label {
	display: block;
	margin: 0 0 max(8px, 10rem);
}
.pink {color: var(--pink);}
.wpcf7-form-control-wrap input {
	display: block;
	width: 100%;
	height: max(42px, 42rem);
	padding: 0 max(10px, 10rem);
	margin: 0 0 max(20px, 24rem);
	font-size: var(--text);
	line-height: 120%;
	letter-spacing: -0.02em;
	color: var(--space);
	background: transparent;
	border-bottom: 1px solid var(--deep_ocean_30);
	transition: all 0.4s ease-in-out;
}
.wpcf7-form-control-wrap textarea {
	display: block;
	width: 100%;
	height: max(42px, 42rem);
	padding: max(10px, 10rem);
	margin: 0 0 max(20px, 24rem);
	font-size: var(--text);
	line-height: 120%;
	letter-spacing: -0.02em;
	resize: vertical;
	color: var(--space);
	background: transparent;
	border-bottom: 1px solid var(--deep_ocean_30);
	transition: all 0.4s ease-in-out;
}
.wpcf7-form-control-wrap input:hover,
.wpcf7-form-control-wrap textarea:hover,
.wpcf7-form-control-wrap input:focus,
.wpcf7-form-control-wrap textarea:focus {
	border-color: var(--deep_ocean);
}
.inactive {
	opacity: 0.4;
	pointer-events: none;
}
::-webkit-input-placeholder {color: var(--deep_ocean_50);}
:-moz-placeholder {color: var(--deep_ocean_50); opacity: 1;}
::-moz-placeholder {color: var(--deep_ocean_50); opacity: 1;}
:-ms-input-placeholder {color: var(--deep_ocean_50);}
.wpcf7-form-control-wrap.error input,
.wpcf7-form-control-wrap.error textarea {
	border-color: #cd0000;
}
.error-msg {
	display: none;
	margin: min(-10px, -14rem) 0 max(20px, 24rem);
	color: var(--red);
	font-size: max(16px, 16rem);
	line-height: 100%;
	letter-spacing: -0.02em;
}
.error .error-msg {
	display: block;
}
.input-box {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.input-box .wpcf7-form-control-wrap {
	width: calc(50% - max(5px, 5rem));
}
.check-item {
	position: relative;
	margin: 0 0 max(12px, 12rem);
}
.check-item:last-child {
	margin: 0;
}
.check-input {
	position: absolute;
	left: 0;
	width: 1px;
	height: 1px;
	opacity: 0;
}
.check-label {
	display: block;
	padding: max(1px, 1rem) 0 max(1px, 1rem) max(36px, 36rem);
	font-size: max(18px, 18rem);
	line-height: 120%;
	color: var(--deep_ocean);
	cursor: pointer;
}
.check-label:after {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	content: '';
	width: max(24px, 24rem);
	height: max(24px, 24rem);
	background: url(../images/checkbox.svg) 50% 50% no-repeat;
	background-size: contain;
}
.check-input:checked + .check-label:after {
	background: url(../images/checkbox-active.svg) 50% 50% no-repeat;
	background-size: contain;
}
.form-check {
	margin: 0 0 max(32px, 36rem);
}
.form-check .check-item {
	margin: 0 0 max(16px, 20rem);
}
.form-note {
	font-size: var(--min);
	line-height: 100%;
	letter-spacing: -0.02em;
	color: var(--ocean_50);
}
.form-note a {
	color: var(--blue);
	text-decoration: none;
}
.form-note a:hover {
	text-decoration: underline;
}
/************************* wrapper *************************/
#wrapper {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 100dvh;
	padding-top: max(154px, 228rem);
}
body.lock {overflow: hidden;}
/************************* header *************************/
.header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 300;
	transition: all 0.5s ease-in-out;
}
.header.animate {
	top: min(-64px, -76rem);
}
.header.ani_start {
	top: 0;
}
.header-delay.ani_start {
	transition-delay: 1s;
}
.header.header-up {
    top: min(-64px, -76rem);
	background: var(--cream);
}
.header-fixed {
	background: var(--cream);
}
.header-block {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: max(64px, 76rem);
	position: relative;
}
.header-logo {
	position: absolute;
	top: max(17px, 20rem);
	left: 50%;
	transform: translateX(-50%);
	z-index: 550;
}
.header-logo img {
	width: max(130px, 156rem);
	transition: all 0.4s ease-in;
}
.logo-white {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
}
.header-nav {
	flex: 1;
}
.header-nav-wrap {
	display: flex;
	align-items: center;
}
.header-nav-list {
	position: relative;
	flex: 1;
	display: flex;
	gap: max(32px, 32rem);
}
.header-nav-list > li {
	position: relative;
	display: flex;
	align-items: center;
	height: max(64px, 76rem);
}
.header-nav-list > li:nth-child(4) {
	margin-left: auto;
}
.nav-link {
	position: relative;
	display: flex;
	align-items: center;
	font-size: max(16px, 18rem);
	line-height: 120%;
	letter-spacing: -0.04em;
	color: var(--deep_ocean);
	text-decoration: none;
}
.nav-parent::after {
	content: '';
	width: max(18px, 18rem);
	height: max(18px, 18rem);
	margin: 0 0 0 max(6px, 6rem);
	background: url(../images/arrow-down.svg) 0 100% no-repeat;
	background-size: contain;
	transition: all 0.4s;
}
.nav-link:hover::after {
	transform: rotate(180deg);
}
.nav-link::before {
	position: absolute;
	left: 0;
	bottom: -2px;
	content: '';
	width: 100%;
	height: 1px;
	background: var(--deep_ocean);
	transition: transform 0.725s var(--eleos);
	transform-origin: 100% 50%;
	transform: scale(0, 1);
}
.nav-link:hover::before,
.active .nav-link::before {
	transform: scale(1);
	transform-origin: 0% 50%;
}

.subnav-bg {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 380px;
	background: var(--cream);
	transition: all 0.5s ease-in-out;
	opacity: 0;
	visibility: hidden;
}
.subnav-bg::before {
	position: absolute;
	top: max(64px, 76rem);
	left: 0;
	right: 0;
	content: '';
	border-top: 1px solid var(--deep_ocean_30);
}
.subnav-mask {
    position: fixed;
    inset: 0;
    background: var(--space_30);
    opacity: 0;
    visibility: hidden;
    transition: all 0.5s ease-in-out;
}
.subnav-bg.active {
	opacity: 1;
	visibility: visible;
}
.subnav-mask.active {
	opacity: 1;
    visibility: visible;
}
.header-nav-list > .subnav-big {
	position: static;
}
.subnav-big .subnav {
	right: 0;
}
.subnav {
	position: absolute;
	left: 0;
	top: 100%;
	padding: 32px 0 0;
	transition: all 0.5s ease-in-out;
	opacity: 0;
	visibility: hidden;
}
.subnav::before {
	position: absolute;
	left: 0;
	right: 0;
	top: min(-12px, -12rem);
	height: max(12px, 12rem);
	content: '';
}
.subnav-list {
	display: flex;
	flex-direction: column;
	gap: max(12px, 12rem);
}
.subnav-list a {
	position: relative;
	color: var(--deep_ocean);
	text-decoration: none;
	white-space: nowrap;
}
.subnav-list a::before {
	position: absolute;
	left: 0;
	bottom: -2px;
	content: '';
	width: 100%;
	height: 1px;
	background: var(--deep_ocean);
	transition: transform 0.725s var(--eleos);
	transform-origin: 100% 50%;
	transform: scale(0, 1);
}
.subnav-list a:hover::before {
	transform: scale(1);
	transform-origin: 0% 50%;
}
.subnav-block {
	display: flex;
	justify-content: space-between;
}
.subnav-block .subheading {
	margin: 0 0 max(22px, 22rem);
	color: var(--deep_ocean_50);
}
.subnav-mob-link {display: none;}
.nowrap {
	white-space: nowrap;
}
.nav-bottom {display: none;}

.header-white:not(.header-fixed, .subnav-open) .logo-def {opacity: 0;}
.header-white:not(.header-fixed, .subnav-open) .logo-white {opacity: 1;}
.header-white:not(.header-fixed, .subnav-open) .nav-link {color: var(--cream);}
.header-white:not(.header-fixed, .subnav-open) .nav-link::before {background-color: var(--cream);}
.header-white:not(.header-fixed, .subnav-open) .nav-parent::after {
    background: url(../images/arrow-down-white.svg) 0 100% no-repeat;
    background-size: contain;
}

@media screen and (min-width: 1025px){
	li:hover .nav-parent::after {transform: rotate(180deg);}
	li:hover .subnav {
		opacity: 1;
		visibility: visible;
		transform: translateY(0px);
	}
}

.mob-nav-icon {
	display: none;
	position: relative;
	z-index: 550;
	padding: 10px 0;
	margin: 0 0 0 auto;
}
.mob-nav-block {
    position: relative;
	display: block;
    width: 32px;
    height: 2px;
    margin: 8px 0;
	background: var(--deep_ocean);
	transition: all .3s linear;
}
.mob-nav-block:after {
    content: "";
    position: absolute;
    top: -8px;
    left: 0;
    width: 32px;
    height: 2px;
    background: var(--deep_ocean);
	transition: all .3s linear;
}
.mob-nav-block:before {
    content: "";
    position: absolute;
    top: 8px;
	left: 10px;
    width: 22px;
    height: 2px;
    background: var(--deep_ocean);
	transition: all .3s linear;
}
.mob-nav-icon.active .mob-nav-block {
    background: none;
}
.mob-nav-icon.active .mob-nav-block:before {
    top: 0;
	left: 0;
	width: 32px;
    transform: rotate(45deg);
}
.mob-nav-icon.active .mob-nav-block:after {
    top: 0;
    transform: rotate(-45deg);
}

/************************* hero *************************/
.hero {
	position: relative;
	overflow: hidden;
	margin: min(-154px, -228rem) 0 max(100px, 130rem);
}
.hero::before {
	position: absolute;
	inset: 0;
	z-index: 10;
	content: '';
	background: var(--grad-1);
	pointer-events: none;
}
.hero-slider .hero-slide {
	height: max(667px, 800rem);
	min-height: 100dvh;
	max-height: 100dvh;
}
.hero-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.hero-content {
	position: absolute;
	inset: 0;
	top: auto;
	z-index: 20;
	padding: 0 max(16px, 50rem) max(24px, 24rem);
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
.hero-title h1 {
	color: var(--desert);
}
.hero-right {
	display: flex;
	flex-direction: column;
	padding: 0 0 max(10px, 18rem);
}
.hero-controls {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: max(16px, 16rem);
	margin: 0 0 max(4px, 8rem);
}
.hero-arrows {
	display: flex;
	align-items: center;
	gap: max(10px, 10rem);
}
.hero-arrow {
	width: 36px;
	height: 36px;
	background: url(../images/slider-arrow.svg) 50% 50% no-repeat;
	background-size: contain;
}
.hero-prev {
	transform: scale(-1, 1);
}
.hero-num {
	width: max(12px, 12rem);
	color: var(--cream);
}
.hero-info-wrap {
	overflow: hidden;
}
.hero-info {
	max-width: max(320px, 640rem);
	margin: min(-4px, -17rem) 0;
}
.hero-info-slide {
	font-family: var(--font5);
	font-weight: 400;
	font-style: italic;
	font-size: var(--caption);
	line-height: 240%;
	text-align: right;
	white-space: nowrap;
}
.hero-link {
	color: var(--cream);
	text-decoration: none;
	border-bottom: 1px solid transparent;
}
.hero-link:hover {
	border-color: var(--cream);
}

/************************* stage *************************/
.stage-tabs {
	display: flex;
	margin: 0 0 max(32px, 50rem);
}
.stage-tabs-link {
	flex: 1;
	padding: 0 0 max(15px, 19rem);
	font-size: max(18px, 20rem);
	line-height: 110%;
	letter-spacing: -0.04em;
	text-align: center;
	color: var(--deep_ocean_50);
	text-decoration: none;
	border-bottom: 1px solid var(--deep_ocean_30);
}
.stage-tabs-link:hover {
	color: var(--deep_ocean);
}
.stage-tabs-link.active {
	color: var(--deep_ocean);
	border-color: var(--deep_ocean);
}
.stage-tab {
	display: none;
}
.stage-tab.vis {
	display: block;
}
.stage-block {
	display: flex;
	flex-direction: row-reverse;
	justify-content: space-between;
}
.stage-side {
	width: calc(50% - 10px);
	max-width: max(560px, 640rem);
	transition: all 0.7s ease-in-out;
	opacity: 0;
	transform: translateY(40px);
}
.stage-photo {
	position: relative;
	overflow: hidden;
	width: calc(50% - 10px);
	aspect-ratio: 1.44/1;
}
.stage-photo-wrap {
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	aspect-ratio: 1.44/1;
	height: 0;
	transition: all 1.2s ease-in-out;
}
.ani_start .vis .stage-photo-wrap {
	height: 100%;
}
.stage-photo-inner {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	aspect-ratio: 1.44/1;
}
.stage-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1.4);
	transition: all 1s ease-in-out 0.2s;
}
.ani_start .stage-photo img {
	transform: scale(1);
}
.active .stage-side,
.vis .stage-side {
	opacity: 1;
	transform: translateY(0px);
}
.active.hiding .stage-side,
.vis.hiding .stage-side {
	opacity: 0;
	transform: translateY(40px);
}
.active .stage-photo-wrap {
	height: 100%;
	transition: all 0.7s ease-in-out;
}
.active.hiding .stage-photo-wrap {
	height: 0;
	transition: all 0.7s ease-in-out;
}
.stage-item {
	padding: max(16px, 24rem) 0;
	border-bottom: 1px solid var(--deep_ocean_30);
}
.stage-item:last-child {
	border-bottom: 0;
}
.stage-top {
	display: block;
}
.stage-top {
	color: var(--deep_ocean);
	text-decoration: none;
}
.stage-hidden {
	display: none;
	padding: max(20px, 20rem) 0 0;
}
.stage-hidden.vis {
	display: block;
}
.stage-text {
	max-width: max(530px, 570rem);
	margin: 0 0 max(22px, 22rem);
}
.stage-mob-link {
	display: none;
}

/************************* main-about *************************/
.main-about {
	display: flex;
}
.main-about-side {
	width: 50%;
}
.main-about h2 {
	max-width: max(300px, 360rem);
}
.main-about-content {
	width: 50%;
}
.main-about-img {
	position: relative;
	width: max(300px, 360rem);
	aspect-ratio: 1/1.28;
	margin: 0 0 max(24px, 30rem);
}
.main-about-img-wrap {
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	aspect-ratio: 1/1.28;
	height: 0;
	transition: all 1.2s ease-in-out;
}
.ani_start .main-about-img-wrap {
	height: 100%;
}
.main-about-img-inner {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	aspect-ratio: 1/1.28;
}
.main-about-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1.4);
	transition: all 1s ease-in-out 0.2s;
}
.ani_start .main-about-img img {
	transform: scale(1);
}
.main-about-bottom {
	display: flex;
	justify-content: space-between;
	gap: max(24px, 32rem);
	padding: 0 0 0 max(24px, 37rem);
}
.main-about-text {
	max-width: max(436px, 480rem);
}
.main-about-text p {
    margin: 0 0 max(8px, 8rem);
}
.main-about-text p:last-child {
	margin: 0;
}
.main-about-link {
	white-space: nowrap;
}

/************************* num *************************/
.main-awards {
	padding: max(30px, 30rem) 0;
	border-top: 1px solid var(--desert_50);
}

/************************* num *************************/
.num {
	position: relative;
	overflow: hidden;
	height: max(747px, 800rem);
}
.num::before {
	position: absolute;
	inset: 0;
	z-index: 10;
	content: '';
	background: var(--space_50);
}
.num-bg {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1.4);
	transition: all 1s ease-in-out;
}
.ani_start .num-bg {
	transform: scale(1);
}
.num-content {
	position: absolute;
	inset: max(16px, 50rem);
	top: max(27px, 27rem);
	bottom: max(30px, 30rem);
	z-index: 20;
	color: var(--cream);
}
.num-title {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	opacity: 0;
	transition: all 0.4s ease-in-out;
	transition-delay: 0.2s;
}
.ani_start .num-title {
	opacity: 1;
}
.num-title h2 {
	color: var(--cream);
}
.num-item {
	position: absolute;
}
.num-top .num-item {
	top: 0;
}
.num-bottom .num-item {
	bottom: 0;
}
.num-top .num-item:nth-child(1) {
	left: 0;
}
.num-top .num-item:nth-child(2) {
	left: 50%;
	transform: translateX(-50%);
	text-align: center;
}
.num-top .num-item:nth-child(3) {
	right: 0;
}
.num-bottom .num-item:nth-child(1) {
	left: 0;
}
.num-bottom .num-item:nth-child(2) {
	left: 50%;
	transform: translateX(-50%);
	text-align: center;
}
.num-bottom .num-item:nth-child(3) {
	right: 0;
}
.num-digit {
	overflow: hidden;
	font-family: var(--third-family);
	font-weight: 300;
	font-size: var(--digits);
	line-height: 110%;
	letter-spacing: -0.04em;
}
.num-digit-wrap {
	transition: transform 0.7s ease-in-out;
	transform: translateY(calc(100% + 20px));
}
.ani_start .num-digit-wrap {
	transform: translateY(0%);
}
.num-text {
	margin-top: min(-6px, -12rem);
	opacity: 0;
	transition: all 0.4s ease-in-out;
	transition-delay: 0.5s;
}
.ani_start .num-text {
	opacity: 1;
}

/************************* mirage *************************/
.mirage {
	overflow: hidden;
	position: relative;
	height: max(465px, 800rem);
	max-height: 100dvh;
}
.mirage-banner {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.mirage-mask {
	position: absolute;
	inset: 0;
	transform-origin: 55.5% 50%;
	transition: all 4s ease-in-out;
}
.mirage-mask img {
	width: 100%;
}
.ani_start .mirage-mask {
	transform: scale(100);
}
.mirage-mob {
	display: none;
}

/************************* creative *************************/
.creative {
	position: relative;
	overflow: hidden;
	height: max(680px, 800rem);
	max-height: 100dvh;
}
.creative-bg {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.creative::before {
	position: absolute;
	inset: 0;
	content: '';
	z-index: 10;
	background: linear-gradient(179.13deg, rgba(18, 50, 69, 0) 1.8%, rgba(18, 50, 69, 0.6) 77.8%);
}
.creative-content {
	position: absolute;
	inset: 0;
	z-index: 20;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	padding: 0 max(16px, 50rem) max(64px, 90rem);
}
.creative-block {
	position: relative;
}
.creative-item {
	max-width: max(520px, 620rem);
	text-align: center;
}
.creative-item h2,
.creative-item h5 {
	color: var(--cream);
}
.creative-item:nth-child(2),
.creative-item:nth-child(3){
	position: absolute;
	top: 0;
	left: 0;
	transform: translateY(200px);
	opacity: 0;
}

/************************* who *************************/
.who {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	height: max(720px, 800rem);
}
.who-img {
	position: absolute;
	width: max(240px, 360rem);
	aspect-ratio: 1/1.29;
}
.who-img-wrap {
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	aspect-ratio: 1/1.29;
	height: 0;
	transition: all 1.2s ease-in-out;
}
.ani_start .who-img-wrap {
	height: 100%;
}
.who-img-inner {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	aspect-ratio: 1/1.29;
}
.who-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1.4);
	transition: all 1s ease-in-out 0.2s;
}
.ani_start .who-img img {
	transform: scale(1);
}

.who-second {
	display: none;
}
.who-img-1 {
	top: 0;
	left: 0;
}
.who-img-2 {
	right: 0;
	bottom: 0;
}
.who-main {
	max-width: max(400px, 540rem);
	text-align: center;
}
.who-main-title {
	margin: 0 0 max(24px, 24rem);
}
.who-main-text {
	position: relative;
}
.who-main-text .who-text:last-child {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	opacity: 0;
}
.who h2 {
	transition: all 0.7s ease-in-out;
}
.who-main-title {
	position: relative;
}
.who-main-title .who-main-wrap:last-child {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}
.who-main-wrap {
	overflow: hidden;
}
.who-main-title .who-main-wrap:last-child h2 {
	transform: translateY(105%);
}
.who-text {
	transition: all 0.7s ease-in-out;
}
.ani_start .who-text:first-child {
	opacity: 0;
}
.ani_start .who-text:last-child {
	opacity: 1;
	transition-delay: 1s;
}
.ani_start .who-main-wrap:first-child h2 {
	transform: translateY(105%);
}
.ani_start .who-main-wrap:last-child h2 {
	transform: translateY(0px);
	transition-delay: 1s;
}

/************************* timeline *************************/
.timeline {
	position: relative;
	overflow: hidden;
}
.timeline::before {
	position: absolute;
	inset: 0;
	z-index: 10;
	right: auto;
	content: '';
	width: max(200px, 300rem);
	background: linear-gradient(270deg, rgba(244, 241, 237, 0) 2.43%, #f4f1ed 100%);
}
.timeline::after {
	position: absolute;
	inset: 0;
	z-index: 10;
	left: auto;
	content: '';
	width: max(200px, 300rem);
	background: linear-gradient(90deg, rgba(244, 241, 237, 0) 2.43%, #f4f1ed 100%);
}
.timeline h2 {
	margin: 0 0 max(32px, 32rem);
	text-align: center;
}
.timeline-slider {
	max-width: max(440px, 704rem);
	margin: 0 auto;
}
.timeline-slide {
	width: max(440px, 704rem);
	text-align: center;
}
.timeline-img {
	margin: 0 0 max(30px, 30rem);
}
.timeline-img-wrap {
	aspect-ratio: 1.83/1;
	transform: scale(0.75);
	transition: all 0.6s ease-in-out;
}
.slick-current .timeline-img-wrap {
	transform: scale(1);
}
.timeline-img-wrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.timeline-info {
	max-width: max(440px, 704rem);
	margin: 0 auto;
}
.timeline-info-slide {
	width: max(440px, 704rem);
	text-align: center;
}
.timeline-title {
	color: var(--deep_ocean);
}
.timeline-slider .slick-list,
.timeline-info .slick-list {
    overflow: visible;
}
.timeline-info-block {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: max(211px, 211rem);
	padding: max(36px, 36rem) 0;
	transition: all 0.6s ease-in-out;
}
.slick-current .timeline-info-block {
	padding: 0;
}
.timeline-info .slick-arrow {
	position: absolute;
	z-index: 20;
	top: min(-7px, -7rem);
	width: max(36px, 36rem);
	height: max(36px, 36rem);
	font-size: 0;
	cursor: pointer;
	background: url(../images/arrow.svg) 50% 50% no-repeat;
	background-size: contain;
}
.timeline-info .slick-arrow.slick-disabled {
	opacity: 0.5;
	pointer-events: none;
}
.timeline-info .slick-prev {
	left: 0;
	transform: scale(-1, 1);
}
.timeline-info .slick-next {
	right: 0;
}
.timeline-line {
	position: absolute;
	left: 0;
	right: 0;
	bottom: max(40px, 40rem);
	height: max(126px, 126rem);
	display: flex;
	justify-content: center;
	gap: 5px;
}
.timeline-line-part {
	width: max(1600px, 1600rem);
	min-width: max(1600px, 1600rem);
	height: max(126px, 126rem);
	background: url(../images/line.svg) 50% 50% no-repeat;
	background-size: contain;
}





/************************* section *************************/
.section {
	margin: 0 0 max(100px, 130rem);
}
.link {
	position: relative;
	font-size: var(--button);
	line-height: 120%;
	color: var(--deep_ocean);
	text-decoration: none;
	text-transform: uppercase;
}
.link::before,
.link::after {
	position: absolute;
	left: 0;
	bottom: -3px;
	content: '';
	width: 100%;
	height: 1px;
	background: var(--deep_ocean);
	transition: transform 0.725s var(--eleos);
	transform-origin: 0% 50%;
	transform: scale(1, 1);
}
.link::after {
	transform-origin: 100% 50%;
	transform: scale(0, 1);
	transition-delay: 0.3s;
}
.link:hover::before {
	transform: scale(0, 1);
	transform-origin: 100% 50%;
}
.link:hover::after {
	transform: scale(1);
	transform-origin: 0% 50%;
}

/************************* breadcrumbs *************************/
.breadcrumbs {
	position: absolute;
	top: max(80px, 105rem);
	left: 0;
	right: 0;
	z-index: 20;
	display: flex;
	flex-wrap: wrap;
	gap: max(6px, 6rem);
	padding: 0 max(16px, 50rem);
	margin: 0;
}
.breadcrumbs li {
	display: flex;
	align-items: flex-start;
	gap: max(6px, 6rem);
	padding: 0;
	margin: 0;
	font-size: var(--button);
	line-height: 120%;
	letter-spacing: -0.04em;
	color: var(--deep_ocean);
	list-style: none;
}
.breadcrumbs li::before {
	display: block;
	content: '/';
	color: var(--deep_ocean_50);
}
.breadcrumbs li:first-child::before {display: none;}
.breadcrumbs li:last-child::before {color: var(--deep_ocean_50);}
.breadcrumbs a {
	color: var(--deep_ocean_50);
	text-decoration: none;
}
.breadcrumbs a:hover {
	color: var(--deep_ocean);
}

















/************************* awards-marquee *************************/
.awards-marquee {
	overflow: hidden;
	margin: 0 min(-16px, -50rem);
}
.awards-marquee-wrap {
	display: flex;
	gap: max(55px, 120rem);
}
.awards-marquee-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
.awards-marquee-img {
	margin: 0 0 max(7px, 9rem);
}
.awards-marquee-img img {
	height: max(128px, 162rem);
	filter: saturate(0);
	transition: all 0.6s ease-in-out;
}
.awards-marquee-item:hover img {
	filter: saturate(1);
}

/************************* about-top *************************/
.about-top-block {
	display: flex;
	justify-content: space-between;
	margin: 0 0 max(32px, 32rem);
	gap: 32px 0;
}
.about-top-col {
	width: calc(50% - 10px);
}
.about-top-text {
	max-width: max(590px, 660rem);
}
.about-top .banner {
    margin: 0 min(-16px, -50rem);
}

/************************* leadership *************************/
.leadership-top {
	display: flex;
	justify-content: space-between;
	margin: 0 0 max(50px, 50rem);
	gap: 32px 0;
}
.leadership-col {
	width: calc(50% - 10px);
}
.leadership-text {
	max-width: max(490px, 535rem);
	margin: 0 0 max(24px, 32rem);
}
.leadership-text:last-child {
	margin: 0;
}

/************************* link-top *************************/
.link-top {
	position: relative;
	margin: 0 0 max(32px, 44rem);
}
.link-top h2 {
	text-align: center;
}
.link-top .link {
    position: absolute;
    top: max(10px, 18rem);
    right: 0;
}
.link::before,
.link::after {
	position: absolute;
	left: 0;
	bottom: 0;
	content: '';
	width: 100%;
	height: 1px;
	background: var(--deep_ocean);
	transition: all 0.725s var(--eleos);
}
.link::before {
	transform-origin: 100% 50%;
}
.link::after {
	transform-origin: 0% 50%;
	transform: scale(0, 1);
	transition-delay: 0.3s;
}
.link:hover::before {
	transform: scale(0, 1);
}
.link:hover::after {
	transform: scale(1);
}

/************************* person *************************/
.person {
	display: flex;
	justify-content: space-between;
	gap: max(32px, 64rem);
}
.person-side {
	width: max(400px, 487rem);
	max-width: max(400px, 487rem);
}
.person-photo {
	overflow: hidden;
	position: sticky;
	top: max(64px, 76rem);
	aspect-ratio: 1/1.37;
}
.person-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.person-content {
	width: 55%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: max(32px, 32rem);
}
.person-content .person-photo {
	display: none;
}
.person-top {
	display: flex;
	flex-direction: column;
	padding: 0 0 0 max(24px, 38rem);
}
.person h5 {
	color: var(--deep_ocean_50);
}
.person-bottom {
	max-width: max(540px, 600rem);
}
.person-text {
	margin: 0 0 max(32px, 32rem);
}
.person-text:last-child {margin: 0;}
.person-webs {
	display: flex;
	gap: max(16px, 16rem);
}
.person-webs-item {
	display: flex;
	align-items: center;
	justify-content: center;
	width: max(56px, 56px);
	height: max(56px, 56px);
	border: 1px solid var(--desert);
}
.person-webs-item svg {
	width: max(24px, 24px);
	height: max(24px, 24px);
}
.person-webs-item path {
	fill: var(--deep_ocean);
	transition: all 0.4s ease-in-out;
}
.person-webs-item:hover {
	background-color: var(--deep_ocean);
	border-color: var(--deep_ocean);
}
.person-webs-item:hover path {
	fill: var(--cream);
}

/************************* team *************************/
.team h1 {
	margin: 0 0 max(32px, 56rem);
	text-align: center;
}
.team-block {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: max(32px, 50rem) max(20px, 20rem);
	margin: 0 0 max(32px, 50rem);
}
.team-item {
	color: var(--deep_ocean);
	text-decoration: none;
	text-align: center;
}
.team-img-wrap {
	position: relative;
	aspect-ratio: 1/1.37;
	margin: 0 0 max(20px, 20rem);
}
.team-img-inner {
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	aspect-ratio: 1/1.37;
	height: 0;
	transition: all 1.2s ease-in-out;
}
.ani_start .team-img-inner {
	height: 100%;
}
.team-img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	aspect-ratio: 1/1.37;
}
.team-img img {
	filter: saturate(0);
	transition: all 0.4s var(--slow);
}
.team-item h5 {
	margin: 0 0 max(8px, 8rem);
}
.team-status {
	color: var(--deep_ocean_50);
}
.team-item:hover .img-box {
	padding: max(16px, 16rem);
}
.team-item:hover .img-box::before,
.team-item:hover .img-box::after {
	opacity: 1;
}
.team-item:hover .team-img img {
	filter: saturate(1);
}

/************************* blog *************************/
.awards h1 {
	margin: 0 0 max(32px, 49rem);
	text-align: center;
}
.awards-block {
	position: relative;
	border-top: 1px solid var(--deep_ocean_30);
	margin: 0 0 max(28px, 28rem);
}
.awards-bg {
	position: absolute;
	width: 100%;
	background: var(--desert_30);
	opacity: 0;
	pointer-events: none;
	transition: all 0.2s ease-in-out;
}
.awards-block:hover .awards-bg {
	opacity: 1;
}
.awards-part {
	display: flex;
	border-bottom: 1px solid var(--deep_ocean_30);
}
.awards-year {
	position: relative;
	width: max(70px, 127rem);
	min-width: max(70px, 127rem);
	padding: max(16px, 19rem) 0;
}
.awards-list {
	flex: 1;
}
.awards-item {
	position: relative;
	display: flex;
	gap: max(16px, 20rem);
	padding: max(16px, 19rem) 0;
	color: var(--space);
	text-decoration: none;
	border-bottom: 1px dashed var(--deep_ocean_30);
}
.awards-item:last-child {
	border-bottom: 0;
}
.awards-item::before,
.awards-item::after {
	position: absolute;
	top: max(14px, 17rem);
	right: 0;
	content: '';
	width: max(22px, 22rem);
	height: max(22px, 22rem);
	background: url(../images/plus.svg) 50% 50% no-repeat;
	background-size: max(22px, 22rem);
	opacity: 0;
}
.awards-item:hover::before {
	opacity: 1;
	transition-delay: 0;
}
.awards-item::before {
	transition: height 0.3s ease-in-out, top 0.3s ease-in-out, opacity 0.2s ease-in-out 0.2s;
}
.awards-item::after {
	background: url(../images/minus.svg) 50% 50% no-repeat;
	background-size: contain;
	opacity: 0;
	transition: all 0.2s ease-in-out 0.2s;
}
.awards-item.active::before {
	height: 0px;
	top: max(26px, 29rem);
	opacity: 0;
}
.awards-item.active::after {
	opacity: 1;
}
.awards-name {
	flex: 1;
	color: var(--deep_ocean_50);
}
.awards-category {
	width: 34%;
}
.awards-body {
	width: 34%;
}
.awards-hidden {
	display: none;
	padding: max(16px, 20rem) 0 0;
}
.awards-img {
	display: flex;
	align-items: center;
	justify-content: center;
	width: max(233px, 233rem);
	height: max(233px, 233rem);
	border: 1px solid var(--deep_ocean_30);
}
.awards-img img {
	max-width: 80%;
	max-height: 80%;
}
.awards-line {
	position: relative;
	display: flex;
	gap: max(16px, 20rem);
	padding: 0 0 max(24px, 28rem) max(70px, 127rem);
	font-weight: 600;
	letter-spacing: -0.04em;
	color: var(--deep_ocean_50);
}
.awards-line-item {
	width: 34%;
}
.awards-line-item:first-child {
	position: absolute;
	top: 0;
	left: 0;
}
.awards-line-item:nth-child(2){
	width: auto;
	flex: 1;
}
.awards-text {
	padding-right: 30px;
}

/************************* brand *************************/
.brand-top {
	display: flex;
	justify-content: space-between;
}
.brand-top h1 {
	max-width: max(280px, 440rem);
}
.brand-top-side {
	width: 50%;
}
.brand-top-text {
	max-width: max(595px, 664rem);
}
.brand-list {
	max-width: max(1400px, 1500rem);
	border-top: 1px solid var(--deep_ocean_30);
}
.brand-item {
	display: flex;
	align-items: center;
	gap: max(16px, 20rem);
	padding: max(20px, 20rem) 0;
	border-bottom: 1px solid var(--deep_ocean_30);
}
.brand-title {
	width: 50%;
	min-width: 50%;
	color: var(--deep_ocean_50);
}
.brand-info {
	flex: 1;
}
.brand-text {
	max-width: max(410px, 450rem);
}

/************************* serv *************************/
.serv h1 {
	margin: 0 0 max(32px, 48rem);
	text-align: center;
}
.serv-block {
	display: flex;
	gap: max(40px, 147rem);
}
.serv-side {
	width: max(300px, 362rem);
	min-width: max(300px, 362rem);
}
.serv-side-list {
	position: sticky;
	top: max(64px, 76rem);
	display: flex;
	flex-direction: column;
	border-bottom: 1px solid var(--deep_ocean_30);
}
.serv-side-link {
	padding: max(20px, 24rem) 0;
	font-size: max(18px, 20rem);
	line-height: 110%;
	letter-spacing: -0.04em;
	color: var(--deep_ocean_50);
	text-decoration: none;
	border-top: 1px solid var(--deep_ocean_30);
}
.serv-side-link:hover, .serv-side-link.active {
	color: var(--deep_ocean);
}
.serv-content {
	flex: 1;
}
.serv-mob-link {
	display: none;
}
.serv-list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: max(30px, 50rem) max(20px, 20rem);
}
.serv-item {
	color: var(--deep_ocean);
	text-decoration: none;
}
.serv-img {
	height: max(210px, 300rem);
	margin: 0 0 max(16px, 24rem);
}
.serv-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.serv-tab {
	display: none;
}
.serv-tab.vis {
	display: block;
}
.serv-item h5 {
	position: relative;
	padding-right: max(30px, 30rem);
}
.serv-item h5::after {
	position: absolute;
	top: 0;
	right: 0;
	content: '';
	width: max(24px, 24rem);
	height: max(24px, 24rem);
	background: url(../images/arrow-next.svg) 50% 50% no-repeat;
	background-size: contain;
	opacity: 0;
	transition: all 0.4s ease-in-out;
}
.serv-item:hover h5::after {
	opacity: 1;
}

/************************* career *************************/
.career h1 {
	margin: 0 0 max(32px, 48rem);
	text-align: center;
}
.career .banner {
	margin: 0 0 max(52px, 130rem);
}
.career-main {
	max-width: max(710px, 780rem);
	margin: 0 auto;
}
.career-main h2 {
	padding-top: max(30px, 32rem);
	margin: 0 0 max(20px, 25rem);
}
.career-main h2:first-child {
	padding-top: 0;
}
.career-main .button {
	margin-top: 10px;
}
.career-main p {
	margin-left: max(30px, 37rem);
}
.banner {
	position: relative;
	overflow: hidden;
	height: max(240px, 600rem);
}
.banner-big {
	height: max(240px, 670rem);
}
.banner-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.parallax .banner-img {
	height: 180%;
	transition: all 1.4s var(--slow);
}
.parallax_start .banner-img {
	transform: translateY(-44%);
}

/************************* client *************************/
.client h1 {
	margin: 0 0 max(32px, 48rem);
	text-align: center;
}
.client-tabs {
	display: flex;
	margin: 0 0 max(32px, 32rem);
}
.client-tabs-link {
	flex: 1;
	padding: 0 0 max(15px, 19rem);
	font-size: 20px;
	line-height: 110%;
	letter-spacing: -0.04em;
	text-align: center;
	color: var(--deep_ocean_50);
	text-decoration: none;
	border-bottom: 1px solid var(--deep_ocean_30);
}
.client-tabs-link:hover {
	color: var(--deep_ocean);
}
.client-tabs-link.active {
	color: var(--deep_ocean);
	border-color: var(--deep_ocean);
}
.client-tab {display: none;}
.client-tab.vis {display: block;}
.client-block {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 0 max(24px, 32rem);
}
.client-item img {
	width: 100%;
}

/************************* cert *************************/
.cert h1 {
	margin: 0 0 max(32px, 50rem);
	text-align: center;
}
.cert-block {
	position: relative;
	border-top: 1px solid var(--deep_ocean_30);
	border-bottom: 1px solid var(--deep_ocean_30);
}
.cert-block:hover .cert-bg {
	opacity: 1;
}
.cert-bg {
    position: absolute;
    width: 100%;
    background: var(--desert_30);
    opacity: 0;
    pointer-events: none;
    transition: all 0.2s ease-in-out;
}
.cert-item {
	position: relative;
	display: flex;
	gap: max(16px, 20rem);
	padding: max(16px, 19rem) 0;
	padding-right: max(30px, 30rem);
	color: var(--space);
	text-decoration: none;
	border-bottom: 1px dashed var(--deep_ocean_30);
}
.cert-item:last-child {
	border-bottom: 0;
}
.cert-item::before,
.cert-item::after {
	position: absolute;
	top: max(14px, 17rem);
	right: 0;
	content: '';
	width: max(22px, 22rem);
	height: max(22px, 22rem);
	background: url(../images/plus.svg) 50% 50% no-repeat;
	background-size: max(22px, 22rem);
	opacity: 0;
}
.cert-item:hover::before {
	opacity: 1;
	transition-delay: 0;
}
.cert-item::before {
	transition: height 0.3s ease-in-out, top 0.3s ease-in-out, opacity 0.2s ease-in-out 0.2s;
}
.cert-item::after {
	background: url(../images/minus.svg) 50% 50% no-repeat;
	background-size: contain;
	opacity: 0;
	transition: all 0.2s ease-in-out 0.2s;
}
.cert-item.active::before {
	height: 0px;
	top: max(26px, 29rem);
	opacity: 0;
}
.cert-item.active::after {
	opacity: 1;
}
.cert-name {
	width: 50%;
	padding: 0 20px 0 0;
	color: var(--deep_ocean_50);
}
.cert-body {
	width: 50%;
}
.cert-hidden {
	display: none;
	padding: max(16px, 20rem) 0 0;
}
.cert-img {
	display: flex;
	align-items: center;
	justify-content: center;
	width: max(193px, 193rem);
	height: max(273px, 273rem);
	border: 1px solid var(--deep_ocean_30);
}
.cert-img img {
	width: 100%;
	height: 100%;
}











/************************* blog *************************/
.blog h1 {
	margin: 0 0 max(32px, 56rem);
	text-align: center;
}
.blog-tabs {
	display: flex;
	margin: 0 0 max(32px, 50rem);
	border-bottom: 1px solid var(--deep_ocean_30);
}
.blog-tabs-link {
	margin: 0 0 -1px;
	padding: 0 max(10px, 16rem) max(15px, 20rem);
	color: var(--deep_ocean);
	text-decoration: none;
	border-bottom: 1px solid transparent;
}
.blog-tabs-link.active {
	border-bottom: 1px solid var(--deep_ocean);
}
.blog-block {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: max(24px, 50rem) max(20px, 20rem);
	margin: 0 0 max(32px, 50rem);
}
.blog-block:last-child {margin: 0;}
.blog-item {
	color: var(--deep_ocean);
	text-decoration: none;
}
.blog-img {
	aspect-ratio: 1.62/1;
	margin: 0 0 max(16px, 24rem);
}
.img-box {
	position: relative;
	overflow: hidden;
	padding: 0;
	transition: all 0.3s var(--slow);
}
.img-box img {
	position: relative;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.img-box::before {
	position: absolute;
	inset: 0;
	content: '';
	border: 1px solid var(--deep_ocean);
	opacity: 0;
	transition: all 0.4s var(--slow);
}
.img-box::after {
	position: absolute;
	top: max(16px, 16rem);
	right: max(16px, 16rem);
	content: '';
	width: max(36px, 44rem);
	height: max(36px, 44rem);
	background: var(--cream) url(../images/box-arrow.svg) 50% 50% no-repeat;
	background-size: max(14px, 18rem);
	opacity: 0;
	transition: all 0.4s var(--slow);
}
.blog-item:hover .img-box {
	padding: max(16px, 16rem);
}
.blog-item:hover .img-box::before,
.blog-item:hover .img-box::after {
	opacity: 1;
}
.blog-line {
	display: flex;
	align-items: center;
	gap: max(11px, 16rem);
	margin: 0 0 max(12px, 16rem);
	color: var(--deep_ocean_50);
}
.blog-line-item {
	display: flex;
	align-items: center;
	gap: max(11px, 16rem);
}
.blog-line-item::before {
	content: '|';
}
.blog-line-item:first-child::before {
	display: none;
}

/************************* blog-more *************************/
.blog-more-top {
	position: relative;
}
.blog-more-top h2 {
	margin: 0 0 max(32px, 38rem);
	text-align: center;
}
.blog-more-top .link {
	position: absolute;
	top: max(6px, 12rem);
	right: 0;
}

/************************* article *************************/
.article-top {
	margin: 0 0 max(28px, 28rem);
}
.article-top h1 {
	max-width: max(700px, 1100rem);
	font-size: max(40px, 72rem);
    line-height: 110%;
}
.article-info {
	display: flex;
	align-items: center;
	gap: max(16px, 16rem);
	margin: 0 0 max(24px, 24rem);
	color: var(--deep_ocean_50);
}
.article-info-item {
	display: flex;
	align-items: center;
	gap: max(16px, 16rem);
}
.article-info-item::before {
	content: '|';
}
.article-info-item:first-child::before {
	display: none;
}
.article .banner {
	margin: 0 0 max(32px, 130rem);
}
.article-block {
	display: flex;
	gap: max(32px, 48rem);
}
.article-side {
	flex: 1;
}
.article-side .share {
	position: sticky;
	top: max(64px, 76rem);
}
.share .subheading {
	margin: 0 0 max(16px, 16rem);
	color: var(--deep_ocean_50);
}
.share-webs {
	display: flex;
	gap: max(8px, 8rem);
}
.share-webs-item {
	display: flex;
	align-items: center;
	justify-content: center;
	width: max(56px, 56px);
	height: max(56px, 56px);
	border: 1px solid var(--desert);
}
.share-webs-item svg {
	width: max(24px, 24px);
	height: max(24px, 24px);
}
.share-webs-item path {
	fill: var(--deep_ocean);
	transition: all 0.4s ease-in-out;
}
.share-webs-item:hover {
	background-color: var(--deep_ocean);
	border-color: var(--deep_ocean);
}
.share-webs-item:hover path {
	fill: var(--cream);
}
.article-content {
	width: 54%;
}
.article-content-wrap {
	max-width: max(670px, 740rem);
}
.article-content h3 {
	margin: 0 0 max(28px, 28rem);
	padding-top: max(28px, 28rem);
}
.article-content h3:first-child {
	padding-top: 0;
}

/************************* gallery-section *************************/
.gallery-block {
	display: flex;
	gap: max(20px, 20rem);
}
.gallery-slider {
	width: calc(100% - max(203px, 253rem));
}
.gallery-slide {
	aspect-ratio: 1.78/1;
}
.gallery-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.thumbs-col {
	width: max(120px, 233rem);
}
.thumbs-slider {
	width: 100%;
}
.thumbs-slide {
	padding: max(10px, 10rem) 0;
}
.thumbs-wrap {
	aspect-ratio: 1.66/1;
}
.thumbs-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.thumbs-wrap {
	position: relative;
	cursor: pointer;
	transition: all 0.4s var(--slow);
}
.thumbs-wrap::before {
	position: absolute;
	inset: 0;
	content: '';
	border: 1px solid var(--deep_ocean);
	opacity: 0;
	transition: all 0.4s var(--slow);
}
.thumbs-wrap:hover,
.slick-current .thumbs-wrap {
	padding: max(8px, 8rem);
}
.thumbs-wrap:hover::before,
.slick-current .thumbs-wrap::before {
	opacity: 1;
}
.tabs-item {display: none;}
.tabs-item.vis {display: block;}
.tabs {
	display: flex;
	margin: 0 0 max(32px, 32rem);
}
.tabs-link {
	flex: 1;
	padding: 0 0 max(15px, 19rem);
	font-size: 20px;
	line-height: 110%;
	letter-spacing: -0.04em;
	text-align: center;
	color: var(--deep_ocean_50);
	text-decoration: none;
	border-bottom: 1px solid var(--deep_ocean_30);
}
.tabs-link:hover {
	color: var(--deep_ocean);
}
.tabs-link.active {
	color: var(--deep_ocean);
	border-color: var(--deep_ocean);
}
.gallery-section .tabs {
	max-width: max(400px, 520rem);
	margin: 0 auto max(32px, 32rem);
}
.thumbs-slider .slick-arrow {	
	display: block;
	width: 100%;
	height: max(18px, 18rem);
	cursor: pointer;
	font-size: 0;
	transition: 0.3s ease-out;
	background: url(../images/arrow-down.svg) 50% 50% no-repeat;
	background-size: contain;
}
.thumbs-slider .slick-prev {
	transform: scale(1, -1);
}
.thumbs-slider .slick-arrow.slick-disabled {
	pointer-events: none;
	opacity: 0.5;
}

/************************* project *************************/
.project h1 {
	margin: 0 0 max(32px, 32rem);
	text-align: center;
}
.project .banner {
	margin: 0 0 max(100px, 130rem);
}
.project-block {
	display: flex;
	gap: max(32px, 48rem);
}
.project-side {
	flex: 1;
}
.project-side .project-components {
	position: sticky;
	top: max(64px, 76rem);
}
.project-components h5 {
	margin: 0 0 max(16px, 20rem);
}
.project-content {
	width: 54%;
}
.project-content .project-components {
	display: none;
}
.project-block ul {
	margin: 0 0 max(19px, 22rem);
	padding: 0 0 0 max(28px, 28rem);
}
.project-block ul:last-child {margin: 0;}
.project-block li {
	list-style-type: disc;
}
.project-content h2 {
	margin: 0 0 max(24px, 24rem);
}
.project-text {
	margin: 0 0 max(24px, 32rem);
	padding: 0 0 0 max(30px, 37rem);
}
.project-stat-item {
	position: relative;
	display: flex;
	gap: max(20px, 20rem);
	padding: max(16px, 16rem) 0;
}
.project-stat-item::after {
	position: absolute;
	left: 0;
	bottom: 0;
	content: '';
	width: 0;
	height: 1px;
	background: var(--deep_ocean_30);
	transition: all 1.4s ease-in-out;
}
.project-stat-item:first-child::before {
	position: absolute;
	left: 0;
	top: 0;
	content: '';
	width: 0;
	height: 1px;
	background: var(--deep_ocean_30);
	transition: all 1.4s ease-in-out;
}
.ani_start .project-stat-item::after,
.ani_start .project-stat-item:first-child::before {
	width: 100%;
}
.project-stat-name {
	width: 50%;
}
.project-stat-value {
	width: 50%;
	text-align: right;
}

/************************* catalog *************************/
.catalog-top {
	display: flex;
	margin: 0 0 max(32px, 58rem);
}
.catalog-top-col {
	width: 50%;
}
.catalog-top-text {
	max-width: max(680px, 740rem);
}
.catalog-main {
	display: flex;
	gap: max(24px, 40rem);
}
.catalog-side {
	width: max(280px, 340rem);
	min-width: max(280px, 340rem);
}
.catalog-content {
	padding: max(46px, 50rem) 0 0;
}
.map {
	position: relative;
	height: max(495px, 495rem);
}
.map-bg {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.map-item {
	position: absolute;
	z-index: 10;
}
.map-1 {
	top: 50%;
	left: 20%;
}
.map-2 {
	top: 50%;
	left: 80%;
}
.map-marker {
	position: absolute;
	left: -50%;
	bottom: 0;
	display: block;
	width: 23px;
	transition: all 0.4s ease-in-out;
}
.map-marker:hover, .map-marker.active {
	width: 50px;
	margin-left: -13px;
}
.map-marker img {
	width: 100%;
}
.map-card {
	position: absolute;
	left: 45px;
	top: 0;
	transform: translateY(-50%);
	width: max(311px, 345rem);
	padding: 12px;
	background: var(--cream);
	display: none;
}
.map-card-right {
	left: auto;
	right: 45px;
}
.map-card-img {
	height: max(160px, 187rem);
	margin: 0 0 max(18px, 18rem);
}
.map-card-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.map-card-country {
	margin: 0 0 max(12px, 12rem);
}
.map-card h3 {
	margin: 0 0 max(18px, 18rem);
}
.map-card-bottom {
	padding: max(12px, 12rem) 0 max(4px, 4rem);
	border-top: 1px solid var(--deep_ocean_30);
}
.catalog-tab {
	padding: 0 0 max(20px, 20rem);
	margin: 0 0 max(20px, 20rem);
	border-bottom: 1px solid var(--deep_ocean_50);
}
.catalog-tab:last-child {
	padding: 0;
	margin: 0;
	border-bottom: 0;
}

/************************* filter *************************/
.filter-title {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 0 max(24px, 24rem);
}
.filter-close {display: none;}
.filter-item {
	padding: max(24px, 24rem) 0;
	border-top: 1px solid var(--deep_ocean_30);
}
.filter-top {
	display: block;
	position: relative;
	color: var(--deep_ocean);
	text-decoration: none;
}
.filter-top::after {
	position: absolute;
	top: 50%;
	right: 0;
	content: '';
    width: max(18px, 18rem);
    height: max(18px, 18rem);
    margin: min(-9px, -9rem) 0 0;
    background: url(../images/arrow-down.svg) 0 100% no-repeat;
    background-size: contain;
    transition: all 0.4s;
}
.filter-top.active::after {
	transform: rotate(180deg);
}
.filter-content {
	display: none;
	padding: max(24px, 24rem) 0 0;
}
.filter-content.vis {
	display: block;
}
.filter-bottom {
	display: none;
}
.check-sublist {
	padding: 0 0 0 max(24px, 24rem);
}
.check-sublist-part {
	margin: 0 0 max(24px, 24rem);
}
.check-sublist-part:last-child {
	margin: 0;
}
.check-sublist .subheading {
	margin: 0 0 max(16px, 16rem);
	color: var(--deep_ocean_50);
}
.sorting-mob {
	display: none;
}

/************************* project-catalog *************************/
.project-catalog .blog-img {
    aspect-ratio: 1 / 1;
    margin: 0 0 max(16px, 16rem);
}

/************************* serv-page *************************/
.serv-page h1 {
	margin: 0 0 max(32px, 32rem);
	text-align: center;
}

/************************* serv-about *************************/
.serv-about {
	display: flex;
}
.serv-about-side {
	width: 34%;
	min-width: max(300px, 34%);
	padding: 0 max(32px, 40rem) 0 0;
}
.serv-about-content {
	width: 66%;
}
.serv-about-text {
	max-width: max(690px, 740rem);
}
.serv-about-text h5 {
	padding-top: max(10px, 10rem);
	margin: 0 0 max(16px, 16rem);
}
.serv-about-text h5:first-child {
	padding-top: 0;
}
.serv-about ul {
	margin: 0 0 max(19px, 22rem);
	padding: 0 0 0 max(28px, 28rem);
}
.serv-about ul:last-child {margin: 0;}
.serv-about li {
	list-style-type: disc;
}


/************************* contact *************************/
.project-slider .blog-img {
    aspect-ratio: 1 / 1;
    margin: 0 0 max(16px, 16rem);
}
.project-section {
	display: flex;
}
.project-section-side {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	width: 34%;
	min-width: max(300px, 34%);
	padding: 0 max(32px, 40rem) 0 0;
}
.project-section-content {
	width: 66%;
}
.project-slider {
	margin: 0 min(-16px, -50rem) 0 0;
}
.project-slide {
	padding: 0 max(12px, 20rem) 0 1px;
}
.project-slide .blog-item {
	display: block;
	width: max(330px, 486rem);
}
.project-controls {
	position: relative;
	padding: 0 46px;
}
.project-arrow {
	position: absolute;
	bottom: -1px;
	width: 36px;
	height: 36px;
	background: url(../images/arrow.svg) 50% 50% no-repeat;
	background-size: contain;
}
.project-prev {
	left: 0;
	transform: scale(-1, 1);
}
.project-next {
	right: 0;
}
.slick-dots {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	gap: 6px;
	height: 34px;
}
.slick-dots button {
	display: block;
	width: 1px;
	height: 22px;
	font-size: 0;
	cursor: pointer;
	background: var(--deep_ocean_30);
	transition: 0.3s ease-out;
}
.slick-dots li:nth-child(4n + 2) button {
	height: 26px;
}
.slick-dots li:nth-child(4n + 3) button {
	height: 19px;
}
.slick-dots li:nth-child(4n) button {
	height: 29px;
}
.slick-dots button:hover {
	background: var(--deep_ocean);
}
.slick-dots li.slick-active button {
	height: 34px;
	background: var(--deep_ocean);
}

/************************* serv-more *************************/
.serv-more h2 {
	margin: 0 0 max(32px, 38rem);
	text-align: center;
}
.serv-more .serv-list {
	grid-template-columns: repeat(3, 1fr);
}





/************************* contact *************************/
.contact h1 {
	margin: 0 0 max(48px, 48rem);
	text-align: center;
}
.contact-block {
	display: flex;
	flex-direction: row-reverse;
	justify-content: space-between;
}
.contact-info {
	width: 51%;
}
.contact-form {
	width: 41%;
}
.contact-block h3 {
	margin: 0 0 max(28px, 28rem);
}
.contact-text {
	margin: 0 0 max(10px, 10rem);
	max-width: max(490px, 540rem);
}
.form-bottom {
	display: flex;
	flex-direction: row-reverse;
	align-items: flex-start;
	gap: max(20px, 24rem);
}
.form-note {
	flex: 1;
	font-size: max(16px, 16rem);
	line-height: 120%;
	color: var(--deep_ocean_50);
}
.form-note a {
	color: var(--deep_ocean);
	text-decoration: underline;
}
.form-note a:hover {
	text-decoration: none;
}
.address {
	display: flex;
	flex-direction: column;
	gap: max(32px, 32rem);
}
.address-item .subheading {
	margin: 0 0 max(12px, 12rem);
}
.address-line {
	display: flex;
	flex-direction: row-reverse;
	gap: max(20px, 80rem);
}
.address-links {
	flex: 1;
	display: flex;
	gap: max(20px, 20rem);
}
.address-links-item {
	width: 50%;
}
.address-link {
	position: relative;
	color: var(--deep_ocean);
	text-decoration: none;
}
.address-link::before {
	position: absolute;
	left: 0;
	bottom: 0;
	content: '';
	width: 100%;
	height: 1px;
	background: var(--deep_ocean);
	transition: transform 0.725s var(--eleos);
	transform-origin: 100% 50%;
	transform: scale(0, 1);
}
.address-link:hover::before {
	transform: scale(1);
	transform-origin: 0% 50%;
}
.address-text {
	width: max(270px, 295rem);
	min-width: max(270px, 295rem);
}

/************************* policy *************************/
.policy {
	max-width: max(680px, 740rem);
	margin: 0 auto;
}
.policy h1 {
	margin: 0 0 max(40px, 48rem);
	text-align: center;
}
.policy h3 {
	margin: 0 0 max(28px, 32rem);
	padding-top: max(30px, 30rem);
}
.policy h5 {
	margin: 0 0 max(20px, 20rem);
	padding-top: max(12px, 12rem);
}
.policy h3:first-child,
.policy h5:first-child {padding-top: 0;}
.policy h3 + h5 {
	padding-top: max(2px, 2rem);
}
.policy ul {
	margin: 0 0 max(22px, 22rem);
	padding: 0 0 0 max(28px, 28rem);
}
.policy ul:last-child {margin: 0;}
.policy ul li {
	position: relative;
	list-style-type: disc;
}
.policy a {
	color: var(--dark);
}

/************************* sitemap *************************/
.sitemap {
	max-width: max(400px, 486rem);
	margin: 0 auto;
	color: var(--deep_ocean);
}
.sitemap h1 {
	margin: 0 0 max(36px, 32rem);
	text-align: center;
}
.sitemap h2 {
	margin: 0 0 max(32px, 32rem);
	padding-top: max(20px, 40rem);
}
.sitemap h2:last-child {margin: 0;}
.sitemap h2:first-child {padding-top: 0;}
.sitemap h2 a {
	position: relative;
	color: var(--deep_ocean);
	text-decoration: none;
}
.sitemap h2 a::before {
	position: absolute;
	left: 0;
	bottom: 0;
	content: '';
	width: 100%;
	height: 1px;
	background: var(--deep_ocean);
	transition: transform 0.725s var(--eleos);
	transform-origin: 100% 50%;
	transform: scale(0, 1);
}
.sitemap h2 a:hover::before {
	transform: scale(1);
	transform-origin: 0% 50%;
}
.sitemap .subheading {
	margin: 0 0 max(24px, 24rem);
}
.sitemap-links {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: max(14px, 14rem);
	margin: 0 0 max(32px, 32rem);
}
.sitemap-links:last-child {margin: 0;}
.sitemap-link {
	position: relative;
	color: var(--deep_ocean);
	text-decoration: none;
}
.sitemap-link::before,
.sitemap-link::after {
	position: absolute;
	left: 0;
	bottom: -3px;
	content: '';
	width: 100%;
	height: 1px;
	background: var(--deep_ocean);
	transition: transform 0.725s var(--eleos);
	transform-origin: 0% 50%;
	transform: scale(1, 1);
}
.sitemap-link::after {
	transform-origin: 100% 50%;
	transform: scale(0, 1);
	transition-delay: 0.3s;
}
.sitemap-link:hover::before {
	transform: scale(0, 1);
	transform-origin: 100% 50%;
}
.sitemap-link:hover::after {
	transform: scale(1);
	transform-origin: 0% 50%;
}

/************************* 404 *************************/
.page404 {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	height: 100dvh;
	margin-top: min(-154px, -228rem);
	padding: max(56px, 56rem) max(16px, 50rem);
	background: url(../images/404.jpg) 50% 50% no-repeat;
	background-size: cover;
}
.page404-block {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: max(20px, 20rem);
	color: var(--cream);
	text-align: center;
}
.page404 h1 {
	color: var(--desert);
}
.page404-text {
	max-width: max(480px, 550rem);
}
.page404-block .link {
	color: var(--cream);
}
.page404-block .link::before,
.page404-block .link::after {
	background: var(--cream);
}

/************************* footer-bottom *************************/
.footer-banner {
	position: relative;
	overflow: hidden;
	height: max(460px, 800rem);
	max-height: 100dvh;
}
.footer-banner::before {
	position: absolute;
	inset: 0;
	z-index: 10;
	content: '';
	background: rgba(0, 0, 0, 0.5);
}
.footer-banner-block {
	position: absolute;
	inset: 0;
	z-index: 20;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: max(28px, 28rem);
}
.footer-banner-block h2 {
	display: flex;
	flex-direction: column;
	align-items: center;
	color: var(--cream);
}
.text-wrap {
	overflow: hidden;
}
.text-inner {
	transition: transform 0.7s ease-in-out;
	transform: translateY(calc(100% + 20px));
}
.ani_start .text-inner {
	transform: translateY(0%);
}
.footer-banner-block .link {
	color: var(--cream);
	opacity: 0;
	transition-delay: 0.5s;
}
.ani_start .footer-banner-block .link {
	opacity: 1;
}
.footer-banner-block .link::before,
.footer-banner-block .link::after {
	background: var(--cream);
}
.footer-banner-text {
	max-width: max(430px, 480rem);
	color: var(--cream);
	opacity: 0;
	transition: all 0.4s ease-in-out;
	transition-delay: 0.5s;
}
.ani_start .footer-banner-text {
	opacity: 1;
}

/************************* footer-main *************************/
.footer-main {
	padding: max(52px, 60rem) 0 max(60px, 74rem);
	background: var(--desert);
}
.footer-block {
	display: flex;
}
.footer-side {
	display: flex;
	gap: max(80px, 158rem);
	width: 50%;
}
.footer-content {
	display: flex;
	width: 50%;
}
.footer-col {
	width: 33.33%;
}
.footer-main .subheading {
	color: var(--deep_ocean_50);
}
.footer-col .subheading {
	margin: 0 0 max(18px, 18rem);
}
.footer-info {
	display: flex;
	flex-direction: column;
	gap: max(18px, 18rem);
}
.footer-link {
	position: relative;
	color: var(--deep_ocean);
	text-decoration: none;
}
.footer-link::before {
	position: absolute;
	left: 0;
	bottom: 0;
	content: '';
	width: 100%;
	height: 1px;
	background: var(--deep_ocean);
	transition: transform 0.725s var(--eleos);
	transform-origin: 100% 50%;
	transform: scale(0, 1);
}
.footer-link:hover::before {
	transform: scale(1);
	transform-origin: 0% 50%;
}
.footer-side .subheading {
	margin: 0 0 max(20px, 24rem);
}
.footer-webs {
	margin: 0 0 max(40px, 50rem);
}
.footer-nav-list {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: max(16px, 16rem);
}
.footer-more {
	max-width: max(280px, 315rem);
}
.footer-more .subheading {
	margin: 0 0 max(8px, 8rem);
}
.footer-more-text {
	margin: 0 0 max(16px, 16rem);
}
.footer-main .button::before {
    background: var(--desert);
}
.footer-main .button:hover {
	background-color: var(--desert);
}
.footer-main .button:hover::before {
	background-color: var(--deep_ocean);
}

/************************* footer-bottom *************************/
.footer-bottom {
	background: url(../images/footer-bg.jpg) 50% 100% no-repeat;
	background-size: cover;
}
.footer-bottom .holder {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	height: max(320px, 400rem);
}
.footer-bottom-block {
	display: flex;
	align-items: flex-end;
	flex-direction: row-reverse;
	justify-content: space-between;
	padding: 0 0 max(24px, 30rem);
	gap: max(50px, 50rem);
	border-bottom: 1px solid var(--cream_50);
}
.footer-bottom-block h2 {
	margin: 0 0 min(-12px, -16rem);
	color: var(--desert);
}
.footer-logo img {
	width: max(164px, 357rem);
}
.footer-line {
	display: flex;
	align-items: center;
	padding: max(20px, 20rem) 0;
	color: var(--cream_50);
}
.footer-links {
	display: flex;
	margin: 0 0 0 auto;
}
.footer-links-item {
	margin: 0 max(50px, 135rem) 0 0;
	position: relative;
	color: var(--cream_50);
	text-decoration: none;
}
.footer-links-item::before {
	position: absolute;
	left: 0;
	bottom: 0;
	content: '';
	width: 100%;
	height: 1px;
	background: var(--cream_50);
	transition: transform 0.725s var(--eleos);
	transform-origin: 100% 50%;
	transform: scale(0, 1);
}
.footer-links-item:hover::before {
	transform: scale(1);
	transform-origin: 0% 50%;
}
.footer-studio img {
	width: max(25px, 25rem);
	margin: 0 max(2px, 2rem);
}
.footer-studio a {
	position: relative;
	color: var(--cream_50);
	text-decoration: none;
}
.footer-studio a::before {
	position: absolute;
	left: 0;
	bottom: 0;
	content: '';
	width: 100%;
	height: 1px;
	background: var(--cream_50);
	transition: transform 0.725s var(--eleos);
	transform-origin: 100% 50%;
	transform: scale(0, 1);
}
.footer-studio a:hover::before {
	transform: scale(1);
	transform-origin: 0% 50%;
}

/************************* popup *************************/
.thanks-popup {
	position: fixed;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 800;
	padding: 16px;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: all 0.4s ease-in-out;
}
.thanks-mask {
	position: absolute;
	inset: 0;
	background: var(--space_50);
}
.thanks-popup.vis {
	opacity: 1;
	visibility: visible;
	pointer-events: all;
}
.thanks-popup-wrap {
	position: relative;
	z-index: 10;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	width: 100%;
	max-width: max(420px, 470rem);
	padding: max(50px, 50rem) max(30px, 40rem);
	background: var(--white);
}
.thanks-popup-wrap h2 {
	margin: 0 0 max(20px, 24rem);
}
.thanks-text {
	margin: 0 0 max(24px, 36rem);
	color: rgba(0, 0, 0, 0.8);
}

/************************* media *************************/
@media screen and (max-width: 1440px) {
	.address-links {
		flex-direction: column;
		gap: max(18px, 20rem);
	}
	.address-links-item {
		width: auto;
	}
}
@media screen and (max-width: 1340px) {
	.subnav-block {
		display: flex;
		flex-wrap: wrap;
		gap: 32px 0;
	}
	.subnav-col {
		width: 33.33%;
		padding: 0 20px 0 0;
	}
	.footer-links-item {
		margin: 0 max(24px, 80rem) 0 0;
		position: relative;
		color: var(--cream_50);
		text-decoration: none;
	}
}
@media screen and (max-width: 1200px) {
	.footer-content {
		flex-wrap: wrap;
		gap: 40px 0;
	}
	.footer-col {
	    width: 50%;
	}
	.footer-copy {
		max-width: 310px;
	}
	.serv-block {
		gap: max(32px, 60rem);
	}
	.serv-side {
		width: max(280px, 362rem);
		min-width: max(280px, 362rem);
	}
	.team-block {
		grid-template-columns: repeat(3, 1fr);
	}
	.blog-block.project-catalog {
		grid-template-columns: repeat(2, 1fr);
	}

}
@media screen and (max-width: 1024px) {
	.header-logo {
		left: 0;
		transform: translateX(0%);
	}
	.mob-nav-icon {
		display: block;
	}
	.lock .mob-nav-icon.active .mob-nav-block::before,
	.lock .mob-nav-icon.active .mob-nav-block::after {background: var(--cream);}
	.lock .logo-default {opacity: 0;}
	.lock .logo-white {opacity: 1;}
	.header-nav {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 540;
		overflow: hidden;
		box-sizing: border-box;
		box-shadow: none;
		display: block;
		height: 0;
		background: var(--deep_ocean);
		transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
	}
	.header-nav.vis {
		height: 100dvh;
	}
	.header-nav-wrap {
		overflow: hidden;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 100dvh;
		padding-top: 107px;
		padding-bottom: 71px;
		flex-direction: column;
		justify-content: flex-start;
		align-items: stretch;
	}
	.header-nav-list {
		position: relative;
		left: auto;
		right: auto;
		top: auto;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		gap: 0;
		padding: 0 16px;
		height: 100%;
		margin: 0;
		overflow-y: auto;
	}
	.header-nav-list::before {display: none;}
	.header-nav-list > li {
		display: block;
		height: auto;
		border-bottom: 1px solid var(--desert_30);
	}
	.header-nav-list > li:last-child {
		border-bottom: 0;
	}
	.header-nav-list > li:nth-child(4) {
		margin-left: 0;
	}
	.nav-link {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 10px;
		padding: 14px 0;
		color: var(--cream);
	}
	.nav-parent::after {
		width: 24px;
		height: 24px;
		margin: 0;
		background: url(../images/nav-arrow-mob.svg) 0 100% no-repeat;
		background-size: contain;
	}
	.nav-link::before {display: none;}
	
	.subnav {
		display: none;
		position: static;
		width: auto;
		padding: 4px 0 28px 12px;
		backdrop-filter: none;
		background: none;
		border-radius: 0;
		transition: none;
		opacity: 1;
		visibility: visible;
		transform: none;
	}
	.subnav::before {display: none;}
	.subnav-list {
		gap: 12px;
	}
	.subnav-list a {
		display: block;
		color: var(--cream);
	}
	.subnav-list a::after {display: none;}
	.subnav-mob-link {
		display: block;
		margin: 0 0 12px;
		color: var(--cream);
		text-decoration: none;
	}
	.subnav-block {
		flex-direction: column;
		padding: 20px 0 0;
	}
	.subnav-col {
		width: 100%;
	}
	.subnav-block .subheading {
		margin: 0 0 16px;
		color: var(--desert_50);
	}
	.nav-bottom {
		position: absolute;
		left: 0;
		right: 0;
		top: auto;
		bottom: 0;
		display: block;
		padding: 10px 16px;
		align-items: center;
		transition: all 0.4s 0.3s;
		background: var(--deep_ocean);
	}
	.header-nav.vis .nav-bottom {
		opacity: 1;
		transform: translateY(0px);
		visibility: visible;
	}
	.nav-bottom .button {
		width: 100%;
		color: var(--deep_ocean);
		background: var(--cream);
	}
	.nav-bottom .button::after {display: none;}
	.footer-block {
		flex-direction: column;
		gap: 40px;
	}
	.footer-side, .footer-content {
		width: auto;
	}
	.footer-side {
		gap: 0;
	}
	.footer-nav {
		width: 50%;
	}
	.footer-line {
		flex-direction: column;
		align-items: stretch;
		gap: 20px;
	}
	.footer-links {
		order: -1;
		margin: 0;
	}
	.contact-block {
		flex-direction: column;
		gap: 52px;
	}
	.contact-info, .contact-form {
		width: 100%;
	}
	.article-block {
		flex-direction: column-reverse;
		gap: max(32px, 48rem);
	}
	.article-content {
		width: auto;
	}
	.blog-block {
		grid-template-columns: repeat(2, 1fr);
	}
	.project-block {
		flex-direction: column;
	}
	.project-side {
		display: none;
	}
	.project-content {
		width: auto;
	}
	.project-text {
		padding: 0;
	}
	.project-content .project-components {
		display: block;
		margin: 0 0 24px;
	}
	.serv-about {
		flex-direction: column;
		gap: 32px;
	}
	.serv-about-side {
		width: auto;
		min-width: 1px;
		padding: 0;
	}
	.serv-about-content {
		width: auto;
	}
	.project-section {
		flex-direction: column;
		gap: 32px;
	}
	.project-section-side {
		width: auto;
		min-width: 1px;
		padding: 0;
	}
	.project-controls {display: none;}
	.project-section-content {
		width: auto;
	}
	.serv-more .serv-list {
		grid-template-columns: repeat(2, 1fr);
	}
	.serv-block {
		display: block;
	}
	.serv-side {
		display: none;
	}
	.serv-content {
		display: flex;
		flex-direction: column;
		gap: max(12px, 32rem);
	}
	.serv-tab {
		display: block;
		border: 1px solid var(--deep_ocean_30);
	}
	.serv-tab.active {
		border-color: var(--deep_ocean);
	}
	.serv-mob-link {
		position: relative;
		display: block;
		padding: 16px 60px 16px 16px;
		font-size: 20px;
		line-height: 110%;
		letter-spacing: -0.04em;
		color: var(--deep_ocean);
		text-decoration: none;
	}
	.serv-mob-link::after {
		position: absolute;
		top: 50%;
		margin-top: -12px;
		right: 16px;
		content: '';
		width: 24px;
		height: 24px;
		background: url(../images/arrow-down-2.svg) 50% 50% no-repeat;
		background-size: contain;
		transition: all 0.4s ease-in-out;
	}
	.serv-mob-link.active::after {
		transform: rotate(180deg);
	}
	.serv-box {
		display: none;
		padding: 16px 16px 32px;
	}
	.vis .serv-box {
		display: block;
	}
	.serv-item h5::after {
		opacity: 1;
	}
	.cert-bg {display: none;}
	.cert-item::before {
		opacity: 1;
		transition-delay: 0;
	}
	.client-block {
		grid-template-columns: repeat(4, 1fr);
		gap: 10px;
	}
	.brand-title {
		width: 35%;
		min-width: 35%;
	}
	.awards-bg, .awards-line {display: none;}
	.awards-item {
		flex-direction: column;
		align-items: stretch;
		gap: 4px;
		padding-right: 30px;
	}
	.awards-item::before {
		opacity: 1;
		transition-delay: 0;
	}
	.awards-category,
	.awards-body {
		width: auto;
	}
	.awards-text {
		padding-right: 0;
	}
	.person-side {
		width: 360px;
		max-width: 360px;
	}
	.person-top {
		padding: 0;
	}
	.stage-tabs {
		display: none;
	}
	.stage-mob-link {
		position: relative;
		display: block;
		padding: 16px 60px 16px 16px;
		font-size: 20px;
		line-height: 110%;
		letter-spacing: -0.04em;
		color: var(--deep_ocean);
		text-decoration: none;
	}
	.stage-mob-link::after {
		position: absolute;
		top: 50%;
		margin-top: -12px;
		right: 16px;
		content: '';
		width: 24px;
		height: 24px;
		background: url(../images/arrow-down-2.svg) 50% 50% no-repeat;
		background-size: contain;
		transition: all 0.4s ease-in-out;
	}
	.stage-mob-link.active::after {
		transform: rotate(180deg);
	}
	.stage-tab {
		display: block;
		margin: 0 0 12px;
		border: 1px solid var(--deep_ocean_30);
	}
	.stage-tab.active {
		border-color: var(--deep_ocean);
	}
	.stage-tab:last-child {
		margin: 0;
	}
	.stage-block {
		display: none;
		padding: 0 16px 16px;
	}
	.vis .stage-block {
		display: block;
	}
	.stage-photo {
		width: auto;
		max-width: 480px;
	}
	.stage-side {
		width: auto;
		max-width: none;
		transition: none;
		opacity: 1;
		transform: translateY(0px);
	}
	.stage-top {
		position: relative;
		padding-right: 30px;
	}
	.stage-top::before,
	.stage-top::after {
		position: absolute;
		top: 0;
		right: 0;
		content: '';
		width: max(22px, 22rem);
		height: max(22px, 22rem);
		background: url(../images/plus.svg) 50% 50% no-repeat;
		background-size: max(22px, 22rem);
		opacity: 0;
	}
	.stage-top::before {
		opacity: 1;
		transition-delay: 0;
	}
	.stage-top::before {
		transition: height 0.3s ease-in-out, top 0.3s ease-in-out, opacity 0.2s ease-in-out 0.2s;
	}
	.stage-top::after {
		background: url(../images/minus.svg) 50% 50% no-repeat;
		background-size: contain;
		opacity: 0;
		transition: all 0.2s ease-in-out 0.2s;
	}
	.stage-top.active::before {
		height: 0px;
		top: max(11px, 11rem);
		opacity: 0;
	}
	.stage-top.active::after {
		opacity: 1;
	}
	.who {
		flex-direction: column;
		align-items: stretch;
		height: auto;
		gap: 100px;
	}
	.who-img {
		position: relative;
	}
	.who-img-1 {
		top: auto;
		left: auto;
	}
	.who-img-2 {
		right: auto;
		bottom: auto;
	}
	.who-main {
		max-width: none;
		text-align: left;
	}
	.who-second {
		display: block;
	}
	.who-second h2 {
		margin: 0 0 max(24px, 24rem);
	}
	.who-main-title .who-main-wrap:last-child,
	.ani_start .who-main .who-text:last-child {display: none;}
	.ani_start .who-text:first-child {
		opacity: 1;
	}
	.ani_start .who-main-wrap:first-child h2 {
		transform: translateY(0);
	}
	.catalog-main {
		flex-direction: column;
		gap: 32px;
	}
	.catalog-side {
		width: auto;
		min-width: 1px;
	}
	.catalog-content {
		padding: 0;
	}
	.sorting-mob {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 7px 0;
	}
	.sorting-tabs {
		display: flex;
	}
	.sorting-tabs-link {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 82px;
		height: 43px;
		padding: 10px;
		font-weight: 400;
		font-size: 16px;
		text-align: center;
		text-transform: uppercase;
		color: var(--deep_ocean);
		text-decoration: none;
		border: 1px solid rgba(18, 50, 69, 0.3);
	}
	.sorting-tabs-link.active {
		color: var(--cream);
		background: var(--deep_ocean);
	}
	.sorting-tabs-link:last-child {
		border-left: 0;
	}
	.filter-mob {
		display: flex;
		align-items: center;
		gap: 8px;
		font-size: 20px;
		line-height: 110%;
		letter-spacing: -0.04em;
		color: var(--deep_ocean);
		text-decoration: none;
	}
	.filter-mob::before {
		content: '';
		width: 18px;
		height: 18px;
		background: url(../images/filter.svg) 50% 50% no-repeat;
		background-size: contain;
	}
	.filter {
		position: fixed;
		inset: 0;
		z-index: 800;
		background: var(--cream);
		padding: 72px 0 122px;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transition: all 0.4s ease-in-out;
	}
	.filter.active {
		opacity: 1;
		visibility: visible;
		pointer-events: all;
	}
	.filter-title {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		padding: 20px 16px;
		margin: 0;
	}
	.filter-reset {display: none;}
	.filter-close {display: block;}
	.filter-close img {display: block;}
	.filter-main {
		height: 100%;
		overflow-y: auto;
		padding: 0 16px;
	}
	.filter-bottom {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		display: flex;
		flex-direction: column;
		padding: 0 12px 12px;
		background: var(--cream);
		border-top: 1px solid rgba(61, 103, 80, 0.2);
	}
	.filter-selected {
		padding: 20px 0;
		font-family: var(--font5);
		font-weight: 400;
		font-size: 18px;
		line-height: 110%;
		letter-spacing: -0.04em;
		text-align: center;
		font-style: normal;
		color: #2c2c2c;
		opacity: 0.6;
	}
	.catalog-tab {
		display: none;
		padding: 0;
		margin: 0;
		border-bottom: 0;
	}
	.catalog-tab.vis {
		display: block;
	}

	
}
@media screen and (max-width: 767px) {
	.footer-block {
        position: relative;
		flex-direction: row;
        gap: 0;
		padding-bottom: 170px;
    }
	.footer-side, .footer-content {
        width: 50%;
    }
	.footer-content {
		gap: 38px 0;
	}
	.footer-col {
	    width: 100%;
	}
	.footer-side {
		flex-direction: column;
		gap: 70px;
	}
	.footer-more {
		position: absolute;
		left: 0;
		bottom: 0;
	}
	.footer-bottom {
		background: url(../images/footer-bg-mob.jpg) 50% 100% no-repeat;
		background-size: cover;
	}
	.footer-bottom-block {
		flex-direction: column;
		align-items: flex-start;
		padding: 50px 0 24px;
	}
	.footer-bottom .holder {
		height: auto;
	}
	.footer-links {
		justify-content: space-between;
		gap: 0;
	}
	.page404 {
		height: 667px;
		padding: 66px max(16px, 50rem);
		background: url(../images/404-mob.jpg) 50% 20% no-repeat;
		background-size: cover;
	}
	.policy h1 {
		text-align: left;
	}
	.input-box .wpcf7-form-control-wrap {
    	width: 100%;
	}
	.form-bottom {
		flex-direction: column;
		gap: 24px;
	}
	.button {
		width: 100%;
	}
	.address-line {
		flex-direction: column;
		gap: 18px;
	}
	.address-item .subheading {
		margin: 0 0 18px;
		color: var(--deep_ocean_50);
	}
	.address-text {
		max-width: none;
		width: auto;
	}
	.career-main p {
		margin-left: 0;
	}
	.career-main h2 {
		margin: 0 0 32px;
	}
	.career-main h2:first-child {
		padding-top: 0;
	}
	.article {
		padding-top: 24px;
	}
	.blog-more {
		position: relative;
		padding-bottom: 70px;
	}
	.blog-more-top {
		position: static;
	}
	.blog-more-top .link {
		position: absolute;
		top: auto;
		right: auto;
		left: 50%;
		transform: translateX(-50%);
		bottom: 0;
	}
	.thumbs-col {
		display: none;
	}
	.gallery-block {
		display: block;
	}
	.gallery-slider {
		width: auto;
		margin: 0 -20px 0 0;
	}
	.gallery-slide {
		width: 320px;
		padding: 0 10px 0 0;
	}
	.blog-tabs {
		justify-content: space-between;
	}
	.cert-item {
		flex-direction: column;
		gap: 0;
	}
	.cert-name {
		width: auto;
		padding: 0;
	}
	.cert-body {
		width: auto;
		display: none;
		padding: 16px 0 0;
	}
	.cert-hidden {
		display: block;
	}
	.client-block {
		grid-template-columns: repeat(3, 1fr);
	}
	.brand-top {
		flex-direction: column;
		gap: 32px;
		margin: 0 0 32px;
	}
	.brand-top-side {
		width: auto;
	}
	.brand-item {
		flex-direction: column;
		align-items: stretch;
	}
	.brand-title {
        width: auto;
        min-width: 1px;
    }
	.brand-item .button {
		width: auto;
		margin: 0 auto 0 0;
	}
	.person {
		flex-direction: column;
	}
	.person-side {
		display: none;
	}
	.person-content {
		width: auto;
	}
	.person-content .person-photo {
		display: block;
		position: static;
	}
	.team-block {
		grid-template-columns: repeat(2, 1fr);
	}
	.link-section {
		position: relative;
		padding-bottom: 50px;
	}
	.link-top {
		position: static;
	}
	.link-section .link-top .link {
        position: absolute;
        top: auto;
        right: auto;
        left: 50%;
        transform: translateX(-50%);
        bottom: 0;
    }
	.link-section .client-item:nth-child(n + 11) {
		display: none;
	}
	.mirage-mask {
		transform-origin: 63% 50%;
	}
	.hero-slider .hero-slide {
		min-height: 667px;
	}
	.hero-content {
		flex-direction: column;
		align-items: flex-start;
		gap: 32px;
	}
	h1 {
		line-height: 100%;
	}
	.hero-right {
		padding: 0;
	}
	.hero-controls {
		justify-content: flex-start;
		margin: 0;
	}
	.hero-info {
		max-width: none;
	}
	.hero-info-slide {
		text-align: left;
	}
	.main-about {
		flex-direction: column;
		gap: 32px;
	}
	.main-about-side {
		width: auto;
	}
	.main-about-content {
		width: auto;
	}
	.main-about-bottom {
		flex-direction: column;
		padding: 0;
	}
	.num-content {
		top: 72px;
	}
	.num-title {
		position: static;
		transform: none;
		margin: 0 0 52px;
	}
	.num-top, .num-bottom {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		gap: 52px 0;
	}
	.num-top {
		margin: 0 0 14px;
	}
	.num-item {
		position: static;
		width: calc(50% - 8px);
	}
	.num-top .num-item:nth-child(2),
	.num-bottom .num-item:nth-child(2) {
		transform: none;
		text-align: left;
	}
	.num-top .num-item:nth-child(3) {
		margin-left: auto;
	}
	.num-bottom .num-item:nth-child(1){
		width: 100%;
	}
	.num-top .num-item:nth-child(2) .num-text {
		max-width: 160px;
	}
	.num-text {
		margin-top: 4px;
	}
	.timeline {
		padding: 0 16px;
	}
	.timeline::before, .timeline::after {display: none;}
	.timeline h2 {
		max-width: 280px;
		margin: 0 auto max(32px, 32rem);
	}
	.mirage {
		display: none;
	}
	.mirage-mob {
		display: block;
		overflow: hidden;
		height: 465px;
	}
	.mirage-mob img {
		width: 100%;
		height: 140%;
		object-fit: cover;
		transition: all 1.4s var(--slow);
	}
	.parallax_start.mirage-mob img {
		transform: translateY(-24%);
	}
	.about-top-block {
		flex-direction: column;
	}
	.about-top-col {
		width: auto;
	}
	.leadership-top {
		flex-direction: column;
	}
	.leadership-col {
		width: auto;
	}
	.creative {
		height: 1030px;
		max-height: none;
		margin: 0 min(-16px, -50rem);
	}
	.creative-item:nth-child(2),
	.creative-item:nth-child(3){
		position: static;
		transform: translateY(0);
		opacity: 1;
	}
	.creative-content {
		padding-bottom: 190px;
	}
	.creative-block {
		display: flex;
		flex-direction: column;
		gap: 32px;
	}
	.creative-block .creative-item {
		transform: translateY(50px);
		opacity: 0;
		transition: all 0.5s ease-in-out;
	}
	.creative-item:nth-child(2) {transition-delay: 0.2s;}
	.creative-item:nth-child(3) {transition-delay: 0.4s;}
	.ani_start .creative-item {
		transform: translateY(0px);
		opacity: 1;
	}
	.catalog-top {
		flex-direction: column;
		gap: 32px;
	}
	.catalog-top-col {
		width: auto;
	}


}
@media screen and (max-width: 576px) {
	.career-main h2 {
		max-width: 340px;
	}
	.blog-block,
	.serv-more .serv-list,
	.team-block,
	.serv-list,
	.blog-block.project-catalog {
		grid-template-columns: repeat(1, 1fr);
	}
	.client-block {
		grid-template-columns: repeat(2, 1fr);
	}
	.main-about-img {
		width: 100%;
	}
	.who-img {
        width: 100%;
    }

}