header.wp-block-template-part {
	position: fixed;
	width: 100%;
	max-width: 100%;
	top: 0;
	left: 0;
	height: auto;
	z-index: 999;
	transition: top 0.3s ease-in-out;

	.has-base-background-color {
		background-color: transparent !important;
		transition: all 0.3s ease-in-out;

		@media screen and (max-width: 900px) {
			padding-left: 31px !important;
			padding-right: 8px !important;
			padding-top: 20px !important;
			padding-bottom: 20px !important;
		}
	}

	/* When mobile menu is open, remove header padding constraints and ensure full width. */
	@media screen and (max-width: 900px) {
		&:has(.wp-block-navigation__responsive-container.is-menu-open) {
			width: 100vw !important;
			max-width: 100vw !important;
			padding: 0 !important;
			margin: 0 !important;
			left: 0 !important;
			right: 0 !important;
			transform: none !important;
		}

		&:has(.wp-block-navigation__responsive-container.is-menu-open) .has-base-background-color {
			padding-left: 0 !important;
			padding-right: 0 !important;
			padding-top: 0 !important;
			padding-bottom: 0 !important;
			margin: 0 !important;
			width: 100vw !important;
			max-width: 100vw !important;
			transform: none !important;
		}

		&:has(.wp-block-navigation__responsive-container.is-menu-open) .wp-block-navigation {
			transform: none !important;
		}
	}

	&.scroll-down {
		/*@media screen and (min-width: 900px) {
			.wp-block-navigation {
				visibility: hidden;
			}
		}*/
	}

	&.scroll-up:not(.logo-contrast-light-nav),
	&.scroll-down:not(.logo-contrast-light-nav) {
		@media screen and (min-width: 900px) {
			/*.wp-block-navigation {
				visibility: visible;

			}*/

			.has-base-background-color {
				background-color: rgba(255, 255, 255, 0.5) !important;
				backdrop-filter: opacity(1) blur(30px);

				/*.custom-logo-link {
					background-color: transparent;
					backdrop-filter: none;
				}*/
			}
		}

	}

	&.scroll-up.logo-contrast-light-nav,
	&.scroll-down.logo-contrast-light-nav {
		@media screen and (min-width: 900px) {


			.has-base-background-color {
				background-color: rgba(0, 0, 0, 0.5) !important;
				backdrop-filter: opacity(1) blur(30px);

			}
		}

	}
}


.admin-bar {
	header.wp-block-template-part {
		top: 32px;
	}
}




.wp-block-navigation {
	background-color: transparent;
	border: 0;
	position: relative;
	/*backdrop-filter: opacity(0.95) blur(280px);*/
	isolation: isolate;
	cursor: pointer;
	transition: all 250ms ease-in-out;
	padding: 0 15px;

	ul {
		gap: 26px;

		li {
			a {
				font-size: 16px;
				font-style: normal;
				font-weight: 400;
				line-height: 150%;
				padding: 13px 0;
				transition: all 0.3s ease;
				font-size: 16px;
				font-style: normal;
				font-weight: 400;
				line-height: 150%;
				padding: 13px 0;
				transition: all 0.3s ease;
				color: #ffffff;

				&:hover,
				&:focus,
				&:active {
					text-decoration: underline;
					background-color: transparent;
					text-decoration-thickness: 0.5px;
				}
			}
		}
	}
}

/* Desktop only: nav link color follows section contrast (excludes duotone - logo changes but nav stays dark). */
@media screen and (min-width: 901px) {

	header.logo-contrast-light-nav {

		.wp-block-navigation .wp-block-navigation__container ul li a,
		.wp-block-navigation .wp-block-navigation__container.has-main-color {
			color: #ffffff !important;
		}
	}

	header.logo-contrast-dark-nav {

		.wp-block-navigation .wp-block-navigation__container ul li a,
		.wp-block-navigation .wp-block-navigation__container.has-main-color {
			color: #000000 !important;


		}
	}

	/* Single post pages: always white nav links on desktop. */
	body.single-post header .wp-block-navigation .wp-block-navigation__container ul li a,
	body.single-post header .wp-block-navigation .wp-block-navigation__container.has-main-color {
		color: #ffffff !important;
	}




	body.single-post header.scroll-down.logo-contrast-dark-nav .has-base-background-color,
	body.single-post header.scroll-up.logo-contrast-dark-nav .has-base-background-color {
		background-color: rgba(0, 0, 0, 0.5) !important;
		backdrop-filter: opacity(1) blur(30px);

	}
}



@media screen and (max-width: 900px) {
	.hide-on-desktop {
		display: none !important;
	}

	.wp-block-navigation__container {
		display: none;
	}

	.wp-block-site-logo {
		/*	max-width: 130px; */
	}

	.wp-block-navigation.items-justified-right {
		--navigation-layout-justification-setting: flex-start;
		--navigation-layout-justify: flex-start;
	}

	.wp-block-navigation__responsive-container:not(.is-menu-open) {
		display: none !important;
	}

	/* Open mobile overlay: fill entire viewport (works with header scroll-up/scroll-down) */
	.wp-block-navigation__responsive-container.is-menu-open {
		position: fixed !important;
		inset: 0 !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		width: 100vw !important;
		max-width: 100vw !important;
		min-width: 100vw !important;
		height: 100vh !important;
		height: 100dvh !important;
		margin: 0 !important;
		padding: 0 !important;
		z-index: 10000 !important;
		overflow-y: auto !important;
		overflow-x: hidden !important;
		box-sizing: border-box !important;
		transform: none !important;
		background-color: #000 !important;
	}

	.admin-bar .wp-block-navigation__responsive-container.is-menu-open {
		top: 32px !important;
		height: calc(100vh - 32px) !important;
		height: calc(100dvh - 32px) !important;
	}

	.wp-block-navigation {

		/* When menu is open, remove parent constraints. */
		&:has(.wp-block-navigation__responsive-container.is-menu-open) {
			position: fixed !important;
			inset: 0 !important;
			top: 0 !important;
			left: 0 !important;
			right: 0 !important;
			bottom: 0 !important;
			padding: 0 !important;
			margin: 0 !important;
			max-width: 100vw !important;
			width: 100vw !important;
			z-index: 1000 !important;
		}

		.wp-block-navigation__responsive-container-open {
			display: flex !important;
			justify-content: center !important;
			align-items: center !important;

			svg {
				width: 28px;
				height: 28px;
				fill: #ffffff;
			}
		}

		.wp-block-navigation__responsive-container {
			padding: 20px 40px;

			background-color: #000 !important;
		}

		.wp-block-navigation__responsive-container.is-menu-open {
			margin-left: 0 !important;
			margin-right: 0 !important;
			padding: 20px 0 !important;
			width: 100vw !important;
			max-width: 100vw !important;
			min-width: 100vw !important;
			overflow-x: hidden !important;
			left: 0 !important;
			right: 0 !important;

			.wp-block-navigation__responsive-container-close {
				width: 38px;
				height: 38px;
				right: 20px;
				top: 20px;

				svg {
					width: 38px;
					height: 38px;

					fill: #fff !important;

					* {
						fill: #fff !important;
					}
				}
			}

			.wp-block-navigation__responsive-container-content {
				justify-content: start;
				width: 100%;
				align-items: start;
				padding: 40px;
				box-sizing: border-box;
			}

			.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
				width: 100% !important;
				max-width: 100% !important;
				padding: 40px !important;
			}

			.wp-block-navigation__responsive-container.is-menu-open ul {
				padding-top: 40px !important;
				align-items: start !important;
				text-align: left !important;
				justify-content: flex-start !important;


				li {
					text-align: left !important;
					width: 100% !important;
					--navigation-layout-justification-setting: flex-start !important;
					--navigation-layout-justify: flex-start !important;
				}

				li,
				li a {
					color: #fff !important;
					font-size: 40px !important;
					font-weight: 400;
					line-height: 150%;
					text-align: left !important;
					justify-content: flex-start !important;
					justify-self: flex-start !important;
				}
			}
		}
	}
}