/**
 * SLDB — Intro Screen.
 *
 * The overlay itself is created by an inline script at wp_body_open, and its
 * geometry is set there too, inline — this file only carries what can wait for
 * an external stylesheet. Anything that must be true on the FIRST PAINT lives
 * inline in the document, because a 226ms window where the stylesheet has not
 * arrived yet is exactly the flash this feature exists to remove.
 */

.sldb-intro-overlay {
	position: fixed;
	inset: 0;
	z-index: 2147483000;
	pointer-events: auto;
	transition-property: opacity;
	transition-timing-function: linear;
}

.sldb-intro-overlay--out {
	opacity: 0;
}

/*
 * Scroll is blocked for the whole intro. `overflow: hidden` on both elements
 * covers the scrollbar and the native wheel; the keyboard and the plugin's own
 * smooth-scroll engine are stopped in JS, since neither goes through overflow.
 */
html.sldb-intro-lock,
html.sldb-intro-lock body {
	overflow: hidden !important;
	overscroll-behavior: none;
}

/*
 * The travelling element has to sit above the overlay, and nothing between it
 * and the viewport may crop it. Ancestors that would clip get un-clipped for
 * the duration and restored afterwards — without this the logo is sliced the
 * moment it leaves its own container, which looks like the effect is broken
 * rather than like a CSS rule three levels up is doing its job.
 */
.sldb-intro-element {
	position: relative;
	z-index: 2147483001;
	transition-property: translate, scale;
	will-change: translate, scale;
}

.sldb-intro-unclip {
	overflow: visible !important;
}

/* Landed: drop the promotion so the page returns to its own stacking order. */
.sldb-intro-done {
	translate: none;
	scale: none;
	will-change: auto;
}

@media ( prefers-reduced-motion: reduce ) {
	.sldb-intro-element {
		transition: none !important;
		translate: none !important;
		scale: none !important;
	}

	.sldb-intro-overlay {
		transition: none !important;
	}
}
