/* ==========================================================================
   G1 header on the homepage stage (parts/header.html, className as-intro).

   The lockup and the three nav items are PAINTED on the marks canvas (so the
   bouncing mark can knock them out). These blocks only carry the link, the
   accessible text and the focus ring: home.js parks each one over its painting.
   Until the canvas lockup has loaded, the <img> stays visible as the fallback.
   ========================================================================== */

.as-home .as-intro {
	position: absolute;
	inset: 0;
	z-index: 3;
	pointer-events: none;
}

.as-home .as-intro .as-lockup {
	position: absolute;
	left: calc(var(--as-u) * 41);
	top: calc(var(--as-u) * 35);
	width: calc(var(--as-u) * 116);
	filter: var(--wp--custom--shadow--logo);
	pointer-events: auto;
}
.as-home .as-intro .as-lockup a { display: block; }
.as-home .as-intro .as-lockup img {
	display: block;
	width: 100%;
	height: auto;
}

/* Both wrappers cover the stage so the items can be parked anywhere on it. */
.as-home .as-intro .as-cta-wrap,
.as-home .as-intro .as-nav {
	position: absolute;
	inset: 0;
	display: block;
	gap: 0;
	pointer-events: none;
}
.as-home .as-intro .as-cta,
.as-home .as-intro .as-nav ul,
.as-home .as-intro .as-nav li {
	position: static;
	display: block;
	margin: 0;
	padding: 0;
}

.as-home .as-intro .as-cta .wp-block-button__link,
.as-home .as-intro .as-nav .wp-block-navigation-item__content {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 0;
	height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
	color: transparent;          /* the painted text is the visible one */
	font-size: 1px;
	line-height: 0;
	overflow: hidden;
	text-decoration: none;
	pointer-events: auto;
	cursor: pointer;
}
.as-home .as-intro .as-cta .wp-block-button__link:focus-visible,
.as-home .as-intro .as-nav .wp-block-navigation-item__content:focus-visible {
	outline: 2px solid var(--wp--preset--color--red);
	outline-offset: 2px;
}