@font-face {
	font-family: 'LG-R';
	src: url('/fonts/LG-R.woff2') format('woff2');
	font-display: swap;
	ascent-override: 95.2%;
	descent-override: 25%;
	line-gap-override: 0%;
	size-adjust: 100%;
}
@font-face {
	font-family: 'LG-I';
	src: url('/fonts/LG-I.woff2') format('woff2');
	font-display: swap;
	font-style: italic;
	ascent-override: 95.2%;
	descent-override: 25%;
	line-gap-override: 0%;
	size-adjust: 100%;
}
@font-face {
	font-family: 'LG-C';
	src: url('/fonts/LG-C.woff2') format('woff2');
	font-display: swap;
	font-stretch: condensed;
	ascent-override: 95.2%;
	descent-override: 25%;
	line-gap-override: 0%;
	size-adjust: 100%;
}
@font-face {
	font-family: 'LG-CI';
	src: url('/fonts/LG-CI.woff2') format('woff2');
	font-display: swap;
	font-style: italic;
	font-stretch: condensed;
	ascent-override: 95.2%;
	descent-override: 25%;
	line-gap-override: 0%;
	size-adjust: 100%;
}
@font-face {
	font-family: 'I-R';
	src: url('/fonts/I-R.woff2') format('woff2');
	font-display: swap;
}
:root {
	--b: #0a0a08;
	--t: #f5f5f7;
	--a: #164579;
	--px5-r: clamp(5px, 0.5vw, calc(10px + 0.25svh));
	--px15-r: clamp(15px, 1.5vw, calc(30px + 0.5svh));
	--px30-r: clamp(30px, 1.75vw, calc(45px + 0.75svh));
	--tr-s: 0.35s;
	--tr-m: 0.4s;
	--tr-l: 0.5s;
	--cubic: cubic-bezier(0.75, 0, 0.35, 1);
	--fs-s: clamp(1.4rem, 1.6vw, calc(1.6rem + 0.75svh));
	--fs-m: clamp(4rem, 4vw, calc(6rem + 0.75svh));
	--fs-l: clamp(12rem, 6vw, calc(14rem + 0.75svh));
	--fs-d: clamp(18rem, 6vw, calc(20rem + 0.75svh));
	--fs-r: clamp(calc(10rem - 0.5svh), 6vw, calc(12rem + 0.75svh));
}
* {
	margin: 0;
	color: var(--t);
	font-weight: 400;
	box-sizing: border-box;
	cursor: none !important;
}
body {
	background: var(--b);
	overflow-x: hidden;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-touch-callout: none;
}
header,
article {
	display: flex;
}
#preloader > * {
	opacity: 0;
	animation: fadeIn var(--tr-s) var(--cubic) forwards;
}
#preloader > *:nth-child(1) {
	animation-delay: 0.25s;
}
#preloader > *:nth-child(2) {
	animation-delay: var(--tr-s);
}
@keyframes fadeIn {
	to {
		opacity: 1;
	}
}
#preloader {
	position: fixed;
	width: 100vw;
	height: 100svh;
	background: var(--b);
	z-index: 5;
	transition:
		transform 0.65s 0.85s var(--cubic),
		opacity var(--tr-s) 1.25s var(--cubic);
}
#preloader::before {
	content: '';
	position: absolute;
	inset: -15svh -100vw;
	background-image:
		linear-gradient(rgba(245, 245, 247, 0.15) 1.5px, transparent 1.5px),
		linear-gradient(90deg, rgba(245, 245, 247, 0.15) 1.5px, transparent 1.5px);
	background-size: var(--fs-m) var(--fs-m);
	transform: skewX(-12.5deg);
	z-index: -1;
	-webkit-mask-image: linear-gradient(
		to bottom,
		transparent,
		var(--b) 10svh,
		var(--b) calc(100% - 10svh),
		transparent
	);
	mask-image: linear-gradient(
		to bottom,
		transparent,
		var(--b) 10svh,
		var(--b) calc(100% - 10svh),
		transparent
	);
}
body.loaded #preloader {
	transform: translateY(-115svh);
	opacity: 0;
}
.loading-bar-container {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 5svh;
}
.loading-bar {
	height: 100%;
	width: 0%;
	background-color: var(--a);
	transition: width 0.75s var(--cubic);
}
.loading-percentage {
	font:
		var(--fs-d) / 1 LG-CI,
		Arial,
		sans-serif;
	position: absolute;
	bottom: 7.5svh;
	left: 7.5svh;
	color: var(--t);
}
#cursor {
	--size: 10px;
	position: fixed;
	top: calc(var(--size) * -0.5);
	left: calc(var(--size) * -0.5);
	pointer-events: none;
	z-index: 4;
	opacity: 0;
	mix-blend-mode: difference;
	transition: opacity var(--tr-s) var(--cubic);
}
#cursor.visible {
	opacity: 1;
}
#cursor::before {
	content: '';
	position: absolute;
	width: var(--size);
	height: var(--size);
	border-radius: 50%;
	box-shadow: 0 0 0 calc(2px / var(--click, 1)) var(--t);
	transform: rotate(calc(var(--z) * 1deg))
		scale(
			calc((1 + var(--s)) * var(--click, 1)),
			calc((1 - var(--s)) * var(--click, 1))
		);
}
#cursor.clicking {
	transition: --click var(--tr-s) var(--cubic);
	--click: 0.75;
}
@media (hover: none) {
	#cursor {
		display: none;
	}
}
p,
a,
h1,
h2,
h3,
h4,
div,
label,
input,
button {
	font:
		var(--fs-s) / 1 LG-R,
		Arial,
		sans-serif;
	overflow-wrap: break-word;
	text-decoration: none;
	width: fit-content;
}
a {
	font:
		var(--fs-s) / 1 LG-I,
		Arial,
		sans-serif;
}
section {
	display: flex;
}
nav {
	z-index: 3;
	display: flex;
	justify-content: space-between;
	position: fixed;
	top: var(--px15-r);
	left: var(--px30-r);
	right: var(--px30-r);
}
nav section {
	gap: var(--px30-r);
}
nav > section:nth-of-type(2) {
	gap: var(--px5-r);
}
nav > section:nth-of-type(2) svg {
	border-radius: var(--px5-r);
	height: var(--fs-s);
}
@keyframes engine-shake {
	0% {
		transform: translate(0, 0) rotate(0deg);
	}
	2% {
		transform: translate(-2px, -3px) rotate(-1.5deg);
	}
	4% {
		transform: translate(2px, -1px) rotate(1deg);
	}
	6% {
		transform: translate(-3px, 2px) rotate(-2deg);
	}
	8% {
		transform: translate(3px, -2px) rotate(1.5deg);
	}
	10% {
		transform: translate(-1px, 3px) rotate(-1deg);
	}
	12% {
		transform: translate(2px, 1px) rotate(2deg);
	}
	18% {
		transform: translate(2px, -1px) rotate(1deg);
	}
	22% {
		transform: translate(-2px, 1px) rotate(-1deg);
	}
	28% {
		transform: translate(1px, -1px) rotate(0.75deg);
	}
	36% {
		transform: translate(-1px, 1px) rotate(-0.5deg);
	}
	44% {
		transform: translate(0.5px, 0) rotate(0.25deg);
	}
	60% {
		transform: translate(-0.5px, 0) rotate(-0.2deg);
	}
	80% {
		transform: translate(0.25px, 0) rotate(0.1deg);
	}
	100% {
		transform: translate(0, 0) rotate(0deg);
	}
}
nav > a svg {
	height: calc(var(--fs-s) + 0.5svh);
}
nav a svg:hover {
	animation: engine-shake var(--tr-l) var(--cubic) forwards;
	transition: none;
}
footer section {
	width: 100%;
	justify-content: space-between;
}
nav > section:nth-of-type(1) a,
footer section a {
	height: var(--fs-s);
	display: inline-block;
	position: relative;
	will-change: transform, opacity;
	transform: translateZ(0);
	backface-visibility: hidden;
}
nav > section:nth-of-type(1) a::after,
footer section a::after {
	content: '';
	position: absolute;
	width: 100%;
	left: 0;
	bottom: 0;
	height: 2px;
	background-color: var(--t);
	transform: scaleX(0);
	transform-origin: left;
	opacity: 0;
	transition:
		transform var(--tr-m) var(--cubic),
		opacity var(--tr-s) var(--cubic);
}
nav > section:nth-of-type(1) a:hover::after,
footer section a:hover::after {
	transform: scaleX(1);
	transform-origin: left;
	opacity: 1;
}
nav > section:nth-of-type(1) a:not(:hover)::after,
footer section a:not(:hover)::after {
	transform: scaleX(0);
	transform-origin: right;
	opacity: 0;
}
.home-s {
	flex-direction: column;
	height: 100svh;
	justify-content: center;
	padding: 0 var(--px30-r);
}
#countdown {
	width: 100%;
	text-align: right;
}
.home-s h1 {
	font:
		var(--fs-l) / calc(var(--fs-l) - 5svh) LG-C,
		Arial,
		sans-serif;
}
.background {
	aspect-ratio: 16/9;
	position: absolute;
	z-index: -1;
	height: 100svh;
	will-change: transform, opacity;
	transform: translateZ(0);
	backface-visibility: hidden;
}
.carousel {
	-webkit-mask-image: linear-gradient(to bottom, transparent, var(--b) 10svh);
	mask-image: linear-gradient(to bottom, transparent, var(--b) 10svh);
	transition: opacity 0.75s var(--cubic);
	opacity: 0;
}
.carousel.active {
	opacity: 1;
}
.img {
	height: 60svh;
	border-radius: var(--px15-r);
}
img {
	object-fit: cover;
	-webkit-user-select: none;
	user-select: none;
	height: 100%;
	width: 100%;
}
.bio {
	justify-content: space-evenly;
	position: relative;
	overflow: visible;
}
.bio::before {
	content: '';
	position: absolute;
	inset: -15svh -100vw;
	background-image:
		linear-gradient(rgba(245, 245, 247, 0.15) 1.5px, transparent 1.5px),
		linear-gradient(90deg, rgba(245, 245, 247, 0.15) 1.5px, transparent 1.5px);
	background-size: var(--fs-m) var(--fs-m);
	transform: skewX(-12.5deg) translateZ(0);
	z-index: -1;
	-webkit-mask-image: linear-gradient(
		to bottom,
		transparent,
		var(--b) 10svh,
		var(--b) calc(100% - 10svh),
		transparent
	);
	mask-image: linear-gradient(
		to bottom,
		transparent,
		var(--b) 10svh,
		var(--b) calc(100% - 10svh),
		transparent
	);
	will-change: transform;
	backface-visibility: hidden;
}
.bio article {
	flex-direction: column;
	width: 25vw;
	gap: var(--px5-r);
	will-change: transform, opacity;
	transform: translateZ(0);
	backface-visibility: hidden;
	transform-style: preserve-3d;
	border-radius: var(--px15-r);
	background: rgba(10, 10, 8, 0.5);
	overflow: hidden;
	transition:
		background var(--tr-l) var(--cubic),
		box-shadow var(--tr-l) var(--cubic);
	padding: var(--px15-r);
}
.bio article::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: var(--px15-r);
	background:
		radial-gradient(
			circle 100px at var(--mx, 50%) var(--my, -30%),
			rgba(245, 245, 247, 0.125) 0%,
			transparent 100%
		),
		radial-gradient(
			circle 60px at var(--mx, 50%) var(--my, -30%),
			rgba(245, 245, 247, 0.15) 0%,
			transparent 100%
		);
	opacity: 0;
	transition: opacity var(--tr-l) var(--cubic);
	pointer-events: none;
	z-index: -1;
}
.bio article.lit {
	background: rgba(22, 69, 121, 1) !important;
	box-shadow:
		50px 30px 100px 0 rgba(22, 69, 121, 0.15),
		50px 30px 150px 0 rgba(22, 69, 121, 0.15);
}
.bio article.lit::after {
	opacity: 1;
}
.bio article h3 {
	font:
		var(--fs-m) / 1 LG-C,
		Arial,
		sans-serif;
}
hr {
	border: 1px solid var(--t);
	transform: skew(-12.5deg);
}
footer {
	flex-direction: column;
	justify-content: center;
	padding: 0 var(--px30-r);
	width: fit-content;
	height: 100lvh;
	display: flex;
	content-visibility: auto;
}
.flood {
	display: inline-block;
	position: relative;
	width: fit-content;
	transition: color var(--tr-m) var(--cubic);
	will-change: transform, opacity;
	transform: translateZ(0);
	backface-visibility: hidden;
}
.flood::before {
	content: '';
	position: absolute;
	inset: 0;
	background-color: var(--a);
	transform: scaleX(0);
	transform-origin: left;
	opacity: 0;
	transition:
		transform var(--tr-m) var(--cubic),
		opacity var(--tr-s) var(--cubic);
	z-index: -1;
}
.flood:hover::before {
	transform: scaleX(1);
	opacity: 1;
}
.flood:not(:hover)::before {
	transform: scaleX(0);
	transform-origin: right;
}
::-webkit-scrollbar {
	display: none;
}
svg {
	display: flex;
	justify-content: center;
	fill: none;
	will-change: transform;
	transform: translateZ(0);
	backface-visibility: hidden;
}
::selection {
	color: var(--b);
	background: var(--t);
}
.italic {
	font:
		var(--fs-d) / calc(var(--fs-d) - 7.75svh) LG-CI,
		Arial,
		sans-serif;
}
@media (hover: none) {
	nav a svg:hover {
		animation: none;
	}
	nav > section:nth-of-type(1) a::after,
	footer section a::after,
	nav > section:nth-of-type(1) a:not(:hover)::after,
	footer section a:not(:hover)::after,
	.flood::before,
	.flood:not(:hover)::before,
	.bio article::after {
		display: none;
	}
	.flood,
	.bio article {
		transition: none;
	}
}
@media (max-width: 1024px) {
	.bio {
		flex-direction: column;
		align-items: center;
	}
	.bio article {
		width: 80vw;
	}
	.img {
		height: 65svh;
	}
}
@media (max-width: 768px) {
	nav {
		left: var(--px15-r);
		right: var(--px15-r);
	}
	.home-s {
		align-items: flex-start;
		justify-content: flex-end;
		height: 90svh;
		padding: 0 var(--px15-r);
	}
	#countdown {
		text-align: left;
		order: 1;
	}
	.home-s h1 {
		font:
			var(--fs-m) / 1 LG-C,
			Arial,
			sans-serif;
		order: 0;
	}
	.italic,
	.loading-percentage {
		font:
			var(--fs-r) / calc(var(--fs-r) - 5.5svh) LG-CI,
			Arial,
			sans-serif;
	}
	footer {
		align-items: flex-start;
		justify-content: flex-end;
		gap: calc(var(--px5-r) + 0.35svh);
		padding: var(--px15-r);
		height: 85svh;
	}
}
@media (max-width: 480px) {
}
