body {
	background: var(--color-black);
	color: var(--color-white);
	font-family: 'Mark Pro', sans-serif;
	font-weight: 400;
}

::-moz-selection {
	color: var(--color-white);
	background:  var(--color-black);
	text-shadow: none;
}

::selection {
	color: var(--color-white);
	background:  var(--color-black);
	text-shadow: none;
}

.flak {
	font-family: 'Flak';
	font-weight: 400;
	line-height: 1;
	text-transform: uppercase;
}

.section--black {
	background: var(--color-black);
	color: var(--color-white);
}

.section--black svg {
	fill: var(--color-white);
}

.section--red {
	background: var(--color-red);
	color: var(--color-black);
}

.section--beige {
	background: var(--color-beige);
	color: var(--color-black);
}

.section--yellow {
	background: var(--color-yellow);
	color: var(--color-black);
}

.section--orange {
	background: var(--color-orange);
	color: var(--color-black);
}

.section--red svg,
.section--beige svg,
.section--yellow svg {
	fill: var(--color-black);
}

.shadow {
	box-shadow: 0 0 0.119vh 0 rgba(var(--rgb-black), 0.05),
				0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
				0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
				0 0.238vh 0.238vh 0 rgba(var(--rgb-black), 0.05),
				0 0.476vh 0.476vh 0 rgba(var(--rgb-black), 0.05),
				0 0.952vh 0.952vh 0 rgba(var(--rgb-black), 0.05);
}

.drag-proxy {
	width: 0;
	height: 0;
	transform: none !important;
}

/* .lenis-scrolling .drag-proxy {
	pointer-events: none;
} */

.text__title + .text__description {
	margin-top: 3.81vh;
}

.scrollbar {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	height: 0.714vh;
	width: 100vw;
	z-index: 9;
}

.scrollbar__handle {
	background: var(--color-orange);
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
	transform: scaleX(0);
	transform-origin: left;
	transition: background-color 0.6s ease;
}

.section__step-1 .scrollbar__handle {
	background: var(--color-white);
}

.section__step-2 .scrollbar__handle {
	background: var(--color-red);
}

.section__step-4 .scrollbar__handle {
	background: var(--color-black);
}

.parallax--wrp {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden
}

.parallax--img {
	width: 150%;
	height: 100%;
	position: relative;
}

/* HEADER */

.page__header {
	box-sizing: border-box;
	display: flex;
	padding: var(--grid-margin);
	left: 0;
	justify-content: flex-end;
	pointer-events: none;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 9;
}

.header__menu {
	display: flex;
	pointer-events: auto;
}

.header__menu__item {
	font-size: 4.524vh;
	text-shadow: 0 0 0.119vh rgba(var(--rgb-black), 0.05),
	0 0.119vh 0.119vh rgba(var(--rgb-black), 0.05),
	0 0.119vh 0.119vh rgba(var(--rgb-black), 0.05),
	0 0.238vh 0.238vh rgba(var(--rgb-black), 0.05),
	0 0.476vh 0.476vh rgba(var(--rgb-black), 0.05),
	0 0.952vh 0.952vh rgba(var(--rgb-black), 0.05);
	transition: background 0.6s ease, border-color 0.6s ease, color 0.6s ease;
}

.header__btn {
	align-items: center;
	box-sizing: border-box;
	border: solid 0.238vh rgba(var(--rgb-white), 0.4);
	box-shadow: 0 0 0.119vh 0 rgba(var(--rgb-black), 0.05),
	0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
	0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
	0 0.238vh 0.238vh 0 rgba(var(--rgb-black), 0.05),
	0 0.476vh 0.476vh 0 rgba(var(--rgb-black), 0.05),
	0 0.952vh 0.952vh 0 rgba(var(--rgb-black), 0.05),
	inset 0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
	inset 0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
	inset 0 0.238vh 0.238vh 0 rgba(var(--rgb-black), 0.05),
	inset 0 0.476vh 0.476vh 0 rgba(var(--rgb-black), 0.05);
	display: flex;
	cursor: pointer;
	height: 4.762vh;
	padding: 1.19vh 0.714vh;
	margin-right: 2.857vh;
	position: relative;
	z-index: 2;
}

.header__btn__inner {
	margin-top: 0.65vh;
	padding: 0 0.476vh;
	position: relative;
}

.header__logo {
	display: none;
}

.header__navtrigger {
	display: flex;
	height: 4.762vh;
	justify-content: center;
	cursor: pointer;
	flex-direction: column;
	gap: 0.714vh;
}

.nav__line {
	background: var(--color-white);
	box-shadow: 0 0 0.119vh 0 rgba(var(--rgb-black), 0.05),
	0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
	0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
	0 0.238vh 0.238vh 0 rgba(var(--rgb-black), 0.05),
	0 0.476vh 0.476vh 0 rgba(var(--rgb-black), 0.05),
	0 0.952vh 0.952vh 0 rgba(var(--rgb-black), 0.05);
	height: 0.476vh;
	width: 5.714vh;
}

.grid__trigger {
	align-items: center;
	border: solid 0.238vh rgba(var(--rgb-white), 0.4);
	box-shadow: 0 0 0.119vh 0 rgba(var(--rgb-black), 0.05),
	0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
	0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
	0 0.238vh 0.238vh 0 rgba(var(--rgb-black), 0.05),
	0 0.476vh 0.476vh 0 rgba(var(--rgb-black), 0.05),
	0 0.952vh 0.952vh 0 rgba(var(--rgb-black), 0.05),
	inset 0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
	inset 0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
	inset 0 0.238vh 0.238vh 0 rgba(var(--rgb-black), 0.05),
	inset 0 0.476vh 0.476vh 0 rgba(var(--rgb-black), 0.05);
	box-sizing: border-box;
	cursor: pointer;
	display: flex;
	justify-content: center;
	height: 4.762vh;
	width: 4.762vh;
	pointer-events: auto;
	margin-right: 1.429vh;
}

.grid__trigger__inner {
	background: var(--color-white);
	box-shadow: 0 0 0.119vh 0 rgba(var(--rgb-black), 0.05),
	0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
	0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
	0 0.238vh 0.238vh 0 rgba(var(--rgb-black), 0.05),
	0 0.476vh 0.476vh 0 rgba(var(--rgb-black), 0.05),
	0 0.952vh 0.952vh 0 rgba(var(--rgb-black), 0.05);
	height: 2.381vh;
	width: 2.381vh;
}

.nav__line,
.grid__trigger,
.grid__trigger__inner {
	transition: border-color 0.6s ease, background-color 0.6s ease;
}

.section__intro .header__menu__item,
.section__step-3 .header__menu__item,
.section__outro .header__menu__item {
	color: var(--color-orange);
}

.section__intro .header__menu__item,
.section__intro .grid__trigger,
.section__step-3 .header__menu__item,
.section__step-3 .grid__trigger,
.section__outro .header__menu__item,
.section__outro .grid__trigger {
	border-color: var(--color-orange);
}

.section__intro .nav__line,
.section__intro .grid__trigger__inner,
.section__step-3 .nav__line,
.section__step-3 .grid__trigger__inner,
.section__outro .nav__line,
.section__outro .grid__trigger__inner {
	background: var(--color-orange);
}

.section__step-2 .header__menu__item {
	color: var(--color-red);
}

.section__step-2 .header__menu__item,
.section__step-2 .grid__trigger {
	border-color: var(--color-red);
}

.section__step-2 .nav__line,
.section__step-2 .grid__trigger__inner {
	background: var(--color-red);
}

.section__step-4 .header__menu__item {
	color: var(--color-white);
}

.section__step-4 .header__menu__item,
.section__step-4 .grid__trigger {
	border-color: var(--color-white);
}

.section__step-4 .nav__line,
.section__step-4 .grid__trigger__inner {
	background: var(--color-white);
}

/* .section__footer .header__menu__item {
	color: var(--color-black);
}

.section__footer .header__menu__item,
.section__footer .grid__trigger {
	border-color: var(--color-black);
}

.section__footer .nav__line,
.section__footer .grid__trigger__inner {
	background: var(--color-black);
} */

.percent__scrolled {
	height: 4.524vh;
	position: fixed;
	right: var(--grid-margin);
	bottom: calc(var(--grid-margin) - 1vh);
	overflow: hidden;
	z-index: 9;
}

.percent__scrolled > span {
	position: relative;
	display: block;
	transform: translate3d(0, -100%, 0);
}

.page__menu {
	background: var(--color-orange);
	height: 100%;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	visibility: hidden;
	clip-path: inset(0 0 100% 0);
	transition: clip-path 0.8s var(--transition-handle), visibility 0s 0.8s;
	will-change: clip-path;
	z-index: 10;
}

.menu__close {
	cursor: pointer;
	height: calc(calc(100vh - var(--grid-margin) * 2 - var(--grid-gutter) * 7) / 8);
	position: absolute;
	top: var(--grid-margin);
	right: var(--grid-margin);
	width: calc(calc(100vh - var(--grid-margin) * 2 - var(--grid-gutter) * 7) / 8);
}

.close__line {
	height: 0.476vh;
	position: absolute;
	left: -18%;
	top: calc(50% - 0.238vh);
	width: 134%;
}

	.close__line:before {
		background: var(--color-black);
		content: '';
		left: 0;
		height: 100%;
		position: absolute;
		transform: scaleX(0);
		transition: transform 0s 0.8s;
		width: 100%;
		top: 0;
	}
	
	.close__line:first-child:before {
		transform-origin: left;
	}
	
	.close__line:last-child:before {
		transform-origin: right;
	}

.menu--open .close__line:before {
	transform: scaleX(1);
	transition: transform 0.8s var(--mask-handle) 0.4s;
}

.close__line:first-child {
	transform: rotate(45deg);
}

.close__line:last-child {
	transform: rotate(-45deg);
}

.menu__inner {
	box-sizing: border-box;
	color: var(--color-black);
	display: flex;
	height: 100%;
	padding: var(--grid-margin);
	position: relative;
}

.menu__header {
	border-right: solid 1px var(--color-black);
	cursor: pointer;
	height: 100%;
	width: 48.69vh;
	z-index: 1;
	padding-right: var(--grid-margin);
}

.menu__header__inner {
	clip-path: inset(100% 0 0 0);
	position: relative;
	overflow: hidden;
	transition: clip-path 0s 0.8s;
}

.menu--open .menu__header__inner {
	clip-path: inset(0 0 0 0);
	transition: clip-path 0.8s var(--mask-handle) 0.3s;
}

.yourbana__iso {
	fill: var(--color-black);
	height: auto;
}

.menu__content {
	flex: 1;
	box-sizing: border-box;
	display: grid;
	grid-template-rows: repeat(8, 1fr);
	grid-template-columns: 100%;
	gap: var(--grid-gutter);
	height: 100%;
	position: relative;
	margin-left: var(--grid-margin);
	width: 100%;
}

.menu__nav {
	margin-right: calc(calc(100vh - var(--grid-margin) * 2 - var(--grid-gutter) * 7) / 8 + var(--grid-margin));
}

.menu__nav,
.main__menu {
	grid-row: 1 / 6;
}

.main__menu__item {
	cursor: pointer;
	font-size: 16.2vh;
	height: calc(16.2vh * 0.64);
	position: relative;
	white-space: nowrap;
}

.menu__item__title {
	padding: 0.75vh 0.238vh;
	width: 100%;
}

.menu__item__group {
	display: flex;
}

.main__menu__item > .menu__item__group > .mask {
	align-items: flex-start;
	display: flex;
}

.main__menu__item > .menu__item__group > .mask:last-child {
	margin-top: -2.45vh;
}

.main__menu__item .mask > span {
	transform: translate3d(0, -102%, 0);
	transition: transform 0s 0.8s;
}

.menu__item__index {
	font-size: 5.4vh;
	line-height: calc(5.4vh * 0.64);
	margin-right: var(--m-24);
	padding-top: 0.595vh;
}

.current__menu__item {
	color: var(--color-white) !important;
	transition: transform 0.8s var(--mask-handle), color 0.3s ease;
}

.menu--open .page__menu {
	visibility: visible;
	transition: clip-path 0.8s var(--transition-handle), visibility 0s;
	clip-path: inset(0 0 0 0);
}

.menu--open .scroll__container {
	opacity: 0;
}

.menu--open .main__menu__item .mask > span {
	transform: translate3d(0, 0, 0);
	transition: transform 0.8s var(--mask-handle);
}

.menu--open .main__menu__item:nth-child(1) .mask > span {
	transition-delay: 0.6s;
}

.menu--open .main__menu__item:nth-child(2) .mask > span {
	transition-delay: 0.55s;
}

.menu--open .main__menu__item:nth-child(3) .mask > span {
	transition-delay: 0.5s;
}

.menu--open .main__menu__item:nth-child(4) .mask > span {
	transition-delay: 0.45s;
}

.menu--open .main__menu__item:nth-child(5) .mask > span {
	transition-delay: 0.4s;
}

.menu__bottom {
	font-weight: 500;
	justify-content: flex-end;
	display: flex;
	flex-direction: column;
	grid-row: 8 / 9;
	width: 100%;
}

.menu__footer {
	border-top: solid 1px var(--color-black);
	display: flex;
	justify-content: space-between;
	margin-top: var(--m-16);
	padding-top: var(--m-16);
}

.menu__langs {
	display: flex;
	gap: var(--m-4);
}

.lang__item:not(.current__lang),
.lang__divider {
	opacity: 0.3;
}

.current__lang {
	pointer-events: none;
}

.menu__social {
	display: flex;
	gap: var(--m-24);
}

.link--underline {
	position: relative;
}

.lang__item {
	cursor: pointer;
	position: relative;
	transition: transform 0.3s ease;
}

.menu__time {
	display: flex;
	position: relative;
}

.time__icon {
	fill: var(--color-black);
	height: 2.381vh;
	width: 2.381vh;
	left: -3.81vh;
	top: 1px;
	position: absolute;
}

.time__icon > svg,
.time__icon > div {
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

.time__icon .global {
	z-index: 2;
}

.time__icon .g-spinner {
	box-sizing: border-box;
	border: solid 1px var(--color-black);
	border-radius: 50%;
	transform: rotateY(90deg);
	border-radius: 50%;
	-webkit-transform-style: preserve-3d;
	animation: spin 4s linear infinite;
	overflow: hidden;
}
	
	.time__icon .g-spinner:after,
	.time__icon .g-spinner:before {
		background-color: var(--color-black);
		content: '';
		left: calc(50% - 1px);
		position: absolute;
		height: 100%;
		width: 1px;
		z-index: -10;
		-webkit-transform: rotateY(-90deg);
		-webkit-transform-origin: 100% 50%;
	}
	
	.time__icon .g-spinner:after {
		
	}
	
	.time__icon .g-spinner:before {
		
	}


@keyframes spin {
	
	0%{
		transform: rotateY(0deg);
	}
	
	100%{
		transform: rotateY(360deg);
	}
	
}

@media (hover: hover) {
	
	.header__btn:hover {
		background: var(--color-white);
		border-color: var(--color-white);
		box-shadow: 0 0 0.119vh 0 rgba(var(--rgb-black), 0.05),
		0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
		0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
		0 0.238vh 0.238vh 0 rgba(var(--rgb-black), 0.05),
		0 0.476vh 0.476vh 0 rgba(var(--rgb-black), 0.05),
		0 0.952vh 0.952vh 0 rgba(var(--rgb-black), 0.05);
		color: var(--color-black);
		text-shadow: none;
		transition: none;
	}
	
	.section__intro .header__btn:hover,
	.section__step-3 .header__btn:hover,
	.section__outro .header__btn:hover {
		background: var(--color-orange);
		border-color: var(--color-orange);
		color: var(--color-black);
	}
	
	.section__step-2 .header__btn:hover {
		background: var(--color-red);
		border-color: var(--color-red);
		color: var(--color-black);
	}
	
	/* .section__footer .header__btn:hover {
		background: var(--color-black);
		border-color: var(--color-black);
		color: var(--color-orange);
	} */

	.menu__close:hover .close__line:before {
		background: var(--color-orange);
	}
	
	.main__menu__item:hover {
		color: var(--color-orange);
	}
	
		.menu__close:before,
		.main__menu__item:before {
			background: var(--color-black);
			content: '';
			height: calc(100% + 1.19vh);
			left: -0.595vh;
			top: -0.595vh;
			opacity: 0;
			pointer-events: none;
			position: absolute;
			width: calc(100% + 1.19vh);
		}
	
		.menu__close:hover:before,
		.main__menu__item:hover:before {
			opacity: 1;
		}
		
	.link--underline:before {
		background: currentcolor;
		bottom: 0;
		content: '';
		height: 1px;
		left: 0;
		position: absolute;
		transform-origin: left;
		transform: scaleX(0);
		transition: transform 0.3s ease;
		width: 100%;
	}
	
	.link--underline:hover:before {
		transform: scaleX(1);
	}
	
	.lang__item:hover {
		opacity: 1;
	}
	
}

.layout__grid {
	box-sizing: border-box;
	display: grid;
	grid-template-rows: repeat(8, 1fr);
	grid-template-columns: min-content;
	gap: var(--grid-gutter);
	height: 100%;
	padding: var(--grid-margin) 0;
	position: relative;
}

body:not(.page--in) .scroll__container {
	visibility: hidden;
}

.scroll__container {
	transition: opacity 0.8s var(--transition-handle);
}

.h__section {
	display: inline-block;
	height: 100vh;
	position: relative;
	will-change: transform;
}

.section__inner {
	display: flex;
	box-sizing: border-box;
	height: 100%;
	white-space: nowrap;
}

.section__text {
	white-space: normal;
}

.scroll__container section:first-child {
	z-index: 8;
}

.false--scroll{
	width: 1px;
}

.title__inner,
.title__word {
	display: flex;
}

.title__inner {
	height: calc(34vh * 0.64);
}

.title__inner + .title__inner {
	margin-top: var(--grid-gutter);
}

.title__word {
	margin-top: -3.65vh;
	position: relative;
}

.title__line {
	display: flex;
	flex-direction: column;
	grid-row: span 2;
}

.hide .main__title .title__letter {
	transform: translate3d(0, calc(-100% - 4.5vh), 0);
}

.main__title .title__letter {
	transform: translate3d(0, 0, 0);
	transition: transform 0.8s var(--mask-handle);
}

.row__title {
	font-size: 34vh;
}

.hero__letter svg {
	height: 100%;
}

.row__title:not(.hero__title) .mask {
	margin-top: -4.5vh;
	padding: 4.5vh 0.476vh 0 0.476vh;
}

.hero__main {
	box-sizing: border-box;
	padding: 0 var(--m-80) 0 var(--m-40);
	position: relative;
}

	.hero__main:before {
		background: var(--color-white);
		content: '';
		height: 100%;
		position: absolute;
		right: 0;
		top: 0;
		transform-origin: top;
		transform: scaleY(0);
		width: 1px;
		z-index: 1;
	}

.hero__top,
.hero__title {
	grid-row: 1 / 7;
}

.hero__main {
	display: block;
	position: relative;
}

.hero__title .title__line--2,
.hero__title .title__line--3 {
	margin-left: 1.675vh;
}

.hero__title .title__line--1 svg {
	fill: var(--color-red);
}

.hero__title .title__line--2 svg,
.hero__title .title__line--3 svg {
	fill: var(--color-orange);
}

.hero__title span {
	height: 100%;
}

.hero__media {
	height: 100vh;
	width: 150vh;
	position: relative;
	overflow: hidden;
}

.hero__takumi--t {width: 12.516vh;}
.hero__takumi--a {width: 11.193vh;}
.hero__takumi--k {width: 12.516vh;}
.hero__takumi--u {width: 10.948vh;}
.hero__takumi--m {width: 14.553vh;}
.hero__takumi--i {width: 4.38vh;}

.hero__studio--s {width: 10.362vh;}
.hero__studio--t {width: 12.516vh;}
.hero__studio--u {width: 10.948vh;}
.hero__studio--d {width: 9.787vh;}
.hero__studio--i {width: 5.72vh;}
.hero__studio--o {width: 9.575vh;}

.hero__number--2 {width: 10.396vh;}
.hero__number--6 {width: 9.559vh;}

.hero__footer {
	align-content: flex-end;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	grid-row: 7 / 9;
	width: 100%;
}

.hero__footer .intro__text {
	font-weight: 500;
	margin-bottom: -0.714vh;
}

.hero__footer .intro__text .mask {
	display: block;
}

.hero__footer .intro__text .mask > span {
	display: block;
	transform: translate3d(0, -100%, 0);
}

.sponsors__container {
	display: flex;	
}

.sponsors__text {
	margin-bottom: var(--m-24);
	margin-top: var(--m-8);
	text-transform: uppercase;	
}

.sponsors__text > span {
	display: block;
	transform: translate3d(0, -100%, 0);
}

.sponsors__container a {
	display: block;
	height: 3.81vh;
}

.sponsors__divider {
	background: var(--color-white);
	height: 3.81vh;
	margin: 0 2.049vh;
	width: 1px;
}

.step__number {
	aspect-ratio: 3 / 4;
	border-right: solid 1px currentcolor;
	box-sizing: border-box;
	padding: var(--grid-margin) 0;
}

.hero__claim {
	background: var(--color-black);
	color: var(--color-white);
	box-sizing: border-box;
	display: flex;
	position: absolute;
	left: 0;
	height: 100vh;
	top: 0;
	z-index: 2;
}

	.hero__claim:before {
		background: var(--color-white);
		content: '';
		height: 100%;
		position: absolute;
		right: 0;
		top: 0;
		width: 1px;
		transform-origin: top;
		transform: scaleY(0);
		z-index: 1;
	}

.claim__inner {
	align-items: center;
	display: flex;
	padding: var(--grid-margin) var(--m-24);
	justify-content: flex-start;
	position: relative;
	width: calc(4.524vh * 0.85);
}

.claim {
	display: flex;
	justify-content: space-between;
	position: absolute;
	bottom: 0;
	left: var(--m-24);
	height: 4.524vh;
	overflow: hidden;
	width: calc(100vh - calc(var(--grid-margin) * 2));
	transform-origin: 0 0;
	transform: rotate(-90deg);
}

.claim__forward {
	cursor: pointer;
	top: var(--grid-margin);
	height: 4vh;
	left: var(--m-24);
	position: absolute;	
	width: 4vh;
}

.arrow__container {
	display: flex;
	line-height: 0;
	width: 200%;
}

.hero__media {
	position: relative;
}

	.hero__media:before {
		background: var(--color-black);
		content: '';
		height: 100%;
		left: calc(5.714vh + (4.524vh * 0.85)); 
		pointer-events: none;
		position: absolute;
		top: 0;
		transform: scalex(1);
		width: calc(100vw - 111.5674vh);
		z-index: 1;
	}

@media (hover: hover) {
	
	.claim__forward:hover .arrow__container .arrow-icon {
		transform: translate3d(-100%, 0, 0);
		transition: transform 0.8s var(--transition-handle);
	}
		
	.logo--link {
		transition: opacity 0.3s ease;
	}
	
		.logo--link:hover {
			opacity: 0.6;
		}
	
}


/* START */

.hero__title .title__inner {
	transform: translate3d(0, -100%, 0);
}

.page--in .hero__title .title__inner {
	transform: translate3d(0, 0, 0);
	transition: transform 1.2s var(--mask-handle);
}

.page--in .hero__title .title__line--2 .title__inner {
	transition-delay: 0.05s;
}

.page--in .hero__title .title__line--3 .title__inner {
	transition-delay: 0.1s;
}

.page--in .hero__footer .intro__text .mask > span {
	transform: translate3d(0, 0, 0);
	transition: transform 1.2s var(--mask-handle);
}

.page--in .hero__footer .intro__text .mask:first-child > span {
	transition-delay: 0.8s; 
}

.page--in .hero__footer .intro__text .mask:nth-child(2) > span {
	transition-delay: 0.85s; 
}

.page--in .hero__footer .intro__text .mask:nth-child(3) > span {
	transition-delay: 0.9s; 
}

.page--in .hero__main:before,
.page--in .hero__claim:before {
	transform: scaleY(1);
	transition: transform 1.2s var(--transition-handle) 0.4s;
}

.claim__text {
	color: var(--color-white) !important;
	transform: translate3d(0, 100%, 0);
}

.arrow__container {
	transform: translate3d(100%, 0, 0);
}

.page--in .claim__text,
.page--in .arrow__container,
.page--in .sponsors__text > span,
.page--in .percent__scrolled > span {
	transform: translate3d(0, 0, 0);
	transition: transform 1.2s var(--mask-handle) 0.8s;
}

.hero__sponsors .sponsors__container {
	opacity: 0;
}

.page--in .hero__sponsors .sponsors__container {
	opacity: 1;
	transition: opacity 1.2s var(--mask-handle) 1s;
}

.page--in .hero__media:before {
	transform-origin: left;
	transform: scalex(0);
	transition: transform 1.2s var(--mask-handle) 0.1s;
}

.header__menu {
	opacity: 0;
}

.page--in .header__menu {
	opacity: 1;
	transition: opacity 1.2s var(--mask-handle) 1s;
}

/* INTRO */

.intro__main {
	box-sizing: content-box;
	padding: 0 var(--m-80);
}

.intro__layout__title,
.intro__layout__title .main__title {
	grid-row: 1 / 9;
	position: relative;
}

.hide .masonry__media {
	clip-path: inset(0 0 100% 0);
}

.masonry__media {
	clip-path: inset(0 0 0 0);
	transition: clip-path 1.2s var(--mask-handle);
}

.masonry__media_1 {
	line-height: 0;
	height: 100%;
	width: 32.5vh;
	position: relative;
	margin-right: var(--grid-gutter);
}

.masonry__media_2 {
	line-height: 0;
	height: 100%;
	position: relative;
}

:lang(it-IT) .masonry__media_2 {
	margin: 0 var(--grid-gutter) 0 calc(var(--grid-gutter) * 2);
	width: 9vh;
	transition-delay: 0.5s;
}

:lang(en-GB) .masonry__media_2 {
	margin: 0 var(--grid-gutter) 0 calc(var(--grid-gutter) + 1px);
	width: 13.35vh;
	transition-delay: 0.25s;
}

:lang(it-IT) .masonry__media_3 {
	line-height: 0;
	height: 67.5vh;
	width: 56.7vh;
	position: absolute;
	left: calc(100% - 57.5vh);
	top: 0;
	transition-delay: 0.6s;
}

:lang(en-GB) .masonry__media_3 {
	line-height: 0;
	height: 44.75vh;
	width: 30.25vh;
	position: absolute;
	left: calc(100% - 30.25vh);
	top: 23vh;
	transition-delay: 0.6s;
}

:lang(it-IT) .masonry__media_4 {
	display: none;
}

:lang(en-GB) .masonry__media_4 {
	line-height: 0;
	height: 100%;
	position: relative;
	margin: 0 var(--grid-gutter) 0 calc(var(--grid-gutter) * 2);
	transition-delay: 0.6s;
	width: 23vh;
}

/* STEP 1 */

.step-1__layout__main .section__text {
	width: 30.952vh;
}

.step-1__main {
	padding: 0 var(--m-80);
}

.step-1__layout__main {
	display: flex;
	justify-content: space-between;
	grid-row: 1 / 5;
}

.step-1__layout__title .main__title {
	grid-row: span 4;
}

.step-1__layout__title {
	grid-row: 5 / 9;
}

.rome__map {
	/* box-shadow: 0.952vh 2.381vh 4.762vh rgba(0, 0, 0, 0.2),
				1.905vh 4.762vh 9.524vh rgba(0, 0, 0, 0.2),
				0 0.119vh rgba(0, 0, 0, 0.05); */
	box-sizing: border-box;
	height: 100%;
	margin: 0 var(--m-56);
	padding: var(--grid-margin) 0;
	position: relative;
}

.rome__map {
	width: 118.214vh;
}

.badge {
	border-radius: 50%;
	height: 28.571vh;
	left: 53vh;
	position: absolute;
	width: 28.571vh;
	top: 12vh;
}

/* :lang(en-GB).badge {
	border-radius: 50%;
	height: 38.095vh;
	left: 40vh;
	position: absolute;
	width: 38.095vh;
	top: 27vh;
} */

.badge__icon {
	box-sizing: border-box;
	height: 11.429vh;
	margin: 8.571vh;
	width: 11.429vh;
}

/* :lang(en-GB) .badge__icon {
	box-sizing: border-box;
	height: 14.286vh;
	margin: 11.9045vh;
	width: 14.286vh;
} */

.badge__icon svg {
	fill: var(--color-orange);
}

.badge__text {
	animation: rotate 20s infinite linear;
}

@keyframes rotate {
	
	0%{
		transform: rotate(0deg);
	}
	
	100%{
		transform: rotate(360deg);
	}
	
}

.step-1__media {
	height: 100vh;
	width: 66.667vh;
	position: relative;
}


/* STEP 2 */

.step-2__main {
	display: flex;
	padding-left: var(--m-56);
}

.step-2__layout__title,
.step-2__layout__title .main__title {
	grid-row: 1 / 5;
}

.step-2__layout__main {
	grid-row: 6 / 9;
}

.step-2__layout__main .section__text .text__columns {
	display: flex;
	gap: var(--m-24);
}

.step-2__layout__main .section__text .text__columns > ul {
	width: 38.095vh;
}

.text__columns > ul {
	padding-left: 1.429vh;
}

.text__columns > ul > li {
	position: relative;
}

.text__description ul > li:before {
	content: '';
	background: currentcolor;
	left: -1.429vh;
	height: 0.476vh;
	position: absolute;
	top: 0.952vh;
	width: 0.476vh;
}

.image__marquee {
	position: relative;
	padding: 0 var(--m-56) 0 var(--m-160);
}

.image__marquee__item {
	box-sizing: border-box;
	box-shadow: 0.952vh 2.381vh 4.762vh rgba(0, 0, 0, 0.1), 1.905vh 4.762vh 9.524vh rgba(0, 0, 0, 0.1), 0 0.119vh rgba(0, 0, 0, 0.05);
	margin-bottom: var(--m-56);
	position: relative;
}

.image__marquee__img {
	height: 50vh;
	position: relative;
	width: 50vh;
	min-width: 50vh;
}

.step-2__marquee {
	flex-shrink: 0;
}

.image__track {
	animation: marqueeTop 48s linear infinite;
}


@keyframes marqueeTop {
	
	0% {
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
	
	100% {
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
	}

}


/* STEP 3 */


.step-3__layout__main .section__text {
	width: 30.952vh;
}

.step-3__main {
	padding: 0 var(--m-120) 0  var(--m-56)
}

.step-3__layout__main {
	grid-row: 1 / 5;
}

.step-3__layout__main .main__title,
.step-3__layout__title .main__title {
	grid-row: span 2;
}

.step-3__layout__title {
	grid-row: 5 / 9;
}

.step-3__layout__title .main__title {
	grid-row: span 4;
}

.matters__container {
	display: flex;
	height: 100vh;
	flex-wrap: nowrap;
	width: 100vh;
}

.matter {
	align-items: center;
	color: var(--color-white);
	cursor: pointer;
	display: flex;
	height: 100%;
	justify-content: center;
	position: relative;
	transition: width 1.2s var(--transition-handle);
	width: 33.3333%;
	flex-shrink: 0;
	min-width: 0;
}

.matters--active .matter {
	width: 20%;
}

.matters--active .matter--active {
	width: 60%;
}

.matter__video {
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

	.matter__video:before {
		background: var(--color-black);
		content: '';
		height: 100%;
		left: -1px;
		opacity: 0.6;
		position: absolute;
		top: 0;
		width: calc(100% + 2px);
		transition: opacity 1.2s var(--mask-handle);
		z-index: 1;
	}

.matter__cta {
	box-shadow: 0 0 0.119vh 0 rgba(var(--rgb-black), 0.05),
	0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
	0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
	0 0.238vh 0.238vh 0 rgba(var(--rgb-black), 0.05),
	0 0.476vh 0.476vh 0 rgba(var(--rgb-black), 0.05),
	0 0.952vh 0.952vh 0 rgba(var(--rgb-black), 0.05),
	0 1.905vh 1.905vh 0 rgba(var(--rgb-black), 0.05),
	inset 0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
	inset 0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
	inset 0 0.238vh 0.238vh 0 rgba(var(--rgb-black), 0.05),
	inset 0 0.476vh 0.476vh 0 rgba(var(--rgb-black), 0.05),
	inset 0 0.952vh 0.952vh 0 rgba(var(--rgb-black), 0.05),
	inset 0 1.905vh 1.905vh 0 rgba(var(--rgb-black), 0.05);
	box-sizing: border-box;
	bottom: -8.571vh;
	height: 9.524vh;
	left: 50%;
	transform: translateX(-50%);
	transition: opacity 0.8s var(--mask-handle) 0.8s, transform 1.2s var(--mask-handle) 0.4s;
	position: absolute;
	width: 9.524vh;
}

	.matter__cta:before {
		border: solid 0.238vh rgba(var(--rgb-white), 0.4);
		box-sizing: border-box;
		content: '';
		height: 100%;
		left: 0;
		position: absolute;
		top: 0;
		transition: background-color 0.3s ease, border-color 0.3s ease;
		width: 100%;
		z-index: 1;
	}

.matter__cta--line {
	background: var(--color-white);
	height: 0.476vh;
	position: absolute;
	top: calc(50% - 0.238vh);
	left: calc(50% - 2.381vh);
	width: 4.762vh;
	transition: background-color 0.3s ease;
	z-index: 2;
}

	.matter__cta--line:last-child {
		transform: rotate(90deg);
		z-index: 3;
	}
	
	.matter__cta--line:first-child:before {
		content: '';
		box-shadow: 0 0 0.119vh 0 rgba(var(--rgb-black), 0.05),
		0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
		0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
		0 0.238vh 0.238vh 0 rgba(var(--rgb-black), 0.05),
		0 0.476vh 0.476vh 0 rgba(var(--rgb-black), 0.05),
		0 0.952vh 0.952vh 0 rgba(var(--rgb-black), 0.05),
		0 1.905vh 1.905vh 0 rgba(var(--rgb-black), 0.05);
		height: 0.476vh;
		position: absolute;
		top: calc(50% - 0.238vh);
		left: calc(50% - 2.381vh);
		width: 4.762vh;
	}
	
	.matter__cta--line:first-child:after {
		box-shadow: 0 0 0.119vh 0 rgba(var(--rgb-black), 0.05),
		0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
		0 0.119vh 0.119vh 0 rgba(var(--rgb-black), 0.05),
		0 0.238vh 0.238vh 0 rgba(var(--rgb-black), 0.05),
		0 0.476vh 0.476vh 0 rgba(var(--rgb-black), 0.05),
		0 0.952vh 0.952vh 0 rgba(var(--rgb-black), 0.05);
		height: 4.762vh;
		position: absolute;
		left: calc(50% - 0.238vh);
		width: calc(50% - 2.381vh);
		width: 0.476vh;
	}
	
@media (hover: hover) {
		
	.matter:hover .matter__cta:before {
		border-color: var(--color-white);
	}
	
}

.matter__text {
	box-sizing: border-box;
	text-align: center;
	padding: var(--grid-margin);
	position: relative;
	z-index: 3;
}

.hidden__text {
	box-sizing: border-box;
	left: 50%;
	font-weight: 500;
	opacity: 0;
	position: absolute;
	padding: 0 var(--grid-margin);
	transition: opacity 0.8s var(--mask-handle);
	transform: translate3d(-50%, 0, 0);
	width: 50vh;
	top: 22.82vh;
	white-space: normal;
}

.hidden__title {
	left: 50%;
	position: absolute;
	top: 50%;
	transform-origin: center;
	transform: translate3d(-50%, -50%, 0) rotate(90deg);
	white-space: nowrap;
}

.text__title > .mask,
.text__title > .mask > span,
.hidden__title > .mask,
.hidden__title > .mask > span,
.matter__cta > .mask,
.matter__cta > .mask > span {
	display: block;
}

.hidden__title > .mask > span {
	transform: translate3d(0, -105%, 0);
}

.matter__text .text__title > .mask > span,
.matter__cta > .mask > span {
	transition: transform 1.2s var(--mask-handle) 0.8s;
}

.hidden__title > .mask > span {
	transition: transform 1.2s var(--mask-handle);
}

.matter--active .hidden__text {
	opacity: 1;
	transition: opacity 0.8s var(--mask-handle) 0.8s;
}

.matter--active .text__title > .mask > span,
.matters--active .matter:not(.matter--active) .hidden__title > .mask > span {
	transform: translate3d(0, 0, 0);
	transition: transform 1.2s var(--mask-handle) 0.8s;
}

.matters--active .matter:not(.matter--active) .text__title > .mask > span,
.matters--active .matter__cta > .mask > span {
	transform: translate3d(0, -110%, 0);
	transition: transform 1.2s var(--mask-handle);
}

.matters--active .matter:not(.matter--active) .matter__cta {
	opacity: 0;
	transition: opacity 0.8s var(--mask-handle), transform 0s 1.2s;
}

.matter--active .matter__cta {
	transform: translate3d(-50%, 26.5vh, 0) rotate(135deg) scale(0.5);
	transition: transform 1.2s var(--mask-handle);
	will-change: transform;
}

.matter--active .matter__video:before {
	opacity: 0.3;
}

/* STEP 4 */

.step-4__main {
	display: flex;
	padding: 0 var(--m-56);
}

.step-4__layout__title,
.step-4__layout__title .main__title {
	grid-row: 1 / 3;
}

.step-4__layout__middle {
	grid-row: 4 / 7;
}

:lang(it-IT) .step-4__layout__middle {
	grid-template-columns: 44.652vh 35vh 35vh;
}

:lang(en-GB) .step-4__layout__middle {
	grid-template-columns: 52vh 33vh 33vh;
}

.step-4__middle--0,
.step-4__middle--1,
.step-4__middle--2 {
	grid-row: span 3;
}

.step-4__middle--0 {
	margin-right: var(--m-8);	
}

.step-4__video {
	grid-row: span 2;
	position: relative;
}

:lang(it-IT) .step-4__video {
	width: 43.7vh;
}

:lang(en-GB) .step-4__video {
	width: 51.25vh;
	height: 24vh;
}

.step-4__layout__bottom {
	grid-row: 7 / 9;
	position: relative;
	z-index: 3;
}


.quote__line {
	font-size: 16.2vh;
	height: calc(16.2vh * 0.64);
	position: relative;
	white-space: nowrap;
}

.quote__line > .mask {
	display: block;
	margin-top: -1.7vh;
	position: relative;
}

.quote__word {
	display: block;
	padding: 0 0.238vh;
	position: relative;
	width: 100%;
}

.instructions__container {
	border: solid 1px rgba(var(--rgb-black), 0.4);
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	margin: 0 0 2.381vh 1.429vh;
	height: calc(100% -  2.381vh);
	white-space: normal;
}

.instructions__title {
	font-size: 9.524vh;
	padding: 1.667vh 2.381vh 0;
}

.instructions__main {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
	padding: 0 2.381vh 2.381vh;
}

.instructions__container .text__description {
	font-weight: 500;
}

.btn {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	height: calc(1.667vh * 1.425 + 2.858vh);
	text-align: center;
	width: 100%;
}

.btn__inner {
	font-weight: 500;
	padding: 1.429vh;
	transition: transform 0.5s var(--transition-handle);
}

	.btn__inner:first-child {
		background: var(--color-red);
		color: var(--color-white);
	}
	
	.btn__inner:last-child {
		background: var(--color-white);
		color: var(--color-black);
	}

.step-4__image {
	box-sizing: border-box;
	height: 100vh;
	width: 64.286vh;
	margin-left: var(--m-80);
	padding: var(--grid-margin) 0;
	position: relative;
}

@media (hover: hover) {
	
	.btn:hover .btn__inner {
		transform: translate3d(0, -100%, 0);
	}
	
}

/* OUTRO */

.outro__layout {
	display: flex;
	grid-row: span 8;
	grid-template-columns: 356vh;
	margin: 0 var(--m-120);
}

.video__mask {
	display: inline-block;
	height: 100%;
	position: relative;
}

.video__mask > video {
	width: 75.23vh;
}

.video__mask svg {
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

.video__mask--t {
	-webkit-mask-image: url(../assets/mask/mask-t.svg);
	-webkit-mask-position:left top;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 100%;
	mask-image: url(../assets/mask/mask-t.svg);
	mask-position: left top;
	mask-repeat: no-repeat;
	mask-size: 100%;
	width: 46.043vh;
}

.video__mask--a {
	-webkit-mask-image: url(../assets/mask/mask-a.svg);
	-webkit-mask-position:left top;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 100%;
	mask-image: url(../assets/mask/mask-a.svg);
	mask-position: left top;
	mask-repeat: no-repeat;
	mask-size: 100%;
	width: 52.945vh;
}

.video__mask--k {
	-webkit-mask-image: url(../assets/mask/mask-k.svg);
	-webkit-mask-position:left top;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 100%;
	mask-image: url(../assets/mask/mask-k.svg);
	mask-position: left top;
	mask-repeat: no-repeat;
	mask-size: 100%;
	width: 50.683vh;
}

.video__mask--u {
	-webkit-mask-image: url(../assets/mask/mask-u.svg);
	-webkit-mask-position:left top;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 100%;
	mask-image: url(../assets/mask/mask-u.svg);
	mask-position: left top;
	mask-repeat: no-repeat;
	mask-size: 100%;
	width: 48.136vh;
}

.video__mask--m {
	-webkit-mask-image: url(../assets/mask/mask-m.svg);
	-webkit-mask-position:left top;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 100%;
	mask-image: url(../assets/mask/mask-m.svg);
	mask-position: left top;
	mask-repeat: no-repeat;
	mask-size: 100%;
	width: 75.23vh;
}

.video__mask--i {
	-webkit-mask-image: url(../assets/mask/mask-i.svg);
	-webkit-mask-position:left top;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 100%;
	mask-image: url(../assets/mask/mask-i.svg);
	mask-position: left top;
	mask-repeat: no-repeat;
	mask-size: 100%;
	width: 16.972vh;
}

/* FOOTER */

.page__footer .layout__grid {
	grid-template-columns: 100%;
	width: 100%;
}

.footer__inner {
	box-sizing: border-box;
	padding: 0 var(--m-56);
	display: grid;
	grid-template-columns: min-content 111.905vh;
}

.footer__layout__main {
	grid-row: 1 / 9;
}

.footer__logos__container {
	background: var(--color-black);
	box-shadow: 0.952vh 2.381vh 4.762vh rgba(0, 0, 0, 0.2),
				1.905vh 4.762vh 9.524vh rgba(0, 0, 0, 0.2),
				0 0.119vh rgba(0, 0, 0, 0.05);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	box-sizing: border-box;
	grid-row: span 3;
	padding: var(--m-24) var(--m-32) var(--m-32) var(--m-24);
	margin-right: 28.571vh;
	width: fit-content;
}

.footer__layout__main .section__text {
	grid-row: span 5;
}

.footer__layout__main .text__title {
	font-weight: 700;
	padding-bottom: var(--m-24);
}

.partners__bottom .text__title {
	border-bottom: solid 1px var(--color-black);
	margin-bottom: var(--m-32);
}

.footer__layout__main .section__text a {
	font-weight: 500;
	position: relative;
}

.footer__logos .sponsors__text {
	margin-top: 0;
}

.footer__humans {
	display: flex;
	flex-direction: column;
	align-items: center;
	color: var(--color-white);
	margin-right: var(--m-56);
}

.footer__humans .sponsors__text {
	margin-bottom: var(--m-16);
}

.humans__logo {
	display: block;
	height: 5.714vh;
}

.footer__layout__title {
	grid-row: 7 / 9;
}

.footer__layout__title .main__title {
	grid-row: 1 / 3;
}

.footer__logos {
	align-items: flex-start;
	display: flex;
	width: fit-content;
}

.footer__logos__text {
	color: var(--color-orange);
	display: flex;
	flex-direction: column;
	gap: calc(var(--grid-gutter) / 2);
	width: fit-content;
}

.row__half__line {
	font-size: 7.738vh;
	display: inline-flex;
	height: calc(7.738vh * 0.64);
	position: relative;
	white-space: nowrap;
}

.row__half__line > .mask {
	display: block;
	margin-top: -0.7vh;
	position: relative;
}

.row__half__word {
	display: block;
	padding: 0 0.119vh;
	position: relative;
	width: 100%;
}

.footer__sponsors > .sponsors__text {
	color: var(--color-white);
}

.footer__sponsors a {
	display: block;
	height: 3.81vh;
}

.footer__sponsors__divider {
	background: var(--color-white);
	height: 3.81vh;
	margin: 0 2.049vh;
	width: 1px;
}

.footer__nav {
	align-self: end;
	border-top: solid 1px var(--color-black);
	display: flex;
	justify-content: space-between;
	grid-row: 8 / 9;
	font-weight: 500;
	gap: var(--m-24);
	padding-top: var(--m-24);	
}

.legal__nav {
	display: flex;
	gap: var(--m-24);
}

.footer__media {
	height: 100vh;
	width: 50vh;
	position: relative;
}

.section__partners {
	grid-row: 1 / 8;
}

.partners__top {
	grid-row: 1 / 4;
}

.partners__bottom {
	grid-row: 4 / 8;
}

.roma__logo {
	display: inline-block;
	height: 14.286vh;
}

.footer__collaborazione {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-template-rows: repeat(3, 1fr);
	gap: var(--m-24);
}

.collab__logo {
	align-self: center;
	display: flex;
	justify-content: center;
	height: var(--m-56);
	width: 100%;
}

.collab__logo--double {
	align-self: flex-end;
	grid-row: span 2;
	grid-column: span 2;
	height: var(--m-120);
	place-content: flex-start;
}

.collab__logo--teatro {
	grid-column: span 6;
	margin-top: var(--m-16);
}


@media (hover: hover) {
	
	.footer__layout__main .section__text a:before {
		background: currentcolor;
		bottom: 0;
		content: '';
		height: 1px;
		left: 0;
		position: absolute;
		transform-origin: left;
		transform: scaleX(0);
		transition: transform 0.3s ease;
		width: 100%;
	}
	
	.footer__layout__main .section__text a:hover:before {
		transform: scaleX(1);
	}
	
}


/* LEGAL */

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

.legal__container {
	box-sizing: border-box;
	color: var(--color-black);
	display: flex;
	height: 100%;
	min-height: 100vh;
	padding: var(--grid-margin);
	position: relative;
}

.legal__header {
	border-right: solid 1px var(--color-black);
	width: 48.69vh;
	z-index: 1;
	padding-right: var(--grid-margin);
	left: var(--grid-margin);
	top: var(--grid-margin);
	position: fixed;
}

.legal__header__inner {
	position: relative;
}

.legal__header .yourbana__iso {
	fill: var(--color-red);
}

.legal__line {
	display: block;
	font-size: 16.2vh;
	height: calc(16.2vh* 0.8);
	position: relative;
	margin-top: -1.6vh;
	white-space: nowrap;
}

.legal__content h2 {
	font-size: 2.857vh;
	line-height: 1.35;
	font-weight: 700;
	margin: var(--m-40) 0 var(--m-32);
}

.legal__content h3 {
	font-weight: 700;
}

.legal__content a {
	font-weight: 700;
	text-decoration: underline;
}

.legal__content ol {
	padding-bottom: var(--m-24);
}

.legal__content ol > li {
	list-style: inside;
	list-style-type: upper-roman;
}

@media (hover: hover) {
	
	.legal__content a:hover {
		color: var(--color-orange);
		text-decoration: none;
	}
	
}

@media (min-width: 981px) {
	
	.legal__content {
		padding-left: calc(var(--grid-margin) * 2);
		margin-left: 48.69vh;
		max-width: 44vw;
	}
	
}

@media (max-width: 980px) {
	
	.legal__header {
		display: none;
	}
	
}

.not__found {
	background: var(--color-red);
	height: 100vh;
	width: 100%;
}

.not__found__header {
	box-sizing: border-box;
	padding: var(--grid-margin);
	left: 0;
	pointer-events: none;
	position: fixed;
	top: 0;
	z-index: 9;
}

.ybn__logo {
	fill: var(--color-black);
	width: var(--m-80);
	pointer-events: auto;
}

.not__found__btn {
	display: flex;
	font-size: 4.524vh;
	justify-content: center;
	margin-top: var(--m-16);
	pointer-events: auto;
	color: var(--color-black);
	align-items: center;
	box-sizing: border-box;
	border: solid 0.238vh var(--color-black);
	cursor: pointer;
	height: 4.762vh;
	padding: 1.19vh 0.714vh;
	position: relative;
	transition: background 0.6s ease, border-color 0.6s ease, color 0.6s ease;
	z-index: 2;
}

.not__found__main {
	box-sizing: border-box;
	height: 100%;
	width: 100%;
}

.not__found:not(.page--in) .not__found__header,
.not__found:not(.page--in) .not__found__main {
	opacity: 0;
}

.not__found__img {
	display: flex;
	height: 100%;
	justify-content: center;
	position: relative;
	width: 100%;
}

.not__found__img > img {
	height: 100%;
	object-fit: contain;
	width: 100%;
}

.not__found__main > .flowmap {
	align-items: center;
	display: flex;
	justify-content: center;
	height: 100%;
	position: relative;
	margin: 0 auto;
	width: 100%;
}

.not__found__main .flowmap--inner {
	height: 100vh;
	margin: 0 auto;
	position: relative;
	width: calc(100vh * 5 / 3);
}

@media (max-aspect-ratio: 5 / 3) {
	
  .not__found__main .flowmap--inner {
	  height: calc(100vw / 1.6667);
	  width: 100vw;
  }

}

@media (hover: hover) {
	
	.not__found__btn:hover {
		background: var(--color-black);
		color: var(--color-red);
		transition: none;
	}
	
}

/* WINDOWS FIX */

.windows .row__title:not(.hero__title) .mask {
	margin-top: -8vh;
}

.windows .main__menu__item > .menu__item__group > .mask:last-child {
	margin-top: -4.25vh;
}

.windows .menu__item__index {
	padding-top: 0;
}

.windows .time__icon {
	top: -1px;
}

.windows .masonry__media__1 {
	margin-top: 3.65vh;
}

.windows .header__btn__inner {
	margin-top: 0;
}

.windows .percent__scrolled {
	bottom: calc(var(--grid-margin) - 0.65vh);
}

.windows .quote__line > .mask {
	margin-top: -3.45vh;
}

.windows .instructions__title {
	padding: var(--m-8) 2.381vh;
}

.windows .row__half__line > .mask {
	margin-top: -1.65vh;
}

:lang(it-IT) .windows .masonry__media_1,
:lang(it-IT) .windows .masonry__media_2,
:lang(en-GB) .windows .masonry__media_1,
:lang(en-GB) .windows .masonry__media_2,
:lang(en-GB) .windows .masonry__media_4 {
	margin-top: 3.5vh;
}
/* line 1 ("Your business,") lives in the 52vh media column — let it run its
   full width over the STEP boxes like the other title lines */
.step-4__main .quote__line--1 {
	position: relative;
	z-index: 3;
}

.step-4__main .quote__line--1 > .mask,
.step-4__main .quote__line--1 .quote__word {
	width: max-content !important;
}