/* ==========================================================================
   Preloader
   ========================================================================== */

.preloader {
	position: fixed;
	inset: 0;
	z-index: var(--z-preloader);
	display: grid;
	place-items: center;
	color: var(--ace-ivory);
	pointer-events: all;
}

.preloader__bg {
	position: absolute;
	inset: 0;
	background: var(--ace-navy-deep);
	clip-path: inset(0 0 0 0);
}

.preloader__inner {
	position: relative;
}

html:not(.js) .preloader {
	display: none;
}

.preloader__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: clamp(1rem, 2.5vw, 2rem);
}

.preloader__mark {
	display: flex;
	font-family: var(--font-display);
	font-weight: 300;
	font-size: clamp(5rem, 15vw, 12rem);
	line-height: 1;
	letter-spacing: 0;
	transform-origin: left top;
}

.preloader__letter {
	display: block;
	overflow: hidden;
	padding: 0 0.07em 0.04em;
}

.preloader__letter > span {
	display: block;
	transform: translate3d(0, 110%, 0);
	transition: transform 1100ms var(--ease-premium);
}

.preloader__letter:nth-child(2) > span { transition-delay: 120ms; }
.preloader__letter:nth-child(3) > span { transition-delay: 240ms; }

.preloader.is-active .preloader__letter > span {
	transform: none;
}

.preloader__tagline {
	display: flex;
	gap: 1.25em;
	font-family: var(--font-body);
	font-size: clamp(0.6875rem, 0.6rem + 0.3vw, 0.8125rem);
	font-weight: 500;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: var(--text-inverse-muted);
}

.preloader__tagline span {
	opacity: 0;
	transform: translate3d(0, 10px, 0);
	filter: blur(4px);
	transition:
		opacity 800ms var(--ease-premium),
		transform 800ms var(--ease-premium),
		filter 800ms var(--ease-premium);
}

.preloader__tagline span:nth-child(2) { transition-delay: 140ms; }
.preloader__tagline span:nth-child(3) { transition-delay: 280ms; }

.preloader.is-tagline .preloader__tagline span {
	opacity: 1;
	transform: none;
	filter: blur(0);
}

.preloader.is-leaving .preloader__tagline span {
	opacity: 0;
	transition-delay: 0ms;
	transition-duration: 400ms;
}

.preloader__rule {
	position: absolute;
	left: 50%;
	bottom: clamp(2rem, 6vh, 4rem);
	width: 120px;
	height: 1px;
	margin-left: -60px;
	background: var(--border-inverse);
	overflow: hidden;
}

.preloader__rule::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--ace-gold);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 1500ms var(--ease-standard);
}

.preloader.is-active .preloader__rule::after {
	transform: scaleX(1);
}

/* Quick mode (already visited in this session) */
.preloader-quick .preloader__letter > span,
.preloader-quick .preloader__tagline span {
	transform: none;
	opacity: 1;
	filter: none;
	transition: none;
}

/* Header logo stays hidden until the flying monogram lands */
.has-preloader:not(.is-loaded) .header__logo .wordmark__mark {
	opacity: 0;
}

.header__logo .wordmark__mark {
	transition: opacity 200ms linear;
}