/**
 * Homepage password gate — first block inside <main>, in normal document flow.
 * Main keeps stable landing/2 padding; gate mount adds offset only while visible
 * so unlock/dismiss does not collapse layout into the console or filters.
 */

:root {
	--studio-hp-gate-clear: calc(
		max(
			var(--studio-console-landing, clamp(120px, 14vh, 200px)),
			calc(6.5rem + var(--wp--preset--spacing--45, 2rem))
		) + var(--wp--preset--spacing--40, 1.5rem)
	);
	--studio-hp-gate-offset: calc(
		var(--studio-hp-gate-clear)
		- (var(--studio-console-landing, clamp(120px, 14vh, 200px)) / 2)
		- var(--wp--preset--spacing--40, 1.5rem)
	);
}

body.home main.wp-block-group > .studio-hp-gate-mount {
	position: relative;
	z-index: 5;
	margin-block: 0;
	padding: 0;
	background-color: transparent;
	max-width: none;
	width: 100%;
}

body.home main.wp-block-group > .studio-hp-gate-mount:not(:has([data-hp-gate][hidden])) {
	display: block;
	margin-top: var(--studio-hp-gate-offset);
}

body.home main.wp-block-group > .studio-hp-gate-mount:has([data-hp-gate][hidden]),
body.home.studio-hp-gate-unlocked main.wp-block-group > .studio-hp-gate-mount {
	display: none;
}

body.home main.wp-block-group > .studio-hp-gate-mount .studio-bridge-gate-rail[data-hp-gate] {
	position: relative;
	z-index: 1;
	margin-top: 0;
	padding-top: 0 !important;
	padding-bottom: var(--wp--preset--spacing--40, 1.5rem);
	padding-inline: max(
		var(--wp--style--root--padding-left, 1.5rem),
		calc((100% - var(--studio-wide-size, 1200px)) / 2)
	);
	background-color: #ffffff;
}

body.home main.wp-block-group > .cluster-engagements {
	position: relative;
	z-index: 1;
}

/* Hub transition must not cloak the gate */
html[data-hub-content-pending] body.home.studio-hub-content-vt-pilot main.wp-block-group > .studio-hp-gate-mount:not(:has([data-hp-gate][hidden])),
html[data-hub-content-pending] body.home.studio-hub-content-vt-pilot main.wp-block-group [data-hp-gate].studio-bridge-gate-rail:not([hidden]) {
	opacity: 1 !important;
	transform: none !important;
}

@media (min-width: 1280px) {
	:root {
		--studio-hp-gate-clear: calc(
			max(
				var(--studio-console-landing, clamp(120px, 14vh, 200px)),
				calc(7rem + var(--wp--preset--spacing--45, 2rem))
			) + var(--wp--preset--spacing--50, 2.5rem)
		);
	}
}