@font-face {
    font-family: 'Aspekta Variable';
    src: url('../fonts/AspektaVF.woff2') format('woff2'),
        url('../fonts/AspektaVF.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}
:root{
	--black: #000;
	--black-800: rgba(0, 0, 0, 0.8);
	--black-700: rgba(0, 0, 0, 0.7);
	--black-600: rgba(0, 0, 0, 0.6);
	--black-400: rgba(0, 0, 0, 0.4);
	--black-200: rgba(0, 0, 0, 0.2);
	--grey: #c3c3c3;
	--white: #fff;
	--white-800: rgba(255, 255, 255, 0.8);
	--white-700: rgba(255, 255, 255, 0.7);
	--white-400: rgba(255, 255, 255, 0.4);
	--dark-blue: #0c273c;
	--red: #af2838;
	--light-blue: #afd5eb;

	--font-family: "Aspekta Variable", sans-serif;

	--h1: max(44px, 80rem);
	--h2: max(32px, 54rem);
	--h3: max(24px, 32rem);
	--h4: max(20px, 24rem);

	--body_L: max(18px, 20rem);
	--body_M: max(16px, 18rem);
	--body_S: max(14px, 16rem);
	--button: max(16px, 20rem);
	--tag: max(14px, 16rem);
	--caption: max(12px, 16rem);

	--duration: .4s;
    --ease: cubic-bezier(.38, .005, .215, 1);
	--ease-out-expo: cubic-bezier(0.19, 1, 0.22, 1);
}
::selection {
	color: var(--white);
	background-color: var(--black);
}
.tabs-block ::selection,
.prod-label::selection,
.button ::selection {
	color: var(--black);
	background-color: var(--white);
}
/************************* reset *************************/
html{
	height: 100%;
	margin: 0;
	padding: 0;width: 100%;
	background: var(--dark-blue);
	font-size: 0.0625vw;
}
body{
	height: 100%;
	width: 100%;
	position: relative;
	margin: 0;
	padding: 0;
	color: var(--black);
	font-weight: 420;
	font-size: var(--body_L);
	line-height: 120%;
	letter-spacing: -0.04em;
	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(20px, 20rem);
}
h1, .h1 {
	display: block;
	font-weight: 470;
	font-size: var(--h1);
	line-height: 94%;
	letter-spacing: -0.04em;
}
h2, .h2 {
	display: block;
	font-weight: 440;
	font-size: var(--h2);
	line-height: 100%;
	letter-spacing: -0.04em;
}
h3, .h3 {
	display: block;
	font-weight: 440;
	font-size: var(--h3);
	line-height: 100%;
	letter-spacing: -0.04em;
}
h4, .h4 {
	display: block;
	font-weight: 440;
	font-size: var(--h4);
	line-height: 100%;
	letter-spacing: -0.04em;
}
a {transition: all 0.4s;}
p {margin: 0 0 max(22px, 24rem);}
p:last-child {margin: 0;}
p a, .article li a {color: var(--black);}
.center {text-align: center;}
.upper {text-transform: uppercase;}
.button-holder {text-align: center;}
.button {
	position: relative;
	display: inline-flex;
	gap: max(4px, 4rem);
	color: var(--black);
	text-decoration: none;
}
.button-main {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: max(10px, 10rem) max(28px, 40rem);
	font-weight: 470;
	font-size: var(--button);
	line-height: 100%;
	letter-spacing: -0.04em;
	color: var(--black);
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	background: var(--white);
	border-radius: max(8px, 8rem);
	transition: all .3s linear;
}
.button-arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: max(48px, 56rem);
	width: max(48px, 56rem);
	height: max(48px, 56rem);
	background: var(--white);
	border-radius: max(8px, 8rem);
	transition: all .3s linear;
}
.button-icon {
    position: relative;
    z-index: 1;
    overflow: hidden;
	width: max(18px, 18rem);
	height: max(18px, 18rem);
}
.button-icon::before,
.button-icon::after {
    display: block;
	width: 100%;
	height: 100%;
	content: '';
	background: url(../images/button-arrow.svg) 50% 50% no-repeat;
	background-size: contain;
    transition: transform var(--duration) var(--ease);
}
.button-icon::after {
    position: absolute;
	left: 0;
    top: 0;
    transform: translate(-110%, 110%);
}
.button:hover .button-icon::before {
    transform: translate(100%, -100%);
}
.button:hover .button-icon::after {
    transform: translateY(0);
}
.button-dark .button-main {
	color: var(--white);
	background: var(--dark-blue);
}
.button-dark .button-arrow {
	background: var(--dark-blue);
}
.button-dark:hover .button-main,
.button-dark:hover .button-arrow {
	background: var(--red);
}
.button-dark .button-icon::before,
.button-dark .button-icon::after {
	background: url(../images/button-arrow-white.svg) 50% 50% no-repeat;
	background-size: contain;
}

/************************* form-block *************************/
.wpcf7-form-control-wrap input {
	display: block;
	width: 100%;
	height: max(50px, 52rem);
	padding: 0 max(24px, 24rem);
	margin: 0 0 max(12px, 12rem);
	font-size: var(--body_L);
	color: var(--black);
	background: var(--white);
	border-radius: max(8px, 8rem);
}
.wpcf7-form-control-wrap textarea {
	display: block;
	width: 100%;
	height: max(120px, 140rem);
	padding: max(24px, 24rem);
	margin: 0 0 max(12px, 12rem);
	font-size: var(--body_L);
	color: var(--black);
	resize: vertical;
	background: var(--white);
	border-radius: max(8px, 8rem);
}
.wpcf7-form-control-wrap input:focus,
.wpcf7-form-control-wrap textarea:focus {
	background-color: var(--white-800);
}
.inactive {
	opacity: 0.4;
	pointer-events: none;
}
::-webkit-input-placeholder {color: var(--black-800);}
:-moz-placeholder {color: var(--black-800); opacity: 1;}
::-moz-placeholder {color: var(--black-800); opacity: 1;}
:-ms-input-placeholder {color: var(--black-800);}
.form-black .wpcf7-form-control-wrap input,
.form-black .wpcf7-form-control-wrap textarea {
	background: var(--white);
	border-color: var(--white);
}
.error-msg {
	display: none;
	margin: 0 0 max(12px, 12rem);
	color: var(--red);
	font-size: var(--body_L);
	line-height: 120%;
}
.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(6px, 6rem));
}
.form-button {
	padding: max(20px, 20rem) 0 0;
}
.form-button .button {
	max-width: none;
}
.check-item {
	position: relative;
	margin: 0 0 10px;
}
.check-input {
	position: absolute;
	left: 0;
	width: 1px;
	height: 1px;
	opacity: 0;
}
.check-label {
	display: block;
	padding: 0 0 0 27px;
	color: #807A7E;
	font-size: 14px;
	line-height: 20px;
	cursor: pointer;
}
.check-label a {color: #fff;}
.check-label:before {
	position: absolute;
	top: 3px;
	left: 0;
	display: block;
	content: '';
	width: 12px;
	height: 12px;
	box-sizing: border-box;
	background: #fff;
	border-radius: 2px;
}
.check-label:after {
	position: absolute;
	top: 3px;
	left: 0;
	display: block;
	content: '';
	width: 12px;
	height: 12px;
	background: url(../images/check.svg) 50% 50% no-repeat;
	background-size: 8px;
	opacity: 0;
}
.check-input:checked + .check-label:after {opacity: 1;}
.check-input:checked + .check-label {color: #D57056;}
/************************* wrapper *************************/
#wrapper {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 100dvh;
	background: var(--white);
}
body.lock {overflow: hidden;}
/************************* header *************************/
.header-mask {
	position: fixed;
	inset: 0;
	z-index: 250;
	background: var(--black-700);
	opacity: 0;
	visibility: hidden;
	transition: all 0.5s;
}
.header-mask.vis {
	opacity: 1;
	visibility: visible;
}
.header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 300;
	height: max(56px, 103rem);
	backdrop-filter: blur(30px);
	background: rgba(255, 255, 255, 0.05);
	transition: all 0.6s var(--ease);
}
.header.animate {
	top: min(-56px, -103rem);
}
.header.ani_start {
	top: 0;
}
.header-delay.ani_start {
	transition-delay: 1s;
}
.header.header-up {
    top: min(-56px, -103rem);
}
.header-block {
	display: flex;
	align-items: center;
	gap: max(24px, 40rem);
	height: max(56px, 103rem);
	position: relative;
}
.header-logo {
	overflow: hidden;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 550;
	width: max(111px, 182rem);
	transition: all 0.4s ease-in;
}
.header-logo img {
	width: max(111px, 182rem);
	transition: all 0.3s linear;
}
.logo-black {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
}
.header-nav {
	flex: 1;
}
.header-nav-list {
	display: flex;
	gap: max(24px, 40rem);
}
.header-nav-list li:nth-child(5){
	margin-right: auto;
}
.header-nav-list > li {
	font-size: var(--body_M);
	line-height: 120%;
}
.header-nav-list > li > a {
	position: relative;
	color: var(--white);
	text-decoration: none;
}
.header-nav-list > li > a::before {
	position: absolute;
	left: 0;
	bottom: 0px;
	content: '';
    display: block;
    width: 0;
    height: 1px;
    background: var(--white);
    transition: width .3s;
}
.header-nav-list > li > a:hover::before,
.header-nav-list > li > a.active::before,
.header-nav-list.list-active > li > a.active::before {
    width: 100%;
}

.subnav {
	position: absolute;
	left: 0;
	right: 0;
	top: max(115px, 115rem);
	transition: all 0.4s;
	opacity: 0;
	visibility: hidden;
	transform: translateY(20px);
}
.subnav-block {
	display: flex;
	justify-content: space-between;
}
.subnav-content {
	width: calc(50% - 10px);
	overflow-y: auto;
	height: max(300px, 360rem);
	scrollbar-width: none; 
  	-ms-overflow-style: none;
}
.subnav-content::-webkit-scrollbar {
  display: none;
}
.subnav-list {
	display: flex;
	flex-direction: column;
}
.subnav-item {
	padding: max(15px, 15rem) 0;
	font-weight: 440;
	font-size: var(--h2);
	line-height: 100%;
	letter-spacing: -0.04em;
	color: var(--black);
	text-decoration: none;
	border-bottom: 1px solid var(--black-200);
}
.subnav-list:hover .subnav-item {
	color: var(--black-200);
}
.subnav-list:hover .subnav-item:hover {
	color: var(--black);
}
.nowrap {
	white-space: nowrap;
}
.subnav-arrow {
	position: relative;
	overflow: hidden;
	display: inline-block;
	vertical-align: top;
	width: max(24px, 32rem);
	height: max(24px, 32rem);
	margin: max(5px, 15rem) 0 0 max(8px, 10rem);
}
.subnav-arrow::after {
	position: absolute;
	inset: 0;
	content: '';
	background: url(../images/arrow-red.svg) 50% 50% no-repeat;
	background-size: contain;
	transform: translate(-100%, 100%);
	transition: all 0.5s var(--ease);
}
.subnav-item:hover .subnav-arrow::after {
	transform: translate(0%, 0%);
}

.subnav-media {
	width: calc(50% - 10px);
	overflow: hidden;
	position: relative;
	border-radius: max(8px, 8rem);
}
.subnav-video {
	position: relative;
	height: max(300px, 360rem);
}
.subnav-video .video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.subnav-img {
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 0%;
	transition: all 0.5s var(--ease);
}
.subnav-img.vis {
	z-index: 20;
	height: 100%;
}
.subnav-img img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: max(300px, 360rem);
	object-fit: cover;
	transition: all 0.4s ease-in;
	transform: scale(1.1);
}
.subnav-img.vis img {
	transform: scale(1);
}

.nav-bottom {
	position: absolute;
	left: 0;
	right: 0;
	top: max(512px, 532rem);
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	transition: all 0.4s;
	opacity: 0;
	visibility: hidden;
	transform: translateY(20px);
}
.nav-button {display: none;}
.nav-caption {
	max-width: max(240px, 300rem);
	font-weight: 560;
	font-size: var(--caption);
	line-height: 120%;
	text-transform: uppercase;
	color: var(--black-600);
}
.nav-phone {
	font-size: var(--body_M);
	line-height: 120%;
	color: var(--black-600);
	text-decoration: none;
}
.nav-phone:hover {
	color: var(--black);
}
.nav-bottom .bio-linkedin {
	position: static;
	width: max(36px, 36rem);
	height: max(36px, 36rem);
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: max(4px, 4rem);
}
.nav-bottom .bio-linkedin svg {
	width: max(16px, 16rem);
	height: max(16px, 16rem);
}
.nav-bottom .bio-linkedin:hover {
	border-color: var(--dark-blue);
}

.header.open {
	margin: max(20px, 20rem);
	padding: 0 12px;
	height: max(580px, 600rem);
	background: var(--white);
	border-radius: max(8px, 8rem);
}
.header.open .header-logo {
	width: max(43px, 70rem);
}
.header.open .logo-black {opacity: 1;}
.header.open .logo-white {opacity: 0;}
.header.open .header-nav-list > li > a {
	color: var(--black);
}
.header.open .header-nav-list > li > a::before {
    background: var(--black);
}
.header.open .mob-nav-block:after,
.header.open .mob-nav-block:before {
    background: var(--black);
}
.header.open .nav-bottom {
	opacity: 1;
	visibility: visible;
	transform: translateY(0px);
	transition-delay: 0.3s;
}
.header.open .subnav.vis {
	opacity: 1;
	visibility: visible;
	transform: translateY(0px);
	transition-delay: 0.3s;
}
.header.open .header-nav-list.list-active > li > a::before,
.header-white.open .header-nav-list.list-active > li > a.active::before,
.header-fixed.open .header-nav-list.list-active > li > a.active::before {
	width: 0%;
}
.header.open .header-nav-list.list-active > li > a.parent-active::before,
.header.open .header-nav-list.list-active > li > a:hover::before {
	width: 100%;
}

.header-white, .header-fixed {
	background: var(--white);
}
.header-white .logo-black,
.header-fixed .logo-black {opacity: 1;}
.header-white .logo-white,
.header-fixed .logo-white {opacity: 0;}
.header-white .header-nav-list > li > a,
.header-fixed .header-nav-list > li > a {
	color: var(--black);
}
.header-white .mob-nav-block:after,
.header-white .mob-nav-block:before,
.header-fixed .mob-nav-block:after,
.header-fixed .mob-nav-block:before {
    background: var(--black);
}
.header-white .header-nav-list.hover > li > a,
.header-fixed .header-nav-list.hover > li > a {
	color: var(--black);
}
.header-white .header-nav-list > li > a::before,
.header-fixed .header-nav-list > li > a::before {
	background: var(--black);
}

.mob-nav-icon {
	position: relative;
	z-index: 550;
	padding: 10px 0;
}
.mob-nav-block {
    position: relative;
	display: block;
    width: 40px;
    height: 2px;
    margin: 3px 0;
	transition: all .3s linear;
}
.mob-nav-block:after {
    content: "";
    position: absolute;
    top: -3px;
    left: 0;
    width: 40px;
    height: 2px;
    background: var(--white);
	transition: all .3s linear;
}
.mob-nav-block:before {
    content: "";
    position: absolute;
    top: 3px;
    left: 0;
    width: 40px;
    height: 2px;
    background: var(--white);
	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);
}
/************************* hero *************************/
.hero {
	position: relative;
	overflow: hidden;
	height: max(700px, 900rem);
	max-height: 100dvh;
	margin: 0 0 max(120px, 200rem);
	background: linear-gradient(180deg, #0c273c 0%, #39566A 100%);
}
.hero::before {
	position: absolute;
	inset: 0;
	content: '';
	background: url(../images/hero-eagle.png) 50% 50% no-repeat;
	background-size: cover;
	opacity: 0;
	transform: scale(1.3);
	transition: opacity 0.3s linear 0.3s, transform 0.8s var(--ease) 0.3s;
}
.hero::after {
	position: absolute;
	inset: 0;
	content: '';
	opacity: 1;
	background: linear-gradient(160deg, #0c273c 0%, rgba(12, 39, 60, 0) 100%);
	transition: opacity 0.4s linear;
}
.hero-block {
	position: absolute;
	z-index: 20;
	left: max(20px, 20rem);
	bottom: max(28px, 40rem);
	color: var(--white);
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.6s var(--ease) 1s, transform 0.8s var(--ease) 1s;
}
.hero-block h1 {
	max-width: max(360px, 620rem);
	margin: 0 0 max(24px, 32rem);
}
.hero-text {
	max-width: max(560px, 620rem);
	margin: 0 0 max(24px, 24rem);
}
.hero-caption {
	position: absolute;
	z-index: 20;
	right: max(20px, 20rem);
	bottom: max(280px, 342rem);
	max-width: max(240px, 300rem);
	font-weight: 560;
	font-size: var(--caption);
	line-height: 120%;
	text-transform: uppercase;
	text-align: right;
	color: var(--white-800);
	opacity: 0;
	transition: opacity 0.8s var(--ease) 1s;
}
.ani_start.hero::before {
	opacity: 1;
	transform: scale(1);
}
.ani_start.hero::after {
	opacity: 0;
}
.ani_start .hero-caption {
	opacity: 1;
}
.ani_start .hero-block {
	opacity: 1;
	transform: translateY(0px);
}
.with-video::after {
	display: none;
}
.video-bg {
	position: absolute;
	inset: 0;
}
.video-bg video,
.video-bg img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}


/************************* about *************************/
.about .top {
	margin: 0 0 max(40px, 40rem);
}
.about-banner {
	position: relative;
	overflow: hidden;
	height: max(350px, 600rem);
	margin: 0 0 max(40px, 40rem);
	border-radius: max(8px, 8rem);
}
.about-banner .video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.top-col h3 {
	max-width: max(440px, 600rem);
}

/************************* work *************************/
.work .top-line {
	margin: 0 0 max(60px, 60rem);
}
.main-how-text {
	display: none;
}
.main-how .how-item {
	opacity: 0;
    transform: translateY(30px);
    transition: all 0.7s var(--ease);
}
.main-how .how-item:nth-child(2){transition-delay: 0.1s;}
.main-how .how-item:nth-child(3){transition-delay: 0.2s;}
.main-how .how-item:nth-child(4){transition-delay: 0.3s;}
.main-how .how-item:nth-child(5){transition-delay: 0.4s;}
.ani_start2.main-how .how-item {
	opacity: 1;
    transform: translateY(0px);
}

/************************* hero-min *************************/
.hero-min {
	position: relative;
	overflow: hidden;
	margin: 0 0 max(120px, 200rem);
	background: url(../images/hero-min.jpg) 50% 50% no-repeat;
	background-size: cover;
}
.hero-min-block {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: max(175px, 235rem) 0 max(90px, 165rem);
	gap: max(24px, 32rem);
	text-align: center;
	color: var(--white);
}
.hero-min-text {
	max-width: max(430px, 480rem);
}
.hero-text-2 {
	max-width: max(530px, 590rem);
}

/************************* breadcrumbs *************************/
.breadcrumbs {
	position: absolute;
	top: max(96px, 143rem);
	left: 0;
	right: 0;
	z-index: 20;
	display: flex;
	gap: max(12px, 12rem);
	padding: 0 max(20px, 20rem);
	margin: 0;
}
.breadcrumbs li {
	display: flex;
	align-items: flex-start;
	gap: max(12px, 12rem);
	padding: 0;
	margin: 0;
	font-weight: 420;
	font-size: var(--body_M);
	line-height: 120%;
	letter-spacing: -0.04em;
	color: var(--grey);
	list-style: none;
}
.breadcrumbs li::before {
	display: block;
	content: '/';
	color: var(--white);
}
.breadcrumbs li:first-child::before {display: none;}
.breadcrumbs a {
	position: relative;
	color: var(--white);
	text-decoration: none;
}
.breadcrumbs a::after {
	position: absolute;
	left: 0;
	bottom: -1px;
	content: '';
    display: block;
    width: 0;
    height: 1px;
    background: var(--white);
    transition: width .3s;
}
.breadcrumbs a:hover::after {
    width: 100%;
}
.breadcrumbs-black {
	top: max(96px, 123rem);
}
.breadcrumbs-black li::before {
	color: var(--black);
}
.breadcrumbs-black a {
	color: var(--black);
}
.breadcrumbs-black a::after {
    background: var(--black);
}

/************************* section *************************/
.section {
	margin: 0 0 max(120px, 200rem);
}

/************************* box *************************/
.box-section .top h2 {
    max-width: max(400px, 800rem);
	margin: 0 0 max(24px, 40rem);
}
.box-block {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: max(52px, 80rem) 20px;
	margin: 0 0 max(52px, 80rem);
}
.box-block:last-child {
	margin: 0;
}
.box-item {
	color: var(--black);
	text-decoration: none;
	transition: none;
}
.box-img {
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	height: max(350px, 500rem);
	margin: 0 0 max(20px, 20rem);
	border-radius: max(8px, 8rem);
}
.box-img img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.5s var(--ease);
}
.box-item:hover .box-img img {
	transform: scale(1.1);
	transition-delay: 0.12s;
}
.box-mask {
	position: relative;
	z-index: 10;
	margin: -10000rem;
	padding: 10000rem;
	width: calc(100% + 20000rem);
	aspect-ratio: 1/1;
	display: flex;
	align-items: center;
	justify-content: center;
	clip-path: shape(evenodd from 50% 0%, curve to 100% 50% with 77.61% 0% / 100% 22.39%, curve to 50% 100% with 100% 77.61% / 77.61% 100%, curve to 0% 50% with 22.39% 100% / 0% 77.61%, curve to 50% 0% with 0% 22.39% / 22.39% 0%, close, move to 49.21% 45.45%, curve to 37.54% 47.52% with 45.99% 44.23% / 39.98% 44.85%, curve to 38.03% 47.5% with 37.7% 47.52% / 37.86% 47.51%, curve to 40.02% 47.4% with 38.69% 47.46% / 39.36% 47.43%, curve to 40.47% 47.38% with 40.17% 47.39% / 40.32% 47.39%, curve to 44.36% 48.27% with 41.78% 47.35% / 43.31% 47.43%, curve to 44.83% 48.87% with 44.61% 48.55% / 44.61% 48.55%, curve to 45.08% 49.24% with 44.95% 49.05% / 44.95% 49.05%, curve to 45.35% 49.63% with 45.17% 49.37% / 45.26% 49.5%, curve to 52.64% 55.01% with 47.11% 52.18% / 49.51% 54.38%, curve to 62.16% 52.34% with 56.1% 55.59% / 59.38% 54.3%, curve to 62.47% 52.11% with 62.26% 52.27% / 62.36% 52.19%, line to 62.47% 51.99%, curve to 62.02% 51.91% with 62.24% 51.95% / 62.24% 51.95%, curve to 58.5% 50.86% with 60.78% 51.67% / 59.66% 51.38%, curve to 57.65% 50.5% with 58.22% 50.74% / 57.94% 50.62%, curve to 52.47% 47.38% with 55.73% 49.68% / 54.11% 48.66%, curve to 49.45% 45.54% with 51.5% 46.63% / 50.59% 45.99%, curve to 49.21% 45.45% with 49.37% 45.51% / 49.29% 45.48%, close);
	transition: all 0.5s ease-in-out;
}
.box-mask img {
	position: static;
	height: max(350px, 500rem);
}
.box-mask2 {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(10px);
}
.box-item:hover .box-mask {
	margin: -1120rem;
	padding: 1120rem;
	width: calc(100% + 2240rem);
}
.box-item h3 {
	margin: 0 0 max(12px, 12rem);
}
.box-item h3:last-child {margin: 0;}
.box-text {
	max-width: max(610px, 660rem);
	color: var(--black-800);
}
.box-date {
	margin: 0 0 max(6px, 6rem);
	font-size: var(--body_M);
	line-height: 120%;
	color: var(--black-800);
}
.box-tag {
	position: absolute;
	top: max(20px, 32rem);
	right: max(20px, 32rem);
	z-index: 20;
	padding: max(12px, 12rem) max(24px, 24rem);
	font-weight: 400;
	font-size: var(--tag);
	line-height: 100%;
	letter-spacing: -0.04em;
	color: var(--white);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: max(4px, 4rem);
}
.box-img .button {
	position: absolute;
	z-index: 20;
	left: max(20px, 32rem);
	bottom: max(20px, 32rem);
	transform: translateY(250%);
	transition: all 0.5s var(--ease);
}
.box-item:hover .box-img .button {
	transform: translateY(0);
	transition-delay: 0.15s;
}

/************************* top *************************/
.top {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: max(24px, 24rem);
	text-align: center;
}
.top-tag {
	padding: max(12px, 12rem) max(24px, 24rem);
	font-weight: 470;
	font-size: var(--button);
	line-height: 100%;
	letter-spacing: -0.04em;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: max(4px, 4rem);
}
.top-text {
	max-width: max(590px, 650rem);
	color: var(--black-800);
}
.top h2 {
	max-width: max(480px, 920rem);
}
.top-line {
	display: flex;
	justify-content: space-between;
	text-align: left;
	width: 100%;
	margin: 0 0 max(40px, 40rem);
}
.top-col {
	width: calc(50% - 10px);
}
.top .top-col h2 {
    max-width: max(280px, 530rem);
}
.management .top-col h2 {
    max-width: max(330px, 610rem);
}
.top-col .top-text {
    margin: 0 0 max(24px, 40rem);
}
.top-col .top-text:last-child {
	margin: 0;
}
.top-left {
	align-items: flex-start;
	text-align: left;
}

/************************* box-projects *************************/
.box-projects {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
}
.box-projects .box-item {
	width: calc(58.5% - 10px);
}
.box-projects .box-item:nth-child(4n),
.box-projects .box-item:nth-child(4n + 1){
	width: calc(41.5% - 10px);
}
.box-projects .box-item:nth-child(4n) .box-img,
.box-projects .box-item:nth-child(4n) .box-mask img,
.box-projects .box-item:nth-child(4n + 1) .box-img,
.box-projects .box-item:nth-child(4n + 1) .box-mask img {
	height: max(240px, 350rem);
}
.box-projects .box-item:hover .box-mask {
	margin: -1320rem;
	padding: 1320rem;
	width: calc(100% + 2640rem);
}
.box-projects .box-item:nth-child(4n):hover .box-mask,
.box-projects .box-item:nth-child(4n + 1):hover .box-mask {
	margin: -950rem;
	padding: 950rem;
	width: calc(100% + 1900rem);
}
.box-block-tag .box-img::before {
	position: absolute;
	inset: 0;
	z-index: 15;
	content: '';
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 45%);
}

/************************* info *************************/
.filter {
	display: flex;
	align-items: flex-start;
	gap: max(80px, 140rem);
	margin: 0 0 max(40px, 40rem);
}
.filter-tabs {
	flex: 1;
}
.filter-tabs-block {
	display: flex;
	flex-wrap: wrap;
	gap: max(12px, 12rem);
}
.tab {
	padding: max(11px, 11rem) max(23px, 23rem);
    font-weight: 400;
    font-size: var(--tag);
    line-height: 100%;
    letter-spacing: -0.04em;
	color: var(--black);
	text-decoration: none;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: max(4px, 4rem);
}
.tab:hover {
	background: #f3f3f3;
}
.tab.active {
	color: var(--white);
	background: var(--dark-blue);
	border-color: var(--dark-blue);
}
.tab.filter-all {
	color: var(--white);
	background: var(--dark-blue);
	border-color: var(--dark-blue);
}
.filter-mob {
	display: none;
}

/************************* box-slider *************************/
.box-slider-section h2 {
	margin: 0 0 max(40px, 40rem);
}
.box-slider {
	margin: 0 -10px;
}
.box-slider .box-item {
	padding: 0 10px;
}
.box-slider .slick-arrow {
	top: min(-72px, -94rem);
}
.box-slider .slick-prev {
	right: max(66px, 66rem);
}
.box-slider .slick-next {
	right: max(10px, 10rem);
}

/************************* project *************************/
.project h1 {
    margin: 0 0 max(20px, 40rem) max(340px, 395rem);
}
.project-block {
	display: flex;
	flex-direction: row-reverse;
	gap: max(20px, 20rem);
}
.project-content {
	flex: 1;
}
.project-img {
	overflow: hidden;
    height: max(350px, 524rem);
	margin: 0 0 max(20px, 20rem);
    border-radius: max(8px, 8rem);
}
.project-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.project-stat {
	display: flex;
	flex-wrap: wrap;
	gap: max(20px, 20rem);
}
.project-stat-item {
	width: max(200px, 243rem);
}
.project-stat-name {
	margin: 0 0 max(4px, 8rem);
	color: var(--black-800);
}
.project-side {
	width: max(320px, 375rem);
    min-width: max(320px, 375rem);
    display: flex;
    flex-direction: column;
}
.project-side h3 {
	margin: 0 0 max(12px, 20rem);
}
.project-text {
	max-width: max(290px, 335rem);
	margin: 0 0 max(60px, 60rem);
	font-size: var(--body_M);
	line-height: 120%;
	color: var(--black-800);
}
.project-side-bottom {
	margin: auto 0 max(72px, 76rem);
}
.project-side-bottom h4 {
	margin: 0 0 max(12px, 20rem);
}
.tabs-block {
	display: flex;
    flex-wrap: wrap;
    gap: max(8px, 8rem);
}

/************************* solutions *************************/
.solutions .top {
	align-items: flex-start;
	text-align: left;
	margin: 0 0 max(24px, 24rem);
}
.solutions h2 {
	display: none;
}
.solutions-top {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: max(40px, 150rem);
	padding: 0 0 max(20px, 40rem);
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.solutions-item {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: max(40px, 150rem);
	padding: max(20px, 40rem) 0;
	font-weight: 440;
	font-size: var(--h3);
	line-height: 100%;
	letter-spacing: -0.04em;
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.solutions-num {
	flex: 1;
}
.solutions-col {
	width: max(300px, 507rem);
	min-width: max(300px, 507rem);
}
.solutions-item .solutions-title {
	display: none;
}
.solutions-title {
	font-weight: 440;
	font-size: var(--h2);
	line-height: 100%;
	letter-spacing: -0.04em;
}

/************************* gallery *************************/
.gallery .top {
	margin: 0 0 max(40px, 40rem);
}
.gallery-slider-wrap {
	overflow: hidden;
	margin: 0 -20px;
}
.gallery-slider {
	display: flex;
}
.gallery-slide {
	padding: 0 20px 0 0;
}
.gallery-link {
	display: block;
	overflow: hidden;
	width: max(320px, 638rem);
	aspect-ratio: 1/1.1;
	border-radius: max(8px, 8rem);
}
.gallery-link img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.popup {
	display: none;
	position: fixed;
	inset: max(20px, 20rem);
	z-index: 1000;
	overflow: hidden;
	border-radius: max(8px, 8rem);
}
.popup-close {
	position: absolute;
	top: max(32px, 32rem);
	right: max(32px, 32rem);
	z-index: 50;
	width: max(48px, 48rem);
	height: max(48px, 48rem);
	font-size: 0;
	cursor: pointer;
	background: var(--white);
	border-radius: max(4px, 4rem);
}
.popup-close:hover {
	background-color: var(--black);
}
.popup-close::before,
.popup-close::after {
	position: absolute;
	inset: 0;
	content: '';
	transition: all 0.3s linear;
}
.popup-close::before {
	background: url(../images/close.svg) 50% 50% no-repeat;
}
.popup-close::after {
	background: url(../images/close-white.svg) 50% 50% no-repeat;
	opacity: 0;
}
.popup-close:hover::before {opacity: 0;}
.popup-close:hover::after {opacity: 1;}
.popup-photo {
	position: relative;
	height: max(100dvh - max(40px, 40rem));
}
.popup-photo::after {
	position: absolute;
	inset: 0;
	top: auto;
	content: '';
	height: max(100px, 140rem);
	background: linear-gradient(180deg, rgba(8, 9, 13, 0) 0%, rgba(8, 9, 13, 0.9) 100%);
}
.popup-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.slick-arrow {
	position: absolute;
	z-index: 20;
	width: max(48px, 48rem);
	height: max(48px, 48rem);
	font-size: 0;
	cursor: pointer;
	background: var(--white);
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: max(4px, 4rem);
	transition: all 0.3s linear;
}
.slick-arrow:hover {
	background-color: var(--black);
	border-color: var(--black);
}
.slick-arrow::before,
.slick-arrow::after {
	position: absolute;
	inset: 0;
	content: '';
	transition: all 0.3s linear;
}
.slick-arrow::before {
	background: url(../images/arrow.svg) 53% 50% no-repeat;
}
.slick-arrow::after {
	background: url(../images/arrow-white.svg) 53% 50% no-repeat;
	opacity: 0;
}
.slick-arrow:hover::before {opacity: 0;}
.slick-arrow:hover::after {opacity: 1;}
.slick-prev::before,
.slick-prev::after {
	transform: scale(-1, 1);
}
.slick-disabled {
	opacity: 0.4;
	pointer-events: none;
}
.popup-slider .slick-arrow {
	left: 50%;
	bottom: max(32px, 32rem);
	border-color: var(--white);
}
.popup-slider .slick-arrow:hover {
	border-color: var(--black);
}
.popup-slider .slick-prev {
	margin-left: min(-56px, -56rem);
}
.popup-slider .slick-next {
	margin-left: max(8px, 8rem);
}

/************************* highlights *************************/
.highlights .top {
	margin: 0 0 max(40px, 40rem);
}
.highlights-block {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: max(20px, 20rem);
}
.highlights-item {
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1/1;
	padding: 0 10px;
	color: var(--white);
	text-align: center;
	background: linear-gradient(180deg, #0c273c 0%, #335065 100%);
	border-radius: max(8px, 8rem);
}
.highlights-item::before {
    position: absolute;
    inset: 0;
    content: '';
    background: url(../images/highlights-bg.png) 50% 100% no-repeat;
    background-size: 100% auto;
    z-index: 0;
    pointer-events: none;
}
.highlights-logo {
	position: absolute;
	top: max(20px, 20rem);
	left: 50%;
	transform: translateX(-50%);
	width: max(48px, 60rem);
	z-index: 1;
}
.highlights-logo img {
	width: 100%;
}
.highlights-item h3 {
	position: relative;
	z-index: 1;
	max-width: max(240px, 380rem);
}

/************************* roots *************************/
.roots-photo {
	overflow: hidden;
    height: max(250px, 600rem);
    border-radius: max(8px, 8rem);
}
.roots-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/************************* team *************************/
.team-block {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: max(40px, 60rem) max(20px, 20rem);
}
.team-item {
	color: var(--black);
	text-decoration: none;
}
.team-photo {
	position: relative;
	overflow: hidden;
	aspect-ratio: 1/1.18;
	margin: 0 0 max(20px, 20rem);
	border-radius: max(8px, 8rem);
}
.team-photo-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.5s var(--ease);
}
a.team-item:hover .team-photo-img {
	transform: scale(1.04);
}
.team-item h3 {
	margin: 0 0 max(6px, 6rem);
}
.team-position {
	font-size: var(--body_M);
	line-height: 120%;
	color: var(--black-800);
}
.team-logo {
	position: absolute;
	overflow: hidden;
	width: max(33px, 33rem);
	top: max(20px, 20rem);
	right: max(20px, 20rem);
	display: flex;
	align-items: center;
	gap: max(8px, 8rem);
	transition: all 0.5s var(--ease);
}
.team-logo img {
	width: max(33px, 33rem);
	min-width: max(33px, 33rem);
}
.team-logo-text {
	font-weight: 470;
	font-size: var(--button);
	line-height: 100%;
	letter-spacing: -0.04em;
	text-decoration: underline;
	color: var(--white);
	white-space: nowrap;
}
a.team-item:hover .team-logo {
	width: max(106px, 122rem);
}
.management .team-block {
	grid-template-columns: repeat(4, 1fr);
}

/************************* timeline *************************/
.timeline .top {
	margin: 0 0 max(40px, 60rem);
}
.timeline-slider {
	margin: 0 min(-20px, -20rem) max(40px, 80rem);
}
.timeline-slider .slick-arrow {
	top: min(-94px, -114rem);
}
.timeline-slider .slick-prev {
	right: max(76px, 76rem);
}
.timeline-slider .slick-next {
	right: max(20px, 20rem);
}
.timeline-slide {
	padding: 0 max(20px, 20rem);
}
.timeline-block {
	max-width: max(860px, 1100rem);
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
}
.timeline-img {
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	width: calc(50% - 10px);
	height: max(220px, 360rem);
	border-radius: max(8px, 8rem);
	background: linear-gradient(180deg, #0c273c 0%, #668699 100%);
}
.timeline-img-logo {
	width: max(164px, 334rem);
}
.timeline-content {
	width: calc(50% - 10px);
	display: flex;
	align-items: center;
	justify-content: center;
}
.timeline-content-wrap {
	max-width: max(340px, 375rem);
}
.timeline-content h3 {
	margin: 0 0 max(12px, 20rem);
}
.timeline-text {
	font-size: var(--body_M);
	line-height: 120%;
	color: var(--black-800);
}
.info-slider::before {
	position: absolute;
	top: max(63px, 63rem);
	left: 0;
	right: 0;
	content: '';
	height: 1px;
	background: linear-gradient(90deg, #0c273c 0%, #abcee1 100%);
}
.info-slide-block {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: max(360px, 660rem);
	gap: max(12px, 12rem);
	text-align: center;
}
.info-slide-block h4 {
	opacity: 0.4;
	transition: all 0.3s linear;
}
.info-slide-logo {
	width: max(80px, 80rem);
	background: var(--white);
}
.info-slide-logo img {
	width: 100%;
	opacity: 0.4;
	transition: all 0.3s linear;
}
.info-slide-text {
	max-width: max(180px, 200rem);
	font-size: var(--body_M);
	line-height: 120%;
	color: var(--black-800);
	opacity: 0.4;
	transition: all 0.3s linear;
}
.slick-current .info-slide-block h4,
.slick-current .info-slide-logo img,
.slick-current .info-slide-text,
.info-slide-block:hover .info-slide-block h4,
.info-slide-block:hover .info-slide-logo img,
.info-slide-block:hover .info-slide-text {
	opacity: 1;
}
.info-slide:not(.slick-current) .info-slide-block {
	cursor: pointer;
}
.timeline-slider-wrap {
	position: relative;
}
.timeline-slider .slick-dots {
	position: absolute;
	top: 0;
	right: max(20px, 20rem);
	bottom: 0;
	z-index: 10;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: max(10px, 15rem);
}
.timeline-slider .slick-dots button {
	font-weight: 400;
	font-size: max(16px, 16rem);
	line-height: 110%;
	opacity: 0.4;
	transition: all 0.3s linear;
	cursor: pointer;
}
.timeline-slider .slick-dots button:hover,
.timeline-slider .slick-dots .slick-active button {
	opacity: 1;
}
.timeline-slider .slick-dots .slick-active button {
	pointer-events: none;
}
.timeline-slider .slick-dots button:hover {
	transform: translateX(-10px);
}

/************************* awards *************************/
.awards .top {
	margin: 0 0 max(40px, 80rem);
}
.awards-block {
	display: flex;
	justify-content: flex-end;
}
.awards-wrap {
	max-width: max(600px, 900rem);
}
.awards-part {
	display: flex;
	gap: max(20px, 20rem);
	padding: max(24px, 28rem) 0;
	border-top: 1px solid rgba(0, 0, 0, 0.2);
}
.awards-part:last-child {
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.awards-year {
	width: max(80px, 112rem);
	min-width: max(80px, 112rem);
	color: rgba(0, 0, 0, 0.3);
}
.awards-content {
	flex: 1;
}
.awards-item {
	position: relative;
	padding: max(24px, 28rem) 0;
	border-top: 1px solid rgba(0, 0, 0, 0.2);
}
.awards-item:first-child {
	padding-top: 0;
	border-top: 0;
}
.awards-item:last-child {
	padding-bottom: 0;
}
.awards-img {
	position: absolute;
	top: 50%;
	left: min(-300px, -600rem);
	transform: translateY(calc(-50% + 30px));
	width: max(100px, 300rem);
	height: max(100px, 300rem);
	opacity: 0;
	visibility: hidden;
	transition: all 0.4s var(--ease);
}
.active .awards-img {
	transform: translateY(-50%);
	opacity: 1;
	visibility: visible;
}
.awards-img img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.awards-item h3 {
	transition: all 0.4s ease-in-out;
}
.hover .awards-item h3 {
	color: var(--black-400);
}
.hover .awards-item h3:hover {
	color: var(--black);
}













/************************* article *************************/
.article-top {
	display: flex;
	flex-direction: row-reverse;
	align-items: flex-end;
	gap: max(20px, 20rem);
	margin: min(-10px, -30rem) 0 max(120px, 120rem);
}
.article-top-content {
	flex: 1;
}
.article-top-content h1 {
	margin: 0 0 max(20px, 40rem);
}
.article-top-img {
	overflow: hidden;
    height: max(350px, 524rem);
    border-radius: max(8px, 8rem);
}
.article-top-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.article-top-side {
	width: max(320px, 375rem);
    min-width: max(320px, 375rem);
}
.article-date {
	font-size: var(--body_M);
	line-height: 120%;
	color: var(--black-800);
}
.article-main {
	padding: 0 0 0 max(340px, 395rem);
}
.article-wrap {
	max-width: max(700px, 770rem);
	color: var(--black-800);
}
.article-wrap a {
	color: var(--black-800);
}
.article-wrap ol,
.article-wrap ul {
	display: flex;
	flex-direction: column;
	margin: 0 0 max(22px, 24rem);
	padding: 0 0 0 max(32px, 32rem);
}
.article-wrap ol:first-child,
.article-wrap ul:first-child {
	padding-top: 0;
}
.article-wrap ol:last-child,
.article-wrap ul:last-child {
	margin: 0;
}
.article-wrap ul li {
	position: relative;
}
.article-wrap ul li::before {
	position: absolute;
	top: max(8px, 10rem);
	left: min(-17px, -19rem);
	content: '';
	width: max(5px, 5rem);
	height: max(5px, 5rem);
	background: var(--black-800);
	border-radius: 50%;
}

/************************* info *************************/
.info {
	display: flex;
	justify-content: space-between;
}
.info-col {
	width: calc(50% - 10px);
}
.info-col h2 {
	margin: 0 0 max(40px, 60rem);
}
.info-col h2:last-child {
	margin: 0;
}
.info-col:first-child {
	padding-right: max(40px, 40rem);
}
.info-col .top-tag {
	display: inline-flex;
	margin: 0 0 max(24px, 24rem);
}
.info-text {
	max-width: max(570px, 640rem);
	margin: 0 0 max(40px, 60rem);
	color: var(--black-800);
}
.info-col h2 + .info-text {
	margin-top: min(-16px, -36rem);
}
.with-tag .info-col:last-child {
	padding-top: max(66px, 80rem);
}
.list-item {
	padding: max(24px, 24rem) 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.list-item:first-child {
	padding-top: 0;
}
.list-item h3 {
	position: relative;
	margin: 0 0 max(8px, 8rem);
}
.list-item h3::before {
	position: absolute;
	top: 50%;
	left: min(-28px, -28rem);
	content: '';
	width: max(8px, 8rem);
	height: max(8px, 8rem);
	margin-top: min(-2px, -2rem);
	background: var(--black);
	border-radius: 50%;
}
.list-text {
	font-size: var(--body_M);
	line-height: 120%;
	color: var(--black-800);
}
.info-img {
	overflow: hidden;
	max-width: max(480px, 640rem);
	height: max(350px, 770rem);
	border-radius: max(8px, 8rem);
}
.info-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/************************* pagination *************************/
.pagination {
	display: flex;
	justify-content: center;
	gap: max(8px, 8rem);
}
.pagination-link {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: max(48px, 48rem);
	height: max(48px, 48rem);
	color: var(--black);
	text-decoration: none;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: max(4px, 4rem);
}
.pagination-link:hover,
.pagination-link.active {
	color: var(--white);
	background-color: var(--black);
	border-color: var(--black);
}
.pagination-arrow::before,
.pagination-arrow::after {
	position: absolute;
	inset: 0;
	content: '';
	transition: all 0.3s linear;
}
.pagination-arrow::before {
	background: url(../images/arrow.svg) 50% 50% no-repeat;
}
.pagination-arrow::after {
	background: url(../images/arrow-white.svg) 50% 50% no-repeat;
	opacity: 0;
}
.pagination-link:hover::before {opacity: 0;}
.pagination-link:hover::after {opacity: 1;}
.pagination-prev::before,
.pagination-prev::after {
	transform: scale(-1, 1);
}

/************************* how *************************/
.how {
	position: relative;
	overflow: hidden;
	padding: max(80px, 120rem) max(40px, 165rem) max(80px, 100rem);
	color: var(--white);
	border-radius: max(8px, 8rem);
	background: linear-gradient(180deg, #0c273c 0%, #66869a 100%);
}
.how::before {
	position: absolute;
	inset: 0;
	content: '';
	background: url(../images/line-1.png) 0 100% no-repeat;
	background-size: 91% auto;
}
.how .top {
	position: relative;
	margin: 0 0 max(40px, 80rem);
}
.how .top-tag {
    border: 1px solid rgba(255, 255, 255, 0.2);
}
.how .top h2 {
	max-width: none;
}
.how .top-text {
	color: var(--white-800);
}
.how-block {
	position: relative;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: max(60px, 100rem) max(40px, 120rem);
	margin: 0 0 max(40px, 80rem);
}
.how-block:last-child {
	margin: 0;
}
.how-item {
	position: relative;
	padding: 0 0 0 max(28px, 40rem);
}
.how-item::before {
	position: absolute;
	top: max(9px, 9rem);
	left: 0;
	content: '';
	width: max(12px, 12rem);
	height: max(12px, 12rem);
	background: var(--white);
	border-radius: 50%;
}
.how-item h3 {
	padding: 0 0 max(12px, 16rem);
	margin: 0 0 max(12px, 16rem);
	border-bottom: 1px solid var(--white-400);
}
.how-text {
	max-width: max(380px, 430rem);
	font-size: var(--body_M);
	line-height: 120%;
	color: var(--white-800);
}

/************************* inner-page *************************/
.inner-page {
	padding: max(175px, 205rem) 0 0;
}

/************************* sitemap *************************/
.sitemap h1 {
	margin: 0 0 max(40px, 120rem);
}
.sitemap h2 {
	margin: 0 0 max(20px, 20rem);
}
.sitemap h2 a {
	position: relative;
	color: var(--black);
	text-decoration: none;
}
.sitemap h2 a::after {
	position: absolute;
	left: 0;
	bottom: max(6px, 10rem);
	content: '';
    display: block;
    width: 0;
    height: 1px;
    background: var(--black);
    transition: width .3s;
}
.sitemap h2 a:hover::after {
    width: 100%;
}
.sitemap-item {
	margin: 0 0 max(60px, 60rem);
}
.sitemap-item:last-child {
	margin: 0;
}
.sitemap-list {
	display: flex;
	flex-direction: column;
	gap: max(20px, 20rem);
	font-weight: 470;
	font-size: var(--button);
	line-height: 100%;
}
.sitemap-list a {
	position: relative;
	color: var(--black);
	text-decoration: none;
}
.sitemap-list a::after {
	position: absolute;
	left: 0;
	bottom: 1px;
	content: '';
    display: block;
    width: 100%;
    height: 1px;
    background: var(--black);
    transition: width .3s;
}
.sitemap-list a:hover::after {
    width: 0%;
}

/************************* bio *************************/
.bio {
	display: flex;
	justify-content: space-between;
}
.bio-col {
	width: calc(50% - 10px);
}
.bio-photo {
	position: sticky;
	top: max(20px, 20rem);
	overflow: hidden;
	max-width: max(440px, 638rem);
	aspect-ratio: 1/1;
	border-radius: max(8px, 8rem);
}
.bio-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.bio-linkedin {
	position: absolute;
	top: max(20px, 20rem);
	right: max(20px, 20rem);
	display: flex;
	align-items: center;
	justify-content: center;
	width: max(44px, 44rem);
	height: max(44px, 44rem);
	background: var(--white);
	border-radius: max(8px, 8rem);
}
.bio-linkedin path {
	fill: var(--black);
	transition: all 0.3s linear;
}
.bio-linkedin:hover {
	background: var(--black);
}
.bio-linkedin:hover path {
	fill: var(--white);
}
.bio-content {
	color: var(--black-800);
}
.bio h1 {
	margin: 0 0 max(12px, 12rem);
	color: var(--black);
}
.bio-position {
	margin: 0 0 max(32px, 40rem);
	font-weight: 560;
	font-size: var(--caption);
	line-height: 120%;
	text-transform: uppercase;
}
.bio h4 {
	margin: 0 0 max(20px, 20rem);
	padding-top: max(10px, 16rem);
}
.bio ul {
	display: flex;
	flex-direction: column;
	gap: max(8px, 8rem);
	margin: 0 0 max(22px, 24rem);
	padding: 0 0 0 max(32px, 32rem);
}
.bio ul:last-child {
	margin: 0;
}
.bio ul li {
	position: relative;
}
.bio ul li::before {
	position: absolute;
	top: max(8px, 10rem);
	left: min(-17px, -19rem);
	content: '';
	width: max(5px, 5rem);
	height: max(5px, 5rem);
	background: var(--black-800);
	border-radius: 50%;
}

/************************* podcast *************************/
.podcast h1 {
	margin: 0 0 max(20px, 40rem) max(340px, 395rem);
}
.podcast-block {
	display: flex;
	align-items: flex-start;
	gap: 20px;
}
.podcast-side {
	width: max(320px, 375rem);
	min-width: max(320px, 375rem);
	display: flex;
	flex-direction: column;
	gap: max(12px, 20rem);
}
.podcast-photo {
	overflow: hidden;
	flex: 1;
	height: max(350px, 524rem);
	border-radius: max(8px, 8rem);
}
.podcast-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.podcast-date, .podcast-text {
	font-size: var(--body_M);
	line-height: 120%;
	color: var(--black-800);
}
.podcast-text {
	max-width: max(300px, 335rem);
}
.iframe-youtube {
	aspect-ratio: 16/9;
}
.iframe-youtube iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
	border-radius: max(8px, 8rem);
}
.iframe-spotify {
	height: 352px;
}
.iframe-spotify iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
	border-radius: max(8px, 8rem);
}
.podcast-bottom {
	max-width: max(710px, 760rem);
	margin: 0 auto;
	color: var(--black-800);
}

/************************* contact *************************/
.footer.contact-page {
    padding: 0;
}
.contact-page .holder {
    padding: 0;
}
.contact-page .footer-section {
	padding-top: max(172px, 205rem);
	border-radius: 0;
}
.contact-block {
	position: relative;
	display: flex;
	justify-content: space-between;
	padding: 0 0 max(140px, 360rem);
}
.contact-side {
	width: calc(50% - 10px);
	padding: max(95px, 115rem) 0 0;
}
.contact-content {
	width: calc(50% - 10px);
}
.contact-side h2 {
	margin: 0 0 max(32px, 40rem);
}
.contact-item {
	margin: 0 0 max(32px, 40rem);
}
.contact-item:last-child {
	margin: 0;
}
.contact-item h3 {
	margin: 0 0 max(12px, 12rem);
	color: var(--grey);
}
.contact-text {
	font-weight: 440;
	font-size: var(--h3);
	line-height: 100%;
	letter-spacing: -0.04em;
}
.contact-text a {
	position: relative;
	color: var(--white);
	text-decoration: none;
}
.contact-text a::after {
	position: absolute;
	left: 0;
	bottom: 1px;
	content: '';
    display: block;
    width: 0;
    height: 1px;
    background: var(--white);
    transition: width .3s;
}
.contact-text a:hover::after {
    width: 100%;
}
.contact-content h1 {
	margin: 0 0 max(24px, 40rem);
}
.form-bottom {
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
	padding: max(12px, 20rem) 0 0;
}
.form-note {
	max-width: max(280px, 280rem);
	font-size: max(16px, 16rem);
	line-height: 110%;
	letter-spacing: -0.04em;
	text-align: right;
	color: var(--white-700);
}
.form-note a {
	color: var(--white-700);
}
.form-note a:hover {
	color: var(--white);
}
.contact-form {
	position: relative;
}
.form-result {
	display: none;
}
.form-sent .form-main {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}
.form-sent .form-result {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	display: block;
}

/************************* page404 *************************/
.footer.page404 {
    padding: 0;
}
.page404 .holder {
    padding: 0;
}
.page404 .footer-section {
	padding-top: max(210px, 322rem);
	border-radius: 0;
}
.page404-block {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 0 0 max(140px, 370rem);
	text-align: center;
}
.page404-num {
	max-width: max(350px, 540rem);
	width: 100%;
	margin: 0 0 max(32px, 32rem);
	opacity: 0;
	transform: scale(1.2);
	transition: all 0.7s var(--ease);
}
.ani_start .page404-num {
	opacity: 1;
	transform: scale(1);
}
.page404-num img {
	width: 100%;
}
.page404-block h2 {
	margin: 0 0 max(24px, 32rem);
	opacity: 0;
	transform: translateY(20px);
	transition: all 0.5s var(--ease) 0.6s;
}
.page404-text {
	color: var(--white-800);
	opacity: 0;
	transform: translateY(20px);
	transition: all 0.5s var(--ease) 0.7s;
}
.ani_start.page404-block h2,
.ani_start .page404-text {
	opacity: 1;
	transform: translateY(0);
}

/************************* policy *************************/
.policy {
	max-width: max(696px, 770rem);
	margin: 0 auto;
	color: var(--black-700);
}
.policy-update {
	margin: 0 0 max(40px, 40rem);
}
.policy a {
	color: var(--black-700);
}
.policy ol,
.policy ul {
	display: flex;
	flex-direction: column;
	gap: max(8px, 8rem);
	margin: 0 0 max(22px, 24rem);
	padding: max(16px, 16rem) 0 0 max(32px, 32rem);
}
.policy ol:first-child,
.policy ul:first-child {
	padding-top: 0;
}
.policy ol:last-child,
.policy ul:last-child {
	margin: 0;
}
.policy ul li {
	position: relative;
}
.policy ul li::before {
	position: absolute;
	top: max(8px, 10rem);
	left: min(-17px, -19rem);
	content: '';
	width: max(5px, 5rem);
	height: max(5px, 5rem);
	background: var(--black-800);
	border-radius: 50%;
}
.policy ul + p,
.policy ol + p {
	padding-top: max(16px, 16rem);
}

/************************* footer *************************/
.footer {
	padding: 0 0 max(20px, 20rem);
}
.footer-section {
	overflow: hidden;
	position: relative;
	padding: max(100px, 160rem) max(20px, 32rem) max(20px, 20rem);
	color: var(--white);
	background: linear-gradient(180deg, #0C273C 0%, #335064 100%);
	border-radius: max(8px, 8rem);
}
.footer-section::before {
	position: absolute;
	inset: 0;
	bottom: max(80px, 250rem);
	content: '';
	background: url(../images/eagle.png) 50% 100% no-repeat;
	background-size: 100% auto; 
}
.footer-contact {
	position: relative;
	display: flex;
	align-items: center;
	flex-direction: column;
	text-align: center;
	gap: max(16px, 24rem);
	margin: 0 0 max(80px, 360rem);
}
.footer-label {
	padding: max(12px, 12rem) max(24px, 24rem);
	font-weight: 470;
	font-size: var(--button);
	line-height: 100%;
	letter-spacing: -0.04em;
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: max(4px, 4rem);
}
.footer-contact-text {
	max-width: max(340px, 380rem);
	color: var(--white-800);
}
.footer-contact .button {
	margin-top: max(8px, 16rem);
}
.footer-block {
	position: relative;
	display: flex;
	margin: 0 0 max(50px, 50rem);
}
.footer-side {
	width: 50%;
	display: flex;
}
.footer-side h3 {
	max-width: max(280px, 380rem);
}
.footer-col {
	width: 33.33%;
	padding: 0 20px 0 0;
}
.footer-col h4 {
	margin: 0 0 max(24px, 24rem);
}
.footer-nav {
	display: flex;
	flex-direction: column;
	gap: max(8px, 8rem);
}
.footer-nav li {
	font-size: var(--body_M);
	line-height: 120%;
}
.footer-nav a {
	position: relative;
	color: var(--white);
	text-decoration: none;
}
.footer-nav a::after {
	position: absolute;
	left: 0;
	bottom: 0;
	content: '';
    display: block;
    width: 0;
    height: 1px;
    background: var(--white);
    transition: width .3s;
}
.footer-nav a:hover::after {
    width: 100%;
}
.footer-logo {
	position: relative;
	margin: 0 0 max(12px, 12rem);
}
.footer-logo img {
	width: 100%;
}
.footer-bottom {
	position: relative;
	display: flex;
	justify-content: space-between;
	font-size: var(--body_S);
	line-height: 110%;
	color: var(--white-400);
}
.footer-studio {
	padding: 0 max(20px, 50rem) 0 0;
}
.footer-studio img {
	width: max(16px, 20rem);
	margin: 0 max(2px, 2rem);
	opacity: 0.4;
}
.footer-studio a, .footer-link {
	position: relative;
	color: var(--white-400);
	text-decoration: none;
}
.footer-studio a:hover, .footer-link:hover {
	color: var(--white);
}
.footer-studio a::after,
.footer-link::after {
	position: absolute;
	left: 0;
	bottom: 0;
	content: '';
    display: block;
    width: 0;
    height: 1px;
    background: var(--white);
    transition: width .3s;
}
.footer-studio a:hover::after,
.footer-link:hover::after {
    width: 100%;
}

/************************* animations *************************/
.fadeUp {
	opacity: 0;
	transform: translateY(20px);
	transition: all 0.5s var(--ease);
}
.fadeUp.ani_start {
	opacity: 1;
	transform: translateY(0);
}

/************************* media *************************/
@media screen and (max-width: 1300px) {
	
}
@media screen and (max-width: 1200px) {
	.footer-side:first-child {
		width: 40%;
	}
	.footer-side:last-child {
		width: 60%;
	}

}
@media screen and (max-width: 1024px) {
	.header-logo {
		position: relative;
		top: auto;
		left: auto;
		transform: none;
	}
	.header-block {
		justify-content: space-between;
	}
	.lock .logo-black {opacity: 1;}
	.lock .logo-white {opacity: 0;}
	.lock .mob-nav-block:after,
	.lock .mob-nav-block:before {
		background: var(--black);
	}

	.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(--white);
		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: 80px;
		padding-bottom: 40px;
		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 12px;
		height: 100%;
		margin: 0;
		overflow-y: auto;
	}
	.header-nav-list li:nth-child(5) {
		margin-right: 0;
	}
	.header-nav-list li:last-child {display: none;}
	.header-nav-list > li > a {
		position: relative;
		display: block;
		padding: 20px 55px 20px 0;
		font-weight: 440;
		font-size: 24px;
		line-height: 100%;
		letter-spacing: -0.04em;
		color: var(--black);
		text-decoration: none;
		border-top: 1px solid rgba(0, 0, 0, 0.2);
	}
	.header-nav-list > li > a::before {display: none;}
	.nav-parent::after {
		position: absolute;
		top: 50%;
		right: 0;
		width: 24px;
		height: 24px;
		margin-top: -12px;
		content: '';
		background: url(../images/nav-arrow.svg) 50% 50% no-repeat;
		background-size: contain;
		transition: all 0.3s linear;
	}
	.nav-parent.nav-active::after {
		transform: rotate(180deg);
	}
	.subnav {
		display: none;
		position: static;
		transition: none;
		opacity: 1;
		visibility: visible;
		transform: none;
	}
	.subnav-block {
		display: block;
	}
	.subnav-content {
		width: auto;
		height: auto;
	}
	.subnav-media {
		display: none;
	}
	.subnav-list {
		gap: 20px;
		padding: 0 0 20px 24px;
	}
	.subnav-item {
		padding: 0;
		font-size: 20px;
		line-height: 100%;
		border-bottom: 0;
	}
	.subnav-list:hover .subnav-item {
		color: var(--black);
	}
	.subnav-arrow {
		width: 14px;
		height: 14px;
		margin: 4px 0 -4px 8px;
		background: url(../images/arrow-red.svg) 50% 50% no-repeat;
		background-size: contain;
	}
	.subnav-arrow::after {
		display: none;
	}
	.nav-bottom {
		position: absolute;
		left: 0;
		right: 0;
		top: auto;
		bottom: 0;
		padding: 52px 12px 12px;
		align-items: center;
		transition: all 0.4s 0.3s;
		background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #fff 60%, #fff 100%);
	}
	.header-nav.vis .nav-bottom {
		opacity: 1;
		transform: translateY(0px);
		visibility: visible;
	}
	.nav-caption {
		display: none;
	}
	.nav-button {
		display: block;
	}
	.footer-block {
		flex-direction: column;
		gap: 40px;
	}
	.footer-side:first-child,
	.footer-side:last-child {
		width: 100%;
	}
	.contact-side {display: none;}
	.contact-content {
		width: 100%;
	}
	.box-img {
		height: max(228px, 600rem);
	}
	.box-mask {display: none;}
	.box-item .box-img .button {
		transform: translateY(0);
		transition-delay: 0.15s;
	}
	.box-button-mob .box-item {
		position: relative;
		padding-bottom: 68px;
	}
	.box-button-mob .box-img {
		position: static;
		flex-direction: column;
		gap: 20px;
		align-items: flex-start;
		height: auto;
	}
	.box-button-mob .box-img img {
		position: relative;
		height: max(228px, 600rem);
		border-radius: 8px;
	}
	.box-item:hover .box-img img {
		transform: none;
	}
	.box-button-mob .box-img .button {
		left: 0;
		bottom: 0;
	}
	.box-button-mob .button-main {
		color: var(--white);
		background: var(--dark-blue);
	}
	.box-button-mob .button-arrow {
		background: var(--dark-blue);
	}
	.box-button-mob .button:hover .button-main,
	.box-button-mob .button:hover .button-arrow {
		background: var(--red);
	}
	.box-button-mob .button-icon::before,
	.box-button-mob .button-icon::after {
		background: url(../images/button-arrow-white.svg) 50% 50% no-repeat;
		background-size: contain;
	}
	.box-button-mob .box-tag {
		position: relative;
		top: auto;
		right: auto;
		color: var(--black);
		border: 1px solid rgba(0, 0, 0, 0.2);
	}
	.box-projects {
		display: flex;
		flex-wrap: wrap;
		align-items: flex-start;
	}
	.box-projects .box-item,
	.box-projects .box-item:nth-child(4n),
	.box-projects .box-item:nth-child(4n + 1){
		width: 100%;
	}
	.box-projects .box-item:nth-child(4n) .box-img,
	.box-projects .box-item:nth-child(4n) .box-mask img,
	.box-projects .box-item:nth-child(4n + 1) .box-img,
	.box-projects .box-item:nth-child(4n + 1) .box-mask img {
		height: auto;
	}
	.box-block-tag .box-img::before {
		display: none;
	}
	.article-top {
		flex-direction: column;
		align-items: stretch;
		gap: 12px;
		margin-top: 0;
	}
	.article-top-content {
		flex: none;
		width: 100%;
	}
	.article-top-side {
		width: auto;
		min-width: 1px;
	}
	.article-main {
		padding: 0;
	}
	.box-section .top {
		align-items: center;
		text-align: center;
	}
	.podcast h1 {
		margin: 0 0 max(20px, 40rem);
	}
	.podcast-block {
		flex-direction: column-reverse;
		align-items: stretch;
	}
	.podcast-side {
		width: auto;
		min-width: 1px;
	}
	.podcast-text {
		max-width: none;
	}
	.filter {
		position: relative;
		justify-content: space-between;
	}
	.filter-mob {
		display: flex;
		align-items: center;
		gap: 8px;
		padding: max(11px, 11rem) max(23px, 23rem);
		font-weight: 400;
		font-size: var(--tag);
		line-height: 100%;
		letter-spacing: -0.04em;
		color: var(--black);
		text-decoration: none;
		border: 1px solid rgba(0, 0, 0, 0.2);
		border-radius: max(4px, 4rem);
	}
	.filter-mob::before {
		width: 11px;
		height: 13px;
		content: '';
		background: url(../images/filter.svg) 50% 50% no-repeat;
		background-size: contain;
	}
	.filter-tabs {
		position: absolute;
		top: 100%;
		right: 0;
		z-index: 50;
		width: 350px;
		padding-top: 12px;
		display: none;
	}
	.filter-tabs.vis {
		display: block;
	}
	.filter-tabs-block {
		flex-direction: column;
		align-items: flex-start;
		padding: 20px;
		background: var(--dark-blue);
		border-radius: 4px;
	}
	.filter-tabs-block .tab {
		color: var(--white);
		border: 1px solid rgba(255, 255, 255, 0.2);
	}
	.filter-tabs-block .tab:hover {
		background: transparent;
	}
	.filter-tabs-block .tab.active {
		color: var(--black);
		background: var(--white);
		border-color: var(--white);
	}
	.how {
		padding: max(80px, 120rem) max(50px, 100rem) max(80px, 100rem);
	}
	.management .team-block {
		grid-template-columns: repeat(3, 1fr);
	}
	.team-logo {
		width: auto;
		top: auto;
		bottom: max(20px, 20rem);
		right: max(20px, 20rem);
	}
	.team-item:hover .team-logo {
		width: auto;
	}
	.awards-block {
		justify-content: center;
	}
	.awards-part {
		flex-direction: column;
		align-items: center;
		text-align: center;
		gap: max(20px, 20rem);
		padding: 28px 0 20px;
		border-top: 1px solid rgba(0, 0, 0, 0.2);
	}
	.awards-item {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 20px;
		padding: 28px 0 20px;
	}
	.awards-img {
		position: relative;
		top: auto;
		left: auto;
		transform: none;
		opacity: 1;
		visibility: visible;
		height: auto;
	}
	.project h1 {
		margin: 0 0 max(20px, 40rem);
	}
	.project-block {
		flex-direction: column;
		gap: 60px;
	}
	.project-side {
		width: auto;
		min-width: 1px;
	}
	.project-stat-item {
		width: calc(25% - 15px);
	}
	.highlights-block {
		grid-template-columns: repeat(2, 1fr);
	}
	.project-side-bottom {
		margin: 0;
	}	
	
}
@media screen and (max-width: 767px) {
	.holder {
		padding: 0 12px;
	}
	.hero-min {
		background: url(../images/hero-min-mob.jpg) 50% 50% no-repeat;
		background-size: cover;
	}
	.footer {
		padding: 0 0 12px;
	}
	.footer-side {
		flex-wrap: wrap;
		justify-content: space-between;
		gap: 52px 0;
	}
	.footer-col {
		width: calc(50% - 10px);
		padding: 0;
	}
	.footer-nav {
		gap: 12px;
	}
	.footer-section::before {
		bottom: 0;
		background: url(../images/eagle-mob.png) 50% 100% no-repeat;
		background-size: 100% auto;
	}
	.footer-contact {
		margin: 0 0 80px;
	}
	.footer-contact-text {
		max-width: 230px;
	}
	.footer-col h4 {
		color: var(--white-800);
	}
	.footer-logo {
		margin: 0 0 20px;
	}
	.footer-bottom {
		flex-wrap: wrap;
		gap: 12px;
	}
	.footer-copy {
		width: 100%;
		order: 1;
	}
	.footer-link {
		order: 2;
	}
	.footer-studio {
		order: 3;
		color: var(--white);
	}
	.footer-studio a {
		color: var(--white);
	}
	.footer-studio img {
		opacity: 1;
	}
	.hero-min-block {
		justify-content: flex-start;
	}
	.hero-min-text {
		max-width: 350px;
	}
	.page404-num {
		margin: 0 0 40px;
	}
	.page404-text {
		color: var(--white);
	}
	.form-bottom {
		flex-direction: column;
		gap: 24px;
	}
	.form-note {
		text-align: left;
	}
	.input-box .wpcf7-form-control-wrap {
		width: 100%;
	}
	.box-block {
		grid-template-columns: repeat(1, 1fr);
	}
	.top {
		align-items: flex-start;
		text-align: left;
	}
	.info {
		flex-direction: column;
		gap: 40px;
	}
	.info-col {
		width: 100%;
	}
	.info-col:first-child {
		padding-right: 0;
	}
	.list-item {
		padding-left: 28px;
	}
	.list-item h3::before {
		width: 12px;
		height: 12px;
		margin-top: -5px;
	}
	.list-text {
		max-width: 330px;
	}
	.with-tag .info-col:last-child {
		padding-top: 0;
	}
	.list-another .list-item {
		padding: 20px 0 20px 28px;
		border-bottom: 0;
	}
	.list-another .list-item:first-child {padding-top: 0;}
	.list-another .list-item:last-child {padding-bottom: 0;}
	.list-another .list-item h3 {
		padding: 0 0 12px;
		margin: 0 0 12px;
		border-bottom: 1px solid rgba(0, 0, 0, 0.2);
	}
	.list-another .list-item h3::before {
        margin-top: -10px;
    }
	.how {
		padding: max(80px, 120rem) 20px max(80px, 100rem);
	}
	.how::before {
		background: url(../images/line-1-mob.png) 0 100% no-repeat;
		background-size: 100% auto;
	}
	.how-block {
		grid-template-columns: repeat(1, 1fr);
	}
	.bio {
		flex-direction: column;
		align-items: stretch;
		gap: 20px;
	}
	.bio-col {
		width: auto;
	}
	.top-line {
		flex-direction: column;
		align-items: stretch;
		gap: 24px;
	}
	.top-col {
		width: auto;
	}
	.team-block, .management .team-block {
        grid-template-columns: repeat(2, 1fr);
    }
	.team-photo {
		aspect-ratio: 1 / 1;
	}
	.team-photo-img {
		object-position: 50% 0%;
	}
	.timeline-slider {
		margin: 0 -12px max(40px, 100rem);
	}
	.timeline-block {
		flex-direction: column;
		gap: 24px;
	}
	.timeline-img, .timeline-content {
		width: 100%;
	}
	.info-slider {
		padding: 0 0 68px;
	}
	.info-slider .slick-arrow {
		bottom: 0;
	}
	.info-slider .slick-prev {
		left: 0;
	}
	.info-slider .slick-next {
		right: 0;
	}
	.hero::before {
		background: url(../images/hero-eagle-mob.png) 50% 50% no-repeat;
		background-size: cover;
	}
	.hero-caption {
		top: 132px;
		left: 12px;
		right: auto;
		bottom: auto;
		max-width: max(240px, 300rem);
		text-align: left;
	}
	.hero-block {
		left: 12px;
		right: 12px;
	}
	.about .top h2 {
		max-width: 240px;
	}
	.main-how .top {
        align-items: center;
        text-align: center;
    }
	.main-how .top h2 {
		max-width: 240px;
	}
	.main-how .top-text {
		display: none;
	}
	.main-how-text {
		position: relative;
		padding: 40px 0 0;
		display: block;
		text-align: center;
	}
	.work {
		position: relative;
		padding: 0 0 88px;
	}
	.work .top-button {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		text-align: center;
	}
	.work .top-col .top-text {
		margin: 0 0 12px;
	}
	.project-stat {
		gap: 16px 10px;
	}
	.project-stat-item {
        width: calc(50% - 5px);
    }
	.project-side h3 {
		max-width: 320px;
	}
	.project-text {
		max-width: none;
	}
	.solutions h2 {
    	display: block;
		max-width: 350px;
	}
	.solutions-top {
		display: none;
	}
	.solutions-item {
		flex-direction: column;
		justify-content: flex-start;
		align-items: stretch;
		gap: 0;
		padding: 19px;
		margin: 0 0 24px;
		border: 1px solid rgba(0, 0, 0, 0.2);
		border-radius: 8px;
	}
	.solutions-item:last-child {
		margin: 0;
	}
	.solutions-item .solutions-title {
		display: block;
		margin: 0 0 16px;
	}
	.solutions-num {
		margin: 0 0 32px;
	}
	.solutions-col:last-child {
		padding: 20px 0 0;
		margin: 20px 0 0;
		border-top: 1px solid rgba(0, 0, 0, 0.2);
	}
	.gallery-slider-wrap {
		margin: 0 -12px;
	}
	.gallery-link {
		height: 400px;
		aspect-ratio: unset;
	}
	.highlights-block {
        grid-template-columns: repeat(1, 1fr);
		gap: 12px;
    }
	.gallery .top {
		align-items: center;
		text-align: center;
	}
	.wpcf7-form-control-wrap input {
		height: 62px;
		margin: 0 0 8px;
	}
	.wpcf7-form-control-wrap textarea {
		height: 130px;
		margin: 0 0 8px;
	}

}
@media screen and (max-width: 576px) {
	.team-block, .management .team-block {
        grid-template-columns: repeat(1, 1fr);
    }

}
