/* Shared Figure-style overlay navbar (all marketing pages) */
#go-top { display: none !important; }

/* Text pages without a full-bleed hero need room under the fixed nav */
body.has-overlay-nav.overlay-nav-pad #process,
body.has-overlay-nav.overlay-nav-pad .error-wrap {
	padding-top: 9.6rem;
}
@media (min-width: 768px) {
	body.has-overlay-nav.overlay-nav-pad #process,
	body.has-overlay-nav.overlay-nav-pad .error-wrap {
		padding-top: 11.2rem;
	}
}

.overlay-nav-fade {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: 580;
	height: 14rem;
	pointer-events: none;
	background: linear-gradient(
		180deg,
		rgba(0, 0, 0, 0.72) 0%,
		rgba(0, 0, 0, 0.48) 28%,
		rgba(20, 20, 20, 0.28) 55%,
		rgba(40, 40, 40, 0.12) 78%,
		transparent 100%
	);
	backdrop-filter: blur(22px);
	-webkit-backdrop-filter: blur(22px);
	-webkit-mask-image: linear-gradient(#000 0%, rgba(0,0,0,0.85) 40%, rgba(0,0,0,0.35) 72%, transparent 100%);
	mask-image: linear-gradient(#000 0%, rgba(0,0,0,0.85) 40%, rgba(0,0,0,0.35) 72%, transparent 100%);
	transition: opacity 0.28s cubic-bezier(0.23, 1, 0.32, 1), visibility 0.28s cubic-bezier(0.23, 1, 0.32, 1);
}
@media (min-width: 768px) {
	.overlay-nav-fade { height: 17rem; }
}
.overlay-nav-fade.nav-hidden {
	opacity: 0;
	visibility: hidden;
}

body.has-overlay-nav header {
	--logo-w: 132px;
	--logo-h: 38px;
	--nav-x: 0px;
	--header-edge: 2rem;
	--header-h: 7.2rem;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	z-index: 600;
	background: transparent !important;
	border-bottom: none !important;
	box-shadow: none !important;
	overflow: visible;
	transition: opacity 0.28s cubic-bezier(0.23, 1, 0.32, 1), visibility 0.28s cubic-bezier(0.23, 1, 0.32, 1);
}
@media (min-width: 768px) {
	body.has-overlay-nav header {
		--header-edge: 4.8rem;
		--header-h: 8.8rem;
		--logo-w: 150px;
		--logo-h: 44px;
	}
}
body.has-overlay-nav header.sticky {
	background: transparent !important;
	box-shadow: none !important;
}
body.has-overlay-nav header.nav-hidden {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}
body.has-overlay-nav header.nav-menu-open {
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
}
body.has-overlay-nav header.nav-menu-open ~ .overlay-nav-fade,
body.has-overlay-nav .overlay-nav-fade.nav-menu-open {
	opacity: 1 !important;
	visibility: visible !important;
}

body.has-overlay-nav header .row {
	width: 100%;
	max-width: none;
	height: var(--header-h);
	margin: 0;
	padding: 0 var(--header-edge);
	display: flex;
	align-items: center;
	justify-content: space-between;
	box-sizing: border-box;
}
body.has-overlay-nav header .logo {
	position: relative;
	left: 0;
	top: 0;
	height: auto;
	z-index: 2;
	flex: 0 0 auto;
}
body.has-overlay-nav header .logo a,
body.has-overlay-nav header.sticky .logo a {
	width: var(--logo-w);
	height: var(--logo-h);
	background: url("../images/logo-rumex-white.png") no-repeat left center;
	background-size: contain;
	filter: drop-shadow(0 1px 8px rgba(0, 0, 0, 0.45));
}

body.has-overlay-nav #main-nav-wrap {
	position: relative;
	z-index: 2;
	flex: 0 1 auto;
	margin-left: auto;
	padding-left: 0 !important;
	height: auto;
	justify-content: flex-end;
	gap: 2.4rem;
}
body.has-overlay-nav .main-navigation {
	margin: 0;
	height: auto;
	gap: clamp(1.6rem, 2.8vw, 4.8rem);
}
body.has-overlay-nav .main-navigation li {
	height: auto;
}
body.has-overlay-nav .main-navigation li a {
	height: auto;
	padding: 0.6rem 0;
	color: #fff !important;
	font-size: 1.45rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none;
	text-underline-offset: 0.35em;
	text-decoration-thickness: 1.5px;
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.45);
}
body.has-overlay-nav .main-navigation li a:hover,
body.has-overlay-nav .main-navigation li a:focus {
	color: #fff !important;
	text-decoration: underline;
}
body.has-overlay-nav .main-navigation li.with-sep a::before {
	display: none;
}

body.has-overlay-nav #main-nav-wrap > .language-dropdown {
	position: relative !important;
	top: auto !important;
	right: auto !important;
	height: auto;
	z-index: 2;
}
body.has-overlay-nav .language-dropdown .dropbtn,
body.has-overlay-nav header .dropbtn {
	height: auto;
	padding: 0.6rem 0;
	color: #fff !important;
	font-size: 1.45rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none !important;
	text-shadow: 0 1px 8px rgba(0, 0, 0, 0.45);
}
body.has-overlay-nav .language-dropdown .dropbtn:hover,
body.has-overlay-nav .language-dropdown .dropbtn:focus {
	color: #fff !important;
	background: transparent !important;
	text-decoration: none !important;
	opacity: 0.85;
}
body.has-overlay-nav a.menu-toggle {
	z-index: 3;
}
body.has-overlay-nav a.menu-toggle span,
body.has-overlay-nav a.menu-toggle span::before,
body.has-overlay-nav a.menu-toggle span::after {
	background-color: #fff;
}

@media only screen and (max-width: 768px) {
	body.has-overlay-nav header {
		--logo-w: 118px;
		--logo-h: 34px;
		--header-h: 6.4rem;
		--header-edge: 1.6rem;
	}
	body.has-overlay-nav header.nav-menu-open {
		background: #fff !important;
	}
	body.has-overlay-nav header.nav-menu-open .logo a {
		background-image: url("../images/logo-rumex-black.png");
		filter: none;
	}
	body.has-overlay-nav #main-nav-wrap {
		position: fixed;
		top: var(--header-h);
		left: 0;
		right: 0;
		margin: 0;
		flex: none;
		width: 100%;
		max-width: none;
		justify-content: flex-start;
		max-height: calc(100vh - var(--header-h));
		max-height: calc(100dvh - var(--header-h));
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}
	body.has-overlay-nav #main-nav-wrap.is-open {
		background: #fff;
		box-shadow: 0 16px 40px rgba(0, 0, 0, 0.12);
	}
	body.has-overlay-nav #main-nav-wrap.is-open .main-navigation {
		display: flex !important;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		padding: 0.6rem 2.2rem 0.4rem;
	}
	body.has-overlay-nav #main-nav-wrap.is-open .main-navigation > li {
		border: 0 !important;
		width: 100%;
	}
	body.has-overlay-nav #main-nav-wrap.is-open .main-navigation li a {
		color: #0c0c0c !important;
		text-transform: none;
		font-family: 'DINPro-Bold', sans-serif;
		font-size: 2.2rem;
		line-height: 1.2;
		letter-spacing: 0.01em;
		text-shadow: none;
		text-decoration: none !important;
		padding: 1.7rem 0;
		width: 100%;
	}
	body.has-overlay-nav #main-nav-wrap.is-open .main-navigation li.current > a {
		color: #04998a !important;
	}
	body.has-overlay-nav #main-nav-wrap.is-open .language-dropdown .dropbtn {
		color: #0c0c0c !important;
		text-transform: none;
		font-size: 1.55rem;
		text-shadow: none;
		text-decoration: none !important;
	}
	body.has-overlay-nav #main-nav-wrap.is-open .language-dropdown .dropbtn:hover,
	body.has-overlay-nav #main-nav-wrap.is-open .language-dropdown .dropbtn:focus {
		color: #0c0c0c !important;
		text-decoration: none !important;
		background: transparent !important;
	}
	body.has-overlay-nav #main-nav-wrap.is-open .language-dropdown .dropdown-content a {
		color: #0c0c0c !important;
		text-shadow: none;
		text-decoration: none !important;
	}
	body.has-overlay-nav #main-nav-wrap.is-open .language-dropdown .dropdown-content a.is-active-lang {
		display: none !important;
	}
	body.has-overlay-nav header.nav-menu-open a.menu-toggle span,
	body.has-overlay-nav header.nav-menu-open a.menu-toggle span::before,
	body.has-overlay-nav header.nav-menu-open a.menu-toggle span::after {
		background-color: #0c0c0c;
	}
}

/* Scroll-Lock nur für die mobile Menü-Schublade */
@media (max-width: 768px) {
	body.nav-drawer-open {
		overflow: hidden;
		touch-action: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.has-overlay-nav header,
	.overlay-nav-fade {
		transition: none;
	}
}