
@font-face {
	font-family: 'Europa Grotesk';
	src: local( 'Europa Grotesk' ),
		local( 'Europa Grotesk' ),
		url( ./fonts/EuropaGrotesk/EuropaGroteskSH-Reg.otf );
	font-style: normal;
	font-weight: normal;
}

@font-face {
	font-family: 'Nimbus Sans';
	src: local( 'Nimbus Sans' ),
		local( 'Nimbus Sans' ),
		url( ./fonts/NimbusSans/Nimbus-Sans-D-OT-Light_32752.ttf );
	font-style: normal;
	font-weight: normal;
}

@font-face {
	font-family: 'Nimbus Sans';
	src: local( 'Nimbus Sans' ),
		local( 'Nimbus Sans' ),
		url( ./fonts/NimbusSans/Nimbus-Sans-D-OT-Bold_32747.ttf );
	font-style: normal;
	font-weight: bold;
}

:root {
	--third-a100: rgba( 255, 0, 153, 1 );
}

.theme-dark:root {
	--back-dark: rgba( 25, 23, 25, 1 );
	--back-medium: rgba( 30, 28, 30, 1 );
	--back-regular: rgba( 16, 15, 17, 1 );
	--back-light: rgba( 46, 44, 48, 1 );
	
	--front-light: rgba( 255, 255, 255, 1 );
	--front-regular: rgba( 255, 255, 255, 0.75 );
	
	--front-reverse-light: rgba( 0, 0, 0, 1 );
	--front-reverse: rgba( 0, 0, 0, 0.75 );
}

.theme-light:root {
	--back-dark: rgba( 48, 48, 48, 1 );
	--back-medium: rgba( 64, 64, 64, 1 );
	--back-regular: rgba( 255, 255, 255, 1 );
	--back-light: rgba( 228, 221, 228, 1 );
	
	--front-light: rgba( 0, 0, 0, 1 );
	--front-regular: rgba( 0, 0, 0, 0.75 );
	
	--front-reverse-light: rgba( 255, 255, 255, 1 );
	--front-reverse: rgba( 255, 255, 255, 0.75 );
}

* {
	border: none;
	box-sizing: border-box;
	letter-spacing: inherit;
	margin: 0;
	outline: none;
	padding: 0;
}

body {
	background: var( --back-regular );
	color: var( --front-regular );
	font-family: 'Europa Grotesk';
	font-size: 16px;
	letter-spacing: 1px;
	overflow: hidden;
	overflow-y: auto;
	min-height: 100vh;
	min-height: calc( 100 * var( --vh ) );
}

@media screen and ( min-width: 768px ) {
	body {
		font-size: 18px;
	}
}

@media screen and ( min-width: 1080px ) {
	body {
		font-size: 20px;
	}
}

button,
input,
option,
select,
textarea {
	background: transparent;
	color: inherit;
	font-family: inherit;
	font-size: inherit;
}

button {
	cursor: pointer;
}

a {
	color: inherit;
	cursor: pointer;
	text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
	color: var( --front-light );
	font-family: 'Nimbus Sans';
	font-weight: normal;
}

.main {
	overflow: hidden;
}

.hero {
	display: flex;
	flex-direction: column-reverse;
	gap: 24px;
	height: 100vh;
	min-height: calc( 100 * var( --vh ) );
	padding: 24px;
}

.hero > * {
	border-radius: 24px;
	height: 50%;
	overflow: hidden;
	position: relative;
}

.hero > *:first-child {
	align-items: center;
	display: flex;
	justify-content: center;
	transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
		-webkit-transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
}

.hero > *:first-child:not( .scroll-driven-viewed ) {
	opacity: 0;
	transform: translateY( 128px );
		-webkit-transform: translateY( 128px );
}

.hero > *:first-child > a:first-child {
	left: 32px;
	position: absolute;
	top: 32px;
}

.hero > *:first-child > a:first-child img {
	filter: saturate( 10 ) hue-rotate( 325deg );
		-webkit-filter: saturate( 10 ) hue-rotate( 325deg );
	height: 64px;
	margin: -12px -20px;
}

.hero > *:first-child > div {
	align-items: center;
	display: flex;
	flex-direction: column-reverse;
	gap: 14px;
	text-align: center;
}

.hero > *:first-child > div > *:first-child {
	font-size: 32px;
	font-weight: bold;
}

.hero > *:first-child > div > *:last-child {
	font-size: 20px;
}

.hero > *:first-child > button {
	background: var( --back-light );
	border-radius: 50%;
	bottom: 32px;
	color: var( --back-regular );
	left: 32px;
	padding: 4px;
	position: absolute;
}

.theme-dark .hero > *:first-child > button {
	background: var( --front-light );
}

.hero > *:first-child > button > span:first-child {
	background: var( --third-a100 );
	border-radius: 100%;
	display: block;
	padding: 8px;
}

.hero > *:first-child > button > span:first-child i {
	background: inherit;
	display: block;
}

.hero > *:first-child > button > span:last-child {
	display: none;
}

.hero > *:first-child > a:last-child {
	align-items: center;
	bottom: 32px;
	display: flex;
	flex-direction: row;
	gap: 12px;
	right: 32px;
	position: absolute;
}

.hero > *:first-child > a:last-child > span:first-child {
	margin-left: auto;
	text-align: right;
	width: 50%;
}

.hero > *:first-child > a:last-child img {
	border-radius: 100%;
	height: 64px;
	object-fit: cover;
	object-position: center center;
	width: 64px;
}

.hero > *:first-child > a:last-child > span:last-child {
	align-items: center;
	aspect-ratio: 1/1;
	background: var( --third-a100 );
	border-radius: 100%;
	color: rgba( 255, 255, 255, 1 );
	display: flex;
	height: 1.25em;
	justify-content: center;
	right: 0;
	padding: 16px 8px;
	position: absolute;
	top: 0;
	transform: translate( 25%, -25% ) scale( 0.75 );
		-webkit-transform: translate( 25%, -25% ) scale( 0.75 );
	width: 1.25em;
}

.hero > *:last-child {
	transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
		-webkit-transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
}

.hero > *:last-child:not( .scroll-driven-viewed ) {
	opacity: 0;
	transform: translateY( -128px );
		-webkit-transform: translateY( -128px );
}

.hero > *:last-child img {
	border-radius: 24px;
	bottom: 0;
	height: 100%;
	left: 0;
	object-fit: cover;
	object-position: center center;
	position: absolute;
	right: 0;
	top: 0;
	transform: scale( 1.5 ) translateY( calc( var( --parallax ) * 25% ) );
		-webkit-transform: scale( 1.5 ) translateY( calc( var( --parallax ) * 25% ) );
	width: 100%;
}

.hero > *:last-child > div {
	align-items: flex-start;
	color: rgba( 255, 255, 255, 1 );
	display: flex;
	flex-direction: column;
	gap: 14px;
	left: 32px;
	position: absolute;
	text-shadow: 0 0 12px rgba( 0, 0, 0, 0.175 ), 0 0 4px rgba( 0, 0, 0, 0.1 );
	top: 32px;
	width: 50%;
}

.hero > *:last-child > button {
	align-items: center;
	background: var( --back-regular );
	border-radius: 12px;
	bottom: 32px;
	display: flex;
	flex-direction: row;
	gap: 8px;
	padding: 12px 14px;
	position: absolute;
	right: 32px;
}

@media screen and ( min-width: 768px ) {
	.hero {
		flex-direction: row;
	}

	.hero > * {
		height: 100%;
	}

	.hero > *:first-child > div > *:first-child {
		font-size: 40px;
	}

	.hero > *:first-child > div > *:last-child {
		font-size: 24px;
	}

	.hero > *:first-child > a:first-child img {
		height: 92px;
	}

	.hero > *:first-child > button > span:first-child {
		font-size: 28px;
    	padding: 12px;
	}

	.hero > *:first-child > a:last-child img {
		height: 80px;
		width: 80px;
	}

	.hero > *:first-child > a:last-child > span:last-child {
		font-size: 24px;
   		padding: 20px 8px;
	}

	.hero > *:first-child {
		width: 60%;
	}

	.hero > *:last-child {
		width: 40%;
	}
}

@media screen and ( min-width: 1080px ) {
	.hero > * {
		width: 50% !important;
	}
	
	.hero > *:first-child > button > span:last-child {
		color: var( --front-regular );
		display: initial;
		left: 12.5%;
		left: calc( 100% + 12px );
		position: absolute;
		top: 50%;
		transform: translateY( -50% );
			-webkit-transform: translateY( -50% );
		white-space: nowrap;
	}
	
	.hero > *:first-child > button > span:last-child:after {
		animation: hero-contact-shine 5s infinite linear;
			-webkit-animation: hero-contact-shine 5s infinite linear;
		background-image: linear-gradient( 120deg, transparent 0%, transparent 6rem, rgba( 255, 255, 255, 1 ) 11rem, transparent 11.15rem, transparent 15rem, rgba( 255, 255, 255, 0.3 ) 20rem, transparent 25rem, transparent 27rem, rgba( 255, 255, 255, 0.6 ) 32rem, white 33rem, rgba( 255, 255, 255, 0.3 ) 33.15rem, transparent 38rem, transparent 40rem, rgba( 255, 255, 255, 0.3 ) 45rem, transparent 50rem, transparent 100% );
			background-image: -webkit-linear-gradient( 30deg, transparent 0%, transparent 6rem, rgba( 255, 255, 255, 1 ) 11rem, transparent 11.15rem, transparent 15rem, rgba( 255, 255, 255, 0.3 ) 20rem, transparent 25rem, transparent 27rem, rgba( 255, 255, 255, 0.6 ) 32rem, white 33rem, rgba( 255, 255, 255, 0.3 ) 33.15rem, transparent 38rem, transparent 40rem, rgba( 255, 255, 255, 0.3 ) 45rem, transparent 50rem, transparent 100% );
		background-repeat: no-repeat;
		background-size: 150% 100%;
		content: '';
		height: 100%;
		left: 0;
		position: absolute;
		top: 0;
		width: 100%;
	}
	
	.theme-dark .hero > *:first-child > button > span:last-child:after {
		background-image: linear-gradient( 120deg, transparent 0%, transparent 6rem, rgba( 0, 0, 0, 1 ) 11rem, transparent 11.15rem, transparent 15rem, rgba( 0, 0, 0, 0.3 ) 20rem, transparent 25rem, transparent 27rem, rgba( 0, 0, 0, 0.6 ) 32rem, white 33rem, rgba( 0, 0, 0, 0.3 ) 33.15rem, transparent 38rem, transparent 40rem, rgba( 0, 0, 0, 0.3 ) 45rem, transparent 50rem, transparent 100% );
			background-image: -webkit-linear-gradient( 30deg, transparent 0%, transparent 6rem, rgba( 0, 0, 0, 1 ) 11rem, transparent 11.15rem, transparent 15rem, rgba( 0, 0, 0, 0.3 ) 20rem, transparent 25rem, transparent 27rem, rgba( 0, 0, 0, 0.6 ) 32rem, white 33rem, rgba( 0, 0, 0, 0.3 ) 33.15rem, transparent 38rem, transparent 40rem, rgba( 0, 0, 0, 0.3 ) 45rem, transparent 50rem, transparent 100% );
	}

	.hero > *:last-child > div {
		flex-direction: row;
	}
}

@keyframes hero-contact-shine {
	0% {
		background-position: 400% 0;
	}
	
	100% {
		background-position: 0% 0;
	}
}

@-webkit-keyframes hero-contact-shine {
	0% {
		background-position: 400% 0;
	}
	
	100% {
		background-position: 0% 0;
	}
}

.video {
	height: 100vh;
	min-height: calc( 100 * var( --vh ) );
	overflow: hidden;
	position: relative;
}

.video > *:first-child {
	z-index: 1;
}

.video > *:first-child,
.video > *:last-child,
.video > *:first-child > * {
	bottom: 0;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
}

.video > *:first-child > * {
	border-radius: 24px;
	height: 100%;
	object-fit: cover;
	object-position: center center;
	transform: scale( calc( 1.25 - var( --parallax ) ) );
		-webkit-transform: scale( calc( 1.25 - var( --parallax ) ) );
	width: 100%;
}

.video > *:last-child {
	display: flex;
	flex-direction: column;
	justify-content: center;
	z-index: 2;
}

.video > *:last-child > * > * > * span {
	color: var( --back-regular );
	font-family: 'Nimbus Sans';
	font-size: max( 64px, 10vh );
	font-weight: bold;
	text-shadow: 0 0 12px rgba( 0, 0, 0, 0.1 ), 0 0 4px rgba( 0, 0, 0, 0.05 );
	text-transform: uppercase;
}

.theme-dark .video > *:last-child > * > * > * span {
	color: var( --front-light );
}

.marquee {
	overflow: hidden;
	white-space: nowrap;
}

.marquee > * {
	display: flex;
	flex-direction: row;
	width: max-content;
	animation: marquee-animate 30s linear infinite;
		-webkit-animation: marquee-animate 30s linear infinite;
}

.marquee.marquee > * {
	animation-duration: 120s;
		-webkit-animation-duration: 120s;
}

.marquee > *,
.marquee > * > * {
	align-items: center;
	display: flex;
	flex-direction: row;
	gap: 0;
}

@keyframes marquee-animate {
	0% {
		transform: translateX( -0% );
			-webkit-transform: translateX( -0% );
	}
	
	100% {
		transform: translateX( -50% );
			-webkit-transform: translateX( -50% );
	}
}

@-webkit-keyframes marquee-animate {
	0% {
		transform: translateX( -0% );
			-webkit-transform: translateX( -0% );
	}
	
	100% {
		transform: translateX( -50% );
			-webkit-transform: translateX( -50% );
	}
}

.highlights {
	color: var( --front-reverse );
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 14px 12px;
	padding-bottom: 48px;
}

.highlights > input {
	display: none;
}

.highlights > input + * {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.highlights > input + * h2 {
	color: var( --front-reverse-light );
	font-size: 28px;
	text-align: center;
}

.theme-dark .highlights > input + * h2 {
	color: var( --front-light );
}

.highlights > input + * h2 span {
	display: inline-block;
	margin-bottom: 0em;
	max-height: 1.125em;
	overflow: hidden;
	transition: margin-bottom 0.6s ease-in-out, max-height 0.6s ease-in-out;
		-webkit-transition: margin-bottom 0.6s ease-in-out, max-height 0.6s ease-in-out;
}

.highlights > input + *:not( .scroll-driven-viewed ) h2 span {
	margin-bottom: 1.125em;
	max-height: 0em;
}

.highlights > input + * label {
	align-items: center;
	background: var( --back-medium );
	border-radius: 12px;
	display: flex;
	flex-direction: row;
	padding: 4px;
	position: relative;
	transition: opacity 0.6s ease-in-out;
		-webkit-transition: opacity 0.6s ease-in-out;
}

.highlights > input + *:not( .scroll-driven-viewed ) label {
	opacity: 0;
}

.highlights > input + * label span {
	border-radius: 8px;
	cursor: pointer;
	padding: 8px 12px;
	transition: color 0.2s ease-in-out;
		-webkit-transition: color 0.2s ease-in-out;
	z-index: 1;
}

.theme-dark .highlights > input + * label span {
	color: var( --front-regular );
}

.highlights > input + * label span:hover {
	color: var( --front-reverse-light );
}

.theme-dark .highlights > input + * label span:hover {
	color: var( --front-light );
}

.highlights > input + * label:after {
	background: var( --back-regular );
	border-radius: 8px;
	content: '';
	height: 81%;
	height: calc( 100% - 8px );
	left: 4px;
	position: absolute;
	top: 4px;
	width: 46%;
	width: calc( 50% - 6px );
	transition: left 0.2s ease-in-out;
		-webkit-transition: left 0.2s ease-in-out;
	z-index: 0;
}

.highlights > input:not( :checked ) + * label span:first-child,
.highlights > input:checked + * label span:last-child {
	color: var( --front-light );
}

.highlights > input:checked + * label:after {
	left: 52%;
	left: calc( 50% + 2px );
}

.highlights > input:checked + * + * > *:first-child,
.highlights > input:not( :checked ) + * + * > *:last-child {
	display: none;
}

.highlights > *:last-child {
	display: grid;
	grid-template-columns: 0fr 1fr 1fr;
	grid-gap: 12px;
	transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
		-webkit-transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
}

.highlights > *:last-child:not( .scroll-driven-viewed ) {
	opacity: 0;
	transform: translateY( 64px );
		-webkit-transform: translateY( 64px );
}

.highlights > *:last-child > *:first-child {
	margin-left: -12px;
}

.highlights > *:last-child > button {
	background: var( --third-a100 );
	border-radius: 32px;
	color: rgba( 255, 255, 255, 1 );
	padding: 8px 12px;
	margin-left: -12px;
	margin-right: auto;
}

.highlights > *:last-child > *:last-child {
	align-items: center;
	display: flex;
	flex-direction: row;
	gap: 8px;
	margin-left: auto;
}

.highlights > input + * + * > * {
	display: grid;
	grid-template-columns: 1fr;
	grid-gap: 18px;
}

@media screen and ( min-width: 680px ) {
	.highlights > input + * + * > * {
		grid-template-columns: 1fr 1fr;
	}
}

@media screen and ( min-width: 1080px ) {
	.highlights > input + * + * > * {
		grid-template-columns: 1fr 1fr 1fr;
	}
}

@media screen and ( min-width: 1400px ) {
	.highlights > input + * + * > * {
		grid-template-columns: 1fr 1fr 1fr 1fr;
	}
}

.highlights > input + * + * > * > * {
	aspect-ratio: 1/1;
	overflow: hidden;
	position: relative;
	transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
		-webkit-transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
}

.highlights > input + * + * > * > *:not( .scroll-driven-viewed ):nth-child( odd ) {
	opacity: 0;
	transform: translateX( 128px );
		-webkit-transform: translateX( 128px );
}

.highlights > input + * + * > * > *:not( .scroll-driven-viewed ):nth-child( even ) {
	opacity: 0;
	transform: translateX( -128px );
		-webkit-transform: translateX( -128px );
}

.highlights > input + * + * > * > * > a:first-child {
	background: var( --back-regular );
	color: var( --front-regular );
	border-radius: 100%;
	position: absolute;
	padding: 12px;
	right: 24px;
	top: 24px;
	z-index: 1;
}

.highlights > input + * + * > * > * > a:first-child + a {
	color: rgba( 255, 255, 255, 1 );
	font-size: 20px;
	left: 24px;
	padding: 12px;
	position: absolute;
	text-shadow: 0 0 12px rgba( 0, 0, 0, 0.175 ), 0 0 4px rgba( 0, 0, 0, 0.1 );
	top: 24px;
	width: 50%;
	z-index: 1;
}

.highlights > input + * + * > * > * > div:not( :last-child ) {
	border-radius: 24px;
	bottom: 0;
	left: 0;
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 0;
}

.highlights > input + * + * > * > * > div:not( :last-child ) img,
.highlights > input + * + * > * > * > div:not( :last-child ) video {
	bottom: 0;
	height: 100%;
	left: 0;
	object-fit: cover;
	object-position: center center;
	position: absolute;
	right: 0;
	top: 0;
	transform: scale( 1.5 ) translateY( calc( var( --parallax ) * 25% ) );
		-webkit-transform: scale( 1.5 ) translateY( calc( var( --parallax ) * 25% ) );
	transition: opacity 0.4s ease-in-out;
		-webkit-transition: opacity 0.4s ease-in-out;
	width: 100%;
}

.highlights > input + * + * > * > * > div:not( :last-child ) img:not( .active ),
.highlights > input + * + * > * > * > div:not( :last-child ) video:not( .active ) {
	opacity: 0;
}

.highlights > input + * + * > * > * > div:last-child {
	align-items: flex-end;
	bottom: 24px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	left: 24px;
	position: absolute;
	right: 24px;
}

.highlights > input + * + * > * > * > div:last-child > * {
	display: flex;
	flex-direction: row;
	gap: 8px;
}

.highlights > input + * + * > * > * > div:last-child > *:last-child {
	display: grid;
	grid-template-columns: repeat( auto-fill, minmax( 100px, 1fr ) );
	grid-gap: 8px;
	transform: scale( -1 );
		-webkit-transform: scale( -1 );
	width: 100%;
}

.highlights > input + * + * > * > * > div:last-child > * > * {
	background: var( --back-regular );
	border-radius: 8px;
	color: var( --front-regular );
	padding: 8px 12px;
}

.highlights > input + * + * > * > * > div:last-child > *:first-child > * {
	background: var( --back-light );
}

.highlights > input + * + * > * > * > div:last-child > *:last-child > * {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 100px;
	transform: scale( -1 );
		-webkit-transform: scale( -1 );
}

.highlights > input + * + * > * > * > div:last-child > *:last-child > * > span:first-child {
	font-size: 12px;
	opacity: 0.75;
}

.highlights > input + * + * > * > * > div:last-child > *:last-child > * > *:last-child {
	margin-left: auto;
}

.highlights > input + * + * > * > * > div:last-child > *:last-child > * b {
	color: var( --front-light );
}

.highlights > input + * + * > * > * > *:not( div ):not( :first-child ),
.highlights > input + * + * > * > * > div:last-child {
	transition: opacity 0.2s ease-in-out;
		-webkit-transition: opacity 0.2s ease-in-out;
}

.highlights > input + * + * > * > *:hover > *:not( div ):not( :first-child ),
.highlights > input + * + * > * > *:hover > div:last-child {
	opacity: 0;
	transition-delay: 0.75s;
		-webkit-transition-delay: 0.75s;
}

@media screen and ( min-width: 768px ) {
	.highlights > input + * h2 {
		font-size: 35px;
	}

	.highlights > input + * + * > * > * > a:first-child + a {
		font-size: 24px;
	}

	.highlights > input + * + * > * > * > div:last-child > *:last-child > * > span:first-child {
		font-size: 14px;
	}
}

@media screen and ( min-width: 1280px ) {
	.highlights {
		gap: 24px;
	}
	
	.highlights > input + * {
		align-items: flex-start;
		flex-direction: row;
		gap: 24px;
		justify-content: space-between;
	}
	
	.highlights > input + * + * > * {
		grid-gap: 24px;
	}
}

.stats {
	display: flex;
	flex-direction: column-reverse;
	gap: 14px;
	padding: 14px 12px;
	padding-top: 32px;
}

.stats > *:first-child {
	display: flex;
	flex-direction: column;
	gap: 24px;
	justify-content: space-between;
}

.stats > *:first-child > *:first-child {
	display: flex;
	flex-direction: column;
	gap: 14px;
	width: 75%;
	transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
		-webkit-transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
}

.stats > *:first-child:not( .scroll-driven-viewed ) > *:first-child {
	opacity: 0;
	transform: translateX( 128px );
		-webkit-transform: translateX( 128px );
}

.stats > *:first-child > *:first-child p {
	opacity: 0.66667;
}

.stats > *:first-child > *:first-child > div {
	align-items: center;
	display: flex;
	flex-direction: row;
	gap: 8px;
}

.stats > *:first-child > *:first-child > div div {
	white-space: nowrap;
}

.stats > *:first-child > *:first-child > div div img {
	border-radius: 100%;
	display: inline-block;
	height: 64px;
	object-fit: cover;
	object-position: center center;
	width: 64px;
}

.stats > *:first-child > *:first-child > div div img + img {
	margin-left: -24px;
}

.stats > *:first-child > *:last-child > * {
	align-items: center;
	display: grid;
	grid-template-columns: 1fr 2fr;
	grid-gap: 12px;
	padding: 24px 0;
}

.stats > *:first-child > *:last-child > *:not( :last-child ) {
	border-bottom: solid var( --back-light ) 1px;
}

.stats > *:first-child > *:last-child > * > span {
	color: var( --front-light );
	font-family: 'Nimbus Sans';
	font-weight: bold;
	font-size: 48px;
	letter-spacing: -4px;
}

.stats > *:first-child > *:last-child > * p {
	font-size: 24px;
}

.stats > *:first-child > *:last-child > * p span {
	display: inline-block;
	margin-bottom: 0em;
	max-height: 2.5em;
	overflow: hidden;
	transition: margin-bottom 0.6s ease-in-out, max-height 0.6s ease-in-out;
		-webkit-transition: margin-bottom 0.6s ease-in-out, max-height 0.6s ease-in-out;
}

.stats > *:first-child:not( .scroll-driven-viewed ) > *:last-child > * p span {
	margin-bottom: 1.125em;
	max-height: 0em;
}

.stats > *:last-child {
	border-radius: 24px;
	overflow: hidden;
	transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
		-webkit-transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
}

.stats > *:last-child:not( .scroll-driven-viewed ) {
	opacity: 0;
	transform: translateX( -128px );
		-webkit-transform: translateX( -128px );
}

.stats > *:last-child img {
	height: 33.33333vh;
	object-fit: cover;
	object-position: center center;
	transform: scale( 1.5 ) translateY( calc( var( --parallax ) * 25% ) );
		-webkit-transform: scale( 1.5 ) translateY( calc( var( --parallax ) * 25% ) );
	width: 100%;
}

@media screen and ( min-width: 720px ) {
	.stats > *:last-child img {
		height: 50vh;
	}
}

@media screen and ( min-width: 992px ) {
	.stats {
		flex-direction: row;
	}

	.stats > *:first-child {
		width: 66.66667%;
	}

	.stats > *:last-child {
		width: 33.33333%;
	}
}

@media screen and ( min-width: 1280px ) {
	.stats > * {
		width: 50% !important;
	}
}

.read-more {
	background: var( --back-dark );
	color: var( --front-reverse );
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 24px;
	padding-top: 48px;
}

.read-more > *:first-child {
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 100%;
}

.read-more > *:first-child h2 {
	color: var( --front-reverse-light );
	font-size: 28px;
	text-align: center;
}

.theme-dark .read-more > *:first-child h2 {
	color: var( --front-light );
}

.read-more > *:first-child h2 span {
	display: inline-block;
	margin-bottom: 0em;
	max-height: 1.125em;
	overflow: hidden;
	transition: margin-bottom 0.6s ease-in-out, max-height 0.6s ease-in-out;
		-webkit-transition: margin-bottom 0.6s ease-in-out, max-height 0.6s ease-in-out;
}

.read-more > *:first-child:not( .scroll-driven-viewed ) h2 span {
	margin-bottom: 1.125em;
	max-height: 0em;
}

.read-more > *:first-child p,
.read-more > *:first-child p a {
	align-items: center;
	display: flex;
	flex-direction: row;
	gap: 4px;
}

.theme-dark .read-more > *:first-child p a {
	color: var( --front-regular );
}

.read-more > *:first-child p {
	transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
		-webkit-transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
}

.read-more > *:first-child:not( .scroll-driven-viewed ) p {
	opacity: 0;
	transform: translateX( -100% );
		-webkit-transform: translateX( -100% );
}

.read-more > *:last-child {
	align-items: flex-end;
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin-left: auto;
}

.read-more > *:last-child a {
	align-items: center;
	background: var( --back-regular );
	border-radius: 38px;
	color: var( --front-light );
	display: flex;
	flex-direction: row;
	gap: 12px;
	max-width: 300px;
	overflow: hidden;
	padding: 4px;
	transition: opacity 0.6s ease-in-out, max-width 0.6s ease-in-out 0.4s;
		-webkit-transition: opacity 0.6s ease-in-out, max-width 0.6s ease-in-out 0.4s;
	width: 100%;
}

.read-more > *:last-child a + a {
	transition: opacity 0.6s ease-in-out 0.2s, max-width 0.6s ease-in-out 0.6s;
		-webkit-transition: opacity 0.6s ease-in-out 0.2s, max-width 0.6s ease-in-out 0.6s;
}

.read-more > *:last-child a + a + a {
	transition: opacity 0.6s ease-in-out 0.4s, max-width 0.6s ease-in-out 0.8s;
		-webkit-transition: opacity 0.6s ease-in-out 0.4s, max-width 0.6s ease-in-out 0.8s;
}

.read-more > *:last-child a + a + a + a {
	transition: opacity 0.6s ease-in-out 0.6s, max-width 0.6s ease-in-out 1s;
		-webkit-transition: opacity 0.6s ease-in-out 0.6s, max-width 0.6s ease-in-out 1s;
}

.read-more > *:last-child:not( .scroll-driven-viewed ) a {
	max-width: 72px;
	opacity: 0;
}

.read-more > *:last-child a img {
	border-radius: 100%;
	height: 64px;
	object-fit: cover;
	object-position: center center;
	width: 64px;
}

.read-more > *:last-child a p {
	margin-right: auto;
	max-width: 8em;
	transition: opacity 0.6s ease-in-out, max-width 0.6s ease-in-out;
		-webkit-transition: opacity 0.6s ease-in-out, max-width 0.6s ease-in-out;
	white-space: nowrap;
}

.read-more > *:last-child a + a p {
	transition: opacity 0.6s ease-in-out 0.2s, max-width 0.6s ease-in-out 0.2s;
		-webkit-transition: opacity 0.6s ease-in-out 0.2s, max-width 0.6s ease-in-out 0.2s;
}

.read-more > *:last-child a + a + a p {
	transition: opacity 0.6s ease-in-out 0.4s, max-width 0.6s ease-in-out 0.4s;
		-webkit-transition: opacity 0.6s ease-in-out 0.4s, max-width 0.6s ease-in-out 0.4s;
}

.read-more > *:last-child a + a + a + a p {
	transition: opacity 0.6s ease-in-out 0.6s, max-width 0.6s ease-in-out 0.6s;
		-webkit-transition: opacity 0.6s ease-in-out 0.6s, max-width 0.6s ease-in-out 0.6s;
}

.read-more > *:last-child:not( .scroll-driven-viewed ) a p {
	max-width: 0em;
	opacity: 0;
}

.read-more > *:last-child a i:last-child {
	font-size: 24px;
	margin: 8px 14px;
	transition: opacity 0.6s ease-in-out;
		-webkit-transition: opacity 0.6s ease-in-out;
}

.read-more > *:last-child a + a i:last-child {
	transition: opacity 0.6s ease-in-out 0.2s;
		-webkit-transition: opacity 0.6s ease-in-out 0.2s;
}

.read-more > *:last-child a + a + a i:last-child {
	transition: opacity 0.6s ease-in-out 0.4s;
		-webkit-transition: opacity 0.6s ease-in-out 0.4s;
}

.read-more > *:last-child a + a + a i:last-child {
	transition: opacity 0.6s ease-in-out 0.6s;
		-webkit-transition: opacity 0.6s ease-in-out 0.6s;
}

.read-more > *:last-child:not( .scroll-driven-viewed ) a i:last-child {
	opacity: 0;
}

@media screen and ( min-width: 768px ) {
	.read-more > *:first-child h2 {
		font-size: 35px;
		text-align: left;
	}
}

.tags {
	background: var( --back-dark );
	padding: 48px 24px;
}

.tags > * {
	margin: 0 -24px;
}

.tags span {
	background: var( --back-medium );
	border-radius: max( 92px, 15vh );
	display: inline-block;
	font-family: 'Nimbus Sans';
	font-size: max( 64px, 10vh );
	margin-right: 24px;
	opacity: 0.5;
	padding: 12px 24px;
	padding-bottom: 8px;
	text-transform: uppercase;
}

.areas {
	background: var( --back-dark );
	color: var( --front-reverse );
	height: 300vh;
	height: calc( 300 * var( --vh ) );
	overflow: hidden;
	position: relative;
}

.areas > * {
	left: 50%;
	position: absolute;
	top: calc( var( --over ) * 200 * var( --vh ) + 50 * var( --vh ) );
	transform: translate( -50%, -50% );
		-webkit-transform: translate( -50%, -50% );
	width: 75%;
	width: calc( 100% - 64px );
}

.areas > * h2 {
	color: var( --front-reverse-light );
	opacity: calc( var( --over ) * 3 );
	text-align: center;
}

.theme-dark .areas > * h2 {
	color: var( --front-light );
}

.areas > * > div {
	aspect-ratio: 1/1;
	margin: auto;
	position: relative;
	width: 75%;
	width: calc( 100% - 64px );
}

.areas > * > div > div {
	align-items: center;
	aspect-ratio: 1/1;
	border-radius: 100%;
	border: solid var( --front-reverse ) 1px;
	display: flex;
	height: 66.66667%;
	justify-content: center;
	left: 50%;
	opacity: calc( var( --over ) * 2 );
	position: absolute;
	top: 50%;
	transform: translate( -50%, -50% ) rotateZ( calc( 0deg + var( --over ) * 180deg ) ) translateY( calc( -100% + var( --over ) * 50% ) );
		-webkit-transform: translate( -50%, -50% ) rotateZ( calc( 0deg + var( --over ) * 180deg ) ) translateY( calc( -100% + var( --over ) * 50% ) );
	width: 66.66667%;
}

.theme-dark .areas > * > div > div {
	border: solid var( --front-regular ) 1px;
}

.areas > * > div > div + div {
	transform: translate( -50%, -50% ) rotateZ( calc( 120deg + var( --over ) * 180deg ) ) translateY( calc( -100% + var( --over ) * 50% ) );
		-webkit-transform: translate( -50%, -50% ) rotateZ( calc( 120deg + var( --over ) * 180deg ) ) translateY( calc( -100% + var( --over ) * 50% ) );
}

.areas > * > div > div + div + div {
	transform: translate( -50%, -50% ) rotateZ( calc( 240deg + var( --over ) * 180deg ) ) translateY( calc( -100% + var( --over ) * 50% ) );
		-webkit-transform: translate( -50%, -50% ) rotateZ( calc( 240deg + var( --over ) * 180deg ) ) translateY( calc( -100% + var( --over ) * 50% ) );
}

.areas > * > div > div span {
	color: var( --front-reverse-light );
	text-align: center;
	transform: rotateZ( calc( 0deg - var( --over ) * 180deg ) );
		-webkit-transform: rotateZ( calc( 0deg - var( --over ) * 180deg ) );
}

.theme-dark .areas > * > div > div span {
	color: var( --front-light );
}

.areas > * > div > div + div span {
	transform: rotateZ( calc( -120deg - var( --over ) * 180deg ) );
		-webkit-transform: rotateZ( calc( -120deg - var( --over ) * 180deg ) );
}

.areas > * > div > div + div + div span {
	transform: rotateZ( calc( -240deg - var( --over ) * 180deg ) );
		-webkit-transform: rotateZ( calc( -240deg - var( --over ) * 180deg ) );
}

@media screen and ( min-width: 768px ) {
	.areas > * h2 {
		font-size: 35px;
	}

	.areas > * > div {
		height: 66.66667vh;
		width: auto;
	}

	.areas > * > div > div {
		height: 50%;
		width: 50%;
	}
}

.advantages {
	display: flex;
	flex-direction: column;
	gap: 24px;
	padding: 14px 24px;
	padding-top: 48px;
}

.advantages > *:first-child {
	display: flex;
	flex-direction: column-reverse;
	gap: 14px;
}

.advantages > *:first-child h2 {
	font-size: 28px;
	overflow: hidden;
}

.advantages > *:first-child h2 span {
	display: inline-block;
	transition: transform 0.6s ease-in-out 0.3s;
		-webkit-transition: transform 0.6s ease-in-out 0.3s;
}

.advantages > *:first-child:not( .scroll-driven-viewed ) h2 span {
	transform: translateY( -100% );
		-webkit-transform: translateY( -100% );
}

.advantages > *:first-child p {
	transition: opacity 0.6s ease-in-out 0.3s, transform 0.6s ease-in-out 0.3s;
		-webkit-transition: opacity 0.6s ease-in-out 0.3s, transform 0.6s ease-in-out 0.3s;
}

.advantages > *:first-child:not( .scroll-driven-viewed ) p {
	opacity: 0;
	transform: translateX( -100% );
		-webkit-transform: translateX( -100% );
}

.advantages > *:last-child {
	display: grid;
	grid-template-columns: repeat( auto-fill, minmax( 320px, 1fr ) );
	grid-gap: 24px;
}

.advantages > *:last-child > * {
	align-items: flex-start;
	display: flex;
	flex-direction: column;
	gap: 14px;
	transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
		-webkit-transition: opacity 0.6s ease-in-out 0.3s, transform 0.6s ease-in-out;
}

.advantages > *:last-child > *:not( .scroll-driven-viewed ) {
	opacity: 0;
	transform: translateY( 128px );
		-webkit-transform: translateY( 128px );
}

.advantages > *:last-child > * i {
	font-size: 48px;
}

.advantages > *:last-child > * p {
	margin-top: 8px;
	opacity: 0.66667;
}

@media screen and ( min-width: 768px ) {
	.advantages > *:first-child h2 {
		font-size: 35px;
	}

	.advantages > *:last-child > * span {
		font-size: 24px;
	}

	.advantages > *:last-child > * p {
		font-size: 20px;
	}
}

.categories {
	display: flex;
	flex-direction: column;
	gap: 24px;
	padding: 64px 24px;
}

.categories h2 {
	text-align: center;
}

.categories h2 span {
	display: inline-block;
	margin-bottom: 0em;
	max-height: 1.125em;
	overflow: hidden;
	transition: margin-bottom 0.6s ease-in-out, max-height 0.6s ease-in-out;
		-webkit-transition: margin-bottom 0.6s ease-in-out, max-height 0.6s ease-in-out;
}

.categories h2:not( .scroll-driven-viewed ) span {
	margin-bottom: 1.125em;
	max-height: 0em;
}

.categories > *:last-child {
	align-items: center;
	display: grid;
	grid-gap: 14px;
	grid-template-columns: 1fr;
	transition: opacity 0.6s ease-in-out;
		-webkit-transition: opacity 0.6s ease-in-out;
}

.categories > *:last-child:not( .scroll-driven-viewed ) {
	opacity: 0;
}

.categories > *:last-child > * {
	display: flex;
	flex-direction: column;
	gap: 14px;
	position: relative;
}

.categories > *:last-child > *:not( :first-child ) {
	display: none;
}

.categories > *:last-child > *:nth-child( 1 ) {
	animation-delay: -8s;
		-webkit-animation-delay: -8s;
}

.categories > *:last-child > *:nth-child( 2 ) {
	animation-delay: -6s;
		-webkit-animation-delay: -6s;
}

.categories > *:last-child > *:nth-child( 3 ) {
	animation-delay: -4s;
		-webkit-animation-delay: -4s;
}

.categories > *:last-child > *:nth-child( 4 ) {
	animation-delay: -2s;
		-webkit-animation-delay: -2s;
}

.categories > *:last-child > *:nth-child( 5 ) {
	animation-delay: 0s;
		-webkit-animation-delay: 0s;
}

@keyframes categories-flow {
	0%, 100% {
		transform: translateY( 0% );
			-webkit-transform: translateY( 0% );
	}
	
	25% {
		transform: translateY( -64px );
			-webkit-transform: translateY( -64px );
	}
	
	75% {
		transform: translateY( 64px );
			-webkit-transform: translateY( 64px );
	}
}

@-webkit-keyframes categories-flow {
	0%, 100% {
		transform: translateY( 0% );
			-webkit-transform: translateY( 0% );
	}
	
	25% {
		transform: translateY( -64px );
			-webkit-transform: translateY( -64px );
	}
	
	75% {
		transform: translateY( 64px );
			-webkit-transform: translateY( 64px );
	}
}

.categories > *:last-child > * a {
	border-radius: 24px;
	overflow: hidden;
	position: relative;
}

.categories > *:last-child > * a:after {
	background: radial-gradient( circle at 0% 150%, var( --back-dark ), transparent );
	bottom: 0;
	content: '';
	left: 0;
	pointer-events: none;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 0;
}

.categories > *:last-child > * a img {
	display: block;
	width: 100%;
}

.categories > *:last-child > * a button {
	background: var( --back-regular );
	border-radius: 100%;
	color: var( --front-regular );
	position: absolute;
	padding: 12px;
	right: 24px;
	top: 24px;
	z-index: 1;
}

.categories > *:last-child > * a div {
	bottom: 24px;
	color: var( --front-reverse-light );
	display: flex;
	flex-direction: column;
	gap: 8px;
	left: 24px;
	position: absolute;
	z-index: 1;
}

.theme-dark .categories > *:last-child > * a div {
	color: var( --front-light );
}

.categories > *:last-child > * a div p {
	font-family: 'Nimbus Sans';
	font-size: 20px;
	margin-right: 16px;
}

.categories > *:last-child > * a.categories-brand {
	border-radius: 0;
}

.categories > *:last-child > * a.categories-brand:after {
	display: none;
}

.categories > *:last-child > * a.categories-brand img {
	filter: saturate( 10 ) hue-rotate( 325deg );
		-webkit-filter: saturate( 10 ) hue-rotate( 325deg );
	margin: auto;
	max-width: 240px;
}

.categories > *:last-child > * a.categories-brand button {
	display: none;
}

.categories > *:last-child > * a.categories-brand div {
	position: static;
}

.categories > *:last-child > * a.categories-brand div p {
	color: var( --front-light );
	font-size: 1rem;
	margin: 0 24px;
	text-align: center;
}

@media screen and ( min-width: 768px ) {
	.categories > *:last-child {
		grid-template-columns: 1fr 1fr 1fr;
		padding: 64px 0;
	}
	
	.categories > *:last-child > * {
		animation: categories-flow 10s ease-in-out infinite;
			-webkit-animation: categories-flow 10s ease-in-out infinite;
	}
	
	.categories > *:last-child > *:nth-child( 2 ),
	.categories > *:last-child > *:nth-child( 3 ) {
		display: flex;
	}

	.categories h2 {
		font-size: 35px;
	}

	.categories > *:last-child > * a div p {
		font-size: 24px;
	}
}

@media screen and ( min-width: 1280px ) {
	.categories > *:last-child {
		grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
		grid-gap: 24px;
	}
	
	.categories > *:last-child > * {
		gap: 24px;
	}
	
	.categories > *:last-child > *:nth-child( 4 ),
	.categories > *:last-child > *:nth-child( 5 ) {
		display: flex;
	}
}

.newsletter {
	min-height: 50vh;
	min-height: max( calc( 50 * var( --vh ) ), 340px );
	overflow: hidden;
	position: relative;
}

.newsletter > *:first-child {
	z-index: 1;
}

.newsletter > *:first-child,
.newsletter > *:last-child,
.newsletter > *:first-child > * {
	bottom: 0;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
}

.newsletter > *:first-child > * {
	border-radius: 24px;
	height: 100%;
	object-fit: cover;
	object-position: center center;
	transform: scale( calc( 1.25 - var( --parallax ) ) );
		-webkit-transform: scale( calc( 1.25 - var( --parallax ) ) );
	width: 100%;
}

.newsletter > *:last-child {
	display: flex;
	flex-direction: column;
	justify-content: center;
	z-index: 2;
}

.newsletter > *:last-child > form {
	background: linear-gradient( 135deg, var( --back-regular ), var( --back-light ) );
		background: -webkit-linear-gradient( 315deg, var( --back-regular ), var( --back-light ) );
	border-radius: 24px;
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin: auto;
	max-width: 320px;
	padding: 24px;
	width: fit-content;
}

.newsletter > *:last-child > form h2 {
	font-family: 'Nimbus Sans';
	font-size: 28px;
}

.newsletter > *:last-child > form h2 + p {
	opacity: 0.66667;
}

.newsletter > *:last-child > form label {
	position: relative;
}

.newsletter > *:last-child > form label input {
	border-bottom: solid var( --front-regular ) 1px;
	margin-top: 8px;
	min-width: 180px;
	padding: 8px 0;
	width: 100%;
}

.newsletter > *:last-child > form label span {
	left: 0;
	opacity: 0.5;
	position: absolute;
	top: 58.5%;
	transform: translateY( -50% );
		-webkit-transform: translateY( -50% );
	transition: top 0.2s ease-in-out;
		-webkit-transition: top 0.2s ease-in-out;
	white-space: nowrap;
}

.newsletter > *:last-child > form label input.active + span,
.newsletter > *:last-child > form label input:focus + span {
	top: 2.5%;
}

.theme-dark .newsletter > *:last-child > form > input {
	color: var( --front-light );
}

.newsletter > *:last-child > form > input {
	background: var( --third-a100 );
	border-radius: 24px;
	color: var( --front-reverse-light );
	cursor: pointer;
	margin: auto;
	margin-top: 8px;
	padding: 8px 16px;
	transition: opacity 0.2s ease-in-out;
		-webkit-transition: opacity 0.2s ease-in-out;
}

.newsletter > *:last-child > form > input:not( :hover ) {
	opacity: 0.66667;
}

@media screen and ( min-width: 768px ) {
	.newsletter > *:last-child > form {
		max-width: 540px;
	}

	.newsletter > *:last-child > form h2 {
		font-size: 35px;
	}
}

@media screen and ( min-width: 992px ) {
	.newsletter > *:last-child > form {
		max-width: 720px;
		width: 100%;
	}

	.newsletter > *:last-child > form h2 + p {
		max-width: 360px;
	}

	.newsletter > *:last-child > form label input {
		max-width: 240px;
	}

	.newsletter > *:last-child > form > input {
		margin-left: 0;
	}
}

@media screen and ( min-width: 992px ) {
	.newsletter {
		min-height: max( calc( 66.66667 * var( --vh ) ), 480px );
	}
}

.locations {
	display: flex;
	justify-content: center;
	min-height: 50vh;
	min-height: calc( 50 * var( --vh ) );
}

.locations > * {
	margin: auto calc( -1 * ( 12px - ( 2 * var( --over ) - 1 ) * 12px ) );
}

.locations > * img {
	filter: grayscale( 1 );
		-webkit-filter: grayscale( 1 );
	height: 92px;
	margin: 0 24px;
	opacity: 0.5;
	transition: filter 0.2s ease-in-out, opacity 0.2s ease-in-out;
		-webkit-transition: filter 0.2s ease-in-out, opacity 0.2s ease-in-out;
}

.locations > * img:hover {
	filter: grayscale( 0 );
		-webkit-filter: grayscale( 0 );
	opacity: 1;
}

@media screen and ( min-width: 992px ) {
	.locations > * img {
		height: 128px;
	}
}

@media screen and ( min-width: 1080px ) {
	.locations > * img {
		margin: 0 48px;
	}
}

@media screen and ( min-width: 1280px ) {
	.locations > * img {
		height: 192px;
	}
}

.footer {
	display: grid;
	grid-template-columns: 1fr;
}

.footer > * {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 24px;
}

.footer > *:first-child > p {
	text-align: center;
}

.footer > *:first-child > a + p {
	padding: 8px 0;
	position: relative;
}

.footer > *:first-child > a + p:before {
	background: var( --front-regular );
	content: '';
	height: 2px;
	left: 33.33333%;
	opacity: 0.5;
	position: absolute;
	right: 33.33333%;
	top: 100%;
}

.footer > *:first-child > p b {
	display: inline-block;
	font-size: 1.25em;
	margin-bottom: 8px;
}

.footer > *:first-child > p:last-child a {
	border-bottom: solid var( --third-a100 ) 2px;
	display: inline-block;
	margin: 2px 0;
	padding-bottom: 4px;
}

.footer > * > p:first-child {
	font-size: 20px;
	opacity: 0.66667;
}

.footer > *:first-child img {
	filter: saturate( 10 ) hue-rotate( 325deg );
		-webkit-filter: saturate( 10 ) hue-rotate( 325deg );
	width: 128px;
}

.footer > *:not( :first-child ):not( :last-child ) a {
	color: var( --front-light );
	width: fit-content;
}

.footer > *:not( :first-child ):not( :last-child ) a:hover {
	text-decoration: underline;
}

.footer > *:last-child > div:first-child {
	align-items: center;
	display: flex;
	flex-direction: row;
	gap: 14px;
}

.footer > *:last-child > div:first-child img {
	border-radius: 100%;
	height: 64px;
	object-fit: cover;
	object-position: center center;
	width: 64px;
}

.footer > *:last-child > div:first-child div {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.footer > *:last-child > div:first-child div span {
	opacity: 0.66667;
}

.footer > *:last-child > p {
	font-size: 20px;
	margin-top: 8px;
}

.footer > *:last-child > div:last-child {
	align-items: center;
	display: flex;
	flex-direction: row;
	gap: 14px;
}

.footer > *:last-child > div:last-child a:first-child {
	background: var( --back-dark );
	border-radius: 24px;
	color: var( --front-reverse );
	padding: 8px 16px;
	transition: background 0.2s ease-in-out, color 0.2s ease-in-out;
		-webkit-transition: background 0.2s ease-in-out, color 0.2s ease-in-out;
}

.theme-dark .footer > *:last-child > div:last-child a:first-child {
	background: var( --front-regular );
}

.footer > *:last-child > div:last-child a:first-child:hover {
	color: var( --front-reverse-light );
}

.theme-dark .footer > *:last-child > div:last-child a:first-child:hover {
	background: var( --front-light );
}

.footer > *:last-child > div:last-child a:not( :first-child ) {
	font-size: 20px;
}

@media screen and ( min-width: 768px ) {
	.footer {
		grid-template-columns: 1fr 1fr;
		padding: 24px;
	}

	.footer > *:first-child img {
		width: 184px;
	}

	.footer > * > p:first-child {
		font-size: 24px;
	}
}

@media screen and ( min-width: 1080px ) {
	.footer {
		grid-template-columns: 1fr 1fr 1fr;
		padding: 24px;
	}
}

.copyright {
	display: flex;
	flex-direction: column;
	font-size: 16px;
	gap: 8px;
	padding: 24px;
	padding-top: 0;
}

.copyright p {
	opacity: 0.66667;
}

.copyright div {
	align-items: center;
	display: flex;
	flex-direction: row;
	gap: 14px;
}

.copyright div a {
	color: var( --front-light );
	width: fit-content;
}

.copyright div a:hover {
	text-decoration: underline;
}

.map > * {
	height: 100%;
	left: 50%;
	position: relative;
	top: 50%;
	transform: translate( -50%, 0% );
		-webkit-transform: translate( -50%, 0% );
	width: 100%;
}

.map > * > * {
	aspect-ratio: 1/1;
	height: 500px; /**/
	height: min( 100vh, 100vw );
	margin: auto;
	overflow: hidden;
	overflow-y: auto;
	position: relative;
	top: 50%;
	user-drag: none;
		-webkit-user-drag: none;
	user-select: none;
		-webkit-user-select: none;
	width: 500px; /**/
	width: min( 100vh, 100vw );
}

.map > * > *::-webkit-scrollbar {
	height: 0;
	width: 0;
}

.map > * > *::-webkit-scrollbar-track {
	background: transparent;
}

.map > * > *::-webkit-scrollbar-thumb {
  background: transparent;
}

.map > * > *::-webkit-scrollbar-thumb:hover {
  background: transparent;
}

.map > * > *:after {
	content: '';
	height: 200%;
	width: 100%;
}

.map > * > * > * {
	height: 100%;
	left: 50%;
	left: calc( 50% + calc( var( --x ) * 1px ) );
	position: absolute;
	top: calc( 50% + calc( var( --y ) * 1px ) );
	transform: translate( -50%, -0% ) scale( var( --zoom ) );
		-webkit-transform: translate( -50%, -0% ) scale( var( --zoom ) );
	width: 100%;
}

.map > * > * > div:first-child {
	filter: invert( 1 );
		-webkit-filter: invert( 1 );
	pointer-events: none;
	transition: opacity 0.2s ease-in-out;
		-webkit-transition: opacity 0.2s ease-in-out;
}

.map.map-scroll > * > * > div:first-child {
	opacity: 0;
}

.map > * > * > div:first-child #gmap {
	height: min( 200vh, 200vw );
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate( -50%, -50% ) scale( calc( 1 / var( --zoom ) ) );
		-webkit-transform: translate( -50%, -50% ) scale( calc( 1 / var( --zoom ) ) );
	width: min( 200vh, 200vw );
}

.map > * > * > div:first-child #gmap:after {
	backdrop-filter: saturate( 25 ) grayscale( 1 );
		-webkit-backdrop-filter: saturate( 25 ) grayscale( 1 );
	background: #1a1c20;
	bottom: 0;
	content: '';
	left: 0;
	mix-blend-mode: color-burn;
		-webkit-mix-blend-mode: color-burn;
	pointer-events: none;
	position: absolute;
	right: 0;
	top: 0;
}

.map > * > * svg {
	height: 100%;
	transform: translate( -50%, 0% ) rotateZ( 0deg ) scaleX( calc( var( --zoom ) * 1 ) ) scaleY( calc( var( --zoom ) * 1 ) );
		-webkit-transform: translate( -50%, 0% ) rotateZ( 0deg ) scaleX( calc( var( --zoom ) * 1 ) ) scaleY( calc( var( --zoom ) * 1 ) );
	width: 100%;
}

.map > * > * svg path {
	cursor: pointer;
	fill: var( --front-regular );
	stroke: var( --front-reverse-light );
	stroke-miterlimit: 10;
	stroke-width: 0.25px;
	transition: fill 0.2s ease-in-out;
		-webkit-transition: fill 0.2s ease-in-out;
}

.map > * > * svg g:hover path {
	fill: var( --front-light );
}

.map > * > * svg g path:hover {
	fill: var( --third-a100 );
}

.map > * > * > div:last-child {
	height: 0;
	top: calc( 100% + calc( var( --y )* 1px ) );
	width: 0;
}

.map > * > * > div:last-child > div {
	background: var( --front-reverse-light );
	border-radius: 50%;
	box-shadow: 0 0 8px var( --front-light );
	cursor: pointer;
	height: 8px;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate( -50%, -50% ) scale( calc( 1 / var( --zoom ) ) );
		-webkit-transform: translate( -50%, -50% ) scale( calc( 1 / var( --zoom ) ) );
	width: 8px;
}

.map > * > * > div:last-child > div > span:first-child {
	aspect-ratio: 1/1;
	background: var( --front-light );
	border: solid var( --back-regular ) 2px;
	border-radius: 8px;
	bottom: 150%;
	box-shadow: 0 0 8px var( --front-light );
	color: var( --back-regular );
	height: 1.875em;
	left: 50%;
	padding: 0.25em;
	position: absolute;
	text-align: center;
	transform: translateX( -50% );
		-webkit-transform: translateX( -50% );
}

.map > * > * > div:last-child > div.map-number > span:first-child {
	border-radius: 100%;
}

.map > * > * > div:last-child > div > span:first-child i {
	transform: translate( 5%, 5% );
		-webkit-transform: translate( 5%, 5% );
}

.map > * > * > div:last-child > div > span:first-child b {
	display: block;
	transform: translate( 5%, 5% );
		-webkit-transform: translate( 5%, 5% );
}

.map > * > * > div:last-child > div > span:last-child {
	background: var( --back-regular );
	border-radius: 8px;
	box-shadow: 0 0 8px var( --front-light );
	color: var( --front-light );
	font-size: 10px;
	left: 50%;
	padding: 4px;
	position: absolute;
	top: 150%;
	transform: translateX( -50% );
		-webkit-transform: translateX( -50% );
	white-space: nowrap;
}

.pane {
	position: relative;
}

.pane.pane-out {
	background: var( --back-regular );
	margin: calc( ( 2 * var( --over ) - 1 ) * -12px ) 0;
}

.pane.pane-out > * {
	background: var( --back-dark );
	border-radius: calc( ( 2 * var( --over ) - 1 ) * 48px );
	margin: calc( ( 2 * var( --over ) - 1 ) * 12px );
	padding: calc( 12px - ( 2 * var( --over ) - 1 ) * 12px );
}

@media screen and ( min-width: 1080px ) {
	.pane.pane-out {
		background: var( --back-regular );
		margin: calc( ( 2 * var( --over ) - 1 ) * -24px ) 0;
	}
	
	.pane.pane-out > * {
		border-radius: calc( ( 2 * var( --over ) - 1 ) * 96px );
		margin: calc( ( 2 * var( --over ) - 1 ) * 24px );
		padding: calc( 24px - ( 2 * var( --over ) - 1 ) * 24px );
	}
}

@media screen and ( min-width: 1400px ) {
	.pane.pane-out {
		background: var( --back-regular );
		margin: calc( ( 2 * var( --over ) - 1 ) * -36px ) 0;
	}
	
	.pane.pane-out > * {
		border-radius: calc( ( 2 * var( --over ) - 1 ) * 144px );
		margin: calc( ( 2 * var( --over ) - 1 ) * 36px );
		padding: calc( 36px - ( 2 * var( --over ) - 1 ) * 36px );
	}
}

.pane.pane-out.pane-out-reverse {
	background: var( --back-dark );
}

.pane.pane-out.pane-out-light {
	background: var( --back-regular );
}

.pane.pane-out.pane-out-light {
	background: var( --back-regular );
}

.pane.pane-out.pane-out-reverse > * {
	background: var( --back-regular );
}

.pane.pane-out.pane-out-light > * {
	background: var( --back-light );
}

.pane.pane-switch {
	background: var( --back-light );
	overflow: hidden;
}

.pane.pane-switch.pane-switch-dark {
	background: var( --back-dark );
}

.pane.pane-switch.pane-switch-light {
	background: var( --back-regular );
}

.pane.pane-switch > *:last-child {
	background: var( --back-dark );
	bottom: 0;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	transform: translateY( 100% - 100% * var( --over ) );
		-webkit-transform: translateY( calc( 100% - 100% * var( --over ) ) );
}

.pane.pane-switch.pane-switch-dark > *:last-child {
	background: var( --back-light );
}

.pane.pane-switch.pane-switch-light > *:last-child {
	background: var( --back-light );
}
