/* --- Header: default (full-width bar on all pages) --- */
.site-header-bar {
	background-color: var(--wp--preset--color--dark-background);
}

.site-header {
	position: relative;
	align-items: center;
	height: 85px;
	color: #fff;
	/* border: 1px dashed red; */
}

.site-header a {
	color: #fff;
}

/* --- Header: overlay mode (front page only) --- */
.header-overlay .site-header-bar {
	background-color: transparent;
	/* background-color: var(--wp--preset--color--dark-background); */

}

.header-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
}

/* --- Mobile --- */
@media (max-width: 600px) {
	.site-header {
		height: 60px;
	}

	/* Triple-line burger icon: hide default SVG but keep button clickable */
	.site-header .wp-block-navigation__responsive-container-open {
		position: relative;
		min-width: 24px;
		min-height: 24px;
		color: #fff;
		left: 1em;
		top: .25em;
	}

	.site-header .wp-block-navigation__responsive-container-open svg {
		position: absolute;
		width: 0;
		height: 0;
		overflow: hidden;
		visibility: hidden;
	}

	.site-header .wp-block-navigation__responsive-container-open::before {
		content: "";
		display: block;
		width: 24px;
		height: 2px;
		background: currentColor;
		box-shadow: 0 6px 0 currentColor, 0 12px 0 currentColor;
		pointer-events: none;
	}

	/* Mobile dropdown: dark background, white text */
	.site-header .wp-block-navigation__responsive-container-content {
		background-color: var(--wp--preset--color--dark-background);
		color: #fff;
		padding: 1em;
	}

	.site-header .wp-block-navigation__responsive-container-content a,
	.site-header .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content {
		color: #fff;
	}

	.site-header .wp-block-navigation__responsive-container-close {
		color: #fff;
		padding: 1em;

	}
}

/** Navigation */
.site-header .wp-block-navigation {
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
}

.site-header .wp-block-navigation__responsive-container .wp-block-navigation__responsive-container-content {
	gap: 20px;
}

/** Logo: absolute center sitewide */
.site-header .site-logo {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 1;
}