:root{
	--theme-color: var(--text-orange);
	--text-color: #fff;
	--background-color:var(--text-black);
	accent-color: var(--theme-color);
	--wrapper-size: 100%;
	--wrapper-padding: 3rem;
	--section-margin: 9rem;

	--cursor-size: 4rem;
	--cursor-label-size: 1.6rem;
	--cursor-label-gap: 1.2rem;

	--lines-width: 64.2rem;

	--font-family: "Space Mono", sans-serif;
	--second-family: "Sanxelda", sans-serif;
	--third-family: "Montserrat", sans-serif;
	--text-white: #fff;
	--text-white-75: rgba(255, 255, 255, 0.75);
	--text-white-60: rgba(255, 255, 255, 0.6);
	--text-orange: #f79d40;
	--text-black: #000;
	--text-red: #ff3b3b;
	--bg-white: #fff;
	--bg-white-50: rgba(255, 255, 255, 0.5);
	--bg-white-35: rgba(255, 255, 255, 0.35);
	--bg-white-10: rgba(255, 255, 255, 0.1);
	--bg-orange: #f79d40;
	--bg-black: #000;
	--bg-black-30: rgba(0, 0, 0, 0.3);
	--bg-black-85: rgba(0, 0, 0, 0.85);
	--stroke-white-50: rgba(255, 255, 255, 0.5);
	--stroke-white-20: rgba(255, 255, 255, 0.2);
	--stroke-white-10: rgba(255, 255, 255, 0.1);
	--stroke-orange: #f79d40;
	--stroke-black-20: rgba(0, 0, 0, 0.2);
	--stroke-red: #ff3b3b;
	--stroke-gray-dark: #464646;
	--vozmozhno-na-zamenu-text-white-75: #bfbfbf;
	--vozmozhno-na-zamenu-text-white-60: #999;
	--vozmozhno-na-zamenu-bg-white-50: #808080;
	--vozmozhno-na-zamenu-bg-white-35: #595959;
	--vozmozhno-na-zamenu-bg-white-10: #1a1a1a;
	--vozmozhno-na-zamenu-stroke-white-50: #808080;
	--vozmozhno-na-zamenu-stroke-white-20: #333;
	--vozmozhno-na-zamenu-stroke-white-10: #1a1a1a;
}

html{
	font-size: 0.5208vw;
	height: 100%;
	overflow-x: hidden;
	overflow-x: clip;
	scrollbar-width: none;
	background-color: var(--background-color);
}

html::-webkit-scrollbar,
body::-webkit-scrollbar{
	width: 0;
	height: 0;
	display: none;
}

html.is-resizing *,
html.is-resizing *::before,
html.is-resizing *::after{
	transition: none !important;
}

/* @media (min-width: 2259px) {
	html{
		font-size: 0.445vw;
	}

	.partners{
		--logo-scale: 1.17;
	}
} */

@media (max-width: 1366px) {
	html{
		font-size: 0.7321vw;
	}
}

@media (max-width: 1024px) {
	html{
		font-size: 0.9766vw;
	}
}

@media (max-width: 768px) {
	html{
		font-size: 1.3021vw;
	}
}

@media (max-width: 480px) {
	html{
		font-size: 2.7778vw;
	}
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
.display-1{
	font-family: var(--second-family);
	font-weight: 700;
	text-transform: uppercase;
}

.display-2,
.p1-a,
.p4,
.p5{
	font-family: var(--font-family);
	font-weight: 400;
	text-transform: uppercase;
}

.p1-b,
.p3{
	font-family: var(--third-family);
	font-weight: 400;
	text-transform: none;
}

h1, .h1{
	font-size: 18rem;
	line-height: 0.9;
	letter-spacing: -0.032rem;
}

h2, .h2{
	font-size: 12rem;
	line-height: 0.9;
	letter-spacing: -0.032rem;
}

h3, .h3{
	font-size: 8rem;
	line-height: 0.9;
	letter-spacing: -0.02em;
}

h4, .h4{
	font-size: 5.2rem;
	line-height: 0.95;
	letter-spacing: -0.02em;
}

h5, .h5{
	font-size: 3.6rem;
	line-height: 0.95;
	letter-spacing: -0.01em;
}

.display-1{
	font-size: 23rem;
	line-height: 0.9;
	letter-spacing: -0.03em;
}

.display-2{
	font-size: 6.4rem;
	line-height: 0.9;
	letter-spacing: -0.02em;
}

.p1-a{
	font-size: 2.4rem;
	line-height: 1.2;
	letter-spacing: -0.06em;
}

.p1-b{
	font-size: 2.4rem;
	line-height: 1.4;
	letter-spacing: -0.02em;
}

.p3{
	font-size: 1.8rem;
	line-height: 1.3;
	letter-spacing: -0.02em;
}

.p4{
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.02em;
}

.p5{
	font-size: 1.4rem;
	line-height: 1;
	letter-spacing: -0.06em;
}

@media (max-width: 1366px) {
	h1, .h1{
		font-size: 12rem;
		line-height: 0.9;
		letter-spacing: -0.02em;
	}

	h2, .h2{
		font-size: 8rem;
		line-height: 0.95;
		letter-spacing: -0.01em;
	}

	h3, .h3{
		font-size: 6rem;
		line-height: 0.9;
		letter-spacing: -0.02em;
	}

	h4, .h4{
		font-size: 3.2rem;
		line-height: 0.95;
		letter-spacing: -0.02em;
	}

	h5, .h5{
		font-size: 2.4rem;
		line-height: 1.05;
		letter-spacing: 0;
	}

	.display-1{
		font-size: 14rem;
		line-height: 0.9;
		letter-spacing: -0.02em;
	}

	.display-2{
		font-size: 4.2rem;
		line-height: 0.9;
		letter-spacing: -0.01em;
	}

	.p1-a{
		font-size: 2rem;
		line-height: 1.2;
		letter-spacing: -0.04em;
	}

	.p1-b{
		font-size: 1.8rem;
		line-height: 1.4;
		letter-spacing: -0.01em;
	}

	.p3{
		font-size: 1.6rem;
		line-height: 1.3;
		letter-spacing: -0.01em;
	}

	.p4{
		font-size: 1.4rem;
		line-height: 1.3;
		letter-spacing: -0.02em;
	}

	.p5{
		font-size: 1.2rem;
		line-height: 1;
		letter-spacing: -0.02em;
	}
}

@media (max-width: 768px) {
	h1, .h1{
		font-size: 8rem;
		line-height: 0.95;
		letter-spacing: -0.01em;
	}

	h2, .h2{
		font-size: 6.4rem;
		line-height: 1;
		letter-spacing: -0.01em;
	}

	h3, .h3{
		font-size: 4.8rem;
		line-height: 0.95;
		letter-spacing: -0.01em;
	}

	h4, .h4{
		font-size: 2.4rem;
		line-height: 0.95;
		letter-spacing: -0.02em;
	}

	h5, .h5{
		font-size: 1.8rem;
		line-height: 1.05;
		letter-spacing: 0;
	}

	.display-1{
		font-size: 10rem;
		line-height: 0.9;
		letter-spacing: -0.02em;
	}

	.display-2{
		font-size: 2.4rem;
		line-height: 0.9;
		letter-spacing: -0.01em;
	}

	.p1-a{
		font-size: 1.4rem;
		line-height: 1.2;
		letter-spacing: -0.02em;
	}

	.p1-b{
		font-size: 1.4rem;
		line-height: 1.4;
		letter-spacing: -0.01em;
	}
}

@media (max-width: 480px) {
	h1, .h1{
		font-size: 4.6rem;
		line-height: 0.95;
		letter-spacing: -0.01em;
	}

	h2, .h2{
		font-size: 3.2rem;
		line-height: 1;
		letter-spacing: -0.01em;
	}

	h3, .h3{
		font-size: 2.4rem;
		line-height: 0.95;
		letter-spacing: 0;
	}

	h4, .h4{
		font-size: 1.8rem;
		line-height: 1.05;
		letter-spacing: 0;
	}

	.display-1{
		font-size: 6rem;
		line-height: 0.9;
		letter-spacing: -0.02em;
	}

	.p1-b{
		font-size: 1.4rem;
		line-height: 1.4;
		letter-spacing: -0.01em;
	}

	.p3{
		font-size: 1.4rem;
		line-height: 1.3;
		letter-spacing: 0;
	}
}

body{
	display: flex;
	flex-direction: column;
	font-family: var(--font-family);
	min-height: 100vh;
	min-height: calc(var(--app-vh, 1vh) * 100);
	font-size: 1.6rem;
	background-color: var(--background-color);
	color: var(--text-color);
	position: relative;
	isolation: isolate;
}

body::before{
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	left: 50%;
	translate: -50% 0;
	width: var(--lines-width);
	height: 100%;
	pointer-events: none;
	background-image: url(../img/bg-lines.png);
	background-size: 100% auto;
	background-position: left top;
	background-repeat: repeat-y;
}

.no-lines::before{
	display: none;
}

::selection{
	background-color: var(--theme-color);
	color: #FFF;
}

/* body.scroll-lock, body.menu-open{
	overflow: hidden;
} */

/* ========== mob-tel ========== */

.mob-tel{
	display: none;
}

@media (max-width: 768px) {
	.mob-tel{
		display: block;
	}
}

/* ========== mob-mini-tel ========== */

.mob-mini-tel{
	display: none;
}

@media (max-width: 480px) {
	.mob-mini-tel{
		display: block;
	}
}

.main{
	flex-grow: 1;
}

.wrapper{
	width: min(var(--wrapper-size), calc(100% - (var(--wrapper-padding) + var(--wrapper-padding))));
	margin-inline:auto;
}

/* ========== wrapper-padding ========== */

.wrapper-padding{
	padding-left: max(var(--wrapper-padding), calc((100% - var(--wrapper-size)) / 2));
	padding-right: max(var(--wrapper-padding), calc((100% - var(--wrapper-size)) / 2));
}

.wrapper-padding.scroll-table::-webkit-scrollbar, .wrapper-padding.scroll-phone{
	display: none;
}

@media (max-width: 1024px) {
	.wrapper-padding.scroll-table{
		overflow: auto;
		scroll-snap-type: x mandatory;
	}

	.wrapper-padding.scroll-table .scroll-el{
		scroll-snap-align: center;
	}
}

@media (max-width: 768px) {
	.wrapper-padding.scroll-phone{
		overflow: auto;
		scroll-snap-type: x mandatory;
	}

	.wrapper-padding.scroll-phone .scroll-el{
		scroll-snap-align: center;
	}
}

/* ========== menu-burger ========== */

.menu-burger{
	display: none;
	align-items: center;
	gap: 0.8rem;
	font-family: var(--font-family);
	font-size: 1.4rem;
	line-height: 1.3;
	letter-spacing: -0.028rem;
	text-transform: uppercase;
	color: var(--text-white);
	background-color: transparent;
}

.menu-burger::before{
	content: "[";
}

.menu-burger::after{
	content: "]";
}

@media (max-width: 1024px) {
	.menu-burger{
		display: flex;
	}
}

[data-modal]{
	cursor: pointer;
}

.modal-close::before{
	transform: rotate(-45deg);
	top: calc(50% - 0.3rem);
}

.modal-close::after{
	transform: rotate(45deg);
	bottom: calc(50% - 0.1rem);
}

.modal-close{
	padding: 0.7rem 0.7rem;
	display: flex;
	position: relative;
	align-self: center;
	background-color: #ffffff00;
	width: 3.5rem;
	height: 3.5rem;
	z-index: 12;
	cursor: pointer;
}

.modal-close{
	position: absolute;
	right: 0.5rem;
	top: 0.5rem;
	transition: opacity 0.2s ease 0s;
}

.modal-close:hover{
	opacity: 0.8;
}

.modal-close::before,
.modal-close::after{
	content: "";
	transition: transform 0.3s ease 0s, top 0.3s ease 0s, bottom 0.3s ease 0s;
	left: 50%;
	top: 50%;
	translate: -50% -50%;
	position: absolute;
	width: calc(100% - 1.5rem);
	height: 0.4rem;
	background-color: var(--theme-color);
	border-radius: 0.2rem;
	animation: fadeIn 1s ease 0.5s forwards;
}

@keyframes fadeIn {
	0%{
		opacity: 0;
		translate: 0px 1rem;
	}

	100%{
		opacity: 1;
		translate: 0px 0px;
	}
}

/* ========== scroll-up ========== */

.scroll-up {
	opacity: 0;
	display: none;
	align-items: center;
	justify-content: center;
	pointer-events: none;
	width: 6rem;
	position: fixed;
	right: 3rem;
	bottom: 3rem;
	height: 6rem;
	border-radius: 50%;
	background-color: var(--theme-color);
	transition: opacity 0.3s ease 0s, margin-bottom 0.3s ease 0s;
	z-index: 100;
}


.scroll-up.active {
	opacity: 1;
	pointer-events: all;
}

.scroll-up svg, .scroll-up img{
	transition: transform 0.2s ease 0s;
	width: 40%;
}

.scroll-up:hover img,  .scroll-up:hover svg{
	transform: translate(0px, -0.2rem);
}

@media (max-width: 768px) {
	.scroll-up {
		width: 4.5rem;
		height: 4.5rem;
		padding: 0.5rem;
		right: 1.5rem;
		bottom: 1.5rem;
		margin-bottom: -4.5rem;
	}

	.scroll-up.active {
		margin-bottom: 0;
	}
}

.swiper-button-next, .swiper-button-prev{
	margin-top: 0px;
	top: 50%;
	translate: 0px -50%;
}

.swiper-slide{
	height: auto;
}

.swiper-button-next svg, .swiper-button-next img, .swiper-button-prev svg, .swiper-button-prev img{
	position: absolute;
	left: 50%;
	top: 50%;
	translate: -50% -50%;
}

.swiper-button-next::after, .swiper-button-prev::after{
	display: none;
}

.drop-menu {
	position: relative;
}

.drop-menu ul{
	padding: 1rem 1.5rem;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.drop-menu ul a{
	border-bottom: none !important;
}

.drop-menu span{
	position: relative;
	transition: color 0.2s ease 0s, border-color 0.2s ease 0s;
	cursor: pointer;
	margin-right: 1.4rem;
	border-bottom: 0.1rem solid rgba(0, 0, 0, 0.1);
}

.drop-menu span::after{
	content: '';
	height: 0.4rem;
	background: url(../img/icons/arrow.svg) center / contain no-repeat;
	position: absolute;
	width: 0.7rem;
	left: calc(100% + 0.8rem);
	transition: transform 0.2s ease 0s;
	top: 0.6rem;
}

.drop-menu ul::-webkit-scrollbar{
	width: 0.4rem;
}

.drop-menu ul::-webkit-scrollbar-thumb{
	background-color: var(--theme-color);
}

/* ========== modal-cookie ========== */

.modal-cookie{
	position: fixed;
	pointer-events: none;
	bottom: 0;
	width: 100%;
	left: 0;
	translate: 0px calc(100% + 3.5rem);
	z-index: 200;
	animation: cookieVisible 1s ease 2s forwards;
}

.modal-cookie .wrapper{
	display: flex;
}

.modal-cookie__body{
	pointer-events: all;
	box-shadow: 0 1.6rem 2.9rem -1.6rem rgba(0, 0, 0, 0.9);
	background: var(--bg-black-85);
	border: 0.1rem solid var(--stroke-white-20);
	border-radius: 0.8rem;
	-webkit-backdrop-filter: blur(1rem);
	backdrop-filter: blur(1rem);
	translate: 0px calc(0% - 3rem);
	overflow: hidden;
	padding: 2.4rem;
	max-width: 45rem;
	text-align: center;
	font-weight: 500;
	font-size: 1.4rem;
	line-height: 150%;
	color: var(--text-white);
	transition: opacity 0.4s ease 0s;
}

.modal-cookie__body button{
	flex-grow: 1;
	width: calc((100% - 1.6rem) / 2);
	font-size: 1.4rem;
	padding: 1rem !important;
}

@keyframes cookieVisible {
	0%{
		translate: 0px 20rem;
	}

	100%{
		translate: 0px 0px;
	}
}

.modal-cookie.hidden-modal .modal-cookie__body{
	opacity: 0;
}

.modal-cookie__bottom{
	display: flex;
	gap: 1.6rem;
}

.modal-cookie a{
	color: var(--theme-color);
}

.modal-cookie__text{
	margin-bottom: 1.5rem;
}

@media (max-width: 1024px) {
	.modal-cookie.hidden-modal .modal-cookie__body{
		opacity: 0;
	}

	.modal-cookie__body{
		padding: 2rem;
		font-size: 1.4rem;
		transition: opacity 0.4s ease 0s;
	}
}

@media (max-width: 768px) {
	.modal-cookie__body button {
    height: 4rem;
		font-size: 1.4rem;
		width: calc((100% - 1rem) / 2);
	}

	.modal-cookie__bottom{
		gap: 1rem;
	}
}

@media (max-width: 480px) {
	.modal-cookie__body {
		padding: 1rem;
	}

	.modal-cookie__text{
		font-size: 1.2rem;
	}

	.modal-cookie__body {
    translate: 0px calc(0% - 1.5rem);
	}

	.modal-cookie__body button {
		height: 3.5rem;
		font-size: 1.2rem;
	}
}

@media (max-width: 768px) {
	.modal-cookie__body {
    max-width: 38rem
}
}

@media (max-width: 480px) {
	.modal-cookie__body {
    max-width: 100%;
}
}

/* ========== burger-menu ========== */

.burger-menu{
	display: none;
}

/* ==================================== */

@media (max-width: 1024px) {
	:root{
		--section-margin: 7.5rem;
	}
}

@media (max-width: 1024px) {
	.burger-menu__top .header__logo{
		width: 15rem;
	}
}

@media (max-width: 768px) {
	:root{
		--section-margin: 5rem;
	}
}

@media (max-width: 480px) {
	:root{
		--wrapper-padding: 2rem;
		--section-margin: 4rem;
	}
}

/* ==================================== */

/* ==================================== */

.tabs-content{
	display: none;
}

.d-block{
	display: block;
}

.none{
	display: none;
}

[class*="copyrights-pane"]{
	display: none !important;
}

.animate__animated, .animate__{
	opacity: 0;
	animation-fill-mode: forwards !important;
	animation-delay: 0.2s !important;
}

.animate__delay-1s{
	animation-delay: 0.8s !important;
}

.animate__delay-2s{
	animation-delay: 1.2s !important;
}

.animate__delay-2s.button{
	animation-delay: 1.4s !important;
}

/* Глобальный твик для всех анимируемых элементов */

.animate__animated,
.animated { /* подойдёт и для кастомного animation.css */
  will-change: transform, opacity;
  backface-visibility: hidden;
  transform: translateZ(0);
}

/* Если в ваших классах есть анимации margin/height/width/top/left — запрещаем: */

[class*="animate-"][style*="margin"],
[class*="animate-"][style*="top"],
[class*="animate-"][style*="left"] {
}

/* лучше переписать сами эффекты на transform/opacity */

/* По умолчанию скрыть, чтобы не было блинка первого кадра */

.animate__animated,
.animated {
  visibility: hidden;
}

/* Когда страница готова — показать и дать анимациям отработать */

.page-ready .animate__animated,
.page-ready .animated {
  visibility: visible;
}

html.custom-cursor,
html.custom-cursor *{
	cursor: none !important;
}

html.custom-cursor textarea,
html.custom-cursor input:not([type]),
html.custom-cursor input[type="text"],
html.custom-cursor input[type="tel"],
html.custom-cursor input[type="email"],
html.custom-cursor input[type="password"],
html.custom-cursor input[type="search"],
html.custom-cursor input[type="url"],
html.custom-cursor input[type="number"]{
	cursor: text !important;
}

/* ========== cursor ========== */

.cursor{
	position: fixed;
	left: 0;
	top: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	gap: var(--cursor-label-gap);
	pointer-events: none;
	opacity: 0;
	will-change: transform;
	transition: opacity 0.3s ease 0s;

	translate: calc(var(--cursor-size) / -2) -50%;
}

.cursor.is-visible{
	opacity: 1;
}

.cursor.is-hidden{
	opacity: 0;
}

.cursor__icon{
	flex-shrink: 0;
	width: var(--cursor-size);
	height: var(--cursor-size);
	background: url(../img/cursor.svg) center / contain no-repeat;

	filter: drop-shadow(0 0 0.2rem rgba(0, 0, 0, 0.7));
}

.cursor__label{
	font-family: var(--font-family);
	font-size: var(--cursor-label-size);
	line-height: 1;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--text-white);
	text-shadow: 0 0 0.4rem rgba(0, 0, 0, 0.7);
	opacity: 0;
	translate: -0.8rem 0;
	transition: opacity 0.25s ease 0s, translate 0.25s ease 0s;
}

.cursor.is-blog .cursor__label{
	opacity: 1;
	translate: 0 0;
}

@media (prefers-reduced-motion: reduce) {
	.cursor__label{
		translate: 0 0;
		transition: opacity 0.25s ease 0s;
	}
}

@media (prefers-reduced-motion: reduce) {
	.fact__crosshair::after,
	.meet__point .icon{
		animation: none;
	}
}

.button,
.button-border{
	-webkit-appearance: none;
	appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.8rem;
	font-family: var(--font-family);
	font-size: 1.4rem;
	line-height: 1;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	padding: 1.4rem 2.4rem;
	border-radius: 0.4rem;
	transition: color 0.25s ease 0s, background-color 0.25s ease 0s, border-color 0.25s ease 0s, opacity 0.25s ease 0s;
}

.button{
	background-color: var(--bg-orange);
	color: var(--text-black);
}

.button:hover{
	opacity: 0.85;
}

.button-border{
	border: 0.1rem solid var(--stroke-white-20);
	color: var(--text-white);
}

.button-border:hover{
	border-color: var(--stroke-orange);
	color: var(--text-orange);
}

.icon{
	flex-shrink: 0;
	fill: currentColor;
}

.icon--arrow-down{
	width: 1.3rem;
	height: 0.9rem;
}

.icon--arrow-right{
	width: 1.5rem;
	height: 1.1rem;
}

.icon--close{
	width: 1.2rem;
	height: 1.2rem;
}

.icon--plus{
	width: 1.4rem;
	height: 1.4rem;
}

/* ========== header ========== */

.header{
	position: fixed;
	z-index: 100;
	top: 0;
	left: 0;
	width: 100%;
	padding-top: 3.8rem;
	padding-bottom: 3.8rem;
	transition: translate 0.5s ease 0s, background-color 0.5s ease 0s, padding-top 0.35s ease 0s, padding-bottom 0.35s ease 0s;
		/* -webkit-backdrop-filter: blur(0.42rem);
	backdrop-filter: blur(0.42rem);
	background-color: var(--bg-black-85); */
}

.header.is-pinned{
	background-color: var(--bg-black-85);
	-webkit-backdrop-filter: blur(0.42rem);
	backdrop-filter: blur(0.42rem);

}

.header.is-hidden{
	translate: 0 -100%;
}

.header__inner{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 3rem;
}

.header__logo{
	flex-shrink: 0;
	display: block;
	width: 23.4rem;
	color: var(--text-white);
	transition: opacity 0.25s ease 0s;
}

.header__logo img{
	display: block;
	width: 100%;
	height: auto;
}

.header__logo:hover{
	opacity: 0.7;
}

.menu{
	display: flex;
	align-items: center;
	gap: 2.4rem;
}

.menu__link{
	display: inline-flex;
	align-items: center;
	gap: 1.2rem;
	padding: 0.4rem 0rem;
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.038rem;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--text-white);
	transition: color 0.25s ease 0s;
}

.menu__link::before,
.submenu__link::before{
	content: "[";
}

.menu__link::after,
.submenu__link::after{
	content: "]";
}

.menu__link:hover,
.submenu__link:hover{
	color: var(--text-orange);
}

.header__nav{
	position: relative;
}

@media (max-width: 1024px) {
	.header .header__nav,
	.header .header__cta{
		display: none;
	}
}

@media (max-width: 768px) {
	.header{
		padding-top: 2rem;
		padding-bottom: 2rem;
	}

	.header__logo{
		width: 15rem;
	}
}

.submenu{
	--dd-cut: 3.5rem;
	--dd-cut-br: 6rem;
	position: absolute;
	z-index: -1;
	top: -4.8rem;
	left: 50%;
	display: flex;
	flex-wrap: wrap;
	gap: 0.8rem 6rem;
	width: 81.6rem;
	min-height: 20rem;
	max-height: min(46rem, calc(100vh - 14rem));
	overflow-y: auto;
	scrollbar-width: none;
	padding: 10rem 5.5rem 4rem 5.5rem;
	translate: -50% -1rem;
	opacity: 0;
	visibility: hidden;
	background-color: var(--bg-black-85);
	-webkit-backdrop-filter: blur(0.42rem);
	backdrop-filter: blur(0.42rem);
	-webkit-backdrop-filter: blur(0.42rem);
	border-radius: 0.6rem;
	clip-path: polygon(
		var(--dd-cut) 0,
		100% 0,
		100% calc(100% - var(--dd-cut-br)),
		calc(100% - var(--dd-cut-br)) 100%,
		var(--dd-cut) 100%,
		0 calc(100% - var(--dd-cut)),
		0 var(--dd-cut)
	);
	transition: opacity 0.3s ease 0s, visibility 0.3s ease 0s, translate 0.3s ease 0s;
}

.submenu::-webkit-scrollbar{
	display: none;
}

.submenu__frame{
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	color: var(--text-white);
	pointer-events: none;
}

.menu__item--drop.is-open .submenu,
.menu__item--drop:focus-within .submenu{
	opacity: 1;
	visibility: visible;
	translate: -50% 0;
}

.menu__item--drop.is-open .icon--arrow-down,
.menu__item--drop:focus-within .icon--arrow-down{
	rotate: 180deg;
}

.icon--arrow-down{
	transition: rotate 0.3s ease 0s;
}

.submenu__list{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.submenu__link{
	display: inline-flex;
	align-items: center;
	gap: 0.8rem;
	padding: 0.8rem 0rem;
	text-align: left;
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--text-white);
	transition: color 0.25s ease 0s;
}

.button-cta{
	--cta-cut: 2rem;
	-webkit-appearance: none;
	appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	gap: 0.8rem;
	min-height: 5rem;
	padding: 0 2.4rem;
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.032rem;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--text-black);
	background-color: var(--bg-white);
	border-radius: 0.6rem;
	clip-path: polygon(
		var(--cta-cut) 0,
		100% 0,
		100% calc(100% - var(--cta-cut)),
		calc(100% - var(--cta-cut)) 100%,
		0 100%,
		0 var(--cta-cut)
	);
	transition: color 0.25s ease 0s, background-color 0.25s ease 0s;
}

.button-cta svg{
	width: 1.6rem;
}

.button-cta:hover{
	background-color: var(--bg-orange);
	
}

.header--invert:not(.is-pinned){
	background-color: transparent;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
}

/* ========== intro ========== */

html:not(.is-loaded) .intro__pin{
	opacity: 0;
}

.intro{
	flex-shrink: 0;
	margin-bottom: var(--section-margin);
	height: 200vh;
	height: calc(var(--app-vh, 1vh) * 200);
}

.intro__pin{
	position: sticky;
	top: 0;
	height: 100vh;
	height: calc(var(--app-vh, 1vh) * 100);
	overflow: hidden;
}

.intro__head{
	position: absolute;
	z-index: 2;
	top: 14rem;
	left: 0;
	width: 100%;
	text-align: center;
}

.intro__label{
	display: block;
	margin-bottom: 2rem;
}

.intro__title{
	white-space: nowrap;
}

.intro__media{
	position: absolute;
	z-index: 1;
	inset: 0;
	clip-path: polygon(
		calc(50% - 46rem) calc(50% - 22rem),
		calc(50% + 37rem) calc(50% - 22rem),
		calc(50% + 41.7rem) calc(50% - 17.3rem),
		calc(50% + 41.7rem) calc(50% - 1.6rem),
		calc(50% + 46rem) calc(50% + 2.7rem),
		calc(50% + 46rem) calc(50% + 17.7rem),
		calc(50% + 41.7rem) calc(50% + 22rem),
		calc(50% - 36.6rem) calc(50% + 22rem),
		calc(50% - 46rem) calc(50% + 12.3rem)
	);
}

.intro__media picture,
.intro__media img,
.intro__media video{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.intro__media img,
.intro__media video{
	transform: scale(0.48);
	will-change: transform;
}

.intro__bottom{
	position: absolute;
	z-index: 2;
	bottom: 7rem;
	left: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2.4rem;
	width: 100%;
}

.intro__text{
	max-width: 48rem;
	color: var(--text-white-75);
	text-align: center;
}

@media (max-width: 1366px) {
	.intro__bottom {
    bottom: 5rem;
}
}

@media (max-width: 1024px) {
	.intro__text {
    max-width: 34rem;

}
}

@media (max-width: 768px) {
	.intro{
		height: auto;
	}

	.intro__pin{
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		padding: 11.8rem var(--wrapper-padding) 0;
	}

	.intro__label {
    margin-bottom: 1.6rem;
}

	.intro__bottom {
		gap: 1.6rem;
        margin-top: 2.4rem;
    }

	.intro__head,
	.intro__bottom{
		position: relative;
		top: auto;
		bottom: auto;
		left: auto;
		width: auto;
		text-align: left;
	}

	.intro__bottom{
		align-items: flex-start;
		gap: 1.6rem;
		margin-top: 2.4rem;
	}

	.intro__text{
		max-width: 32rem;
		text-align: left;
	}

	.intro .intro__cta{
		width: 14rem;
		min-height: 8.2rem;
		padding: 1.2rem;
	}

	.intro__media{
		clip-path: none;
	}

	.intro__media img,
	.intro__media video{
		transform: none;
	}
}

@media (max-width: 480px) {
	.intro__pin {
        padding: 8rem var(--wrapper-padding) 0;
    }

	.intro{
		padding-bottom: 34rem;
	}

	.intro__pin{
		overflow: visible;
	}

	.intro__bottom{
		margin-top: 1.6rem;
	}
}

/* ========== button-white ========== */

.button-orange,
.button-white{
	--btn-cut: 1.5rem;
	-webkit-appearance: none;
	appearance: none;
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.8rem;
	width: 15rem;
	min-height: 10rem;
	padding: 1.6rem;
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--text-black);
	background-color: var(--stroke-black-20);
	clip-path: polygon(
		var(--btn-cut) 0,
		calc(100% - var(--btn-cut)) 0,
		100% var(--btn-cut),
		100% calc(100% - var(--btn-cut)),
		calc(100% - var(--btn-cut)) 100%,
		var(--btn-cut) 100%,
		0 calc(100% - var(--btn-cut)),
		0 var(--btn-cut)
	);
}

.button-orange::before,
.button-white::before{
	content: "";
	position: absolute;
	inset: 0.1rem;
	background-color: var(--bg-orange);
	clip-path: polygon(
		calc(var(--btn-cut) - 0.1rem) 0,
		calc(100% - var(--btn-cut) + 0.1rem) 0,
		100% calc(var(--btn-cut) - 0.1rem),
		100% calc(100% - var(--btn-cut) + 0.1rem),
		calc(100% - var(--btn-cut) + 0.1rem) 100%,
		calc(var(--btn-cut) - 0.1rem) 100%,
		0 calc(100% - var(--btn-cut) + 0.1rem),
		0 calc(var(--btn-cut) - 0.1rem)
	);
}

.button-orange > *,
.button-white > *{
	position: relative;
}

.button-orange .icon,
.button-white .icon{
	align-self: flex-end;
	margin-top: auto;
}

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

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

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

.button-white{
	color: var(--text-black);
}

@media (max-width: 1366px) {
	.button-orange, .button-white {
    font-size: 1.4rem;
}

	.button-orange, .button-white {
    width: 14rem;
    min-height: 9rem;
}
}

@media (max-width: 768px) {
	.button-orange, .button-white {
    --btn-cut: 1.4rem;
    width: 14rem;
    min-height: 8rem;
    padding: 1.2rem;
}
}

.marker-list{
	display: flex;
	flex-direction: column;
	gap: 1.6rem;
}

.marker{
	position: relative;
	display: block;
	padding-left: 2.2rem;
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.02em;
	text-transform: uppercase;
}

.marker:empty{
	display: none;
}

.folio__year:has(.marker:empty){
	display: none;
}

.marker::before{
	content: "";
	position: absolute;
	top: 0.6rem;
	left: 0rem;
	width: 0.8rem;
	height: 0.8rem;
	border: 0.1rem solid currentColor;
	border-radius: 0.2rem;
}

/* ========== slider-nav ========== */

.slider-nav{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 9rem;
}

.slider-nav__arrow{
	display: flex;
	align-items: center;
	color: var(--text-white);
	background-color: transparent;
	transition: color 0.25s ease 0s, opacity 0.25s ease 0s;
}

.slider-nav__arrow:hover{
	color: var(--text-orange);
}

.slider-nav .icon--arrow-right {
    width: 1.4rem;
    height: 1.1rem;
}

.slider-nav__arrow.is-disabled{
	opacity: 0.3;
	pointer-events: none;
}

.slider-nav__arrow--prev .icon{
	scale: -1 1;
}

.slider-nav__counter{
	font-family: var(--font-family);
	font-size: 1.4rem;
	font-weight: 400;
	line-height: 1;
	letter-spacing: -0.084em;
	color: var(--text-white-75);
}

.slider-nav__counter b{
	font-weight: 400;
	color: var(--text-white);
}

/* ========== worlds ========== */

.worlds{
	padding: var(--section-margin) 0rem;
}

.worlds__title{
	max-width: 147.4rem;
	margin-bottom: 6rem;
}

@media (max-width: 1366px) {
	.worlds__title {
    max-width: 110.4rem;
    margin-bottom: 4rem;
}
}

@media (max-width: 768px) {
	.worlds__title {
        margin-bottom: 2.4rem;
    }

	.worlds__slider .wrapper{
		width: 100%;
			padding-left: max(var(--wrapper-padding), calc((100% - var(--wrapper-size)) / 2));
	padding-right: max(var(--wrapper-padding), calc((100% - var(--wrapper-size)) / 2));
	}
}

.slider-nav{
	margin-top: 3.2rem;
}

/* ========== world ========== */

.world{
	--world-cut-x: 10rem;
	--world-cut-y: 10rem;
	position: relative;
	flex-shrink: 0;
	display: block;
	height: 59.5rem;
}

/* Запомнить */

/* @media (min-width:  2259px) {
	.world {
		height: 71.5rem;
	}
} */

.world::after{
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	border: 10.4rem solid transparent;
	border-image: url(../img/game-world/border.png) 208 stretch;
}

.swiper-pagination-fraction{
	width: auto !important;
}

.world__media{
	display: block;
	width: 100%;
	height: 100%;
	overflow: hidden;
	border-radius: 0 0.6rem 0 0.6rem;
	clip-path: polygon(
		var(--world-cut-x) 0,
		100% 0,
		100% calc(100% - var(--world-cut-y)),
		calc(100% - var(--world-cut-x)) 100%,
		0 100%,
		0 var(--world-cut-y)
	);
}

.world__img{
	display: block;
	width: 100%;
	height: 100%;
	object-position: bottom;
	object-fit: cover;
	transition: scale 0.5s ease 0s;
}

.world:hover .world__img{
	scale: 1.05;
}

@media (max-width: 1366px) {
	.world {
    height: 47.5rem;
}
}

@media (max-width: 1024px) {
	.world {
        height: 34.5rem;
    }
}

@media (max-width: 768px) {
	.world{
		--world-cut-x: 8.15rem;
		--world-cut-y: 7.1rem;
		height: 29.5rem;
	}

	.world::after{
		border-width: 7.5rem 8.6rem;
		border-image-source: url(../img/game-world/border2.png);
		border-image-slice: 150 172;
	}
}

@media (max-width: 480px) {
	.world{
		--world-cut-x: 7.15rem;
		--world-cut-y: 7.15rem;
	}

	.world::after{
		border-width: 7.5rem;
		border-image-source: url(../img/game-world/border3.png);
		border-image-slice: 150;
	}
}

/* ========== partners ========== */

.partners{
	--logo-gap: 6rem;
}

.partners{
	overflow: hidden;
}

/* .partners__viewport{
	overflow: hidden;
} */

.partners__track{
	display: flex;
	justify-content: center;
	gap: calc(var(--logo-gap) * var(--logo-scale, 1));
}

.partners.is-marquee .partners__track{
	justify-content: flex-start;
	width: max-content;
}

.partners__list{
	flex-shrink: 0;
	display: flex;
	align-items: center;
	gap: calc(var(--logo-gap) * var(--logo-scale, 1));
}

.partners__logo{
	flex-shrink: 0;
	display: block;
	width: calc(var(--logo-w, 16rem) * var(--logo-scale, 1));
	max-width: calc(20rem * var(--logo-scale, 1));
	height: auto;
	max-height: calc(10rem * var(--logo-scale, 1));
	object-fit: contain;
}

@media (max-width: 1366px) {
	.partners{
		--logo-gap: 4rem;
	}
}

@media (max-width: 480px) {
	.partners{
		--logo-scale: 0.6;
	}
}

section:not(.intro){
	padding: var(--section-margin) 0rem;
}

/* ========== about ========== */

.about{
	overflow: hidden;
}

.about__title{
	margin-bottom: 1rem;
	text-align: center;
}

.about__body{
	max-width: 154.6rem;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
}

.about__col{
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	position: relative;
	z-index: 1;
	gap: 6rem;
}

.about__col--right{
	margin-top: 10.4rem;
}

.about__media{
	flex-shrink: 0;
	width: 60.6rem;
	position: relative;
	z-index: -1;
}

.about__img,
.about__video{
	display: block;
	width: 100%;
	height: auto;
}

/* ========== fact ========== */

.fact__crosshair{
	display: none;
	position: absolute !important;
	z-index: -1;
	top: 50%;
	translate: 0px -50%;
}

.fact__crosshair::after{
	content: '';
	width: 4.4rem;
	position: absolute;
	height: 4.4rem;
	background: url(../img/icons/cursor-theme.svg) center / contain no-repeat;
	animation: crosshair-spin 8s linear infinite;
}

@keyframes crosshair-spin{
	from{
		rotate: 0deg;
	}

	to{
		rotate: 360deg;
	}
}

.about__col--left .fact__crosshair::after{
	left: 100%;
	bottom: calc(100% + 0.7rem);
	translate: -50% 0%;
}

.about__col--left .fact:first-child .fact__crosshair{
	left: 100%;
	width: 16.6rem;
	display: block;
	height: 7rem;
	border-bottom: 0.1rem solid var(--theme-color);
	border-right: 0.1rem solid var(--theme-color);
}

.about__col--left .fact:nth-child(2) .fact__crosshair{
	left: 100%;
	width: 13.7rem;
	display: block;
	translate: 0px -75%;
	height: 6.1rem;
	border-bottom: 0.1rem solid var(--theme-color);
	border-right: 0.1rem solid var(--theme-color);
}

.about__col--right .fact:first-child .fact__crosshair{
	display: block;
	right: 100%;
	width: 7.3rem;
	height:8.2rem;
	translate: 0px -25%;
	border-left: 0.1rem solid var(--theme-color);
	border-bottom: 0.1rem solid var(--theme-color);
}

.about__col--right .fact__crosshair::after{
	right: 100%;
	bottom: calc(100% + 0.7rem);
	translate: 50% 0%;
}

.about__col--right .fact:nth-child(2) .fact__crosshair{
	display: block;
	right: 100%;
	width: 24.1rem;
	translate: 0px -100%;
	height:8.1rem;
	border-left: 0.1rem solid var(--theme-color);
	border-bottom: 0.1rem solid var(--theme-color);
}

@media (max-width: 1366px) {
	.about__col{
		gap: 10rem;
	}

	.about__col--right{
		margin-top: 5rem;
	}

	.about__media{
		width: 52.6rem;
	}

	.about__body{
		gap: 0.3rem;
		max-width: 119.6rem;
	}

	.about__col--right .fact:nth-child(2) .fact__crosshair {
    width: 18.4rem;
    height: 8.1rem;
}

	.about__col--left .fact:first-child .fact__crosshair {
    width: 10.9rem;
}

	.about__col--left .fact:nth-child(2) .fact__crosshair {
    width: 7.9rem;
}
}

@media (max-width: 1024px) {
	.about__title{
		margin-bottom: 2rem;
	}

	.about__col{
		padding-top: 3rem;
	}

	.about__col--left .fact:first-child .fact__crosshair {
        width: 10.9rem;
		translate: 0px 25%;
    }

	.about__col--left .fact:nth-child(2) .fact__crosshair {
        width: 10.9rem;
		translate: -20% 50%;
    }

	.about__col--right .fact:nth-child(2) .fact__crosshair {
        width: 14.4rem;
		translate: 0px 20%;
    }

	.about__col--right .fact:first-child .fact__crosshair {
    width: 7.3rem;
    translate: 0px 20%;
}

	.about__col{
	padding-top: 0rem;
	max-width: 15.3rem;
	margin-left: auto;
 }

	.about__col--right {
			margin-top: 0rem;
		}

	.about__body {
			align-items: center;
        max-width: 86.6rem;
    }
}

@media (max-width: 768px) {
	.about__body {
			align-items: flex-start;
    }

	.about__media{
		width: 34.5rem;
	}
}

@media (max-width: 480px) {
	.about__media {
        width: 24.4rem;
		left: 0;
		translate: -3.4rem 0rem;
		top: 5rem;
    }

	.about__media::after, .about__media::before{
		content: '';
		width: 1.6rem;
		position: absolute;
		height: 1.6rem;
		background: url(../img/icons/cursor-theme.svg) center / contain no-repeat;
		animation: crosshair-spin 8s linear infinite;
	}

	.about__title{
		margin-bottom: 3.2rem;
	}

	.about__media::after{
			top: 7.2rem;
			right: 4.5rem;
		}

	.about__media::before{
			top: 13rem;
			left: 6.7rem;
		}

	.about__body{
		flex-direction: column;
		gap: 1.5rem;
	}

	.about{
		position: relative;
	}

	.about__col{
		gap: 1.5rem;
	}

	.about__media{
		position: absolute;
	}
}

.fact{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1.6rem;
	width: 45rem;
	min-height: 23.5rem;
	padding: 4rem;
}

.fact::before,
.fact::after{
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.fact::before{
	background-color: var(--bg-white-10);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='450' height='235' viewBox='0 0 450 235' preserveAspectRatio='none'%3E%3Cpath d='M170.25 235L170.25 234.5L279.75 234.5L279.75 235L389.25 235L389.25 234.5L444 234.5C447.038 234.5 449.5 232.038 449.5 229L449.5 192.371L450 192.371L450 119.114L449.5 119.114L449.5 82.4854C449.5 82.1224 449.464 81.7629 449.395 81.4121L449.884 81.3155C449.73 80.5426 449.426 79.8076 448.988 79.1524L448.573 79.4297C448.375 79.1324 448.145 78.8534 447.889 78.5967L433.768 64.4746L434.121 64.1211L405.879 35.8789L405.525 36.2325L391.403 22.1114C391.147 21.8547 390.868 21.6255 390.57 21.4268L390.848 21.0118C390.193 20.574 389.457 20.2699 388.685 20.1162L388.588 20.6055C388.237 20.5357 387.878 20.5 387.515 20.5L329.53 20.5L329.53 20L213.561 20L213.561 20.5L155.576 20.5C155.133 20.5 154.694 20.4551 154.267 20.3672L154.366 19.8779C153.57 19.714 152.814 19.3896 152.147 18.9248L151.861 19.334C151.593 19.147 151.337 18.9388 151.098 18.711L150.863 18.4766L147 14.4102L147.362 14.0674L139.637 5.93361L139.274 6.27833L135.412 2.21193C135.154 1.94005 134.87 1.69729 134.567 1.48634L134.853 1.07618C134.185 0.611375 133.43 0.286938 132.633 0.123058L132.531 0.612316C132.17 0.538035 131.799 0.500012 131.424 0.500011L108.95 0.50001L108.95 9.52473e-06L64.0039 5.5954e-06L64.0039 0.500006L41.5303 0.500004C41.1614 0.500004 40.7956 0.537361 40.4395 0.609379L40.3399 0.119144C39.5554 0.277909 38.8107 0.592925 38.1494 1.04395L38.4307 1.45606C38.1306 1.66072 37.8493 1.8961 37.5918 2.16016L28.709 11.2705L28.3516 10.9229L10.586 29.1416L10.9444 29.4912L2.06154 38.6016C1.8125 38.857 1.59109 39.1344 1.39845 39.4287L0.978533 39.1553C0.554154 39.8039 0.260028 40.5293 0.111345 41.29L0.602556 41.3848C0.551876 41.6438 0.519785 41.9076 0.506853 42.1738L0.500017 42.4404L0.500013 89.0811L1.27566e-05 89.0811L4.6019e-06 182.36L0.500005 182.36L0.500001 229C0.5 231.943 2.81084 234.346 5.7168 234.493L6 234.5L60.75 234.5L60.75 235L170.25 235Z' fill='%23000'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='450' height='235' viewBox='0 0 450 235' preserveAspectRatio='none'%3E%3Cpath d='M170.25 235L170.25 234.5L279.75 234.5L279.75 235L389.25 235L389.25 234.5L444 234.5C447.038 234.5 449.5 232.038 449.5 229L449.5 192.371L450 192.371L450 119.114L449.5 119.114L449.5 82.4854C449.5 82.1224 449.464 81.7629 449.395 81.4121L449.884 81.3155C449.73 80.5426 449.426 79.8076 448.988 79.1524L448.573 79.4297C448.375 79.1324 448.145 78.8534 447.889 78.5967L433.768 64.4746L434.121 64.1211L405.879 35.8789L405.525 36.2325L391.403 22.1114C391.147 21.8547 390.868 21.6255 390.57 21.4268L390.848 21.0118C390.193 20.574 389.457 20.2699 388.685 20.1162L388.588 20.6055C388.237 20.5357 387.878 20.5 387.515 20.5L329.53 20.5L329.53 20L213.561 20L213.561 20.5L155.576 20.5C155.133 20.5 154.694 20.4551 154.267 20.3672L154.366 19.8779C153.57 19.714 152.814 19.3896 152.147 18.9248L151.861 19.334C151.593 19.147 151.337 18.9388 151.098 18.711L150.863 18.4766L147 14.4102L147.362 14.0674L139.637 5.93361L139.274 6.27833L135.412 2.21193C135.154 1.94005 134.87 1.69729 134.567 1.48634L134.853 1.07618C134.185 0.611375 133.43 0.286938 132.633 0.123058L132.531 0.612316C132.17 0.538035 131.799 0.500012 131.424 0.500011L108.95 0.50001L108.95 9.52473e-06L64.0039 5.5954e-06L64.0039 0.500006L41.5303 0.500004C41.1614 0.500004 40.7956 0.537361 40.4395 0.609379L40.3399 0.119144C39.5554 0.277909 38.8107 0.592925 38.1494 1.04395L38.4307 1.45606C38.1306 1.66072 37.8493 1.8961 37.5918 2.16016L28.709 11.2705L28.3516 10.9229L10.586 29.1416L10.9444 29.4912L2.06154 38.6016C1.8125 38.857 1.59109 39.1344 1.39845 39.4287L0.978533 39.1553C0.554154 39.8039 0.260028 40.5293 0.111345 41.29L0.602556 41.3848C0.551876 41.6438 0.519785 41.9076 0.506853 42.1738L0.500017 42.4404L0.500013 89.0811L1.27566e-05 89.0811L4.6019e-06 182.36L0.500005 182.36L0.500001 229C0.5 231.943 2.81084 234.346 5.7168 234.493L6 234.5L60.75 234.5L60.75 235L170.25 235Z' fill='%23000'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}

.fact::after{
	background: url(../img/about-us/fact-top.png) center / 100% 100% no-repeat;
}

.fact > *{
	position: relative;
}

.fact--bottom::before{
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='450' height='235' viewBox='0 0 450 235' preserveAspectRatio='none'%3E%3Cpath d='M279.75 -1.48837e-05L279.75 0.499985L170.25 0.499976L170.25 -2.44565e-05L60.75 -3.40293e-05L60.75 0.499966L6 0.499961C2.96243 0.499961 0.50001 2.9624 0.499999 5.99996L0.499996 42.6289L-3.72674e-06 42.6289L-1.01311e-05 115.886L0.49999 115.886L0.499987 152.515C0.499987 152.878 0.535676 153.237 0.605455 153.588L0.116198 153.685C0.269866 154.457 0.573962 155.192 1.01171 155.848L1.42674 155.57C1.62544 155.868 1.85466 156.147 2.11131 156.403L16.2324 170.525L15.8789 170.879L44.1211 199.121L44.4746 198.768L58.5967 212.889C58.8533 213.145 59.1323 213.375 59.4297 213.573L59.1523 213.988C59.8075 214.426 60.5426 214.73 61.3154 214.884L61.4121 214.394C61.7629 214.464 62.1224 214.5 62.4853 214.5L120.47 214.5L120.47 215L236.439 215L236.439 214.5L294.424 214.5C294.867 214.5 295.306 214.545 295.733 214.633L295.634 215.122C296.43 215.286 297.186 215.61 297.853 216.075L298.139 215.666C298.407 215.853 298.663 216.061 298.902 216.289L299.137 216.523L303 220.59L302.638 220.933L310.363 229.066L310.726 228.722L314.588 232.788C314.846 233.06 315.13 233.303 315.433 233.514L315.147 233.924C315.815 234.389 316.57 234.713 317.367 234.877L317.469 234.388C317.83 234.462 318.201 234.5 318.576 234.5L341.05 234.5L341.05 235L385.996 235L385.996 234.5L408.47 234.5C408.839 234.5 409.204 234.463 409.561 234.391L409.66 234.881C410.445 234.722 411.189 234.407 411.851 233.956L411.569 233.544C411.869 233.339 412.151 233.104 412.408 232.84L421.291 223.729L421.648 224.077L439.414 205.858L439.056 205.509L447.938 196.398C448.188 196.143 448.409 195.866 448.602 195.571L449.021 195.845C449.446 195.196 449.74 194.471 449.889 193.71L449.397 193.615C449.448 193.356 449.48 193.092 449.493 192.826L449.5 192.56L449.5 145.919L450 145.919L450 52.6396L449.5 52.6396L449.5 6C449.5 3.05741 447.189 0.654224 444.283 0.506835L444 0.499999L389.25 0.499995L389.25 -5.31093e-06L279.75 -1.48837e-05Z' fill='%23000'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='450' height='235' viewBox='0 0 450 235' preserveAspectRatio='none'%3E%3Cpath d='M279.75 -1.48837e-05L279.75 0.499985L170.25 0.499976L170.25 -2.44565e-05L60.75 -3.40293e-05L60.75 0.499966L6 0.499961C2.96243 0.499961 0.50001 2.9624 0.499999 5.99996L0.499996 42.6289L-3.72674e-06 42.6289L-1.01311e-05 115.886L0.49999 115.886L0.499987 152.515C0.499987 152.878 0.535676 153.237 0.605455 153.588L0.116198 153.685C0.269866 154.457 0.573962 155.192 1.01171 155.848L1.42674 155.57C1.62544 155.868 1.85466 156.147 2.11131 156.403L16.2324 170.525L15.8789 170.879L44.1211 199.121L44.4746 198.768L58.5967 212.889C58.8533 213.145 59.1323 213.375 59.4297 213.573L59.1523 213.988C59.8075 214.426 60.5426 214.73 61.3154 214.884L61.4121 214.394C61.7629 214.464 62.1224 214.5 62.4853 214.5L120.47 214.5L120.47 215L236.439 215L236.439 214.5L294.424 214.5C294.867 214.5 295.306 214.545 295.733 214.633L295.634 215.122C296.43 215.286 297.186 215.61 297.853 216.075L298.139 215.666C298.407 215.853 298.663 216.061 298.902 216.289L299.137 216.523L303 220.59L302.638 220.933L310.363 229.066L310.726 228.722L314.588 232.788C314.846 233.06 315.13 233.303 315.433 233.514L315.147 233.924C315.815 234.389 316.57 234.713 317.367 234.877L317.469 234.388C317.83 234.462 318.201 234.5 318.576 234.5L341.05 234.5L341.05 235L385.996 235L385.996 234.5L408.47 234.5C408.839 234.5 409.204 234.463 409.561 234.391L409.66 234.881C410.445 234.722 411.189 234.407 411.851 233.956L411.569 233.544C411.869 233.339 412.151 233.104 412.408 232.84L421.291 223.729L421.648 224.077L439.414 205.858L439.056 205.509L447.938 196.398C448.188 196.143 448.409 195.866 448.602 195.571L449.021 195.845C449.446 195.196 449.74 194.471 449.889 193.71L449.397 193.615C449.448 193.356 449.48 193.092 449.493 192.826L449.5 192.56L449.5 145.919L450 145.919L450 52.6396L449.5 52.6396L449.5 6C449.5 3.05741 447.189 0.654224 444.283 0.506835L444 0.499999L389.25 0.499995L389.25 -5.31093e-06L279.75 -1.48837e-05Z' fill='%23000'/%3E%3C/svg%3E");
}

.fact--bottom::after{
	background-image: url(../img/about-us/fact-bottom.png);
}

.fact--bottom{
	padding-bottom: 12rem;
}

.fact__value{

	font-family: var(--second-family);
	color: var(--text-white);
}

.fact__icon{
	width: 11.2rem;
	height: 5.5rem;
	margin-bottom: 0.8rem;
	color: var(--text-white);
	fill: currentColor;
}

.fact__text{
	max-width: 25rem;
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.032em;
	text-transform: uppercase;
	color: var(--text-white-75);
}

@media (max-width: 1366px) {
	.fact__icon{
	width: 9.1rem;
	height: 4.5rem;
	margin-bottom: 0.6rem;
}

	.fact{
		justify-content: flex-end;
		width: 33.2rem;
		min-height: 19.5rem;
		padding: 2.4rem 3rem;
	}

	.fact--bottom{
		justify-content: flex-start;
	}

	.fact::before{
		-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='332' height='195' viewBox='0 0 332 195' fill='none' preserveAspectRatio='none'%3E%3Cpath d='M332 82.4852L332 189.001C332 192.314 329.314 195.001 326 195.001L5.99999 195C2.68629 195 4.51063e-06 192.314 4.7073e-06 189L1.33372e-05 42.4407C1.3474e-05 40.8757 0.611485 39.3726 1.70401 38.2521L37.2339 1.81118C38.3632 0.652942 39.9123 -0.000225393 41.5299 -0.000225251L131.424 -0.000217392C133.069 -0.000217249 134.641 0.674908 135.774 1.86729L151.226 18.1323C152.359 19.3247 153.931 19.9998 155.576 19.9998L269.515 19.9998C271.106 19.9998 272.632 20.6319 273.757 21.7572L330.243 78.2425C331.368 79.3677 332 80.8939 332 82.4852Z' fill='%23000'/%3E%3C/svg%3E");
		mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='332' height='195' viewBox='0 0 332 195' fill='none' preserveAspectRatio='none'%3E%3Cpath d='M332 82.4852L332 189.001C332 192.314 329.314 195.001 326 195.001L5.99999 195C2.68629 195 4.51063e-06 192.314 4.7073e-06 189L1.33372e-05 42.4407C1.3474e-05 40.8757 0.611485 39.3726 1.70401 38.2521L37.2339 1.81118C38.3632 0.652942 39.9123 -0.000225393 41.5299 -0.000225251L131.424 -0.000217392C133.069 -0.000217249 134.641 0.674908 135.774 1.86729L151.226 18.1323C152.359 19.3247 153.931 19.9998 155.576 19.9998L269.515 19.9998C271.106 19.9998 272.632 20.6319 273.757 21.7572L330.243 78.2425C331.368 79.3677 332 80.8939 332 82.4852Z' fill='%23000'/%3E%3C/svg%3E");
	}

	.fact::after{
		background-image: url(../img/about-us/fact-top-1366.png);
	}

	.fact--bottom::before{
		-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='332' height='195' viewBox='0 0 332 195' fill='none' preserveAspectRatio='none'%3E%3Cpath d='M-9.83635e-06 112.515L-3.10421e-05 5.99998C-3.07524e-05 2.68627 2.68628 -2.1332e-05 5.99997 -2.11173e-05L326 -5.24537e-07C329.314 -2.34843e-07 332 2.68629 332 6L332 152.559C332 154.124 331.389 155.627 330.296 156.748L294.766 193.189C293.637 194.347 292.088 195 290.47 195L200.576 195C198.931 195 197.359 194.325 196.226 193.132L180.774 176.867C179.641 175.675 178.069 175 176.424 175L62.4853 175C60.894 175 59.3678 174.368 58.2426 173.243L1.75734 116.757C0.632131 115.632 -9.97546e-06 114.106 -9.83635e-06 112.515Z' fill='%23000'/%3E%3C/svg%3E");
		mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='332' height='195' viewBox='0 0 332 195' fill='none' preserveAspectRatio='none'%3E%3Cpath d='M-9.83635e-06 112.515L-3.10421e-05 5.99998C-3.07524e-05 2.68627 2.68628 -2.1332e-05 5.99997 -2.11173e-05L326 -5.24537e-07C329.314 -2.34843e-07 332 2.68629 332 6L332 152.559C332 154.124 331.389 155.627 330.296 156.748L294.766 193.189C293.637 194.347 292.088 195 290.47 195L200.576 195C198.931 195 197.359 194.325 196.226 193.132L180.774 176.867C179.641 175.675 178.069 175 176.424 175L62.4853 175C60.894 175 59.3678 174.368 58.2426 173.243L1.75734 116.757C0.632131 115.632 -9.97546e-06 114.106 -9.83635e-06 112.515Z' fill='%23000'/%3E%3C/svg%3E");
	}

	.fact--bottom::after{
		background-image: url(../img/about-us/fact-bottom-1366.png);
	}

	.fact__text{
		max-width: none;
		font-size: 1.4rem;
	}
}

@media (max-width: 1024px) {
	.fact__crosshair{
	display: none !important;
 }

	.fact{
		padding: 0rem;
		min-height: 0rem;
		width: 15.3rem;
		justify-content: flex-start;
	}

	.fact__crosshair{
		border: none !important;
	}

	.fact::before, .fact::after{
		display: none;
	}
}

@media (max-width: 768px) {
	.fact {
		gap: 1.2rem;
	}

	.fact__icon {
        width: 6.7rem;
        height: 3.3rem;
        margin-bottom: 0.3rem;
    }
}

@media (max-width: 480px) {
	.fact__icon {
        width: 3.5rem;
        height: 1.7rem;
        margin-bottom: 0rem;
    }

	.fact {
		gap: 0.8rem;
	}
}

/* ========== services ========== */

.services{
	margin-top: var(--section-margin);
	overflow: hidden;
}

.services__label{
	display: block;
	margin-bottom: 3rem;
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.038rem;
	text-transform: uppercase;
	color: var(--text-white);
}

.services__cover{
	--cols: 105;
	--rows: 30;
	position: absolute;
	z-index: 5;
	inset: 0;
	pointer-events: none;
}

.services__cover canvas{
	display: block;
}

.services__panel{
	position: relative;
	display: none;
	align-items: flex-start;
	justify-content: flex-end;
	gap: 18rem;
	padding-right: 16rem;
}

.services__panel.is-active{
	display: flex;
}

.services__info{
	position: absolute;
	z-index: 2;
	top: 9.6rem;
	left: 0;
	width: 70rem;
}

.services__title{
	margin-bottom: 2.4rem;
}

.services__text{
	max-width: 40rem;
	margin-bottom: 4rem;
	color: var(--text-white-75);
}

.services__media{
	position: relative;
	flex-shrink: 0;
	width: 92rem;
}

.services__main{
	--slide-gap: 2rem;
}

.services__shot{
	position: relative;
	aspect-ratio: 920 / 535;
	-webkit-mask: url(../img/characters/media-mask.svg) center / 100% 100% no-repeat;
	mask: url(../img/characters/media-mask.svg) center / 100% 100% no-repeat;
}

.services__shot img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.services__tiles{
	--cols: 52;
	--rows: 30;
	position: absolute;
	z-index: 3;
	top: 0;
	left: 0;
	width: 100%;
	aspect-ratio: 920 / 535;
	pointer-events: none;
	-webkit-mask: url(../img/characters/media-mask.svg) center / 100% 100% no-repeat;
	mask: url(../img/characters/media-mask.svg) center / 100% 100% no-repeat;
}

.services__tiles canvas{
	display: block;
}

.services__caption{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 1rem;
	translate: 0px calc(-100% - 1.2rem);
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.032em;
	text-transform: uppercase;
	color: var(--text-white-60);
}

.services__caption b{
	width: 0.8rem;
	border-radius: 0.2rem;
	height: 0.8rem;
	border: 1px solid var(--theme-color);
}

.services__thumbs{
	--thumb-h: 8.8rem;
	--thumb-gap: 1.6rem;
	--thumb-view: 4;
	position: relative;
	flex-shrink: 0;
	width: 14.3rem;
}

.services__thumbs-slider{
	height: calc(var(--thumb-h) * var(--thumb-view) + var(--thumb-gap) * (var(--thumb-view) - 1));
}

.services__thumb{
	height: var(--thumb-h);
	padding: 0.4rem;
	cursor: pointer;
}

.services__thumb img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: grayscale(1);
}

.services__marker{
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	width: 14.3rem;
	height: var(--thumb-h);
	pointer-events: none;
	background: url(../img/characters/border.png) center / 100% 100% no-repeat;
	transition: translate 0.4s cubic-bezier(0.65, 0, 0.35, 1) 0s;
}

.services__tabs{
	display: flex;
	flex-shrink: 0;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 2.4rem;
	margin-top: calc(var(--section-margin) + var(--section-margin));
}

/* ========== tab ========== */

.tab{
	--tab-cut: 2.4rem;
	position: relative;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	height: 4.8rem;
	padding: 0 3rem;
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.032em;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--text-white);
	background-color: var(--stroke-white-20);
	border-radius: 0 0.6rem 0 0.6rem;
	cursor: pointer;
	clip-path: polygon(
		var(--tab-cut) 0,
		100% 0,
		100% calc(100% - var(--tab-cut)),
		calc(100% - var(--tab-cut)) 100%,
		0 100%,
		0 var(--tab-cut)
	);
	transition: color 0.25s ease 0s;
}

.tab::before{
	content: "";
	position: absolute;
	z-index: -1;
	inset: 0.1rem;
	background-color: var(--bg-black);
	border-radius: 0 0.5rem 0 0.5rem;
	clip-path: polygon(
		calc(var(--tab-cut) - 0.1rem) 0,
		100% 0,
		100% calc(100% - var(--tab-cut) + 0.1rem),
		calc(100% - var(--tab-cut) + 0.1rem) 100%,
		0 100%,
		0 calc(var(--tab-cut) - 0.1rem)
	);
	transition: background-color 0.25s ease 0s;
}

.tab:hover{
	color: var(--text-orange);
}

.services.is-busy .tab{
	pointer-events: none;
}

@media (max-width: 1366px) {
	.services__panel{
		gap: 7.6rem;
		padding-right: 6.5rem;
	}

	.services__label{
		font-size: 1.4rem;
	}

	.services__info{
		top: 11rem;
		width: 46rem;
	}

	.services__text{
		max-width: 35rem;
	}

	.services__media{
		width: 59rem;
	}

	.services__shot,
	.services__tiles{
		aspect-ratio: 590 / 485;
		-webkit-mask-image: url(../img/characters/media-mask-1366.svg);
		mask-image: url(../img/characters/media-mask-1366.svg);
	}

	.services__tiles{
		--cols: 33;
		--rows: 27;
	}

	.services__cover{
		--cols: 74;
		--rows: 27;
	}

	.services__thumbs{
		--thumb-h: 8.4rem;
		width: 13.5rem;
	}

	.services__marker{
		width: 13.5rem;
	}

	.services__caption{
		font-size: 1.4rem;
	}
}

@media (max-width: 1024px) {
	.services__panel{
		flex-wrap: wrap;
		justify-content: flex-start;
		gap: 4rem;
		padding-right: 0;
	}

	.services__info{
		max-width: 50rem;
	}

	.services__tabs{
		gap: 1.6rem;
		margin-top: var(--section-margin);
	}

	.services__info{
		position: static;
		width: 100%;
	}

	.services__media{
		width: calc(100% - 13.5rem - 4rem);
	}

	.services__tiles{
		--cols: 45;
		--rows: 37;
	}

	.services__cover{
		--cols: 39;
		--rows: 42;
	}
}

@media (max-width: 768px) {
	.services .wrapper-padding{
		display: flex;
		flex-direction: column;
	}

	.services__caption{
		margin-top: 0.8rem;
		justify-content: flex-start;
		translate: 0px 0px;
	}

	.services__label{
		order: 1;
		margin-bottom: 2.4rem;
	}

	.services__tabs{
		order: 2;
		flex-wrap: nowrap;
		justify-content: flex-start;
		margin: 0 calc(-1 * var(--wrapper-padding)) 4rem;
		padding: 0 var(--wrapper-padding);
		overflow-x: auto;
		scrollbar-width: none;
	}

	.services__tabs::-webkit-scrollbar{
		display: none;
	}

	.services__panel{
		order: 3;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		padding-right: 0;
	}

	.services__tabs{
		margin-bottom: 2.4rem;
	}

	.services__info{
		display: contents;
	}

	.services__title{
		order: 1;
		margin-bottom: 2.4rem;
	}

	.services__text{
		order: 2;
		max-width: 39rem;
		margin-bottom: 2.6rem;
	}

	.services__media{
		order: 3;
		width: calc(100% + var(--wrapper-padding));
		margin-bottom: 4rem;
	}

	.services__more{
		order: 4;
	}

	.services__slide{
		width: 34.4rem;
	}

	.services__caption{
		justify-content: flex-start;
	}

	.services__thumbs{
		display: none;
	}

	.services__cover{
		--cols: 30;
		--rows: 40;
	}
}

@media (max-width: 480px) {
	.services__main{
		--slide-gap: 1.2rem;
	}

	.services__tabs {
        gap: 1.2rem;
    }

	.services__slide{
		width: 30.3rem;
	}

	.services__text{
		max-width: none;
	}

	.services__cover{
		--cols: 18;
		--rows: 44;
	}

	.services__tiles{
		--cols: 17;
		--rows: 14;
	}
}

.tab.is-active{
	color: var(--text-black);
}

.tab.is-active::before{
	background-color: var(--bg-white);
}

@media (max-width: 1366px) {
	.tab {
	font-size: 1.4rem;
	padding: 0rem 1.6rem;
}
}

@media (max-width: 480px) {
	.tab {
		    --tab-cut: 1.6rem;
    height: 4.2rem;
}
}

/* ========== deliver ========== */

.deliver{
	position: relative;
	overflow: hidden;
	text-align: center;
}

.deliver__title{
	position: relative;
	z-index: 2;
	max-width: 107.5rem;
	margin: 0 auto;
}

.deliver__inner{
	position: absolute;
	left: 50%;
	translate: -50% 0%;
	top: calc(var(--section-margin) + 3rem);
	width: 144rem;
	height: 81rem;
	margin: 0 auto;
}

.deliver__media{
	width: 100%;
}

.deliver__img,
.deliver__video{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.deliver__cta{
	position: relative;
	z-index: 2;
	margin: 54.7rem auto 0;
	text-align: left;
}

@media (max-width: 1366px) {
	.deliver__title{
		max-width: 76.2rem;
	}

	.deliver {
    padding-bottom: 4.7rem !important;
}

	.deliver__inner{
		width: 102.2rem;
		height: 57.5rem;
	}

	.deliver__cta{
		margin-top: 42.7rem;
	}
}

@media (max-width: 768px) {
	.deliver__cta{
		margin-top: 42.5rem;
	}

	.deliver__inner {
    top: calc(var(--section-margin) + 1rem);
}
}

@media (max-width: 480px) {
	.deliver__cta{
		margin-top: 27rem;
	}

	.deliver__inner {
    top: calc(var(--section-margin));
}

	.deliver__title{
		max-width: none;
	}

	.deliver__inner{
		width: 53.4rem;
		height: 30.1rem;
	}
}

/* ========== team ========== */

.team{
	position: relative;
	flex-shrink: 0;
	height: 200vh;
	height: calc(var(--app-vh, 1vh) * 200);
}

.team__pin{
	position: sticky;
	top: 0;
	height: 100vh;
	height: calc(var(--app-vh, 1vh) * 100);
	overflow: hidden;
}

.team__bg{
	position: absolute;
	inset: 0;
	background-color: var(--bg-black);
}

.team__bg::after{
	content: "";
	position: absolute;
	z-index: 2;
	inset: 0;
	pointer-events: none;
	background-color: rgba(0, 0, 0, 0.42);
	transition: background-color 0.5s ease 0s;
}

.team.is-alt .team__bg::after{
	background-color: rgba(0, 0, 0, 0.55);
}

.team__img{
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
}

.team__img.is-active{
	opacity: 1;
}

.team__tiles{
	position: absolute;
	z-index: 1;
	inset: 0;
	pointer-events: none;
}

.team__tiles canvas{
	display: block;
}

.team__inner{
	position: relative;
	z-index: 3;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 2rem;
	height: 100%;
	padding-top: 8rem;
	padding-bottom: 8rem;
}

.team__info{
	flex-shrink: 0;
	width: 84.2rem;
}

.team__title{
	margin-bottom: 3.2rem;
}

.team__text{
	max-width: 42.7rem;
}

.team__cta{
	align-self: start;
	justify-self: start;
}

.team__cta--info{
	display: none;
}

.team__list{
	display: grid;
	grid-template-columns: repeat(2, 44rem);
	gap: 6rem 2rem;
	margin-right: 7rem;
	max-width: 92rem;
	width: 100%;
	opacity: 0;
	translate: 0 55vh;
}

.team__name{
	margin-bottom: 2.4rem;
	text-transform: uppercase;
}

.team__name b{
	font-weight: inherit;
	color: var(--text-orange);
}

.team__note{
	position: relative;
	padding-left: 2.4rem;
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.028rem;
	text-transform: uppercase;
	color: var(--text-white-75);
}

.team__note::before{
	content: "";
	position: absolute;
	top: 0.6rem;
	border-radius: 0.2rem;
	left: 0;
	width: 1.2rem;
	height: 1.2rem;
	background-color: var(--bg-orange);
}

.team__item--end{
	justify-content: flex-end;
	display: flex;
	flex-direction: column;
}

@media (max-width: 1366px) {
	.team__list{
	margin-right: 5rem;
}

	.team__note::before {
    top: 0.5rem;
    width: 0.8rem;
    height: 0.8rem;
}

	.team__note{
	padding-left: 2.2rem;
}

	.team__info {
    width: 53.4rem;
}

	.team__list {
    gap: 4rem 2rem;
    max-width: 64.2rem;
	grid-template-columns: repeat(2, 30.9rem)
}

	.team__item br{
	display: none;
}

	.team__name{
	margin-bottom: 1.6rem;
}

	.team__note {
    padding-left: 2.4rem;
    font-size: 1.4rem;
}
}

@media (max-width: 1024px) {
	.team__bg {
			top: auto;
        height: 64.5rem;
		bottom: var(--section-margin);
    }

	.team__inner{
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 0rem;
		padding-top: 0rem;
		padding-bottom: 3rem;
	}

	.team__scroll{
		width: calc( 100% + var(--wrapper-padding) + var(--wrapper-padding));
		overflow-x: auto;
		overflow-y: hidden;
		overscroll-behavior-x: contain;
		margin-top: 52rem;
		margin-left: -3rem;
		padding-left: var(--wrapper-padding);
		padding-right: var(--wrapper-padding);
		scrollbar-width: none;
	}

	.team__scroll::-webkit-scrollbar{
		display: none;
	}

	.team__cta--info{
		display: flex;
		margin-top: 3.2rem;
	}

	.team__list .team__cta{
		display: none;
	}

	.team__info{
		width: auto;
	}

	.team__text{
		max-width: 45rem;
	}

	.team{
		height: auto;
	}

	.team__pin{
		position: static;
		height: auto;
		overflow: visible;
	}

	.team__list{
		display: flex;
		max-width: 100%;
		flex-wrap: nowrap;
		width: 100%;
		gap: 2rem;
		opacity: 1;
		translate: none;
	}

	.team__item{
		width: 28rem;
		flex-shrink: 0;
	}

	.team__item--end{
		display: none !important;
	}
}

@media (max-width: 768px) {
	.team__title {
    margin-bottom: 2.4rem;
}

	.team__item {
        width: 24rem;
    }
}

@media (max-width: 480px) {
	.team__name b{
		display: block;
	}

	.team__name {
        margin-bottom: 1.2rem;
    }

	.team__scroll {
        margin-top: 53.8rem;
        margin-left: -2rem;
    }

	.team__list {
        padding-top: 0rem;
    }

	.team__cta--info {
        margin-top: 2.4rem;
    }

	.team__title {
    margin-bottom: 1.6rem;
}
}

/* ========== meet ========== */

.meet{
	position: relative;
	overflow: hidden;
}

.meet__title{
	max-width: 130rem;
	margin: 0rem auto 6rem;
	text-align: center;
}

.meet__body{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 2rem;
}

.meet__side{
	flex-shrink: 0;
	width: 60rem;
}

.meet__list{
	display: flex;
	flex-direction: column;
	gap: 3.2rem;
}

.meet__cta{
	margin-top: 6rem;
}

/* ========== loc ========== */

.loc{
	--loc-cut-x: 1.5rem;
	--loc-cut-y: 1.4rem;
	position: relative;
}

.loc::before,
.loc::after{
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.loc::before{
	background-color: var(--bg-white-10);
	-webkit-backdrop-filter: blur(0.4rem);
	backdrop-filter: blur(0.4rem);
	clip-path: polygon(
		var(--loc-cut-x) 0,
		calc(100% - var(--loc-cut-x)) 0,
		100% var(--loc-cut-y),
		100% calc(100% - var(--loc-cut-y)),
		calc(100% - var(--loc-cut-x)) 100%,
		var(--loc-cut-x) 100%,
		0 calc(100% - var(--loc-cut-y)),
		0 var(--loc-cut-y)
	);
}

.loc::after{
	border: 2rem solid transparent;
	border-image: url(../img/map/border-accordion.png) 40 stretch;
}

.loc__head,
.loc__body{
	position: relative;
}

.loc__head{
	display: flex;
	align-items: center;
	gap: 1rem;
	width: 100%;
	min-height: 8.1rem;
	padding: 1.6rem 3.2rem;
	text-align: left;
	background-color: transparent;
	cursor: pointer;
}

.loc__label{
	flex-shrink: 0;
	width: 11.9rem;
	font-family: var(--font-family);
	font-size: 1.6rem;
	padding-right: 1rem;
	line-height: 1.3;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--text-white-60);
}

.loc__name{
	color: var(--text-white);
	transition: color 0.25s ease 0s;
}

.loc__head:hover .loc__name{
	color: var(--text-orange);
}

.loc__toggle{
	position: relative;
	flex-shrink: 0;
	width: 1.4rem;
	height: 1.4rem;
	margin-left: auto;
	color: var(--text-white);
}

.loc__toggle .icon{
	position: absolute;
	top: 50%;
	left: 50%;
	translate: -50% -50%;
	transition: opacity 0.25s ease 0s;
}

.loc__toggle .icon--close{
	opacity: 0;
}

.loc.is-open .loc__toggle .icon--plus{
	opacity: 0;
}

.loc.is-open .loc__toggle .icon--close{
	opacity: 1;
}

.loc__body{
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.5s ease 0s;
}

.loc.is-open .loc__body{
	grid-template-rows: 1fr;
}

.loc__wrap{
	min-height: 0;
	overflow: hidden;
}

.loc__grid{
	display: grid;
	grid-template-columns: 21.8rem 1fr auto;
	align-items: start;
	gap: 2.4rem;
	padding: 6rem 3.2rem 3.2rem;
}

.loc__key,
.loc__value{
	position: relative;
	display: block;
	padding-left: 2.2rem;
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.032rem;
	text-transform: uppercase;
}

.loc__key{
	color: var(--text-orange);
}

.loc__key::before{
	content: "";
	position: absolute;
	top: 0.6rem;
	left: 0rem;
	width: 0.8rem;
	height: 0.8rem;
	border: 0.1rem solid var(--stroke-orange);
	border-radius: 0.2rem;
}

.loc__value{
	margin-top: 1.6rem;
	color: var(--text-white-75);
}

.loc__in{
	display: block;
	width: 2.4rem;
	transition: opacity 0.25s ease 0s;
}

.loc__in img{
	display: block;
	width: 100%;
	height: auto;
}

.loc__in:hover{
	opacity: 0.7;
}

@media (max-width: 1366px) {
	.loc__head{
		min-height: 6.4rem;
		padding: 1.4rem 2.4rem;
	}

	.loc__label{
		width: 8rem;
	}

	.loc__grid{
		grid-template-columns: 1fr auto;
		gap: 2.4rem 1.6rem;
		padding: 3.2rem 2.4rem 3.2rem;
	}

	.loc__col:first-child{
		grid-column: 1 / -1;
	}

	.loc__key, .loc__value {
    padding-left: 2rem;
    font-size: 1.4rem;

}

	.loc__key::before {
    top: 0.5rem;
}

	.loc__label {
    font-size: 1.4rem;
}
}

@media (max-width: 1024px) {
	.loc__list{
		gap: 2.4rem;
	}

	.loc__head{
		padding: 1.4rem 2rem;
	}

	.loc__label{
		width: 6.4rem;
	}

	.loc__grid{
		padding: 2.8rem 2rem 2.8rem;
	}
}

@media (max-width: 768px) {
	.loc__value {
    margin-top: 0.4rem;
}

	.loc__head{
		min-height: 5.1rem;
		padding: 1.2rem 1.6rem;
	}

	.loc__label{
		width: 9rem;
	}

	.loc__grid{
		grid-template-columns: 1fr 1fr auto;
		gap: 1.6rem;
		padding: 6rem 3.2rem 3.2rem 11rem;
	}

	.loc__col:first-child{
		grid-column: auto;
	}
}

@media (max-width: 480px) {
	.loc__label{
		display: none;
	}

	.loc__head{
		min-height: 5rem;
		padding: 1.2rem 2rem;
	}

	.loc__grid{
		grid-template-columns: 1fr auto;
		gap: 2rem 1.6rem;
		padding: 1.5rem 1.6rem 2.4rem;
	}

	.loc__col:first-child{
		grid-column: 1 / -1;
	}

	.loc__in{
		align-self: start;
	}

	.loc__toggle {
    width: 1.2rem;
    height: 1.2rem;
}
}

.meet__map{
	position: relative;
	flex-shrink: 0;
	width: 134.9rem;
	margin-right: -11.4rem;
}

.meet__map-img{
	display: block;
	width: 100%;
	height: auto;
}

.meet__point{
	position: absolute;
	width: 6rem;
	height: 6rem;
	translate: -50% -50%;
	color: var(--text-orange);
	pointer-events: none;
}

.meet__point use{
	width: 100%;
	height: 100%;
}

.meet__point .icon{
	display: block;
	width: 100%;
	height: 100%;
	animation: crosshair-spin 8s linear infinite;
}

.meet__point--la{
	top: 52.15%;
	left: 15.01%;
}

.meet__point--yerevan{
	top: 47.75%;
	left: 55%;
}

.meet__point--seoul{
	top: 46.3%;
	left: 79.15%;
}

@media (max-width: 1366px) {
	.meet__title{
		max-width: 92rem;
		margin-bottom: 4rem;
	}

	.meet__side{
		width: 42rem;
	}

	.meet__map{
		width: 92.8rem;
		margin-right: -4rem;
	}

	.meet__cta{
		margin-top: 4rem;
	}

	.meet__list{
	gap: 2.4rem;
}
}

@media (max-width: 1024px) {
	.meet__title{
		max-width: 68rem;
	}

	.meet__side{
		width: 37rem;
	}

	.meet__map{
		width: 72rem;
		margin-right: -12rem;
	}

	.meet__point{
		width: 4.4rem;
		height: 4.4rem;
	}
}

@media (max-width: 768px) {
	.meet__title{
		max-width: 60rem;
		margin-bottom: 2.4rem;
	}

	.meet__point{
	width: 3.2rem;
	height: 3.2rem;
}

	.meet__body{
		flex-direction: column;
		align-items: stretch;
		gap: 2.4rem;
	}

	.meet__map{
		order: 1;
		width: 100%;
		margin-right: 0;
	}

	.meet__side{
		order: 2;
		width: auto;
	}

	.meet__list{
		gap: 1.6rem;
	}

	.meet__cta{
		margin: 2.4rem auto 0;
	}
}

@media (max-width: 480px) {
	.meet__cta {
        margin: 2.4rem auto 0;
		margin-left: 0rem;
    }

	.meet__map{
		width: calc(100% + var(--wrapper-padding) + var(--wrapper-padding));
		margin-left: -2rem;
	}

	.meet__point{
	width: 1.6rem;
	height: 1.6rem;
}
}

/* ========== reviews ========== */

.reviews{
	overflow: hidden;
}

.footer{
	overflow: hidden;
}

.reviews__title{
	max-width: 130rem;
	margin: 0rem auto 6rem;
	text-align: center;
}

.reviews__slider{
	max-width: 155rem;
	margin-inline: auto;
}

.reviews__slider .swiper{
	overflow: clip;
	overflow-clip-margin: 0.4rem;
}

@media (max-width: 1366px) {
	.reviews__title{
		max-width: 90rem;
		margin-bottom: 4rem;
	}

	.reviews__slider{
		max-width: 119.6rem;
	}
}

@media (max-width: 768px) {
	.reviews__title{
		max-width: 100%;
		margin-bottom: 2.1rem;
		text-align: left;
	}

	.reviews__slider{
		max-width: 100%;
	}

	.reviews .slider-nav{
	display: flex;
}
}

@media (max-width: 480px) {
	.reviews .slider-nav{
	justify-content: space-between;
}

	.reviews__slider{
		max-width: unset;
		margin-left: -2rem;
		padding: 0rem var(--wrapper-padding);
		width: calc(100% + var(--wrapper-padding) + var(--wrapper-padding));
	}

	.reviews__title{
		margin-bottom: 2.4rem;
	}

	.reviews__slider .swiper{
		margin-inline: calc(var(--wrapper-padding) * -1);
		padding-inline: var(--wrapper-padding);
	}
}

[data-slider-fade] .swiper-slide{
	will-change: opacity, transform;
}

/* ========== review ========== */

.review{
	--review-cut: 5.75rem;
	position: relative;
	display: flex;
	min-height: 45rem;
	padding: 5.4rem;
}

.review::before,
.review::after{
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.review::before{
	background-color: var(--background-color);
	background-image: linear-gradient(var(--bg-white-10), var(--bg-white-10));
	clip-path: polygon(
		var(--review-cut) 0,
		calc(100% - var(--review-cut)) 0,
		100% var(--review-cut),
		100% calc(100% - var(--review-cut)),
		calc(100% - var(--review-cut)) 100%,
		var(--review-cut) 100%,
		0 calc(100% - var(--review-cut)),
		0 var(--review-cut)
	);
}

.review::after{
	border: var(--review-cut) solid transparent;
	border-image: url(../img/map/border.png) 110 stretch;
}

.review__inner{
	position: relative;
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	justify-content: space-between;
	min-width: 0;
}

.review__text{
	font-family: var(--font-family);
	font-size: 2.4rem;
	line-height: 1.2;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--text-white);
}

.review__bottom{
	display: flex;
	padding-top: 2.4rem;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
}

.slider-nav__arrow[disabled]{
	opacity: 0.3;
	pointer-events: none;
}

@media (max-width: 768px) {
	.slider-nav{
		display: none;
	}
}

.review__name,
.review__role{
	position: relative;
	display: block;
	padding-left: 2.2rem;
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.032rem;
	text-transform: uppercase;
}

.review__name{
	color: var(--text-orange);
}

.review__name::before{
	content: "";
	position: absolute;
	top: 0.6rem;
	left: 0rem;
	width: 0.8rem;
	height: 0.8rem;
	border: 0.1rem solid var(--stroke-orange);
	border-radius: 0.2rem;
}

.review__role{
	margin-top: 1.6rem;
	color: var(--text-white-75);
}

.review__logos{
	display: flex;
	align-items: center;
	flex-shrink: 0;
	gap: 2.8rem;
}

.review__logos img{
	display: block;
	width: 9.6rem;
	height: 5.2rem;
}

.review__logos img + img{
	width: 5rem;
	height: 5rem;
}

@media (max-width: 1366px) {
	.review{
		--review-cut: 4rem;
		min-height: 38rem;
		padding: 4rem;
	}

	.review__text{
		font-size: 2rem;
		letter-spacing: -0.04em;
	}

	.review__name,
	.review__role{
		padding-left: 2rem;
		font-size: 1.4rem;
		letter-spacing: -0.028rem;
	}

	.review__name::before{
		top: 0.5rem;
	}
}

@media (max-width: 768px) {
	.review{
		--review-cut: 2.4rem;
		min-height: 35.7rem;
		padding: 2.4rem;
	}

	.review__text{
		font-size: 1.4rem;
		letter-spacing: -0.02em;
	}

	.review__bottom{
		flex-direction: column;
		align-items: flex-start;
		gap: 2rem;
	}

	.review__logos{
		gap: 2rem;
	}

	.review__logos img{
		width: 6.2rem;
		height: auto;
	}

	.review__logos img + img{
		width: 3rem;
		height: auto;
	}

	.review::after {
    border-image: url(../img/map/border-768.png) 58 stretch;
}
}

@media (max-width: 480px) {
	.review__inner{
		justify-content: flex-start;
		gap: 1.9rem;
	}

	.review__text{
		font-size: 1.4rem;
		letter-spacing: -0.04em;
	}

	.review__bottom{
		gap: 1.2rem;
	}

	.review__name::before{
		top: 0.7rem;
	}

	.review__role{
		margin-top: 0.8rem;
	}

	.review__logos img{
		width: 7.4rem;
	}

	.review__logos img + img{
		width: 3.8rem;
	}
}

/* ========== showreel ========== */

.showreel{
	height: 200vh;
	height: calc(var(--app-vh, 1vh) * 200);
}

.showreel__pin{
	position: sticky;
	top: 0;
	height: 100vh;
	height: calc(var(--app-vh, 1vh) * 100);
	overflow: hidden;
}

.showreel__head{
	position: absolute;
	z-index: 2;
	top: 7rem;
	left: 0;
	width: 100%;
	text-align: center;
}

.showreel__title{
	max-width: 140rem;
	margin: 0rem auto 2.4rem;
}

.showreel__lead{
	max-width: 36rem;
	margin: 0rem auto;
	color: var(--text-white);
}

.showreel__media{
	position: absolute;
	z-index: 1;
	inset: 0;
	will-change: transform;
}

.showreel__video{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.showreel__note{
	position: absolute;
	bottom: 2.4rem;
	left: 0;
	width: 100%;
	font-family: var(--third-family);
	font-size: 1.6rem;
	line-height: 1.3;
	text-align: center;
	color: var(--text-white);
}

@media (max-width: 1366px) {
	.showreel__title{
		max-width: 100rem;
		margin-bottom: 2rem;
	}

	.showreel__lead{
		max-width: 30rem;
	}

	.showreel__note{
		bottom: 2rem;
		font-size: 1.4rem;
	}
}

@media (max-width: 1024px) {
	.showreel__head{
		top: 5rem;
		padding: 0rem var(--wrapper-padding);
	}

	.showreel__title{
		max-width: 100%;
	}
}

@media (max-width: 768px) {
	.showreel__head{
		top: 4rem;
	}

	.showreel__title{
		max-width: 100%;
		margin-bottom: 1.6rem;
	}

	.showreel__lead{
		max-width: 32rem;
	}

	.showreel__note{
		bottom: 1.6rem;
		font-size: 1.2rem;
	}
}

@media (max-width: 480px) {
	.showreel__head{
		top: 3rem;
	}

	.showreel__title{
		margin-bottom: 1.2rem;
	}

	.showreel__lead{
		max-width: 26rem;
	}

	.showreel__note{
		bottom: 1.2rem;
		font-size: 1rem;
	}
}

/* ========== ways ========== */

.ways{
	padding: var(--section-margin) 0rem;
}

.ways__label{
	display: block;
	margin-bottom: 3.2rem;
	text-align: center;
	color: var(--text-white-75);
}

.ways__title{
	max-width: 100rem;
	margin: 0rem auto 6rem;
	text-align: center;
}

.ways__list{
	display: flex;
	justify-content: center;
	gap: 2rem;
}

@media (max-width: 1366px) {
	.ways__label{
		margin-bottom: 3rem;
	}

	.ways__title{
		max-width: 70rem;
		margin-bottom: 4rem;
	}
}

@media (max-width: 1024px) {
	.ways__list{
		gap: 2rem;
	}
}

@media (max-width: 480px) {
	.ways__label{
		margin-bottom: 1.6rem;
	}

	.ways__title{
		margin-bottom: 2.4rem;
	}

	.ways__list{
		flex-direction: column;
		gap: 2rem;
	}
}

/* ========== way ========== */

.way{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 76.3rem;
	min-height: 51.5rem;
	padding: 6rem;
}

.way::before,
.way::after{
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.way::before{
	background-image: linear-gradient(var(--bg-white-10), var(--bg-white-10));
	-webkit-mask: url(../img/ways/card-mask.svg) center / 100% 100% no-repeat;
	mask: url(../img/ways/card-mask.svg) center / 100% 100% no-repeat;

	-webkit-backdrop-filter: blur(0.4rem);
	backdrop-filter: blur(0.4rem);
}

.way::after{
	background-image: url(../img/ways/card-bg.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.way--right::before{
	-webkit-mask-image: url(../img/ways/card-mask2.svg);
	mask-image: url(../img/ways/card-mask2.svg);
}

.way--right::after{
	background-image: url(../img/ways/card-bg2.png);
}

.way__title,
.way__body,
.way__dot{
	position: relative;
	z-index: 1;
}

.way__title{
	margin-bottom: 2.4rem;
	color: var(--text-white);
}

.way__body{
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	justify-content: space-between;
	gap: 4rem;
	margin-left: 14rem;
}

.way__text{
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.032rem;
	text-transform: uppercase;
	color: var(--text-white-75);
}

.way__points{
	gap: 1.8rem;
}

.way__points .marker::before{
	top: 0.8rem;
	border-color: var(--theme-color);
}

.way__dot{
	position: absolute;
	bottom: 3.2rem;
	left: 3.2rem;
	width: 1.2rem;
	height: 1.2rem;
	background-color: var(--bg-orange);
	border-radius: 0.2rem;
}

.way--right .way__dot{
	right: 3.2rem;
	left: auto;
}

@media (max-width: 1366px) {
	.way__points .marker::before {
    top: 0.4rem;
    border-color: var(--theme-color);
}

	.way{
		width: 58.8rem;
		min-height: 46.5rem;
		padding: 6.5rem;
	}

	.way::before{
		-webkit-mask-image: url(../img/ways/card-mask-1366.svg);
		mask-image: url(../img/ways/card-mask-1366.svg);
	}

	.way::after{
		background-image: url(../img/ways/card-bg-1366.png);
	}

	.way--right::before{
		-webkit-mask-image: url(../img/ways/card-mask-1366-2.svg);
		mask-image: url(../img/ways/card-mask-1366-2.svg);
	}

	.way--right::after{
		background-image: url(../img/ways/card-bg-1366-2.png);
	}

	.way__body{
		margin-left: 7.3rem;
	}

	.way__text,
	.way__points .marker{
		font-size: 1.4rem;
	}

	.way__dot{
		bottom: 2.4rem;
		left: 2.4rem;
		width: 1.2rem;
		height: 1.2rem;
	}

	.way--right .way__dot{
		right: 2.4rem;
	}
}

@media (max-width: 1024px) {
	.way{
		flex: 1 1 0;
		width: auto;
		min-height: 35.7rem;
		padding: 3rem;
	}

	.way::before,
	.way--right::before{
		-webkit-mask-image: url(../img/ways/card-mask-mobile.svg);
		mask-image: url(../img/ways/card-mask-mobile.svg);
	}

	.way::after,
	.way--right::after{
		background-image: url(../img/ways/card-bg-mobile.png);
	}

	.way__body{
		gap: 2.4rem;
		margin-left: 0rem;
	}

	.way__dot{
		display: none;
	}
}

@media (max-width: 480px) {
	.way{
		flex: 0 0 auto;
		width: 100%;
		min-height: 35.7rem;
		padding: 2.4rem;
	}
}

/* ========== contacts ========== */

.contacts__title{
	max-width: 100rem;
	margin-bottom: 4rem;
}

.contacts__body{
	width: 107.6rem;
	margin-left: auto;
	margin-right: 15.8rem;
}

.contacts .checkbox{
	margin-top: -0.4rem;
}

.contacts__lead{
	max-width: 40rem;
	margin-bottom: 3.2rem;
	color: var(--text-white-75);
}

.contacts .form{
	width: 100%;
}

@media (max-width: 1366px) {
	.contacts__title{
		max-width: 70rem;
	}

	.contacts__body{
		width: 74rem;
		margin-right: 13.2rem;
	}
}

@media (max-width: 1024px) {
	.contacts__body{
		width: 100%;
	}
}

@media (max-width: 768px) {
	.contacts__lead {
    margin-bottom:2.4rem;
}

	.contacts__title{
		max-width: 55rem;
		margin-bottom: 2.4rem;
	}

	.contacts__body{
		width: 100%;
		margin-right: 0rem;
	}

	.contacts__lead{
		max-width: 35rem;
	}
}

@media (max-width: 480px) {
	.contacts__title {
        margin-bottom: 1.6rem;
    }

	.contacts__lead{
		max-width: none;
	}
}

/* ========== all ========== */

.all{
	--all-card: 29.3rem;
	position: relative;
	flex-shrink: 0;
	height: 100vh;
	height: calc(var(--app-vh, 1vh) * 100);
	padding: 0rem;
	overflow: hidden;
}

.all__inner{
	position: relative;
	z-index: 2;
	padding-top: 5rem;
	text-align: center;
}

.all__title{
	max-width: 90rem;
	margin: 0rem auto 3rem;
}

.all__list{
	--all-item: 8.8rem;
	position: relative;
	height: calc(var(--all-item) * 3);
	overflow: hidden;
	perspective: 60rem;
	-webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 22%, #000 78%, transparent 100%);
	mask-image: linear-gradient(180deg, transparent 0%, #000 22%, #000 78%, transparent 100%);
}

.all__track{
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	height: var(--all-item);
	margin-top: calc(var(--all-item) / -2);
	transform-style: preserve-3d;
}

.all__item{
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	white-space: nowrap;
	color: var(--text-white);
}

.all__cards{
	position: absolute;
	z-index: 1;
	inset: 0;
	pointer-events: none;
}

.all__card{
	--all-cut: calc(var(--all-card) * 0.0512);
	position: absolute;
	display: block;
	width: var(--all-card);
	height: var(--all-card);
	will-change: transform;
}

.all__card::before,
.all__card::after{
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.all__card::before{
	background-color: var(--bg-white-10);
	clip-path: polygon(
		var(--all-cut) 0,
		calc(100% - var(--all-cut)) 0,
		100% var(--all-cut),
		100% calc(100% - var(--all-cut)),
		calc(100% - var(--all-cut)) 100%,
		var(--all-cut) 100%,
		0 calc(100% - var(--all-cut)),
		0 var(--all-cut)
	);
}

.all__card::after{
	background-image: url(../img/all/border.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.all__card img{
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
	height: 100%;
	padding: 2rem;
	object-fit: contain;
}

.all__card--1{
	top: calc(50% - 31.4rem);
	left: 18.7rem;
}

.all__card--2{
	top: calc(50% - 48rem);
	right: 3rem;
}

.all__card--3{
	top: calc(50% + 12.5rem);
	left: 34.3rem;
}

.all__card--4{
	top: calc(50% - 9rem);
	right: 18.5rem;
}

@media (max-width: 1366px) {
	.all{
		--all-card: 25.4rem;
	}

	.all__inner{
		padding-top: 4rem;
	}

	.all__title{
		max-width: 60rem;
		margin-bottom: 3.6rem;
	}

	.all__list{
		--all-item: 6.1rem;
	}

	.all__card--1{
		top: calc(50% - 26.5rem);
		left: 8.3rem;
	}

	.all__card--2{
		top: calc(50% - 34rem);
		right: 8.7rem;
	}

	.all__card--3{
		top: calc(50% + 4rem);
		left: 19.3rem;
	}

	.all__card--4{
		top: calc(50% + 5rem);
		right: 19.7rem;
	}
}

@media (max-width: 1024px) {
	.all{
		--all-card: 20.6rem;
	}

	.all__inner{
		padding-top: 7rem;
	}

	.all__title{
		max-width: 56rem;
		margin-bottom: 3.2rem;
	}

	.all__list{
		--all-item: 4.6rem;
	}

	.all__item{
		font-size: 3.2rem;
	}

	.all__card--1{
		top: calc(50% - 18rem);
		left: 4rem;
	}

	.all__card--2{
		top: calc(50% - 31.2rem);
		right: 4.2rem;
	}

	.all__card--3{
		top: calc(50% + 13.2rem);
		left: 20rem;
	}

	.all__card--4{
		top: calc(50% + 7.5rem);
		right: 13.1rem;
	}
}

@media (max-width: 768px) {
	.all{
		--all-card: 15.5rem;
	}

	.all__card{
		--all-cut: calc(var(--all-card) * 0.0677);
	}

	.all__card::after{
		background-image: url(../img/all/border-mob.png);
	}

	.all__inner{
		padding-top: 6rem;
	}

	.all__title{
		max-width: 45rem;
		margin-bottom: 2.8rem;
	}

	.all__list{
		--all-item: 3.8rem;
	}

	.all__item{
		font-size: 2.4rem;
	}

	.all__card--1{
		top: 8rem;
		left: 3rem;
	}

	.all__card--2{
		top: 3rem;
		right: 3rem;
	}

	.all__card--3{
		top: 36rem;
		left: 15rem;
	}

	.all__card--4{
		top: 31rem;
		right: 9.7rem;
	}
}

@media (max-width: 480px) {
	.all{
		--all-card: 15.5rem;
		display: flex;
		flex-direction: column;
	}

	.all__inner{
		order: 1;
		padding-top: 2rem;
	}

	.all__title{
		max-width: 24rem;
		margin-bottom: 2.4rem;
	}

	.all__list{
		--all-item: 3rem;
	}

	.all__cards{
		order: 2;
		position: relative;
		inset: auto;
		display: flex;
		gap: 1.2rem;
		margin-top: 2.3rem;
		padding: 0rem 2rem;
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scrollbar-width: none;
		pointer-events: auto;
	}

	.all{
		height: auto;
	}

	.all__cards::-webkit-scrollbar{
		display: none;
	}

	.all__card{
		position: relative;
		flex-shrink: 0;
		top: auto;
		left: auto;
		right: auto;
	}

    .all__list {
        --all-item: 3.5rem;
    }
}

/* ========== fresh ========== */

.fresh__title{
	margin-bottom: 6rem;
}

.fresh__cta{
	margin: 6rem auto 0rem;
}

@media (max-width: 1366px) {
	.fresh__title{
		margin-bottom: 4rem;
	}

	.fresh__cta{
		margin-top: 4rem;
	}
}

@media (max-width: 768px) {
	.fresh__title{
		margin-bottom: 3.2rem;
	}

	.fresh__cta{
		margin-top: 2.4rem;
		margin-left: var(--wrapper-padding);
	}
}

@media (max-width: 480px) {
	.fresh__title{
		margin-bottom: 2.4rem;
	}

	.fresh__slider .swiper-wrapper{
		flex-direction: column;
		gap: 2rem;
	}

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

/* ========== article ========== */

.article{
	display: flex;
	flex-direction: column;
}

.article__media{
	position: relative;
	display: block;
	height: 46.5rem;
	color: var(--text-white);
}

.article__media img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: grayscale(1);
	-webkit-mask: url(../img/articles/card-mask.svg) center / 100% 100% no-repeat;
	mask: url(../img/articles/card-mask.svg) center / 100% 100% no-repeat;
	transition: filter 0.4s ease 0s;
}

.article__media:hover img{
	filter: grayscale(0);
}

.article__media::after{
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image: url(../img/articles/border.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.article__title{
	margin-top: 2.4rem;
	color: var(--text-white);
}

.article__title a{
	transition: color 0.25s ease 0s;
}

.article__title a:hover{
	color: var(--text-orange);
}

.article__info{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	margin-top: 1.6rem;
	padding-right: 9.7rem;
}

.article__tags{
	display: flex;
	flex-wrap: wrap;
	gap: 0.8rem 1.6rem;
}

.article__tag{
	padding-left: 1.6rem;
	color: var(--text-white-60);
}

.article__tag::before{
		color: var(--text-orange);
}

.article__date{
	flex-shrink: 0;
	font-family: var(--font-family);
	font-size: 1.4rem;
	line-height: 1.3;
	letter-spacing: -0.02em;
	color: var(--text-white-60);
}

@media (max-width: 1366px) {
	.article__media{
		height: 32.3rem;
	}

	.article__info{
		padding-right: 0rem;
	}

	.article__tag{
		font-size: 1.4rem;
	}
}

@media (max-width: 1024px) {
	.article__media{
		height: 36.2rem;
	}
}

@media (max-width: 768px) {
	.article__media{
		height: 32rem;
	}

	.article__media img{
		-webkit-mask-image: url(../img/articles/card-mask-768.svg);
		mask-image: url(../img/articles/card-mask-768.svg);
	}

	.article__media::after{
		background-image: url(../img/articles/border-768.png);
	}
}

@media (max-width: 480px) {
	.article__media{
		height: 29.8rem;
	}
}

/* ========== subscribe ========== */


.subscribe{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 100vh;
	min-height: calc(var(--app-vh, 1vh) * 100);
	padding: var(--section-margin) 0rem;
	overflow: hidden;
}

.subscribe__trail{
	position: absolute;
	z-index: 0;
	inset: 0;
	pointer-events: none;
}

.subscribe__shot{
	position: absolute;
	top: 0;
	left: 0;
	width: 32rem;
	height: auto;
	opacity: 0;
	will-change: transform, opacity;
}

.subscribe__inner{
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.subscribe__title{
	max-width: 80rem;
	margin-bottom: 4rem;
	text-align: center;
}

.subscribe__form{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 3.2rem;
}

.subscribe__form .field{
	flex-grow: 0;
	width: 35.3rem;
}

@media (max-width: 1366px) {
	.subscribe__shot{
		width: 30rem;
	}

	.subscribe__title{
		margin-bottom: 3.6rem;
	}

	.subscribe__form{
		gap: 2.4rem;
	}

	.subscribe__form .field{
		width: 30rem;
		height: 6.4rem;
	}

	.subscribe__form .field__control{
		padding: 0rem 2rem;
	}
}

@media (max-width: 1024px) {
	.subscribe__shot{
		display: none;
	}
	.subscribe{
		height: auto;
		min-height: 0rem;
	}

	.subscribe{
		margin-top: var(--section-margin);
	}

	.subscribe__shot--left,
	.subscribe__shot--right{
		display: block;
		top: 50%;
		left: 50%;
		width: 24rem;
		opacity: 1;
	}

	.subscribe__shot--left{
		translate: -48rem -22.5rem;
		rotate: 37deg;
	}

	.subscribe__shot--right{
		translate: 24.9rem -15.5rem;
	}

	.subscribe__title{
		max-width: 58rem;
		margin-bottom: 3.2rem;
	}

	.subscribe__form .field{
		width: 35rem;
		height: 4.6rem;
	}

	.subscribe__form .field__control{
		padding: 0rem 1.6rem;
		font-size: 1.4rem;
	}
}

@media (max-width: 768px) {
	.subscribe__shot--left,
	.subscribe__shot--right{
		width: 18rem;
	}

	.subscribe__shot--left{
		translate: -36rem -19.6rem;
	}

	.subscribe__shot--right{
		translate: 20.8rem -12.6rem;
	}
}

@media (max-width: 480px) {
	.subscribe__shot--left{
		width: 15.5rem;
		translate: -21.4rem -17.7rem;
		rotate: 15deg;
	}

	.subscribe__shot--right{
		width: 17rem;
		translate: 3.5rem -20.9rem;
	}

	.subscribe__title{
		max-width: 26rem;
		margin-bottom: 2rem;
	}

	.subscribe__form{
		width: 100%;
	}

	.subscribe__form .field{
		width: 100%;
		height: 5.3rem;
	}
}

/* ========== ask ========== */

.ask{
	padding: var(--section-margin) 0rem;
}

.ask__title{
	max-width: 80rem;
	margin-bottom: 6rem;
}

.ask__inner{
	--wrapper-size: 155rem;
}

.ask__list{
	display: flex;
	flex-direction: column;
	gap: 3rem;
	width: 107.6rem;
	max-width: 100%;
	margin-left: auto;
}



.ask .loc__head{
	align-items: baseline;
	min-height: 0rem;
	padding: 2.5rem 3.2rem;
}

.ask .loc__label{
	width: 31.4rem;
}

.ask .loc__head{
	align-items: flex-start;
}

.ask .loc__label{
	margin-top: 0.6rem;
}

.ask__answer{
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0rem 0.8rem;
	padding: 0rem 3.2rem 2.5rem 35.6rem;
}

.ask__marker,
.ask__text{
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.032rem;
	text-transform: uppercase;
}

.ask__marker{
	color: var(--text-orange);
}

.ask__text{
	max-width: 50rem;
	color: var(--text-white-75);
}

@media (max-width: 1366px) {
	.ask__title{
		max-width: 50rem;
		margin-bottom: 4rem;
	}

	.ask__inner{
		--wrapper-size: 108rem;
	}

	.ask__list{
		gap: 2.4rem;
		width: 75.4rem;
	}

	.ask .loc__head{
		padding: 2.4rem;
	}

	.ask .loc__label{
		width: 19rem;
		font-size: 1.4rem;
	}

	.ask__answer{
		padding: 0rem 2.4rem 1.6rem 22.4rem;
	}

	.ask__marker,
	.ask__text{
		font-size: 1.4rem;
	}

	.ask__text{
		max-width: 40rem;
	}
}

@media (max-width: 768px) {
	.ask__inner{
		--wrapper-size: 100%;
	}

	.ask__list{
		gap: 1.6rem;
		width: 100%;
	}

	.ask .loc__head{
		padding: 1.6rem;
	}

	.ask__answer{
		padding: 0rem 1.6rem 1.6rem 21.6rem;
	}

	    .ask__title {
        margin-bottom: 2.4rem;
    }
}

@media (max-width: 480px) {
	.ask__from{
		display: none;
	}

	.ask__list{
		gap: 1.6rem;
	}

	.ask .loc__label{
		width: auto;
	}

	.ask__answer{
		padding: 0rem 1.2rem 1.2rem 5.3rem;
	}

	.ask__text{
		max-width: 100%;
	}
}

/* ========== footer ========== */

.footer{
	padding: var(--section-margin) 0rem 3rem;
}

.footer__top{
	display: grid;
	grid-template-columns: 60rem 1fr;
	gap: 4rem;
	margin-bottom: 11.5rem;
}

.footer__menu{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	column-gap: 4rem;
}

.footer__logo{
	display: block;
	width: 23.4rem;
}

.footer__logo img{
	display: block;
	width: 100%;
	height: auto;
}

.footer__label{
	display: block;
	margin-bottom: 3.2rem;
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.028rem;
	text-transform: uppercase;
	color: var(--text-white-60);
}

.footer__label{
	grid-column: span 2;
}

.footer__list{
	display: flex;
	flex-direction: column;
	gap: 1.6rem;
}

.footer__link{
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.032rem;
	text-transform: uppercase;
	color: var(--text-white);
	transition: color 0.25s ease 0s;
}

.footer__bottom .footer__link{
	color: var(--text-white-60);
}

.footer__link:hover{
	color: var(--text-orange);
}

.footer__bottom{
	display: flex;
	align-items: center;
	gap: 27rem;
	margin-top: 3rem;
}
.footer__bottom .footer__link:last-child{
	margin-left: auto;
}

.footer__copy{
	font-family: var(--font-family);
	font-size: 1.4rem;
	line-height: 1.3;
	letter-spacing: -0.032rem;
	text-transform: uppercase;
	color: var(--text-white-60);
}

@media (max-width: 1366px) {
	.footer__top{
		grid-template-columns: 41.4rem 1fr;
		margin-bottom: 5.6rem;
	}

	.footer__list{
		gap: 1.2rem;
	}

	.footer__bottom{
		gap: 12rem;
	}

	.footer__copy,
	.footer__bottom .footer__link{
		font-size: 1.2rem;
		line-height: 1;
		letter-spacing: -0.02em;
	}
}

@media (max-width: 768px) {
	.footer__top{
		grid-template-columns: 1fr;
		gap: 6.4rem;
		margin-bottom: 6rem;
	}

	.footer__menu{
		column-gap: 2.4rem;
	}

	.footer__label{
		margin-bottom: 3.2rem;
	}

	.footer__bottom{
		gap: 10rem;
	}
}

/* ========== game ========== */

.game{
	position: relative;
	-webkit-user-select: none;
	user-select: none;
}

.game__hero{
	position: absolute;
	z-index: 2;
	bottom: 0;
	width: 49.6rem;
	height: auto;
	pointer-events: none;
}

.game__hero--left{
	left: 6.4rem;
}

.game__hero--right{
	right: 10.1rem;
	width: 38.4rem;
}

.game__field{
	--game-cut: 5.749rem;
	overflow: hidden;
	--game-cols: 17;
	--game-col-head: 6.855;
	--game-col-step: 5.645;
	--game-rows: 8.17, 25.48, 43.74, 62, 80.26;
	position: relative;
	z-index: 1;
	min-height: 57.5rem;
	background-color: var(--bg-white-10);
	background-image: url(../img/game/border.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	clip-path: polygon(
		0 var(--game-cut),
		calc(var(--game-cut)*0.008) calc(var(--game-cut)*0.96),
		calc(var(--game-cut)*0.031) calc(var(--game-cut)*0.926),
		calc(var(--game-cut)*0.926) calc(var(--game-cut)*0.031),
		calc(var(--game-cut)*0.96) calc(var(--game-cut)*0.008),
		var(--game-cut) 0,
		calc(100% - var(--game-cut)) 0,
		calc(100% - var(--game-cut)*0.96) calc(var(--game-cut)*0.008),
		calc(100% - var(--game-cut)*0.926) calc(var(--game-cut)*0.031),
		calc(100% - var(--game-cut)*0.031) calc(var(--game-cut)*0.926),
		calc(100% - var(--game-cut)*0.008) calc(var(--game-cut)*0.96),
		100% var(--game-cut),
		100% calc(100% - var(--game-cut)),
		calc(100% - var(--game-cut)*0.008) calc(100% - var(--game-cut)*0.96),
		calc(100% - var(--game-cut)*0.031) calc(100% - var(--game-cut)*0.926),
		calc(100% - var(--game-cut)*0.926) calc(100% - var(--game-cut)*0.031),
		calc(100% - var(--game-cut)*0.96) calc(100% - var(--game-cut)*0.008),
		calc(100% - var(--game-cut)) 100%,
		var(--game-cut) 100%,
		calc(var(--game-cut)*0.96) calc(100% - var(--game-cut)*0.008),
		calc(var(--game-cut)*0.926) calc(100% - var(--game-cut)*0.031),
		calc(var(--game-cut)*0.031) calc(100% - var(--game-cut)*0.926),
		calc(var(--game-cut)*0.008) calc(100% - var(--game-cut)*0.96),
		0 calc(100% - var(--game-cut))
	);
}

.is-play .game__field{
	background-color: black;
}

.is-over .game__field {
	background-color: black;
}

.game__field::before{
	content: "";
	position: absolute;
	inset: 0;
	background-image: url(../img/game/bg.webp);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	opacity: 0;
	transition: opacity 0.5s ease 0s;
}

.game.is-play .game__field::before,
.game.is-over .game__field::before{
	opacity: 1;
}

.game__targets{
	position: absolute;
	inset: 0;
	overflow: hidden;
	transform: translateZ(0);
}

.game__target{
	position: absolute;
	height: auto;
	translate: -50% -50%;
	opacity: 0;
	cursor: pointer;
	-webkit-user-select: none;
	user-select: none;
	-webkit-user-drag: none;
	transition: opacity 0.15s ease 0s;
}

.game__target.is-up{
	opacity: 1;
}

.game__intro,
.game__over{
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 2rem var(--wrapper-padding);
	text-align: center;
	will-change: opacity;
	transition: opacity 0.35s ease 0s, visibility 0.35s ease 0s;
}

.game__hero{
	transition: opacity 0.35s ease 0s, visibility 0.35s ease 0s;
}

.game__title{
	margin-bottom: 6rem;
}

.game__aim{
	width: 5.4rem;
	height: 5.4rem;
	margin-bottom: 3.2rem;
	background-color: var(--bg-orange);
	-webkit-mask: url(../img/cursor.svg) center / contain no-repeat;
	mask: url(../img/cursor.svg) center / contain no-repeat;
}

.game__lead{
	max-width: 40rem;
	margin-bottom: 3.2rem;
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.032rem;
	text-transform: uppercase;
	color: var(--text-white-75);
}

.game__result{
	margin-bottom: 3.2rem;
}

.game__vibe{
	margin-bottom: 3.6rem;
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.032rem;
	text-transform: uppercase;
	color: var(--text-white);
}

.game__vibe b{
	font-size: 2.4rem;
	font-weight: 400;
	color: var(--text-orange);
}

.game__hud{
	position: absolute;
	z-index: 2;
	right: 5.6rem;
	bottom: 2.4rem;
	left: 5.6rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2.4rem;
	display: none;
	transition: opacity 0.25s ease 0s;
}



.game__stat,
.game__skip{
	min-width: 12.4rem;
	font-family: var(--font-family);
	font-size: 1.4rem;
	line-height: 1.3;
	justify-content: center;
	display: flex;
	letter-spacing: -0.032rem;
	padding: 0.4rem 1rem;
	text-transform: uppercase;
	color: var(--text-white-60);
	background-color: transparent;

	border-radius: 0.6rem;
background: var(--bg-black-30, rgba(0, 0, 0, 0.30));
-webkit-backdrop-filter: blur(0.4rem);
backdrop-filter: blur(0.4rem);
}

.game__skip{
	font-size: 1.6rem;
	color: #FFF;
}

.game__stat b{
	font-weight: 400;
	color: var(--text-orange);
}

[data-game-score]{
	min-width: 2.5rem;
	text-align: center;
}

.game__skip{
	cursor: pointer;
	transition: color 0.25s ease 0s;
}

.game__skip:hover{
	color: var(--text-orange);
}

.game.is-play .game__hud,
.game.is-over .game__hud{
	display: flex;
}

.game.is-play .game__intro,
.game.is-over .game__intro,
.game.is-play .game__over{
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.game__over{
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.game.is-over .game__over{
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.game.is-play .game__hero,
.game.is-over .game__hero{
	opacity: 0;
	visibility: hidden;
}

.game.is-over .game__targets{
	filter: blur(0.6rem);
	pointer-events: none;
}

.game.is-play .game__field{
	cursor: none;
}

.game .modal__close,
.game__rotate{
	display: none;
}

.game .modal__close{
	z-index: 4;
	top: 2.4rem;
	right: 2.4rem;
}

.game__rotate{
	position: absolute;
	z-index: 3;
	inset: 0;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1.6rem;
	padding: 0rem var(--wrapper-padding);
	text-align: center;
}

.game__rotate-icon{
	width: 3rem;
	height: auto;
}

.game__rotate-text{
	font-family: var(--second-family);
	font-size: 1.8rem;
	max-width: 27.2rem;
	line-height: 1.2;
	text-transform: uppercase;
	color: var(--text-white);
}

body.is-aiming .cursor__icon{
	background-image: none;
	background-color: var(--bg-orange);
	-webkit-mask: url(../img/cursor.svg) center / contain no-repeat;
	mask: url(../img/cursor.svg) center / contain no-repeat;
}

@media (max-width: 1366px) {
	.game__field{
		--game-cols: 15;
		--game-col-head: 7.887;
		--game-col-step: 6.336;
		min-height: 45.3rem;
		background-image: url(../img/game/border-1366.png);
	}

	.game__field::before{
		background-image: url(../img/game/bg-1366.png);
	}

	.game__aim{
		width: 4.4rem;
		height: 4.4rem;
		margin-bottom: 2.4rem;
		flex-shrink: 0;
	}

	.game__lead{
		font-size: 1.4rem;
		line-height: 1.3;
		letter-spacing: -0.02em;
	}

	.game__result{
		margin-bottom: 2.4rem;
	}

	.game__vibe{
		margin-bottom: 2.4rem;
		font-size: 1.2rem;
		line-height: 1;
		letter-spacing: -0.02em;
	}

	.game__vibe b{
		font-size: 2rem;
		line-height: 1.2;
		letter-spacing: -0.04em;
	}
}

@media (max-width: 768px), (max-height: 520px) and (orientation: landscape) {
	.game__hero{
		display: none;
	}

	.game__field{
		min-height: 45.3rem;
		background-image: url(../img/game/border-768.png);
	}

	.game.is-play::before,
	.game.is-over::before{
		content: "";
		position: fixed;
		z-index: 199;
		inset: 0;
		background-color: var(--bg-black);
	}

	.game.is-play .game__field,
	.game.is-over .game__field{
		--game-cut: 2.1rem;
		--game-cols: 5;
		--game-col-head: 8.13;
		--game-col-step: 18.27;
		--game-rows: 15.36, 40.75, 66.14;
		--game-live: 6;
		position: fixed;
		z-index: 200;
		inset: 2rem;
		height: auto;
		background-color: var(--bg-black);
		background-image: none;
	}

	.game.is-play .game__field::before,
	.game.is-over .game__field::before{
		background-image: url(../img/game/bg-768.webp);
	}

	.game.is-play .modal__close,
	.game.is-over .modal__close{
		display: flex;
	}

		    .game__title {
        margin-bottom: 2.4rem !important;
    }

	    .game__aim {
        margin-bottom: 1.2rem !important;
    }

	.game__lead {
    margin-bottom: 2.4rem;
	}
}

@media (max-width: 768px) and (orientation: portrait) {
	.game.is-play .game__rotate{
		display: flex;
	}

	.game.is-play .game__targets{
		filter: blur(0.6rem);
		pointer-events: none;
	}

	.game.is-play .game__hud{
		display: none;
	}
	
}

@media (max-width: 480px) {
	.footer__top{
		gap: 4.8rem;
		margin-bottom: 4.8rem;
	}

	.footer__menu{
		grid-template-columns: repeat(2, 1fr);
		row-gap: 1.6rem;
	}

	.footer__label{
		margin-bottom: 0rem;
	}

	.footer__label:nth-of-type(2){
		order: 1;
		margin-top: 4.4rem;
	}

	.footer__list:nth-of-type(3),
	.footer__list:nth-of-type(4){
		order: 2;
	}

	.footer__bottom{
		display: grid;
		grid-template-columns: 1fr auto;
		gap: 0.8rem 2rem;
	}

	.footer__copy{
		grid-row: span 2;
	}

	.footer__bottom .footer__link{
		text-align: right;
	}

	.footer__bottom .footer__link:last-child{
		margin-left: 0rem;
	}

	.game__field{
		--game-cut: 2.1rem;
		min-height: 33.8rem;
		background-image: url(../img/game/border-480.png);
	}

	.game__hud{
		right: 1.6rem;
		bottom: 1.6rem;
		left: 1.6rem;
		gap: 0.8rem;
	}

}

section.join{
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	padding-top: 13.2rem;
	padding-bottom: 8.6rem;
}

.join__inner{
	flex-grow: 1;
	text-align: center;
}

.join__title{
	max-width: 130rem;
	margin: 0rem auto;
}

.join__text{
	max-width: 49rem;
	margin: 3.2rem auto 11rem;
	color: var(--text-white-75);
}

@media (max-width: 1366px) {
	section.join{
		padding-top: 16.1rem;
	}

	.join__title{
		max-width: 90rem;
	}

	.join__text{
		max-width: 40rem;
		margin-top: 2.4rem;
	}
}

@media (max-width: 768px) {
	section.join{
		min-height: auto;
		padding-top: 12.7rem;
		padding-bottom: 6rem;
	}

	.join__inner{
		flex-grow: 0;
	}

	.join__text{
		margin-bottom: 8rem;
	}
}

@media (max-width: 480px) {
	section.join{
		padding-top: 8.8rem;
		padding-bottom: 4rem;
	}

	.join__text{
		max-width: 28rem;
		margin-top: 1.6rem;
	}
}

.together__grid{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem;
}

.together__side{
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	align-content: start;
	gap: 2rem;
}

.together__title{
	grid-column: 1 / -1;
}

.together__block{
	display: grid;
	grid-template-columns: subgrid;
	gap: 2.4rem 2rem;
}

.together__block--solo{
	grid-column: 4 / -1;
	margin-top: 4.6rem;
}

.together__block--partners{
	grid-column: 3 / -1;
	align-items: end;
}

.together__block--countries{
	grid-column: 3 / -1;
}

.together__block--team{
	grid-column: 1 / span 4;
}

.together__block--titles{
	grid-column: 1 / span 4;
	margin-top: 21rem;
}

.together__block--mission{
	grid-column: 1 / span 5;
}

.together__shot{
	position: relative;
	overflow: hidden;
	grid-column: 1 / -1;
	aspect-ratio: var(--shot, 3 / 2);
}

.together__shot img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	-webkit-mask: var(--mask, none) center / 100% 100% no-repeat;
	mask: var(--mask, none) center / 100% 100% no-repeat;
}

.together__shot::after{
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image: var(--frame, none);
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.together__shot--a{
	--shot: 607 / 430;
	--mask: url(../img/together/mask-1.svg);
	--frame: url(../img/together/border-1.png);
}

.together__shot--b{
	--shot: 450 / 299;
	--mask: url(../img/together/mask-2.svg);
	--frame: url(../img/together/border-2.png);
}

.together__shot--c{
	--shot: 1 / 1;
	--mask: url(../img/together/mask-3.svg);
	--frame: url(../img/together/border-3.png);
	grid-column: 3 / span 2;
}

.together__shot--d{
	--shot: 1 / 1;
	--mask: url(../img/together/mask-3.svg);
	--frame: url(../img/together/border-3.png);
	grid-column: 1 / span 2;
}

.together__shot--e{
	--shot: 607 / 430;
	--mask: url(../img/together/mask-4.svg);
	--frame: url(../img/together/border-4.png);
}

.together__shot--f{
	--shot: 763 / 445;
	--mask: url(../img/together/mask-5.svg);
	--frame: url(../img/together/border-5.png);
}

.together__stat{
	grid-column: 1 / -1;
}

.together__block--partners .together__stat{
	grid-column: 1 / span 2;
}

.together__block--countries .together__stat{
	grid-column: 3 / span 2;
	margin-top: 1.9rem;
	text-align: center;
}

.together__block--team .together__stat{
	grid-column: 1 / span 3;
}

.together__block--titles .together__stat{
	grid-column: 3 / span 2;
}

.together__value{
	display: block;
	color: var(--text-orange);
}

.together__label{
	display: block;
	margin-top: 1.2rem;
	color: var(--text-white);
}

.together__text{
	grid-column: 1 / span 4;
	max-width: 52rem;
	margin-top: 2rem;
	color: var(--text-white-75);
}

.together__cta{
	grid-column: 1 / span 2;
	margin-top: 0.4rem;
}

@media (max-width: 1366px) {
	.together__side{
		grid-template-columns: repeat(7, 1fr);
	}

	.together__block--solo{
		grid-column: 4 / -1;
	}

	.together__block--partners{
		grid-column: 3 / -1;
	}

	.together__block--countries{
		grid-column: 3 / -1;
	}

	.together__block--team{
		grid-column: 1 / span 6;
	}

	.together__block--titles{
		grid-column: 1 / -1;
		align-items: end;
		margin-top: 11.9rem;
	}

	.together__block--mission{
		grid-column: 1 / span 6;
	}

	.together__shot--c{
		grid-column: 3 / span 3;
	}

	.together__shot--d{
		grid-column: 1 / span 3;
	}

	.together__block--partners .together__stat{
		grid-column: 1 / span 2;
	}

	.together__block--countries .together__stat{
		grid-column: 4 / span 2;
	}

	.together__block--team .together__stat{
		grid-column: 1 / span 4;
	}

	.together__block--titles .together__stat{
		grid-column: 4 / -1;
	}

	.together__text{
		grid-column: 1 / span 5;
	}

	.together__cta{
		grid-column: 1 / span 3;
	}
}
.together__mob{
	display: none;
}

@media (max-width: 768px) {
	.together__grid{
		display: none;
	}

	.together__mob{
		display: flex;
		flex-direction: column;
	}

	.together__text--mob{
		max-width: 47rem;
		margin-top: 2.4rem;
	}

	.together__stats{
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		gap: 2rem;
		margin-top: 2.4rem;
	}

	.together__stats .together__stat{
		grid-column: auto;
	}

	.together__slider{
		margin-top: 3.2rem;
	}

	.together__shot--slide{
		--shot: 450 / 299;
		--mask: url(../img/together/mask-2.svg);
		--frame: url(../img/together/border-2.png);
	}

	.together__cta--mob{
		margin-top: 2.4rem;
	}

	.together__label {
		margin-top: 1.2rem;
		color: var(--text-white-75);
	}
}

@media (max-width: 480px) {
	.together__stats{
		grid-template-columns: repeat(2, 1fr);
		gap: 2.4rem;
	}

	.together__stat--third{
		order: 4;
	}

		.together__label {
		margin-top: 0.4rem;
	}

	.together__stat--fourth{
		order: 3;
	}

	.together__slider{
		order: 1;
		margin-inline: calc(var(--wrapper-padding) * -1);
	}

	.together__slider .swiper{
		padding-inline: var(--wrapper-padding);
	}

	.together__stats{
		order: 2;
		margin-top: 2.4rem;
	}

	.together__cta--mob{
		order: 3;
	}
}

.perks__grid{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 2rem;
}

.perks__title{
	grid-column: 1 / span 2;
	max-width: 105rem;
	margin-bottom: 6rem;
}

.perks__list{
	display: grid;
	grid-column: 2 / -1;
	grid-template-columns: subgrid;
	gap: 4rem 2rem;
}

.perks__item--right{
	grid-column: 2;
}

.perks__accent{
	color: var(--text-orange);
}

.perks__text{
	position: relative;
	max-width: 41.5rem;
	margin-top: 2.4rem;
	padding-left: 2.2rem;
	color: var(--text-white-75);
}

.perks__text::before{
	content: "";
	position: absolute;
	top: 0.5rem;
	left: 0rem;
	border-radius: 0.2rem;
	width: 1.2rem;
	height: 1.2rem;
	background-color: var(--bg-orange);
}

.perks__lead{
	grid-column: 1;
	max-width: 42.5rem;
	color: var(--text-white-75);
}

.perks--dev .perks__title{
	max-width: 110rem;
	margin-bottom: 3.2rem;
}

.perks--dev .perks__list{
	margin-top: 8.3rem;
}

.perks--dev .perks__text{
	max-width: 48.5rem;
	padding-left: 0rem;
	color: var(--text-white-60);
}

.perks--dev .perks__text::before{
	display: none;
}

@media (max-width: 1366px) {
	.perks__title{
		margin-bottom: 4rem;
	}

	.perks--dev .perks__title {
    margin-bottom: 2.8rem;
}

	.perks__list{
		gap: 4rem 7.5rem;
	}

	.perks__text{
		margin-top: 1.6rem;
	}

	.perks__text::before{
		top: 0.5rem;
		width: 0.8rem;
		height: 0.8rem;
	}
}

@media (max-width: 1024px) {
	.perks__grid{
		grid-template-columns: repeat(2, 1fr);
	}

		.perks--dev .perks__title {
    margin-bottom: 2.4rem;
}

	.perks__title{
		max-width: none;
		margin-bottom: 2.4rem;
	}

	.perks__list{
		grid-column: 1 / -1;
		gap: 2.4rem 2rem;
	}

	.perks__caption br{
		display: none;
	}

	.perks__text{
		max-width: 32.2rem;
		padding-left: 2rem;
	}
}

@media (max-width: 480px) {
	.perks__list{
		grid-template-columns: 1fr;
		row-gap: 1.6rem;
	}

			.perks--dev .perks__title {
    margin-bottom: 1.6rem;
}

	.perks__item--right{
		grid-column: auto;
	}

	.perks__text{
		max-width: none;
		padding-left: 1.6rem;
	}
}

@media (max-width: 1024px) {
	.perks__lead{
		grid-column: 1 / -1;
	}

	.perks--dev .perks__list{
		margin-top: 4rem;
	}
}

@media (max-width: 480px) {
	.perks--dev .perks__list{
		margin-top: 2.4rem;
		row-gap: 2.4rem;
	}
}

.steps{
	--steps-aim: 5.4rem;
	--steps-step: 9.8rem;
	--steps-line: 6rem;
	--steps-dot: calc(var(--steps-step) - var(--steps-line));
	--steps-rail: calc(var(--steps-step) * 4 + var(--steps-dot));
	--steps-cut: polygon(1.535rem 0rem, calc(100% - 1.535rem) 0rem, 100% 1.477rem, 100% calc(100% - 1.477rem), calc(100% - 1.535rem) 100%, 1.535rem 100%, 0rem calc(100% - 1.477rem), 0rem 1.477rem);
}

.steps__title{
	max-width: 13.6em;
	margin: 0rem auto;
	text-align: center;
}

.steps__body{
	position: relative;
	margin-top: 6rem;
}

.steps__list{
	display: grid;
	grid-template-columns: repeat(2, 45rem);
	grid-auto-rows: 1fr;
	justify-content: center;
	gap: 4rem 33.4rem;
	list-style: none;
}

.steps__card{
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 34rem;
	padding:3.2rem;
}

.steps__card::before{
	content: "";
	position: absolute;
	z-index: -1;
	inset: 0;
	clip-path: var(--steps-cut);
	background-color: var(--bg-white-10);
	-webkit-backdrop-filter: blur(0.42rem);
	backdrop-filter: blur(0.42rem);
}

.steps__card::after{
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	border: 10rem solid transparent;
	border-image-source: url(../img/steps/border.png);
	border-image-slice: 160;
	border-image-repeat: stretch;
}

.steps__item{
	position: relative;
	z-index: 0;
}

.steps__lvl{
	color: var(--text-orange);
}

.steps__name{
	margin-top: auto;
}

.steps__text{
	position: relative;
	margin-top: 2.4rem;
	padding-left: 2.2rem;
	color: var(--text-white-75);
}

.steps__text::before{
	content: "";
	position: absolute;
	top: 0.5rem;
	left: 0rem;
	border-radius: 0.2rem;
	width: 1.2rem;
	height: 1.2rem;
	background-color: var(--bg-orange);
}

.steps__rail{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	translate: -50% 0;
	width: var(--steps-aim);
	pointer-events: none;
}

.steps__track{
	position: sticky;
	top: calc(50vh - var(--steps-rail) / 2);
	display: flex;
	flex-direction: column;
	align-items: center;
}

.steps__dot{
	display: flex;
	align-items: center;
	justify-content: center;
	height: var(--steps-dot);
	color: var(--text-white-60);
	transition: color 0.45s ease 0s;
}

.steps__dot.is-active{
	color: var(--text-white);
}

.steps__link{
	position: relative;
	width: 0.1rem;
	height: var(--steps-line);
	background-color: var(--stroke-white-20);
}

.steps__link::after{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: calc(var(--fill, 0) * 100%);
	background-color: var(--bg-orange);
}

.steps__aim{
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	width: var(--steps-aim);
	height: var(--steps-aim);
	margin-top: calc((var(--steps-dot) - var(--steps-aim)) / 2);
	margin-inline: auto;
	color: var(--text-orange);
	translate: 0 var(--aim, 0rem);
	transition: translate 0.45s ease 0s;
}

.steps__slider .swiper{
	overflow: visible;
}

.steps__bar{
	display: none;
	align-items: center;
	gap: 1.3rem;
	margin-top: 2.4rem;
}

.steps__edge{
	color: var(--text-white);
}

.steps__track-line{
	position: relative;
	flex-grow: 1;
	height: 0.1rem;
	background-color: var(--stroke-white-20);
}

.steps__fill{
	position: absolute;
	top: 0;
	left: calc(var(--pos, 0) * 100%);
	width: calc(var(--size, 1) * 100%);
	height: 100%;
	background-color: var(--bg-orange);
	transition-property: left;
	transition-timing-function: cubic-bezier(0.25, 1, 0.5, 1);
	transition-duration: 0ms;
}

.steps__edge:last-child{
	color: var(--text-white-60);
}

@media (max-width: 1366px) {
	.steps__body{
		margin-top: 4rem;
	}

	.steps__list{
		grid-template-columns: repeat(2, 36.5rem);
		gap: 4rem 24rem;
	}

	.steps__card{
		min-height: 27.6rem;
		padding: 2.4rem;
	}
}

@media (max-width: 768px) {
	.steps__title{
		max-width: 9.4em;
		margin: 0rem;
		text-align: left;
	}

	.steps__body{
		margin-top: 3rem;
	}

	.steps__rail{
		display: none;
	}

	.steps__slider{
		margin-inline: calc(var(--wrapper-padding) * -1);
	}

	.steps__slider .swiper{
		overflow: hidden;
		padding-inline: var(--wrapper-padding);
	}

	.steps__list{
		display: flex;
		justify-content: flex-start;
		gap: 0rem;
	}

	.steps__card{
		min-height: 23.6rem;
		padding: 1.6rem;
	}

	.steps__text{
		margin-top: 1.6rem;
	}

	.steps__bar{
		display: flex;
	}
}

.jobs{
	--jobs-cut: polygon(1.885rem 0rem, calc(100% - 1.885rem) 0rem, 100% 1.778rem, 100% calc(100% - 1.778rem), calc(100% - 1.885rem) 100%, 1.885rem 100%, 0rem calc(100% - 1.778rem), 0rem 1.778rem);
}

.jobs__grid{
	display: flex;
	flex-direction: column;
}

.jobs__title{
	margin-bottom: 6rem;
}

.jobs__list{
	display: flex;
	flex-direction: column;
	max-width: 107.2rem;
	margin-left: calc(33.333% + 0.667rem);
	gap: 3rem;
	list-style: none;
}

.jobs__card{
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 35.4rem;
	padding: 3.2rem;
}

.jobs__card::before{
	content: "";
	position: absolute;
	z-index: -1;
	inset: 0;
	clip-path: var(--jobs-cut);
	background-color: var(--bg-white-10);
	-webkit-backdrop-filter: blur(0.42rem);
	backdrop-filter: blur(0.42rem);
}

.jobs__card::after{
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	clip-path: var(--jobs-cut);
	border: 8rem solid transparent;
	border-image-source: url(../img/steps/border2.png);
	border-image-slice: 160;
	border-image-repeat: stretch;
}

.jobs__item{
	position: relative;
	z-index: 0;
}

.jobs__info{
	display: flex;
	gap: 1rem;
	margin-top: 2.4rem;
	padding-left: 12.4rem;
}

.jobs__label{
	flex-shrink: 0;
	color: var(--text-orange);
}

.jobs__text{
	max-width: 50.6rem;
	color: var(--text-white-75);
}

.jobs__foot{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	margin-top: auto;
	padding-top: 3rem;
}

.jobs__mark{
	border-radius: 0.2rem;
	width: 1.2rem;
	height: 1.2rem;
	background-color: var(--bg-orange);
}

.jobs__more{
	display: flex;
	align-items: center;
	gap: 0.8rem;
	color: var(--text-white);
	transition: color 0.25s ease 0s;
}

.jobs__more:hover{
	color: var(--text-orange);
}

.icon--chevrons{
	width: 1.4rem;
	height: 1rem;
}

@media (max-width: 1366px) {
	.jobs__title{
		margin-bottom: 4rem;
	}

	.jobs__list{
		max-width: 74.4rem;
	}

	.jobs__card{
		min-height: 33.1rem;
		padding: 2.4rem;
	}

	.jobs__info{
		padding-left: 9.3rem;
	}

	.jobs__text{
		max-width: 36.8rem;
	}

	.jobs__foot{
		padding-top: 1rem;
	}

	.jobs__mark{
		width: 1rem;
		height: 1rem;
	}

	.jobs__more span{
		max-width: 5rem;
	}
}

@media (max-width: 768px) {
	.jobs__title{
		margin-bottom: 2.4rem;
	}

	.jobs__list{
		max-width: none;
		margin-left: 0rem;
		gap: 1.6rem;
	}

	.jobs__card{
		min-height: 24rem;
		padding: 1.6rem;
	}

	.jobs__info{
		padding-left: 10.7rem;
	}

	.jobs__text{
		max-width: 51rem;
	}

	.jobs__foot{
		padding-top: 1.6rem;
	}

	.jobs__more span{
		max-width: none;
	}
}

@media (max-width: 480px) {
	.jobs__card{
		min-height: 0rem;
	}

	.jobs__info{
		margin-top: 1.6rem;
	}

	.jobs__card::after{
		border-width: 9rem;
		border-image-source: url(../img/steps/border-mob.png);
		border-image-slice: 180;
	}

	.jobs__info{
		padding-left: 0rem;
	}

	.jobs__text{
		max-width: none;
	}
}

section.blog{
	--blog-chip-cut: 2.2rem;
	padding-top: 28rem;
}

.blog__title{
	text-align: center;
}

.blog__filter{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 2.4rem;
	margin-top: 3.2rem;
}

.blog__chip{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 0rem 0.6rem 0rem 0.6rem;
	height: 4.8rem;
	padding: 0rem 3rem;
	clip-path: polygon(var(--blog-chip-cut) 0rem, 100% 0rem, 100% calc(100% - var(--blog-chip-cut)), calc(100% - var(--blog-chip-cut)) 100%, 0rem 100%, 0rem var(--blog-chip-cut));
	background-color: var(--stroke-white-20);
	color: var(--text-white);
	cursor: pointer;
	transition: color 0.25s ease 0s;
}

.blog__chip::before{
	content: "";
	position: absolute;
	inset: 0.1rem;
	border-radius: 0rem 0.5rem 0rem 0.5rem;
	clip-path: polygon(var(--blog-chip-cut) 0rem, 100% 0rem, 100% calc(100% - var(--blog-chip-cut)), calc(100% - var(--blog-chip-cut)) 100%, 0rem 100%, 0rem var(--blog-chip-cut));
	background-color: var(--bg-black);
	transition: background-color 0.25s ease 0s;
}

.blog__chip span{
	position: relative;
	font-family: var(--font-family);
	font-size: 1.4rem;
	line-height: 1.3;
	letter-spacing: -0.02em;
	text-transform: uppercase;
}

.blog__chip:hover{
	color: var(--text-orange);
}

.blog__chip.is-active{
	background-color: var(--bg-white);
	color: var(--text-black);
}

.blog__chip.is-active::before{
	background-color: var(--bg-white);
}

.blog__grid{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4rem 2rem;
	margin-top: 6rem;
}

.blog__grid .article{
	transition: opacity 0.45s ease 0s, translate 0.45s ease 0s;
}

.blog__grid .article.is-hiding{
	opacity: 0;
	translate: 0 1.6rem;
	pointer-events: none;
}

.blog__grid .article.is-hidden{
	display: none;
}

.blog__more{
	margin: 6rem auto 0rem;
	transition: opacity 0.35s ease 0s;
}

.blog__more.is-hiding{
	opacity: 0;
	pointer-events: none;
}

.blog__more.is-hidden{
	display: none;
}

@media (max-width: 1366px) {
	section.blog{
		--blog-chip-cut: 2rem;
		padding-top: 15rem;
	}

	.blog__filter{
		gap: 1.7rem;
		margin-top: 2.4rem;
	}

	.blog__chip{
		padding: 0rem 1.6rem;
	}

	.blog__grid{
		margin-top: 4rem;
	}

	.blog__more{
		margin: 4rem auto 0rem;
	}
}

@media (max-width: 1024px) {
	.blog__grid .article__media{
		height: 23.6rem;
	}
}

@media (max-width: 768px) {
	section.blog{
		padding-top: 12rem;
	}

		    section.blog {
        --blog-chip-cut: 1.6rem;
    }


	    .blog__chip {
		height: 4.2rem;
    }

	.blog__filter{
		gap: 1.2rem;
		margin-top: 2.4rem;
	}

	.blog__grid{
		grid-template-columns: repeat(2, 1fr);
		gap: 3.2rem 2rem;
		margin-top: 2.4rem;
	}
}

@media (max-width: 480px) {
	section.blog{
		padding-top: 10rem;
	}


	.blog__filter{
		flex-wrap: nowrap;
		justify-content: flex-start;
		margin-top: 1.6rem;
		margin-inline: calc(var(--wrapper-padding) * -1);
		padding-inline: var(--wrapper-padding);
		overflow-x: auto;
		scrollbar-width: none;
	}

	.blog__filter::-webkit-scrollbar{
		width: 0;
		height: 0;
		display: none;
	}

	.blog__chip{
		flex-shrink: 0;
		padding: 0rem 1.2rem;
	}

	.blog__grid{
		grid-template-columns: 1fr;
		gap: 3.2rem;
	}
}

section.post{
	padding-top: 28rem;
}

.post__title{
	max-width: 12.8em;
	margin: 0rem auto;
	text-align: center;
}

.post__meta{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	margin-top: 8rem;
}

.post__fact{
	display: flex;
	align-items: center;
	gap: 1rem;
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--text-white-60);
}

.post__fact .marker{
	color: var(--text-white);
}

.post__tags{
	display: flex;
	gap:1.6rem;
	list-style: none;
}


.post__meta .marker::before{
	color: var(--theme-color);
}

.post__hero{
	position: relative;
	height: 88.5rem;
	margin-top: 2rem;
}

.post__hero img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	-webkit-mask: url(../img/blog-single/hero-mask.svg) center / 100% 100% no-repeat;
	mask: url(../img/blog-single/hero-mask.svg) center / 100% 100% no-repeat;
}

.post__lead{
	margin-top: 6rem;
}

.post__part{
	margin-top: 4rem;
}

.post__head{
	margin-left: calc(25% + 0.5rem);
	margin-bottom: 1.6rem;
}

.post__body{
	display: flex;
	flex-direction: column;
	max-width: 92rem;
	margin-left: calc(33.333% + 0.667rem);
	gap: 2.4rem;
	color: var(--text-white-75);
}

.post__note{
	color: var(--text-white-60);
}

.post__link{
	color: var(--text-orange);
	text-decoration: underline;
	transition: opacity 0.25s ease 0s;
}

.post__link:hover{
	opacity: 0.7;
}

.post__shot{
	position: relative;
	flex-shrink: 0;
	height: 45rem;
}

.post__shot img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	-webkit-mask: url(../img/blog-single/shot-mask.svg) center / 100% 100% no-repeat;
	mask: url(../img/blog-single/shot-mask.svg) center / 100% 100% no-repeat;
}

.post__nav{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	margin-top: 9.6rem;
}

.post__step{
	display: flex;
	align-items: center;
	gap: 0.8rem;
	font-family: var(--font-family);
	font-size: 1.4rem;
	line-height: 1;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--text-white);
	transition: color 0.25s ease 0s;
}

.post__step:hover{
	color: var(--text-orange);
}

.post__step-icon{
	scale: -1 1;
}

.related__grid{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2rem;
	margin-top: 5.6rem;
}

@media (max-width: 1366px) {
	section.post{
		padding-top: 15rem;
	}

	.post__meta{
		margin-top: 6.4rem;
	}

	.post__hero{
		height: 62.1rem;
	}

	.post__lead{
		margin-top: 4rem;
	}

	.post__part{
		margin-top: 4rem;
	}

	.post__head{
		margin-left: calc(16.667% + 0.333rem);
	}

	.post__body{
		margin-left: calc(25% + 0.5rem);
	}

	.post__body p{
		max-width: 63rem;
	}

	.post__nav{
		margin-top: 8rem;
	}
}

@media (max-width: 1024px) {
	.post__hero{
		height: 45.87rem;
	}

	.post__shot{
		height: 35.12rem;
	}

	.related__grid .article__media{
		height: 23.6rem;
	}
}

@media (max-width: 768px) {
	section.post{
		padding-top: 12rem;
	}

	.post__fact,
	.post__meta .marker{
		font-size: 1.4rem;
	}

	.post__meta{
		margin-top: 2.4rem;
	}

	.post__hero{
		height: 53rem;
	}

	.post__hero img{
		-webkit-mask-image: url(../img/blog-single/hero-mask-768.svg);
		mask-image: url(../img/blog-single/hero-mask-768.svg);
	}

	.post__lead{
		margin-top: 3.2rem;
	}

	.post__part{
		margin-top: 2.8rem;
	}

	.post__head{
		margin-inline: calc(16.667% + 0.333rem);
	}

	.post__body{
		margin-inline: calc(16.667% + 0.333rem);
	}

	.post__body .post__note{
		max-width: 35rem;
	}

	.post__shot{
		height: 22.76rem;
	}

	.post__nav{
		margin-top: 4rem;
	}

	.related__grid{
		grid-template-columns: repeat(2, 1fr);
		gap: 3.2rem 2rem;
		margin-top: 2.4rem;
	}
}

@media (max-width: 480px) {
	section.post{
		padding-top: 10rem;
	}

	.post .wrapper-padding{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.post .wrapper-padding > *,
	.post__tags{
		width: 100%;
	}

	.post__meta{
		display: contents;
	}

	.post__title{
		order: -5;
	}

	.post__tags{
		order: -4;
		margin-top: 2.4rem;
	}

	.post__hero{
		order: -3;
		height: 30rem;
		margin-top: 1.2rem;
	}

	.post__hero img{
		-webkit-mask-image: url(../img/blog-single/hero-mask-480.svg);
		mask-image: url(../img/blog-single/hero-mask-480.svg);
	}

	.post__fact{
		order: -2;
		width: auto;
		margin-top: 1.2rem;
	}

	.post__fact--end{
		order: -1;
	}

	.post__lead{
		margin-top: 2rem;
		margin-bottom: 0.6rem;
	}

	.post__part{
		margin-top: 1.8rem;
	}

	.post__head{
		margin-inline: 0rem;
		margin-bottom: 1.2rem;
	}

	.post__body{
		margin-inline: 0rem;
	}

	.post__shot{
		height: 15.65rem;
	}

	.post__nav{
		margin-top: 4.4rem;
	}

	.related__grid{
		grid-template-columns: 1fr;
		gap: 3.2rem;
	}
}

/* ========== chars ========== */

section.chars{
	position: relative;
	padding-top: 0rem;
}

.chars__media{
	position: absolute;
	top: 0rem;
	left: 0rem;
	width: 100%;
	height: 100vh;
	height: calc(var(--app-vh, 1vh) * 100);
}

.chars__media picture,
.chars__media img,
.chars__media video{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media (max-width: 480px) {
	.chars__video{
		scale: 1.04;
	}
}

.chars__inner{
	position: relative;
	padding-top: calc(100vh - 22rem);
	padding-top: calc(var(--app-vh, 1vh) * 100 - 22rem);
}

.chars__lead{
	max-width: calc(25% - 1.5rem);
	margin-top: 3.2rem;
	color: var(--text-white-75);
}

@media (max-width: 768px) {
	.chars__inner{
		padding-top: calc(100vh - 10.6rem);
		padding-top: calc(var(--app-vh, 1vh) * 100 - 10.6rem);
	}

	.chars__lead{
		max-width: 43rem;
		margin-top: 1.6rem;
	}
}

@media (max-width: 480px) {
	.chars__inner{
		padding-top: calc(100vh - 5.6rem);
		padding-top: calc(var(--app-vh, 1vh) * 100 - 5.6rem);
	}

	.chars__title{
		font-size: 4.2rem;
	}

	.chars__lead{
		max-width: none;
	}
}

/* ========== caps ========== */

.caps__title{
	max-width: 15.5em;
	margin: 0rem auto;
	text-align: center;
}

.caps__tabs{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2.4rem;
	margin-top: 3.2rem;
}

.caps__tabs .tab{
	--tab-cut: 2.2rem;
	font-size: 1.4rem;
	letter-spacing: -0.02em;
}

.caps__panels{
	display: grid;
	grid-template-columns: minmax(0rem, 1fr);
}

.caps__panel{
	grid-area: 1 / 1;
	opacity: 0;
	visibility: hidden;
	translate: 0rem 1.2rem;
	pointer-events: none;
	transition: opacity 0.25s ease 0s, translate 0.25s ease 0s, visibility 0s linear 0.25s;
}

.caps__panel.is-active{
	opacity: 1;
	visibility: visible;
	translate: 0rem 0rem;
	pointer-events: auto;
	transition: opacity 0.3s ease 0.25s, translate 0.3s ease 0.25s, visibility 0s linear 0s;
}

.caps__grid{
	display: grid;
	grid-template-columns: repeat(2, minmax(0rem, 1fr));
	max-width: calc(66.667% - 0.667rem);
	margin: 5.6rem auto 0rem;
	gap: 4rem 2rem;
}

.caps__card{
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 44rem;
	padding: 3.2rem 8rem;
}

.caps__card::before{
	content: "";
	position: absolute;
	inset: 0rem;
	background-color: var(--bg-white-10);
	-webkit-backdrop-filter: blur(0.42rem);
	backdrop-filter: blur(0.42rem);
}

.caps__card::after{
	content: "";
	position: absolute;
	inset: 0rem;
	pointer-events: none;
	border-style: solid;
	border-color: transparent;
	border-image-repeat: round;
}

.caps__grid--caps .caps__card:nth-child(1)::before{
	clip-path: polygon(3.3rem 0.6rem, 3.4757rem 0.1757rem, 3.9rem 0rem, calc(100% - 0.6rem) 0rem, calc(100% - 0.1757rem) 0.1757rem, 100% 0.6rem, 100% calc(100% - 7.3032rem), calc(100% - 0.0645rem) calc(100% - 7.0326rem), calc(100% - 0.2441rem) calc(100% - 6.8202rem), calc(100% - 9.3413rem) calc(100% - 0.117rem), calc(100% - 9.5099rem) calc(100% - 0.03rem), calc(100% - 9.6972rem) 100%, 0.6rem 100%, 0.1757rem calc(100% - 0.1757rem), 0rem calc(100% - 0.6rem), 0rem 24.6385rem, 0.0424rem 24.4169rem, 0.1637rem 24.2266rem, 3.1363rem 21.078rem, 3.2576rem 20.8877rem, 3.3rem 20.6661rem);
}

.caps__grid--caps .caps__card:nth-child(1)::after{
	border-width: 25rem 10rem 8rem 4rem;
	border-image-source: url(../img/3d-chapters/border1.png);
	border-image-slice: 500 200 160 80;
}

.caps__grid--caps .caps__card:nth-child(2)::before{
	clip-path: polygon(calc(100% - 3.3rem) 0.6rem, calc(100% - 3.4757rem) 0.1757rem, calc(100% - 3.9rem) 0rem, 0.6rem 0rem, 0.1757rem 0.1757rem, 0rem 0.6rem, 0rem calc(100% - 7.3032rem), 0.0645rem calc(100% - 7.0326rem), 0.2441rem calc(100% - 6.8202rem), 9.3413rem calc(100% - 0.117rem), 9.5099rem calc(100% - 0.03rem), 9.6972rem 100%, calc(100% - 0.6rem) 100%, calc(100% - 0.1757rem) calc(100% - 0.1757rem), 100% calc(100% - 0.6rem), 100% 24.6385rem, calc(100% - 0.0424rem) 24.4169rem, calc(100% - 0.1637rem) 24.2266rem, calc(100% - 3.1363rem) 21.078rem, calc(100% - 3.2576rem) 20.8877rem, calc(100% - 3.3rem) 20.6661rem);
}

.caps__grid--caps .caps__card:nth-child(2)::after{
	border-width: 25rem 4rem 8rem 10rem;
	border-image-source: url(../img/3d-chapters/border2.png);
	border-image-slice: 500 80 160 200;
}

.caps__grid--caps .caps__card:nth-child(3)::before{
	clip-path: polygon(3.3rem calc(100% - 0.6rem), 3.4757rem calc(100% - 0.1757rem), 3.9rem 100%, calc(100% - 0.6rem) 100%, calc(100% - 0.1757rem) calc(100% - 0.1757rem), 100% calc(100% - 0.6rem), 100% 7.3032rem, calc(100% - 0.0645rem) 7.0326rem, calc(100% - 0.2441rem) 6.8202rem, calc(100% - 9.3413rem) 0.117rem, calc(100% - 9.5099rem) 0.03rem, calc(100% - 9.6972rem) 0rem, 0.6rem 0rem, 0.1757rem 0.1757rem, 0rem 0.6rem, 0rem 19.3615rem, 0.0424rem 19.5831rem, 0.1637rem 19.7734rem, 3.1363rem 22.922rem, 3.2576rem 23.1123rem, 3.3rem 23.3339rem);
}

.caps__grid--caps .caps__card:nth-child(3)::after{
	border-width: 24rem 10rem 1rem 4rem;
	border-image-source: url(../img/3d-chapters/border3.png);
	border-image-slice: 480 200 20 80;
}

.caps__grid--caps .caps__card:nth-child(4)::before{
	clip-path: polygon(calc(100% - 3.3rem) calc(100% - 0.6rem), calc(100% - 3.4757rem) calc(100% - 0.1757rem), calc(100% - 3.9rem) 100%, 0.6rem 100%, 0.1757rem calc(100% - 0.1757rem), 0rem calc(100% - 0.6rem), 0rem 7.3032rem, 0.0645rem 7.0326rem, 0.2441rem 6.8202rem, 9.3413rem 0.117rem, 9.5099rem 0.03rem, 9.6972rem 0rem, calc(100% - 0.6rem) 0rem, calc(100% - 0.1757rem) 0.1757rem, 100% 0.6rem, 100% 19.3615rem, calc(100% - 0.0424rem) 19.5831rem, calc(100% - 0.1637rem) 19.7734rem, calc(100% - 3.1363rem) 22.922rem, calc(100% - 3.2576rem) 23.1123rem, calc(100% - 3.3rem) 23.3339rem);
}

.caps__grid--caps .caps__card:nth-child(4)::after{
	border-width: 24rem 4rem 1rem 10rem;
	border-image-source: url(../img/3d-chapters/border4.png);
	border-image-slice: 480 80 20 200;
}

.caps__card-title{
	position: relative;
	color: var(--text-white);
}

.caps__list{
	position: relative;
	display: flex;
	flex-direction: column;
	max-width: 36rem;
	margin-top: auto;
	margin-left: 8rem;
	gap: 1.6rem;
	list-style: none;
}

.caps__list .marker::before{
	color: var(--theme-color);
}

.caps__grid--styles{
	max-width: calc(83.333% - 0.333rem);
	gap: 2rem;
}

.caps__card--style{
	min-height: 44rem;
	padding: 3.2rem 6rem;
}

.caps__card--style::before{
	clip-path: polygon(0rem 5.2485rem, 0.0457rem 5.0189rem, 0.1757rem 4.8243rem, 4.8243rem 0.1757rem, 5.0189rem 0.0457rem, 5.2485rem 0rem, calc(100% - 5.2485rem) 0rem, calc(100% - 5.0189rem) 0.0457rem, calc(100% - 4.8243rem) 0.1757rem, calc(100% - 0.1757rem) 4.8243rem, calc(100% - 0.0457rem) 5.0189rem, 100% 5.2485rem, 100% calc(100% - 5.2485rem), calc(100% - 0.0457rem) calc(100% - 5.0189rem), calc(100% - 0.1757rem) calc(100% - 4.8243rem), calc(100% - 4.8243rem) calc(100% - 0.1757rem), calc(100% - 5.0189rem) calc(100% - 0.0457rem), calc(100% - 5.2485rem) 100%, 5.2485rem 100%, 5.0189rem calc(100% - 0.0457rem), 4.8243rem calc(100% - 0.1757rem), 0.1757rem calc(100% - 4.8243rem), 0.0457rem calc(100% - 5.0189rem), 0rem calc(100% - 5.2485rem));
}

.caps__card--style::after{
	border-width: 5.25rem;
	border-image-source: url(../img/3d-chapters/border-big.png);
	border-image-slice: 105;
}

.caps__card--style .caps__list{
	max-width: none;
	margin-left: 0rem;
}

.caps__shot{
	position: absolute;
	right: 4rem;
	bottom: 4rem;
	width: 35rem;
	height: 28rem;
}

.caps__shot img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	clip-path: polygon(0rem 5.2485rem, 0.0457rem 5.0189rem, 0.1757rem 4.8243rem, 4.8243rem 0.1757rem, 5.0189rem 0.0457rem, 5.2485rem 0rem, calc(100% - 5.2485rem) 0rem, calc(100% - 5.0189rem) 0.0457rem, calc(100% - 4.8243rem) 0.1757rem, calc(100% - 0.1757rem) 4.8243rem, calc(100% - 0.0457rem) 5.0189rem, 100% 5.2485rem, 100% calc(100% - 5.2485rem), calc(100% - 0.0457rem) calc(100% - 5.0189rem), calc(100% - 0.1757rem) calc(100% - 4.8243rem), calc(100% - 4.8243rem) calc(100% - 0.1757rem), calc(100% - 5.0189rem) calc(100% - 0.0457rem), calc(100% - 5.2485rem) 100%, 5.2485rem 100%, 5.0189rem calc(100% - 0.0457rem), 4.8243rem calc(100% - 0.1757rem), 0.1757rem calc(100% - 4.8243rem), 0.0457rem calc(100% - 5.0189rem), 0rem calc(100% - 5.2485rem));
}

.caps__shot::after{
	content: "";
	position: absolute;
	inset: 0rem;
	pointer-events: none;
	background-image: url(../img/3d-chapters/border-mini.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.caps__mark{
	position: absolute;
	width: 1.2rem;
	height: 1.2rem;
	border-radius: 0.2rem;
	background-color: var(--bg-orange);
}

.caps__card:nth-child(1),
.caps__card:nth-child(2){
	padding-bottom: 6.4rem;
}

.caps__card:nth-child(1) .caps__mark{
	bottom: 3.2rem;
	left: 4rem;
}

.caps__card:nth-child(2) .caps__mark{
	bottom: 3.2rem;
	right: 4rem;
}

.caps__card:nth-child(3) .caps__mark{
	top: 3.2rem;
	left: 4rem;
}

.caps__card:nth-child(4) .caps__mark{
	top: 3.2rem;
	right: 4rem;
}

@media (max-width: 1366px) {
	.caps__tabs{
		margin-top: 2.4rem;
	}

	.caps__grid{
		max-width: calc(83.333% - 0.333rem);
		margin-top: 4rem;
		gap: 3.2rem 2rem;
	}

	.caps__card{
		min-height: 35rem;
		padding: 2.4rem 7.9rem 2.4rem 5.8rem;
	}

	.caps__grid--caps .caps__card:nth-child(3),
	.caps__grid--caps .caps__card:nth-child(4){
		padding-top: 5.4rem;
	}

	.caps__grid--caps .caps__card:nth-child(3){
		padding-right: 7.2rem;
	}

	.caps__grid--caps .caps__card:nth-child(4){
		padding-left: 7.2rem;
	}

	.caps__list{
		max-width: none;
		margin-left: 0rem;
	}

	.caps__list .marker{
		font-size: 1.4rem;
	}

	.caps__grid--caps .caps__card:nth-child(1)::before{
		clip-path: polygon(2.8923rem 0.4773rem, 3.0462rem 0.1398rem, 3.4181rem 0rem, calc(100% - 0.5259rem) 0rem, calc(100% - 0.154rem) 0.1398rem, 100% 0.4773rem, 100% calc(100% - 5.8094rem), calc(100% - 0.0565rem) calc(100% - 5.5941rem), calc(100% - 0.2139rem) calc(100% - 5.4252rem), calc(100% - 8.1871rem) calc(100% - 0.0931rem), calc(100% - 8.3349rem) calc(100% - 0.0239rem), calc(100% - 8.499rem) 100%, 0.5259rem 100%, 0.154rem calc(100% - 0.1398rem), 0rem calc(100% - 0.4773rem), 0rem 19.5988rem, 0.0372rem 19.4225rem, 0.1435rem 19.2712rem, 2.7488rem 16.7666rem, 2.8551rem 16.6152rem, 2.8923rem 16.4389rem);
	}

	.caps__grid--caps .caps__card:nth-child(1)::after{
		border-width: 19.8864rem 8.7644rem 6.3636rem 3.5058rem;
	}

	.caps__grid--caps .caps__card:nth-child(2)::before{
		clip-path: polygon(calc(100% - 2.8923rem) 0.4773rem, calc(100% - 3.0462rem) 0.1398rem, calc(100% - 3.4181rem) 0rem, 0.5259rem 0rem, 0.154rem 0.1398rem, 0rem 0.4773rem, 0rem calc(100% - 5.8094rem), 0.0565rem calc(100% - 5.5941rem), 0.2139rem calc(100% - 5.4252rem), 8.1871rem calc(100% - 0.0931rem), 8.3349rem calc(100% - 0.0239rem), 8.499rem 100%, calc(100% - 0.5259rem) 100%, calc(100% - 0.154rem) calc(100% - 0.1398rem), 100% calc(100% - 0.4773rem), 100% 19.5988rem, calc(100% - 0.0372rem) 19.4225rem, calc(100% - 0.1435rem) 19.2712rem, calc(100% - 2.7488rem) 16.7666rem, calc(100% - 2.8551rem) 16.6152rem, calc(100% - 2.8923rem) 16.4389rem);
	}

	.caps__grid--caps .caps__card:nth-child(2)::after{
		border-width: 19.8864rem 3.5058rem 6.3636rem 8.7644rem;
	}

	.caps__grid--caps .caps__card:nth-child(3)::before{
		clip-path: polygon(2.8923rem calc(100% - 0.4773rem), 3.0462rem calc(100% - 0.1398rem), 3.4181rem 100%, calc(100% - 0.5259rem) 100%, calc(100% - 0.154rem) calc(100% - 0.1398rem), 100% calc(100% - 0.4773rem), 100% 5.8094rem, calc(100% - 0.0565rem) 5.5941rem, calc(100% - 0.2139rem) 5.4252rem, calc(100% - 8.1871rem) 0.0931rem, calc(100% - 8.3349rem) 0.0239rem, calc(100% - 8.499rem) 0rem, 0.5259rem 0rem, 0.154rem 0.1398rem, 0rem 0.4773rem, 0rem 15.4012rem, 0.0372rem 15.5775rem, 0.1435rem 15.7288rem, 2.7488rem 18.2334rem, 2.8551rem 18.3848rem, 2.8923rem 18.5611rem);
	}

	.caps__grid--caps .caps__card:nth-child(3)::after{
		border-width: 19.0909rem 8.7644rem 0.7955rem 3.5058rem;
	}

	.caps__grid--caps .caps__card:nth-child(4)::before{
		clip-path: polygon(calc(100% - 2.8923rem) calc(100% - 0.4773rem), calc(100% - 3.0462rem) calc(100% - 0.1398rem), calc(100% - 3.4181rem) 100%, 0.5259rem 100%, 0.154rem calc(100% - 0.1398rem), 0rem calc(100% - 0.4773rem), 0rem 5.8094rem, 0.0565rem 5.5941rem, 0.2139rem 5.4252rem, 8.1871rem 0.0931rem, 8.3349rem 0.0239rem, 8.499rem 0rem, calc(100% - 0.5259rem) 0rem, calc(100% - 0.154rem) 0.1398rem, 100% 0.4773rem, 100% 15.4012rem, calc(100% - 0.0372rem) 15.5775rem, calc(100% - 0.1435rem) 15.7288rem, calc(100% - 2.7488rem) 18.2334rem, calc(100% - 2.8551rem) 18.3848rem, calc(100% - 2.8923rem) 18.5611rem);
	}

	.caps__grid--caps .caps__card:nth-child(4)::after{
		border-width: 19.0909rem 3.5058rem 0.7955rem 8.7644rem;
	}

	.caps__card--style{
		min-height: 33rem;
		padding: 2.4rem 4rem 2.4rem 6rem;
	}

	.caps__card--style .caps__list{
		margin-right: 21.4rem;
	}

	.caps__card--style::before{
		clip-path: polygon(0rem 3.8489rem, 0.0318rem 3.6805rem, 0.1225rem 3.5378rem, 3.3637rem 0.1289rem, 3.4994rem 0.0335rem, 3.6595rem 0rem, calc(100% - 3.6595rem) 0rem, calc(100% - 3.4994rem) 0.0335rem, calc(100% - 3.3637rem) 0.1289rem, calc(100% - 0.1225rem) 3.5378rem, calc(100% - 0.0318rem) 3.6805rem, 100% 3.8489rem, 100% calc(100% - 3.8489rem), calc(100% - 0.0318rem) calc(100% - 3.6805rem), calc(100% - 0.1225rem) calc(100% - 3.5378rem), calc(100% - 3.3637rem) calc(100% - 0.1289rem), calc(100% - 3.4994rem) calc(100% - 0.0335rem), calc(100% - 3.6595rem) 100%, 3.6595rem 100%, 3.4994rem calc(100% - 0.0335rem), 3.3637rem calc(100% - 0.1289rem), 0.1225rem calc(100% - 3.5378rem), 0.0318rem calc(100% - 3.6805rem), 0rem calc(100% - 3.8489rem));
	}

	.caps__card--style::after{
		border-width: 3.85rem 3.6606rem;
	}

	.caps__shot{
		right: 1.4rem;
		bottom: 1.4rem;
		width: 22rem;
		height: 21rem;
	}

	.caps__shot::after{
		background-image: url(../img/characters/border-1366.png);
	}

	.caps__card:nth-child(1) .caps__mark,
	.caps__card:nth-child(3) .caps__mark{
		left: 3rem;
	}

	.caps__card:nth-child(2) .caps__mark,
	.caps__card:nth-child(4) .caps__mark{
		right: 3rem;
	}

	.caps__card:nth-child(1) .caps__mark,
	.caps__card:nth-child(2) .caps__mark{
		bottom: 2.6rem;
	}

	.caps__card:nth-child(3) .caps__mark,
	.caps__card:nth-child(4) .caps__mark{
		top: 2.6rem;
	}
}

@media (max-width: 1024px) {
	.caps__grid{
		max-width: none;
	}
}

@media (max-width: 768px) {
	.caps__title{
		max-width: none;
	}

	.caps__tabs{
		margin-top: 1.6rem;
	}

	.caps__grid{
		display: flex;
		max-width: none;
		margin-top: 3.2rem;
		margin-inline: calc(var(--wrapper-padding) * -1);
		padding-inline: var(--wrapper-padding);
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
		gap: 2rem;
	}

	.caps__grid::-webkit-scrollbar{
		display: none;
	}

	.caps__card{
		scroll-snap-align: center;
		flex: 0 0 34.4rem;
		min-height: 35.7rem;
		padding: 2.4rem 2.6rem 3rem;
	}

	.caps__grid--caps .caps__card:nth-child(3),
	.caps__grid--caps .caps__card:nth-child(4){
		padding-top: 2.4rem;
		padding-right: 2.6rem;
		padding-left: 2.6rem;
	}

	.caps__grid .caps__card:nth-child(n)::before{
		clip-path: polygon(0rem 3.3809rem, 0.043rem 3.1582rem, 0.1657rem 2.967rem, 2.8159rem 0.1861rem, 3.014rem 0.0485rem, 3.2502rem 0rem, calc(100% - 3.2502rem) 0rem, calc(100% - 3.014rem) 0.0485rem, calc(100% - 2.8159rem) 0.1861rem, calc(100% - 0.1657rem) 2.967rem, calc(100% - 0.043rem) 3.1582rem, 100% 3.3809rem, 100% calc(100% - 3.3809rem), calc(100% - 0.043rem) calc(100% - 3.1582rem), calc(100% - 0.1657rem) calc(100% - 2.967rem), calc(100% - 2.8159rem) calc(100% - 0.1861rem), calc(100% - 3.014rem) calc(100% - 0.0485rem), calc(100% - 3.2502rem) 100%, 3.2502rem 100%, 3.014rem calc(100% - 0.0485rem), 2.8159rem calc(100% - 0.1861rem), 0.1657rem calc(100% - 2.967rem), 0.043rem calc(100% - 3.1582rem), 0rem calc(100% - 3.3809rem));
	}

	.caps__grid .caps__card:nth-child(n)::after{
		border-width: 4rem;
		border-image-source: url(../img/3d-chapters/border-768.png);
		border-image-slice: 80;
	}

	.caps__card--style .caps__list{
		margin-top: 1.6rem;
		margin-right: 0rem;
	}

	.caps__mark{
		display: none;
	}

	.caps__shot{
		right: 1rem;
		bottom: 1rem;
		width: 17.2rem;
		height: 17.8rem;
	}

	.caps__shot img{
		clip-path: polygon(0rem 3.3809rem, 0.043rem 3.1582rem, 0.1657rem 2.967rem, 2.8159rem 0.1861rem, 3.014rem 0.0485rem, 3.2502rem 0rem, calc(100% - 3.2502rem) 0rem, calc(100% - 3.014rem) 0.0485rem, calc(100% - 2.8159rem) 0.1861rem, calc(100% - 0.1657rem) 2.967rem, calc(100% - 0.043rem) 3.1582rem, 100% 3.3809rem, 100% calc(100% - 3.3809rem), calc(100% - 0.043rem) calc(100% - 3.1582rem), calc(100% - 0.1657rem) calc(100% - 2.967rem), calc(100% - 2.8159rem) calc(100% - 0.1861rem), calc(100% - 3.014rem) calc(100% - 0.0485rem), calc(100% - 3.2502rem) 100%, 3.2502rem 100%, 3.014rem calc(100% - 0.0485rem), 2.8159rem calc(100% - 0.1861rem), 0.1657rem calc(100% - 2.967rem), 0.043rem calc(100% - 3.1582rem), 0rem calc(100% - 3.3809rem));
	}

	.caps__shot::after{
		background-image: none;
		border-style: solid;
		border-color: transparent;
		border-width: 4rem;
		border-image-source: url(../img/3d-chapters/border-768.png);
		border-image-slice: 80;
		border-image-repeat: round;
	}

		.caps__tabs {
    gap: 1.2rem;
	}
}

@media (max-width: 480px) {
	.caps__title{
		text-align: left;
		margin: 0rem;
	}


	.caps__tabs{
		justify-content: flex-start;
	}

	.caps__grid{
		gap: 1rem;
		margin-top: 2.4rem;
	}

	.caps__card{
		flex-basis: 31rem;
		min-height: 35rem;
		padding: 2rem 2rem 2.4rem;
	}

	.caps__grid--caps .caps__card:nth-child(3),
	.caps__grid--caps .caps__card:nth-child(4){
		padding-top: 2rem;
		padding-right: 2rem;
		padding-left: 2rem;
	}

	.caps__grid .caps__card:nth-child(n)::before{
		clip-path: polygon(0rem 1.2925rem, 0.0495rem 1.0538rem, 0.1898rem 0.8545rem, 0.9292rem 0.1621rem, 1.1188rem 0.042rem, 1.3393rem 0rem, calc(100% - 1.3393rem) 0rem, calc(100% - 1.1188rem) 0.042rem, calc(100% - 0.9292rem) 0.1621rem, calc(100% - 0.1898rem) 0.8545rem, calc(100% - 0.0495rem) 1.0538rem, 100% 1.2925rem, 100% calc(100% - 1.2925rem), calc(100% - 0.0495rem) calc(100% - 1.0538rem), calc(100% - 0.1898rem) calc(100% - 0.8545rem), calc(100% - 0.9292rem) calc(100% - 0.1621rem), calc(100% - 1.1188rem) calc(100% - 0.042rem), calc(100% - 1.3393rem) 100%, 1.3393rem 100%, 1.1188rem calc(100% - 0.042rem), 0.9292rem calc(100% - 0.1621rem), 0.1898rem calc(100% - 0.8545rem), 0.0495rem calc(100% - 1.0538rem), 0rem calc(100% - 1.2925rem));
	}

	.caps__grid .caps__card:nth-child(n)::after{
		border-width: 2rem;
		border-image-source: url(../img/3d-chapters/border-480.png);
		border-image-slice: 40;
	}

	.caps__shot{
		width: 17rem;
		height: 16.5rem;
	}

	.caps__shot img{
		clip-path: polygon(0rem 1.2925rem, 0.0495rem 1.0538rem, 0.1898rem 0.8545rem, 0.9292rem 0.1621rem, 1.1188rem 0.042rem, 1.3393rem 0rem, calc(100% - 1.3393rem) 0rem, calc(100% - 1.1188rem) 0.042rem, calc(100% - 0.9292rem) 0.1621rem, calc(100% - 0.1898rem) 0.8545rem, calc(100% - 0.0495rem) 1.0538rem, 100% 1.2925rem, 100% calc(100% - 1.2925rem), calc(100% - 0.0495rem) calc(100% - 1.0538rem), calc(100% - 0.1898rem) calc(100% - 0.8545rem), calc(100% - 0.9292rem) calc(100% - 0.1621rem), calc(100% - 1.1188rem) calc(100% - 0.042rem), calc(100% - 1.3393rem) 100%, 1.3393rem 100%, 1.1188rem calc(100% - 0.042rem), 0.9292rem calc(100% - 0.1621rem), 0.1898rem calc(100% - 0.8545rem), 0.0495rem calc(100% - 1.0538rem), 0rem calc(100% - 1.2925rem));
	}

	.caps__shot::after{
		border-width: 2rem;
		border-image-source: url(../img/3d-chapters/border-480.png);
		border-image-slice: 40;
	}
}

/* ========== folio ========== */

.folio__title{
	text-align: center;
}

.folio__slider{
	width: 100%;
	margin-top: 6rem;
}

.folio{
	--folio-w: 123.2rem;
	--folio-h: 71.5rem;
	--folio-drop: 0.35;
	--folio-cap: 67.2rem;
	--folio-lift: -11.01rem;
}

.folio__slide{
	position: relative;
	width: var(--folio-w);
	height: var(--folio-h);
}

.folio__media{
	height: var(--folio-h);
	scale: calc(1 - min(var(--slide-progress, 1), 1) * var(--folio-drop));
	translate: calc(var(--slide-shift, 0) * var(--folio-w) * var(--folio-drop) / 2) 0rem;
	will-change: scale, translate;
	transition: scale var(--slide-ease, 0s) ease 0s, translate var(--slide-ease, 0s) ease 0s;
	-webkit-mask: url(../img/3d-chapters/slide-mask.svg) center / 100% 100% no-repeat;
	mask: url(../img/3d-chapters/slide-mask.svg) center / 100% 100% no-repeat;
}

.folio__media img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.folio__slide--fit .folio__media img{
	object-fit: contain;
	object-position: right center;
}

.folio__year{
	position: absolute;
	top: var(--folio-cap);
	right: 2rem;
	display: flex;
	align-items: center;
	gap: 1rem;
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--text-white-60);
	translate: 0rem calc(min(var(--slide-progress, 1), 1) * var(--folio-lift));
	transition: translate var(--slide-ease, 0s) ease 0s;
}

.folio__year .marker{
	color: var(--text-white);
}

.folio__year .marker::before{
	color: var(--theme-color);
}

@media (max-width: 1366px) {
	.folio{
		--folio-w: 96rem;
		--folio-h: 55.7rem;
		--folio-drop: 0.25;
		--folio-cap: 52.4rem;
		--folio-lift: -6.13rem;
	}

	.folio__slider{
		margin-top: 4rem;
	}
}

@media (max-width: 1024px) {
	.folio{
		--folio-w: 72rem;
		--folio-h: 41.8rem;
		--folio-cap: 39.3rem;
		--folio-lift: -4.9rem;
	}

	.folio__slider{
		margin-top: 3.2rem;
	}
}

@media (max-width: 768px) {
	.folio{
		--folio-w: 46.5rem;
		--folio-h: 27rem;
		--folio-lift: 0rem;
	}

	.folio .folio__nav {
		display: flex;
	}

	.folio__slide{
		height: calc(var(--folio-h) + 5.6rem);
	}

	.folio__year{
		top: calc(var(--folio-h) + 2.2rem);
		right: auto;
		left: 0rem;
	}
}

@media (max-width: 480px) {
	.folio{
		--folio-w: 32rem;
		--folio-h: 18.6rem;
	}

	.folio__slider{
		margin-top: 2.4rem;
	}

	.folio__slide{
		height: calc(var(--folio-h) + 4rem);
	}

	.folio__year{
		top: calc(var(--folio-h) + 1.6rem);
	}
}

/* ========== expert ========== */

section.expert{
	position: relative;
	height: 150rem;
	margin: var(--section-margin) 0rem;
	padding: 0rem;
	overflow: hidden;
}

.expert__video{
	position: absolute;
	inset: 0rem;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.expert__inner{
	position: relative;
	height: 100%;
}

.expert__title{
	max-width: 100rem;
	padding-top: 7.5rem;
}

.expert__lead{
	max-width: 43rem;
	margin-top: 3.2rem;
	color: var(--text-white-75);
}

.expert__points{
	list-style: none;
}

.expert__point{
	position: absolute;
	padding-left: 2.2rem;
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--text-white);
}

.expert__point::before{
	content: "";
	position: absolute;
	top: 0.4rem;
	left: 0rem;
	width: 1.2rem;
	height: 1.2rem;
	border-radius: 0.2rem;
	background-color: var(--bg-orange);
}

.expert__point--one{
	top: 55.9rem;
	left: 144rem;
	width: 35.1rem;
}

.expert__point--two{
	top: 73.2rem;
	left: 18.7rem;
	width: 33.5rem;
}

.expert__point--three{
	top: 80.5rem;
	left: 144rem;
	width: 32.5rem;
}

.expert__point--four{
	top: 109.8rem;
	left: 18.7rem;
	width: 32.5rem;
}

@media (max-width: 1366px) {
	section.expert{
		height: 106.8rem;
	}

	.expert__title{
		max-width: 74rem;
	}

	.expert__lead{
		font-size: 1.4rem;
	}

	.expert__point{
		font-size: 1.4rem;
	}

	.expert__point::before{
		top: 0.3rem;
	}

	.expert__point--one{
		top: 42.5rem;
		left: 99.3rem;
		width: 34.3rem;
	}

	.expert__point--two{
		top: 56.9rem;
		left: 8.5rem;
		width: 31.2rem;
	}

	.expert__point--three{
		top: 85.1rem;
		left: 102.5rem;
		width: 31.1rem;
	}

	.expert__point--four{
		top: 86.8rem;
		left: 14.1rem;
		width: 31.1rem;
	}
}

@media (max-width: 1024px) {
	section.expert{
		height: 80.1rem;
	}

	.expert__point--one{
		top: 45rem;
		left: 65.1rem;
	}

	.expert__point--two{
		top: 49rem;
		left: 6.4rem;
	}

	.expert__point--three{
		top: 63.8rem;
		left: 68.3rem;
	}

	.expert__point--four{
		top: 65.1rem;
		left: 10.6rem;
	}
}

@media (max-width: 768px) {
	section.expert{
		height: auto;
	}

	.expert__video{
		top: auto;
		bottom: 0rem;
		height: 70rem;
	}

	.expert__inner{
		height: auto;
		padding-bottom: 73rem;
	}

	.expert__title{
		max-width: 66rem;
		padding-top: 4.8rem;
	}

	.expert__lead {
    margin-top: 2.4rem;
	}

	.expert__points{
		position: absolute;
		top: calc(100% - 70rem + 4rem);
		left: 0rem;
		right: 0rem;
		display: flex;
		gap: 2rem;
		padding-inline: var(--wrapper-padding);
		overflow-x: auto;
		scrollbar-width: none;
	}

	.expert__points::-webkit-scrollbar{
		display: none;
	}

	.expert__point{
		position: relative;
		top: auto;
		left: auto;
		flex: 0 0 24rem;
		width: 24rem;
	}

	.expert__point--four{
		order: 1;
	}

	.expert__point--three{
		order: 2;
	}

	.expert__point--two{
		order: 3;
	}

	.expert__point--one{
		order: 4;
	}
}

@media (max-width: 480px) {
	.expert__video{
		height: 50rem;
	}

	.expert__inner{
		padding-bottom: 52rem;
	}

	.expert__points{
		top: calc(100% - 50rem + 3.6rem);
	}

	    .expert__lead {
        margin-top: 1.6rem;
    }
}

/* ========== pipe ========== */

.pipe__inner{
	display: flex;
	align-items: flex-start;
	gap: 2rem;
}

.pipe__head{
	position: sticky;
	top: 12rem;
	max-width: 68rem;
}

.pipe__title{
	max-width: 68rem;
}

.pipe__lead{
	max-width: 42rem;
	margin-top: 2.4rem;
	color: var(--text-white-60);
}

.pipe__cta{
	margin-top: 3.2rem;
}

.pipe__chart{
	display: flex;
	flex-direction: column;
	gap: 3.85rem;
	margin-right: 15.7rem;
	width: 92rem;
	margin-left: auto;
}

.pipe__card{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 45rem;
	height: 18.5rem;
	padding: 2.2rem 3.2rem;
}

.pipe__chart .pipe__card:nth-child(odd){
	margin-left: 47rem;
}

.pipe__card::before{
	content: "";
	position: absolute;
	inset: 0rem;
	background-color: var(--bg-white-10);
	-webkit-backdrop-filter: blur(0.42rem);
	backdrop-filter: blur(0.42rem);
	clip-path: polygon(0rem 1.76rem, 0.086rem 1.535rem, 0.19rem 1.322rem, 1.427rem 0.162rem, 1.63rem 0.063rem, 1.837rem 0rem, calc(100% - 1.837rem) 0rem, calc(100% - 1.63rem) 0.063rem, calc(100% - 1.427rem) 0.162rem, calc(100% - 0.19rem) 1.322rem, calc(100% - 0.086rem) 1.535rem, 100% 1.76rem, 100% calc(100% - 1.76rem), calc(100% - 0.086rem) calc(100% - 1.535rem), calc(100% - 0.19rem) calc(100% - 1.322rem), calc(100% - 1.427rem) calc(100% - 0.162rem), calc(100% - 1.63rem) calc(100% - 0.063rem), calc(100% - 1.837rem) 100%, 1.837rem 100%, 1.63rem calc(100% - 0.063rem), 1.427rem calc(100% - 0.162rem), 0.19rem calc(100% - 1.322rem), 0.086rem calc(100% - 1.535rem), 0rem calc(100% - 1.76rem));
}

.pipe__card::after{
	content: "";
	position: absolute;
	inset: 0rem;
	pointer-events: none;
	background-image: url(../img/3d-chapters/border-pipeline.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.pipe__lvl{
	position: relative;
	font-family: var(--font-family);
	font-size: 1.4rem;
	line-height: 1.3;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--text-orange);
}

.pipe__lvl b{
	font-weight: 400;
}

.pipe__name{
	position: relative;
	margin-top: auto;
	white-space: nowrap;
	color: var(--text-white);
}

.pipe__aim{
	position: absolute;
	top: -15.3rem;
	left: calc(50% - 2.2rem);
	width: 4.4rem;
	height: 4.4rem;
	color: var(--text-orange);
	animation: pipe-aim-spin 12s linear infinite;
}

@keyframes pipe-aim-spin{
	from{
		rotate: 0deg;
	}

	to{
		rotate: 360deg;
	}
}

.pipe__link{
	position: absolute;
	background-color: var(--bg-orange);
}

.pipe__aim--solo,
.pipe__bar{
	display: none;
}

.pipe__link--v{
	top: -9.8rem;
	left: calc(50% - 0.05rem);
	width: 0.1rem;
	height: 9.8rem;
}

.pipe__link--h{
	top: -13.15rem;
	width: 21.2rem;
	height: 0.1rem;
}

.pipe__chart .pipe__card:nth-child(even) .pipe__link--h{
	left: calc(50% + 3.3rem);
}

.pipe__chart .pipe__card:nth-child(odd) .pipe__link--h{
	right: calc(50% + 3.3rem);
}

@media (max-width: 1366px) {
	.pipe__lead{
		max-width: 49rem;
	}

	.pipe__chart {
    margin-right: 15.7rem;
}

	.pipe__chart{
		gap: 4rem;
		width: 65rem;
		margin-right: 11rem;
	}

	.pipe__chart .pipe__card:nth-child(odd){
		margin-left: 38.1rem;
	}

	.pipe__card{
		width: 25.6rem;
		padding: 2.2rem;
	}

	.pipe__card::before{
		clip-path: polygon(0rem 1.76rem, 0.086rem 1.535rem, 0.19rem 1.322rem, 1.427rem 0.162rem, 1.63rem 0.063rem, 1.837rem 0rem, calc(100% - 1.837rem) 0rem, calc(100% - 1.63rem) 0.063rem, calc(100% - 1.427rem) 0.162rem, calc(100% - 0.19rem) 1.322rem, calc(100% - 0.086rem) 1.535rem, 100% 1.76rem, 100% calc(100% - 1.76rem), calc(100% - 0.086rem) calc(100% - 1.535rem), calc(100% - 0.19rem) calc(100% - 1.322rem), calc(100% - 1.427rem) calc(100% - 0.162rem), calc(100% - 1.63rem) calc(100% - 0.063rem), calc(100% - 1.837rem) 100%, 1.837rem 100%, 1.63rem calc(100% - 0.063rem), 1.427rem calc(100% - 0.162rem), 0.19rem calc(100% - 1.322rem), 0.086rem calc(100% - 1.535rem), 0rem calc(100% - 1.76rem));
	}

	.pipe__card::after{
		background-image: url(../img/3d-chapters/pipeline-1366.png);
	}

	.pipe__name{
		max-width: 16rem;
		white-space: normal;
	}

	.pipe__name br{
		display: none;
	}

	.pipe__chart .pipe__card:nth-child(4) .pipe__name br{
		display: inline;
	}

	.pipe__aim{
		top: -14.5rem;
	}

	.pipe__link--v{
		top: -9rem;
		height: 9rem;
	}

	.pipe__link--h{
		top: -12.35rem;
		width: 22rem;
	}
}

@media (max-width: 1024px) {
	.pipe__inner{
		flex-direction: column;
	}

	.pipe__head{
		position: static;
		max-width: none;
	}

	.pipe__chart{
		margin-top: 4rem;
	}
}

@media (max-width: 768px) {
	.pipe__head{
		display: contents;
	}

	.pipe__cta{
		order: 1;
		margin-top: 4rem;
	}

	.pipe__chart{
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 2rem;
		width: 100%;
		margin: 0.4rem 0rem 0rem;
	}

	.pipe__lead {
    margin-top: 0.4rem;
	}

	    .pipe__cta {
 margin-top: 0.4rem;
    }

	.pipe__chart .pipe__card:nth-child(odd){
		margin-left: 0rem;
	}

	.pipe__card{
		width: auto;
		padding: 2.2rem;
	}

	.pipe__card::before{
		clip-path: polygon(0rem 1.76rem, 0.0748rem 1.535rem, 0.1653rem 1.322rem, 1.2412rem 0.162rem, 1.4178rem 0.063rem, 1.5978rem 0rem, calc(100% - 1.5978rem) 0rem, calc(100% - 1.4178rem) 0.063rem, calc(100% - 1.2412rem) 0.162rem, calc(100% - 0.1653rem) 1.322rem, calc(100% - 0.0748rem) 1.535rem, 100% 1.76rem, 100% calc(100% - 1.76rem), calc(100% - 0.0748rem) calc(100% - 1.535rem), calc(100% - 0.1653rem) calc(100% - 1.322rem), calc(100% - 1.2412rem) calc(100% - 0.162rem), calc(100% - 1.4178rem) calc(100% - 0.063rem), calc(100% - 1.5978rem) 100%, 1.5978rem 100%, 1.4178rem calc(100% - 0.063rem), 1.2412rem calc(100% - 0.162rem), 0.1653rem calc(100% - 1.322rem), 0.0748rem calc(100% - 1.535rem), 0rem calc(100% - 1.76rem));
	}

	.pipe__card::after{
		background-image: url(../img/3d-chapters/pipeline-768.png);
	}

	.pipe__name{
		max-width: none;
	}

	.pipe__name br{
		display: inline;
	}

	.pipe__card .pipe__aim,
	.pipe__link{
		display: none;
	}

	.pipe__aim--solo{
		position: static;
		display: block;
		grid-row: 1;
		grid-column: 3;
		place-self: center;
	}
}

@media (max-width: 480px) {
	.pipe__chart{
		position: relative;
		grid-template-columns: 1fr;
		gap: 1rem;
		padding-right: 6.6rem;
	}

	.pipe__inner {
    gap: 1.6rem;
}

	.pipe__card{
		height: 10.4rem;
		padding: 1.6rem 2.2rem;
	}

	.pipe__card::before{
		clip-path:   polygon(
    6% 0,
    94% 0,
    100% 14%,
    100% 86%,
    94% 100%,
    6% 100%,
    0 86%,
    0 14%
  );
	}

	.pipe__card::after{
		background-image: url(../img/3d-chapters/pipeline-480.png);
	}

	.pipe__aim--solo{
		position: absolute;
		top: 0rem;
		right: -0rem;
		left: auto;
		grid-row: auto;
		grid-column: auto;
		place-self: auto;
	}

	.pipe__bar{
		position: absolute;
		display: block;
		top: 3.5rem;
		right: 1.5rem;
		bottom: 0rem;
		width: 0.2rem;
		background-color: var(--bg-white-10);
	}

	.pipe__bar::after{
		content: "";
		position: absolute;
		top: 0rem;
		left: 0rem;
		right: 0rem;
		height: calc(var(--pipe-progress, 0) * 100%);
		background-color: var(--bg-orange);
	}

	.pipe__aim {
    width: 3.2rem;
    height: 3.2rem;
}
}

/* ========== skill ========== */

.skill__grid{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 2rem;
}

.skill__title{
	grid-column: 1 / -1;
	max-width: 90rem;
	margin-bottom: 6rem;
}

.skill__group{
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: subgrid;
}

.skill__group + .skill__group{
	margin-top: 6rem;
}

.skill__label{
	grid-column: 1;
	color: var(--text-white-75);
}

.skill__viewport{
	grid-column: 2 / -1;
}

.skill__tiles{
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
}

.skill__tile{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 21.5rem;
	height: 21.5rem;
	padding: 1.5rem;
}

.skill__tile::before{
	content: "";
	position: absolute;
	inset: 0rem;
	background-color: var(--bg-white-10);
	-webkit-backdrop-filter: blur(0.42rem);
	backdrop-filter: blur(0.42rem);
	clip-path: polygon(0rem 1.749rem, 0.046rem 1.519rem, 0.176rem 1.324rem, 1.324rem 0.176rem, 1.519rem 0.046rem, 1.749rem 0rem, calc(100% - 1.749rem) 0rem, calc(100% - 1.519rem) 0.046rem, calc(100% - 1.324rem) 0.176rem, calc(100% - 0.176rem) 1.324rem, calc(100% - 0.046rem) 1.519rem, 100% 1.749rem, 100% calc(100% - 1.749rem), calc(100% - 0.046rem) calc(100% - 1.519rem), calc(100% - 0.176rem) calc(100% - 1.324rem), calc(100% - 1.324rem) calc(100% - 0.176rem), calc(100% - 1.519rem) calc(100% - 0.046rem), calc(100% - 1.749rem) 100%, 1.749rem 100%, 1.519rem calc(100% - 0.046rem), 1.324rem calc(100% - 0.176rem), 0.176rem calc(100% - 1.324rem), 0.046rem calc(100% - 1.519rem), 0rem calc(100% - 1.749rem));
}

.skill__tile::after{
	content: "";
	position: absolute;
	inset: 0rem;
	pointer-events: none;
	background-image: url(../img/3d-chapters/border-skill.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.skill__tile img{
	position: relative;
	display: block;
	width: calc(var(--logo-w, 12rem) * var(--logo-scale, 1));
	max-width: calc(17rem * var(--logo-scale, 1));
	height: auto;
	max-height: calc(14rem * var(--logo-scale, 1));
	object-fit: contain;
}

.skill__note{
	position: relative;
	text-align: center;
	color: var(--text-white-75);
}

@media (max-width: 1366px) {
	.skill{
		--logo-scale: 0.679;
	}

	.skill__title{
		margin-bottom:4rem;
	}

	.skill__group + .skill__group{
		margin-top: 3rem;
	}

	.skill__tile{
		width: 14.6rem;
		height: 14.6rem;
		padding: 1.4rem;
	}

	.skill__tile::before{
		clip-path: polygon(0rem 1.1877rem, 0.0312rem 1.0315rem, 0.1195rem 0.8991rem, 0.8991rem 0.1195rem, 1.0315rem 0.0312rem, 1.1877rem 0rem, calc(100% - 1.1877rem) 0rem, calc(100% - 1.0315rem) 0.0312rem, calc(100% - 0.8991rem) 0.1195rem, calc(100% - 0.1195rem) 0.8991rem, calc(100% - 0.0312rem) 1.0315rem, 100% 1.1877rem, 100% calc(100% - 1.1877rem), calc(100% - 0.0312rem) calc(100% - 1.0315rem), calc(100% - 0.1195rem) calc(100% - 0.8991rem), calc(100% - 0.8991rem) calc(100% - 0.1195rem), calc(100% - 1.0315rem) calc(100% - 0.0312rem), calc(100% - 1.1877rem) 100%, 1.1877rem 100%, 1.0315rem calc(100% - 0.0312rem), 0.8991rem calc(100% - 0.1195rem), 0.1195rem calc(100% - 0.8991rem), 0.0312rem calc(100% - 1.0315rem), 0rem calc(100% - 1.1877rem));
	}

}

@media (max-width: 1024px) {
	.skill__title{
		margin-bottom: 4rem;
	}

	.skill__group{
		display: block;
	}

	.skill__group + .skill__group{
		margin-top: 4.8rem;
	}

	.skill__label{
		padding-top: 0rem;
	}

	.skill__viewport{
		margin-top: 2.4rem;
	}
}

@media (max-width: 768px) {
	.skill__grid{
		display: block;
	}

	.skill__title{
		margin: 0rem auto 2.4rem;
		text-align: center;
	}

	.skill__label{
		color: var(--text-white);
		display: block;
		text-align: center;
	}

	.skill__group + .skill__group{
		margin-top: 2.4rem;
	}

	.skill__viewport{
		overflow: hidden;
		margin: 2.4rem calc(var(--wrapper-padding) * -1) 0rem;
	}

	.skill__track{
		display: flex;
		justify-content: center;
		gap: 6rem;
	}

	.skill__group.is-marquee .skill__track{
		justify-content: flex-start;
		width: max-content;
	}

	.skill__tiles{
		flex-wrap: nowrap;
		flex-shrink: 0;
		align-items: center;
		gap: 2.4rem;
	}

	.skill__tile{
		flex-shrink: 0;
		width: auto;
		height: auto;
		padding: 0rem;
	}

	.skill__tile::before,
	.skill__tile::after{
		display: none;
	}

	.skill__note{
		width: 12rem;
	}

	.skill__track{
	gap: 2.4rem;
}

.skill__viewport{
	margin-top: 1.6rem;
}
}

/* ========== studio ========== */

.studio__title{
	text-align: center;
}

.studio__lead{
	max-width: 46rem;
	margin: 4rem auto 0rem;
	text-align: center;
	color: var(--text-white-60);
}

.studio .partners{
	margin-top: 5.1rem;
}

@media (max-width: 1024px) {
	.studio__lead{
		margin-top: 3.2rem;
	}

	.studio .partners{
		margin-top: 4rem;
	}
}

@media (max-width: 768px) {
	.studio__lead{
		margin-top: 2.4rem;
	}

	.studio .partners{
		margin-top: 3.2rem;
	}
}

@media (max-width: 480px) {
	.studio__title br{
		display: none;
	}

	.studio__lead{
		margin-top: 1.6rem;
	}

	.studio .partners{
		margin-top: 2.4rem;
	}
}

/* ========== error ========== */

section.error{
	position: relative;
	height: 100vh;
	padding: 0rem;
	overflow: hidden;
}

.error__bg{
	position: absolute;
	inset: 0rem;
	display: block;
}

.error__bg img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.error__inner{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	height: 100%;
	padding-top: 17rem;
	padding-bottom: 8rem;
	text-align: center;
}

.error__text{
	max-width: 38rem;
	margin-top: auto;
	color: var(--text-white-75);
}

.error__cta{
	margin-top: 3.2rem;
}

@media (max-width: 768px) {
	.error__inner{
		padding-top: 15rem;
		padding-bottom: 6rem;
	}

	
.error__cta{
	margin-top: 1.6rem;
}
}

@media (max-width: 480px) {
	.error__title{
		font-size: 3rem;
	}

		.error__inner{
		padding-top: 10rem;
	}
}

/* ========== policy ========== */

section.policy{
	padding-top: 28rem;
}

.policy__part{
	margin-top:4rem;
}

.policy__part:first-of-type{
	margin-top: 6rem;
}

.policy__head{
	margin-bottom: 4rem;
}

.policy__body{
	display: flex;
	flex-direction: column;
	margin-left: calc(8.333% + 0.167rem);
	max-width: calc(41.667% - 1.167rem);
	color: var(--text-white-75);
}

.policy__body > * + *{
	margin-top: 2.4rem;
}

.policy__body > p + .policy__list,
.policy__body > .policy__list + p{
	margin-top: 0rem;
}

.policy__body > * + .policy__sub{
	margin-top: 2.4rem;
}

.policy__body > .policy__sub + *{
	margin-top: 1rem;
}

.policy__body > * + .policy__note{
	margin-top: 1.2rem;
}

.policy__body > .policy__note + *{
	margin-top: 1.4rem;
}

.policy__sub,
.policy__note{
	color: var(--text-white);
}

.policy__list{
	padding-left: 1.3rem;
	list-style: none;
}

.policy__list li{
	position: relative;
	padding-left: 1.4rem;
}

.policy__list li::before{
	content: "";
	position: absolute;
	top: 1rem;
	left: 0rem;
	width: 0.3rem;
	height: 0.3rem;
	border-radius: 50%;
	background-color: currentColor;
}

.policy__link{
	color: var(--text-orange);
	transition: opacity 0.25s ease 0s;
}

.policy__link:hover{
	opacity: 0.7;
}

.section-test{
	height: 100vh;
	border-top: 0.1rem solid var(--stroke-white-10);
}

html:has(.preloader:not(.is-hidden)){
	overflow: hidden;
}

.together__stat--countries{
	padding-left: 6rem;
	text-align: left;
}

.together__stat--titles .together__label{
	max-width: 19rem;
}

/* ========== preloader ========== */

.preloader{
	position: fixed;
	z-index: 2000;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
	background-color: var(--bg-black);
	clip-path: inset(0 0 0 0);
	transition: clip-path 1.1s cubic-bezier(0.65, 0, 0.35, 1);
}

.preloader.is-hidden{
	pointer-events: none;
	clip-path: inset(0 0 100% 0);
}

.preloader__defs{
	position: absolute;
	width: 0;
	height: 0;
}

.preloader__logo{
	position: relative;
	width: 24.8rem;
}

.preloader__logo img{
	display: block;
	width: 100%;
	height: auto;
	opacity: 0;
}

.preloader__logo.is-shown img{
	opacity: 1;
}

.preloader__tiles{
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.preloader__tiles canvas{
	display: block;
}

.preloader__bottom{
	position: absolute;
	left: 3rem;
	right: 3rem;
	bottom: 4rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1.7rem;
}

.preloader__status{
	color: var(--text-white-75);
	animation: preloaderBlink 1.8s ease-in-out infinite;
}

@keyframes preloaderBlink{
	0%{
		opacity: 1;
	}

	50%{
		opacity: 0.2;
	}

	100%{
		opacity: 1;
	}
}

.preloader__bar{
	display: flex;
	align-items: center;
	gap: 2rem;
	width: 100%;
	overflow: hidden;
}

.preloader__bracket{
	flex-shrink: 0;
	width: 1.6rem;
	height: 5.8rem;
	color: var(--text-orange);
	fill: currentColor;
}

.preloader__cells{
	display: flex;
	flex-grow: 1;
	min-width: 0;
	justify-content: space-between;
	gap: 1rem;
}

.preloader__cell{
	flex-shrink: 0;
	width: 1.2rem;
	height: 1.2rem;
	border-radius: 0.2rem;
	background-color: var(--bg-white-10);
	transition: background-color 0.2s ease 0s;
}

.preloader__cell.is-on{
	background-color: var(--bg-orange);
}

@media (max-width: 1366px) {
	.preloader__logo{
		width: 23.4rem;
	}

	.preloader__bracket{
		width: 1.2rem;
		height: 4.4rem;
	}

	.preloader__bottom{
		bottom: 3.3rem;
	}
}

@media (max-width: 1366px) {
	.news {
    bottom: 5rem;
}

.steps__text::before {
    width: 0.8rem;
    height: 0.8rem;
}
}

/* ========== ruler ========== */

.ruler{
	position: fixed;
	z-index: 90;
	top: 50%;
	right: 3rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2.4rem;
	width: 4.8rem;
	translate: 0 -60%;
	color: var(--stroke-white-20);
	pointer-events: none;
}

.ruler__marks{
	flex-shrink: 0;
	width: 2.8rem;
	height: 11.2rem;
	fill: currentColor;
}

.ruler__num{
	font-family: var(--font-family);
	font-size: 1.4rem;
	line-height: 1;
	font-weight: 400;
	letter-spacing: -0.084rem;
	color: rgba(255, 255, 255, 0.20);
}

.ruler__num b{
	letter-spacing: -0.024rem;
}

@media (max-width: 1024px) {
	.ruler{
		display: none;
	}
}

/* ========== news ========== */

.news{
	--news-cut: 1.5rem;
	position: absolute;
	z-index: 3;
	right: 3rem;
	bottom: 7rem;
	display: flex;
	flex-direction: column;
	width: 29.3rem;
	height: 29.3rem;
	padding: 1.6rem;
	color: var(--text-white);
}

.news::before,
.news::after{
	content: '';
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.news::before{
	background-color: var(--bg-white-10);
	-webkit-backdrop-filter: blur(0.42rem);
	backdrop-filter: blur(0.42rem);
	clip-path: polygon(
		var(--news-cut) 0,
		calc(100% - var(--news-cut)) 0,
		100% var(--news-cut),
		100% calc(100% - var(--news-cut)),
		calc(100% - var(--news-cut)) 100%,
		var(--news-cut) 100%,
		0 calc(100% - var(--news-cut)),
		0 var(--news-cut)
	);
}

.news::after{
	border: 2rem solid transparent;
	border-image: url(../img/icons/border-card.png) 40 stretch;
}

.news__slides{
	position: relative;
	flex-grow: 1;
}

.news__slide{
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	opacity: 0;
	visibility: hidden;
}

.news__slide.is-active,
.news__slide.is-leaving{
	opacity: 1;
	visibility: visible;
}

.news__slide.is-active{
	z-index: 1;
}

.news__slide.is-leaving{
	z-index: 2;
	pointer-events: none;
}

.news__top{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

.news__date{
	font-size: 1.4rem;
	line-height: 1;
	letter-spacing: -0.084em;
	text-transform: uppercase;
	color: var(--text-white-75);
}

.news__read{
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.032em;
	text-transform: uppercase;
	transition: color 0.25s ease 0s;
}

.news__read:hover{
	color: var(--text-orange);
}

.news__title{
	margin-top: 2.4rem;
	font-family: var(--font-family);
	font-weight: 400;
	max-width: 24rem;
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.032em;
	text-transform: uppercase;
}

.news__media{
	--media-cut: 1.2rem;
	position: relative;
	display: block;
	margin-top: 1.2rem;
	height: 12rem;
	overflow: hidden;
	clip-path: polygon(
		var(--media-cut) 0,
		calc(100% - var(--media-cut)) 0,
		100% var(--media-cut),
		100% calc(100% - var(--media-cut)),
		calc(100% - var(--media-cut)) 100%,
		var(--media-cut) 100%,
		0 calc(100% - var(--media-cut)),
		0 var(--media-cut)
	);
}

.news__media-frame{
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

.news__media img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top;
}

.news__nav{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-top: auto;
	padding-top: 1rem;
}

.news__arrow{
	display: flex;
	align-items: center;
	color: var(--text-white);
	transition: color 0.25s ease 0s;
}

.news__arrow:hover{
	color: var(--text-orange);
}

.news__arrow--prev .icon{
	scale: -1 1;
}

.news__counter{
	font-size: 1.4rem;
	line-height: 1;
	letter-spacing: -0.084em;
	color: var(--text-white-75);
}

.news__counter b{
	font-weight: 400;
	color: var(--text-white);
}

@media (max-width: 1366px) {
	.news__date{
		font-size: 1.2rem;
	}

	.news__read{
		font-size: 1.4rem;
	}

	.news__title{
		max-width: 19rem;
		font-size: 1.4rem;
	}

	.news__counter{
		font-size: 1.2rem;
	}
}

@media (max-width: 768px) {
	.news{
		right: var(--wrapper-padding);
		bottom: 3rem;
		width: 25.6rem;
		height: 27.4rem;
	}
}

@media (max-width: 480px) {
	.news{
		top: calc(100% + 3rem);
		right: var(--wrapper-padding);
		bottom: auto;
		left: var(--wrapper-padding);
		width: auto;
		height: 24rem;
	}

	.news__title{
		max-width: none;
	}

	.news__media{
		height: 13rem;
	}

	.news__nav{
		position: absolute;
		top: calc(100% + 2.4rem);
		right: 0;
		left: 0;
		margin-top: 0;
		padding-top: 0;
	}
}

/* ========== modal ========== */

.modal{
	position: fixed;
	z-index: 300;
	inset: 0;
	visibility: hidden;
	pointer-events: none;
}

.modal.popup-active{
	visibility: visible;
	pointer-events: auto;
}

.modal__fade{
	position: absolute;
	inset: 0;
	background-color: var(--bg-black-30);
	-webkit-backdrop-filter: blur(0.55rem);
	backdrop-filter: blur(0.55rem);
	opacity: 0;
	transition: opacity 0.5s ease 0s;
}

.modal.pp-animate .modal__fade{
	opacity: 1;
}

.modal__body{
	position: absolute;
	top: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	width: 79.3rem;
	height: 100%;
	background: var(--bg-black);
	translate: 100% 0;
	transition: translate 0.6s cubic-bezier(0.65, 0, 0.35, 1) 0s;
}

.modal__scroll{
	flex-grow: 1;
	min-height: 0;
	padding: 11rem 3rem;
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-width: none;
}

.modal__scroll::-webkit-scrollbar{
	width: 0;
	height: 0;
	display: none;
}

.modal.pp-animate .modal__body{
	translate: 0 0;
}

.modal.pp-unanimate .modal__body{
	translate: 100% 0;
}

.modal__close,
.burger-menu__close{
	--close-cut: 1rem;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 4rem;
	height: 4rem;
	color: var(--text-black);
	background-color: var(--stroke-black-20);
	clip-path: polygon(
		var(--close-cut) 0,
		calc(100% - var(--close-cut)) 0,
		100% var(--close-cut),
		100% calc(100% - var(--close-cut)),
		calc(100% - var(--close-cut)) 100%,
		var(--close-cut) 100%,
		0 calc(100% - var(--close-cut)),
		0 var(--close-cut)
	);
}

.modal__close .icon,
.burger-menu__close .icon{
	position: relative;
}

.modal__close{
	position: absolute;
	top: 3.2rem;
	right: 3.2rem;
}

.modal__close::before,
.burger-menu__close::before{
	content: "";
	position: absolute;
	inset: 0.1rem;
	background-color: var(--bg-white);
	clip-path: polygon(
		calc(var(--close-cut) - 0.1rem) 0,
		calc(100% - var(--close-cut) + 0.1rem) 0,
		100% calc(var(--close-cut) - 0.1rem),
		100% calc(100% - var(--close-cut) + 0.1rem),
		calc(100% - var(--close-cut) + 0.1rem) 100%,
		calc(var(--close-cut) - 0.1rem) 100%,
		0 calc(100% - var(--close-cut) + 0.1rem),
		0 calc(var(--close-cut) - 0.1rem)
	);
	transition: background-color 0.25s ease 0s;
}

.modal__close:hover::before,
.burger-menu__close:hover::before{
	background-color: var(--theme-color);
}

.modal__title{
	margin-bottom: 4.2rem;
}

.modal__title--join{
	margin-top: 8rem;
}

.vacancy{
	display: flex;
	flex-direction: column;
	gap: 2.4rem;
	margin-bottom: 4rem;
}

.vacancy__row{
	display: flex;
	gap: 2rem;
}

.vacancy__label{
	flex-shrink: 0;
	width: 24rem;
	color: var(--text-orange);
}

.vacancy__body{
	flex-grow: 1;
	min-width: 0;
}

.vacancy__list{
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	gap: 1.6rem;
	min-width: 0;
	list-style: none;
}

.vacancy__list li{
	position: relative;
	padding-left: 2rem;
}

.vacancy__list li::before{
	content: "";
	position: absolute;
	top: 0.8rem;
	left: 0;
	border-radius: 0.2rem;
	border: 0.1rem solid var(--stroke-orange);
	width: 0.8rem;
	height: 0.8rem;
}

.modal .vacancy{
	color: var(--text-white-75);
}

@media (max-width: 768px) {
	.modal__body{
		width: 100%;
	}

	.vacancy{
		gap: 4rem;
	}

	.vacancy__row{
		flex-direction: column;
		gap: 1.6rem;
	}

	.vacancy__label{
		width: auto;
	}

	.modal__title--join{
		margin-top: 6rem;
	}
}

@media (max-width: 480px) {
	.vacancy{
		gap: 3.2rem;
	}

	.vacancy__row{
		gap: 1.2rem;
	}

	.vacancy__list{
		gap: 1.2rem;
	}

	.form__row{
		flex-direction: column;
	}

	.modal__title--join{
		margin-top: 4.8rem;
	}
}

.modal__lead,
.burger-menu__lead{
	position: relative;
	max-width: 33.5rem;
	margin-bottom: 6rem;
	padding-left: 2.4rem;
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.032em;
	text-transform: uppercase;
	color: var(--text-white-75);
}

.modal__lead::before,
.burger-menu__lead::before{
	content: "";
	position: absolute;
	left: 0;
	border-radius: 0.2rem;
	top: 0.6rem;
	width: 1.2rem;
	height: 1.2rem;
	background-color: var(--bg-orange);
}

@media (max-width: 1024px) {
	.burger-menu{
		display: block;
		position: fixed;
		top: 0;
		right: 0;
		width: 100%;
		height: 100%;
		background-color: var(--background-color);
		z-index: 200;
		overflow: auto;
		transition: translate 0.8s ease 0s;
		translate: 100% 0%;
	}

	.burger-menu .burger-menu__label{
		font-size: 1.4rem;
	}

	body.menu-open .burger-menu{
		translate: 0px 0px;
	}

	.burger-menu::-webkit-scrollbar{
		display: none;
	}

	.burger-menu__inner{
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 8rem;
		min-height: 100%;
		padding: 3rem var(--wrapper-padding) 6rem;
	}

	.burger-menu__group--main .burger-menu__list{
		display: flex;
		justify-content: space-between;
		gap: 1.6rem;
	}

	.burger-menu__top{
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 3rem;
		width: 100%;
	}

	.burger-menu__group{
		width: 100%;
	}

	.burger-menu__label{
		display: block;
		margin-bottom: 2.4rem;
		font-family: var(--second-family);
		font-weight: 700;
		font-size: 2.4rem;
		line-height: 0.95;
		letter-spacing: -0.02em;
		text-transform: uppercase;
		color: var(--text-white);
	}

	.burger-menu__group--main .burger-menu__label{
		display: none;
	}

	.burger-menu__list{
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(6, auto);
		grid-auto-flow: column;
		gap: 1.6rem 1.6rem;
	}

	.burger-menu__group--main .burger-menu__list{
		grid-template-columns: repeat(4, 1fr);
		grid-template-rows: auto;
	}

	.burger-menu__link{
		display: inline-flex;
		gap: 0.8rem;
		font-size: 1.4rem;
		line-height: 1.3;
		letter-spacing: -0.038rem;
		text-transform: uppercase;
		color: var(--text-white);
		transition: color 0.25s ease 0s;
	}

	.burger-menu__link::before{
		content: "[";
	}

	.burger-menu__link::after{
		content: "]";
	}

	.burger-menu__link:hover{
		color: var(--text-orange);
	}

	.burger-menu__talk{
		width: 100%;
	}

	.burger-menu .burger-menu__lead {
		font-size: 1.4rem;
		padding-left: 1.8rem;
		margin-bottom: 2.4rem;
	}

	.burger-menu .burger-menu__lead::before {
    top: 0.5rem;
    width: 0.8rem;
    height: 0.8rem;
}

	.burger-menu__title{
		margin-bottom: 2.4rem;
	}

	.ask .loc__label {
    margin-top: 0rem;
}
}

@media (max-width: 480px) {
	.burger-menu__list{
		gap: 1.2rem;
	}

	.burger-menu__inner{
		gap: 4rem;
	}

	.burger-menu__top{
		order: 1;
	}

	.burger-menu__group--services{
		order: 2;
	}

	.burger-menu__group--main{
		order: 3;
	}

	.burger-menu__talk{
		order: 4;
	}

	.burger-menu__label,
	.burger-menu__group--main .burger-menu__label{
		display: flex;
		gap: 0.8rem;
		margin-bottom: 1.6rem;
		font-family: var(--font-family);
		font-weight: 400;
		font-size: 1.4rem;
		line-height: 1.3;
		letter-spacing: -0.028rem;
		color: var(--text-white-60);
	}

	.burger-menu__label::before{
		content: "[";
	}

	.burger-menu__label::after{
		content: "]";
	}

	.burger-menu__group--main .burger-menu__list{
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(3, auto);
	}

	.burger-menu__link{
		gap: 0;
		font-size: 1.4rem;
	}

	.burger-menu__link::before,
	.burger-menu__link::after{
		content: none;
	}

	    .steps__body {
        margin-top: 2rem;
    }
}

/* ========== form ========== */

.form{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 2rem;
	width: 73.3rem;
	max-width: 100%;
}

.form__row{
	display: flex;
	gap: 2rem;
	width: 100%;
}

/* ========== field ========== */

.field{
	--field-cut-x: 1.6rem;
	--field-cut-y: 1.5rem;
	position: relative;
	display: block;
	flex-grow: 1;
	height: 8.1rem;
}

.field::before,
.field::after{
	content: '';
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.field::before{
	background-color: var(--bg-white-10);
	clip-path: polygon(
		var(--field-cut-x) 0,
		calc(100% - var(--field-cut-x)) 0,
		100% var(--field-cut-y),
		100% calc(100% - var(--field-cut-y)),
		calc(100% - var(--field-cut-x)) 100%,
		var(--field-cut-x) 100%,
		0 calc(100% - var(--field-cut-y)),
		0 var(--field-cut-y)
	);
	-webkit-backdrop-filter: blur(0.4rem);
	backdrop-filter: blur(0.4rem);
}

.field::after{
	border: 2rem solid transparent;
	border-image: url(../img/icons/border.png) 40 stretch;
}

.field--wide{
	width: 100%;
}

.field--area{
	width: 100%;
	height: 20rem;
}

.field--area::after{
	border-image-source: url(../img/icons/border-textarea.png);
}

.field__control{
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	padding: 0 3rem;
	-webkit-appearance: none;
	appearance: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	font-family: var(--font-family);
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.032rem;
	text-transform: uppercase;
	color: var(--text-white);
	background-color: transparent;
	resize: none;
}

.all{
	overflow: visible;
}

.field--area .field__control{
	padding: 3rem;
}

.field__control::placeholder{
	color: var(--text-white-60);
}

.field__control:-webkit-autofill,
.field__control:-webkit-autofill:hover,
.field__control:-webkit-autofill:focus,
.field__control:-webkit-autofill:active{
	-webkit-text-fill-color: var(--text-white);
	caret-color: var(--text-white);
	transition: background-color 100000s ease 0s, color 100000s ease 0s;
}

.field__control:autofill{
	-webkit-text-fill-color: var(--text-white);
	caret-color: var(--text-white);
	transition: background-color 100000s ease 0s, color 100000s ease 0s;
}

@media (max-width: 1366px) {
	.field{
		height: 6rem;
	}

	.field--area{
		height: 16rem;
	}

	.field__control{
		padding: 0rem 2rem;
		font-size: 1.4rem;
	}

	.field--area .field__control{
		padding: 3rem 2rem;
	}
}

@media (max-width: 768px) {
	.field--area .field__control {
    padding: 1.6rem;
}

	.field--area {
    height: 12rem;
}

	.field:not(.field--area){
		--field-cut-x: 1.4rem;
		height: 5rem;
	}

	.field::after{
			opacity: 0.7;
		border-image-source: url(../img/icons/border-mobile-2x.png);
	}

	.field__control{
		font-size: 1.4rem;
		padding: 0 1.6rem;
	}
}

/* ========== checkbox ========== */

.checkbox{
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	margin-top: 0.5rem;
	cursor: pointer;
}

.modal .checkbox{
	margin-top: -0.4rem;
}

.chars{
	overflow: hidden;
}

@media (max-width: 1366px) {
	.modal__lead{
	padding-left: 1.8rem;
	font-size: 1.4rem;
}

.chars__lead {
    margin-top: 2.4rem;
}

	.modal__lead::before {
    top: 0.6rem;
    width: 0.8rem;
    height: 0.8rem;
}

	.modal__lead {
    margin-bottom: 6rem;
}

	.modal .checkbox {
    margin-top: -0.2rem;
}

.game__hero {
    width: 37.8rem;
}

.policy__part:first-of-type{
	margin-top: 4rem;
}

.game__hero--left {
    left: 5.6rem;
}
	.game__hero--right {
    right: 1.6rem;
	      width: 31.3rem;
}

.game__skip {
    font-size: 1.4rem;
}

.footer {
    padding: var(--section-margin) 0rem 1.3rem;
}

.footer__label{
	margin-bottom: 2.4rem;
	font-size: 1.4rem;
}

.footer__bottom{
	margin-top: 1.3rem;
}

.footer__link {
	font-size: 1.4rem;
}

.game__title {
    margin-bottom: 4rem;
}

.modal__body{
	width: 67.3rem;
}
}

@media (max-width: 1024px) {
	.modal__lead {
    margin-bottom: 3.2rem;
}

.footer__top{
	flex-direction: column;
	display: flex;
}
}

@media (max-width: 768px) {
	.modal__body{
		width: 100%;
		max-width: 100%;
	}

	.policy__part {
    margin-top: 2.4rem;
}

    .policy__part {
        margin-bottom: 2.4rem;
    }

	.policy__part:first-of-type{
	margin-top: 2.4rem;
}

	.modal__lead{
		margin-bottom: 2.4rem;
}

.game__hud{
	left: 1.6rem;
	right: 1.6rem;
}
}

@media (max-width: 480px) {
	.modal__title {
    margin-bottom: 1.6rem;
}

	.modal__scroll {
    padding: 11rem 2rem 5rem 2rem;
}
}

.checkbox__control{
	position: absolute;
	width: 0.1rem;
	height: 0.1rem;
	opacity: 0;
}

.checkbox__box{
	position: relative;
	flex-shrink: 0;
	width: 1.2rem;
	height: 1.2rem;
	margin-top: 0.45rem;
	border-radius: 0.2rem;
	border: 0.1rem solid var(--stroke-white-50);
	transition: background-color 0.2s ease 0s, border-color 0.2s ease 0s;
}

.checkbox__control:checked + .checkbox__box{
	background-color: var(--bg-orange);
	border-color: var(--stroke-orange);
}

.checkbox__control:focus-visible + .checkbox__box{
	outline: 0.2rem solid var(--stroke-orange);
	outline-offset: 0.2rem;
}

.checkbox__text{
	font-size: 1.6rem;
	line-height: 1.3;
	letter-spacing: -0.032em;
	text-transform: uppercase;
	color: var(--text-white-75);
}

@media (max-width: 1366px) {
	.checkbox__text {
    font-size: 1.4rem;
}

	.checkbox__box {
    margin-top: 0.25rem;
}

.policy__body{
	margin-left: 15.7rem;
	max-width: 76.3rem;
}

section.policy {
    padding-top: 15rem;
}

.policy__head {
    margin-bottom: 3.2rem;
}

.policy__part {
      margin-bottom: 3.2rem;
}

.policy__body > * + .policy__sub {
    margin-top: 1.6rem;
}
}

.form .button-white{
	margin-top: 1.2rem;
}

.all{
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.policy{
	overflow: hidden;
}

@media (max-width: 1024px) {
	.game__hero{
		display: none;
	}

	.policy__body{
	margin-left: 10.7rem;
	max-width: 76.3rem;
}

section.policy {
    padding-top: 15rem;
}

	    .together__block--titles {
        margin-top: 21.9rem;
    }
}
@media (max-width: 768px) {
	.form .button-white {
    margin-top: 0rem;
}

	.policy__part {
    margin-top: 2.4rem;
}

    .policy__head {
        margin-bottom: 1.6rem;
    }

.policy__body > .policy__sub + * {
    margin-top: 1.2rem;
}

    .policy__part {
        margin-bottom: 2.4rem;
    }

.policy__body{
	margin-left: 0rem;
	max-width: 100%;
}

.policy__title{
	text-align: center;
	margin-bottom: 0rem;
}

.policy__part{
	margin-left: auto;
	margin-right: auto;
	max-width: 46.6rem;
}

section.policy {
    padding-top: 12rem;
}
}

@media (max-width: 480px) {
	.form__row{
		gap: 1.6rem;
	}

	.policy__part{
		max-width: 100%;
	}

	.all{
	overflow: hidden;
}

	.form{
		gap: 1.6rem;
	}

	.form__row{
		flex-direction: column;
	}
}

@media (max-width: 1366px) {
	body::before {
		display: none;
	}

}

@media (max-width: 480px) {
	:root{
		--wrapper-padding: 2rem;
	}

	.ask     .loc__label {
        display: block;
    }

	    .footer__label {
        margin-bottom: 0rem;
    }

	.footer__menu{
		row-gap: 1.6rem;
	}

	    .chars__lead {
        margin-top: 1.6rem;
    }

}

/* ========== mobile paint ========== */

@media (max-width: 768px) {
	.loc::before,
	.way::before,
	.news::before,
	.field::before,
	.game__skip,
	.modal-cookie__body{
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}
}




a > [data-scramble-hover],
button > [data-scramble-hover],
label > [data-scramble-hover]{
	pointer-events: none;
}

.folio__media{
	position: relative;
}

.folio__shot,
.folio__video{
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.folio__shot--alt{
	opacity: 0;
}

.folio__shot--base{
	z-index: 1;
}

.folio__media.is-live .folio__shot--alt{
	opacity: 1;
}

.folio__media.is-live .folio__shot--base{
	opacity: 0;
}

.folio__video{
	pointer-events: none;
}

.folio__tiles{
	--cols: 52;
	--rows: 30;
	position: absolute;
	z-index: 2;
	inset: 0;
	pointer-events: none;
}

.folio__tiles canvas{
	display: block;
}

.folio__slide--fit .folio__shot,
.folio__slide--fit .folio__video{
	object-fit: contain;
	object-position: right center;
}

@media (max-width: 768px) {
	.folio__tiles{
		--cols: 34;
		--rows: 20;
	}
}

@media (max-width: 480px) {
	.folio__tiles{
		--cols: 26;
		--rows: 15;
	}
}