/**
 * Complete header + banner responsive fixes.
 * Headers: Elementor HFE #1160 (home) and #137 (inner pages).
 *
 * Layers:
 *  1) Top utility — Home / Nieuws / … + country & language
 *  2) Logo + primary nav + search + Contact
 *  3) (mobile-only Elementor strip is unused; theme .header-mobile takes over <768)
 */

/* Prevent page-level horizontal scroll from oversized Elementor widths */
@media (max-width: 1024px) {
	html,
	body {
		max-width: 100%;
		overflow-x: hidden;
	}
}

/* -------------------------------------------------------------------------- */
/* Tablet (768–1024): rebuild flex rows — kill fixed px widths & negative pull */
/* -------------------------------------------------------------------------- */
@media (max-width: 1024px) and (min-width: 768px) {
	/* —— Home header #1160 —— */
	.elementor-1160 .elementor-element-6c55bc9,
	.elementor-1160 .elementor-element-c028acb {
		--width: 100% !important;
		width: 100% !important;
		max-width: 100% !important;
		--margin-top: 0px !important;
		--margin-bottom: 0px !important;
		margin-top: 0 !important;
		margin-bottom: 0 !important;
		--min-height: 0px !important;
		--flex-wrap: nowrap !important;
		--align-items: center !important;
		--justify-content: space-between !important;
		--gap: 8px 12px !important;
		--padding-top: 8px !important;
		--padding-bottom: 8px !important;
		--padding-left: 16px !important;
		--padding-right: 16px !important;
		position: relative;
		z-index: 30;
		box-sizing: border-box;
	}

	/* Row 1 — reference layout: links | country | lang consecutive, right-aligned */
	.elementor-1160 .elementor-element-6c55bc9 {
		z-index: 40;
		border-bottom: 1px solid #e8eef0;
		--justify-content: flex-end !important;
		--align-items: center !important;
		--gap: 0px 16px !important;
		--column-gap: 16px !important;
		--padding-top: 2px !important;
		--padding-bottom: 2px !important;
	}

	/* Row 1 columns: hug content, single line */
	.elementor-1160 .elementor-element-9f1d346,
	.elementor-1160 .elementor-element-19963b0 {
		--width: auto !important;
		width: auto !important;
		max-width: none !important;
		flex: 0 1 auto !important;
		min-width: 0 !important;
		align-self: center !important;
		--justify-content: flex-end !important;
		--align-items: center !important;
	}

	/* Row 2: logo | nav | search | contact — solid bar, one line */
	.elementor-1160 .elementor-element-c028acb {
		background: #ffffff !important;
		border-bottom: 1px solid #e8eef0;
		--min-height: 64px !important;
	}

	.elementor-1160 .elementor-element-de1db66 {
		--width: 96px !important;
		width: 96px !important;
		max-width: 96px !important;
		flex: 0 0 96px !important;
		--flex-grow: 0 !important;
		--flex-shrink: 0 !important;
		align-self: center !important;
		--padding-top: 0px !important;
		--padding-right: 0px !important;
		--padding-bottom: 0px !important;
		--padding-left: 0px !important;
		padding: 0 !important;
		--margin-left: 0px !important;
		margin-left: 0 !important;
		--justify-content: center !important;
		--align-items: center !important;
	}

	.elementor-1160 .elementor-element-0869202 .hfe-site-logo {
		padding: 0 !important;
	}

	.elementor-1160 .elementor-element-0869202 > .elementor-widget-container {
		margin: 0 !important;
	}

	/* SVG logo has no intrinsic ratio — size by width, never height/auto */
	.elementor-1160 .elementor-element-0869202 .hfe-site-logo .hfe-site-logo-container img,
	.elementor-1160 .elementor-element-0869202 .hfe-site-logo img {
		width: 88px !important;
		height: auto !important;
		max-width: 100% !important;
	}

	.elementor-1160 .elementor-element-5ce1771 {
		--width: auto !important;
		width: auto !important;
		max-width: none !important;
		flex: 0 1 auto !important;
		min-width: 0 !important;
		overflow: hidden;
		--margin-top: 0px !important;
		margin-top: 0 !important;
		--flex-direction: row !important;
		--justify-content: flex-end !important;
		--align-items: center !important;
		align-self: center !important;
	}

	.elementor-1160 .elementor-element-1b17b69.elementor-element {
		--align-self: center !important;
		align-self: center !important;
	}

	.elementor-1160 .elementor-element-1b17b69 > .elementor-widget-container {
		display: flex !important;
		align-items: center !important;
		height: 100%;
		margin: 0 !important;
	}

	.elementor-1160 .elementor-element-1b17b69 .hfe-nav-menu,
	.elementor-1160 .elementor-element-1b17b69 .hfe-nav-menu__layout-horizontal {
		display: flex !important;
		align-items: center !important;
		flex-wrap: nowrap !important;
		margin: 0 !important;
	}

	.elementor-1160 .elementor-element-1b17b69 .hfe-nav-menu > li.menu-item {
		margin: 0 !important;
	}

	/* Theme main.min.css uses `#menu-1-1b17b69 li a {16px !important}` — must out-specify it */
	.elementor-1160 #menu-1-1b17b69 li a.hfe-menu-item,
	.elementor-1160 #menu-1-1b17b69 li a.hfe-sub-menu-item {
		font-size: 12px !important;
		line-height: 1.2 !important;
		padding-left: 5px !important;
		padding-right: 5px !important;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		white-space: nowrap;
	}

	body:not(.rtl) .elementor-1160 .elementor-element-1b17b69 .hfe-nav-menu__layout-horizontal .hfe-nav-menu > li.menu-item {
		margin-bottom: 0 !important;
	}

	.elementor-1160 .elementor-element-2f2988d {
		--width: 40px !important;
		width: 40px !important;
		flex: 0 0 40px !important;
		--margin-top: 0px !important;
		margin-top: 0 !important;
		align-self: center !important;
		display: flex !important;
		align-items: center !important;
	}

	/* Theme main.min.css hides all .ekit-wid-con under 1024px — re-show header search */
	.elementor-1160 .elementor-widget-elementskit-header-search .ekit-wid-con,
	.elementor-137 .elementor-widget-elementskit-header-search .ekit-wid-con {
		display: block !important;
	}

	.elementor-1160 .elementor-widget-elementskit-header-search .ekit_navsearch-button i,
	.elementor-137 .elementor-widget-elementskit-header-search .ekit_navsearch-button i {
		font-size: 22px !important;
		line-height: 1 !important;
	}

	.elementor-1160 .elementor-element-10f3fdf {
		flex: 0 0 auto !important;
		align-self: center !important;
		display: flex !important;
		align-items: center !important;
		order: 0 !important;
	}

	.elementor-1160 .elementor-element-10f3fdf > .elementor-widget-container {
		margin: 0 !important;
		padding: 0 !important;
		--e-transform-scale: 1 !important;
		transform: none !important;
		display: flex !important;
		align-items: center !important;
	}

	.elementor-1160 .elementor-element-10f3fdf .elementor-button {
		font-size: 12px !important;
		line-height: 1.2 !important;
		padding: 8px 14px !important;
		white-space: nowrap;
		margin: 0 !important;
		display: inline-flex !important;
		align-items: center !important;
	}

	/* —— Inner header #137 —— */
	.elementor-137 .elementor-element-f45756c,
	.elementor-137 .elementor-element-a8b28e3 {
		--width: 100% !important;
		width: 100% !important;
		max-width: 100% !important;
		--margin-top: 0px !important;
		margin-top: 0 !important;
		--flex-wrap: nowrap !important;
		--align-items: center !important;
		--justify-content: space-between !important;
		--gap: 8px 12px !important;
		--padding-top: 8px !important;
		--padding-bottom: 8px !important;
		--padding-left: 16px !important;
		--padding-right: 16px !important;
		position: relative;
		z-index: 30;
		box-sizing: border-box;
	}

	/* Row 1 — reference layout: links | country | lang consecutive, right-aligned */
	.elementor-137 .elementor-element-f45756c {
		z-index: 40;
		border-bottom: 1px solid #e8eef0;
		--justify-content: flex-end !important;
		--align-items: center !important;
		--gap: 0px 16px !important;
		--column-gap: 16px !important;
		--padding-top: 2px !important;
		--padding-bottom: 2px !important;
	}

	/* Row 2 inner header — solid bar */
	.elementor-137 .elementor-element-a8b28e3 {
		background: #ffffff !important;
		border-bottom: 1px solid #e8eef0;
		--min-height: 64px !important;
	}

	.elementor-137 .elementor-element-ae134c3,
	.elementor-137 .elementor-element-9355c0e {
		--width: auto !important;
		width: auto !important;
		max-width: none !important;
		flex: 0 1 auto !important;
		min-width: 0 !important;
		align-self: center !important;
		--justify-content: flex-end !important;
		--align-items: center !important;
	}

	.elementor-137 .elementor-element-1e8d55f {
		--width: 96px !important;
		width: 96px !important;
		flex: 0 0 96px !important;
		align-self: center !important;
		--padding-top: 0px !important;
		--padding-right: 0px !important;
		--padding-bottom: 0px !important;
		--padding-left: 0px !important;
		padding: 0 !important;
		--margin-left: 0px !important;
		margin-left: 0 !important;
		--justify-content: center !important;
		--align-items: center !important;
	}

	.elementor-137 .elementor-element-b1288a0 .hfe-site-logo {
		padding: 0 !important;
	}

	.elementor-137 .elementor-element-b1288a0 > .elementor-widget-container {
		margin: 0 !important;
	}

	.elementor-137 .elementor-element-b1288a0 img {
		width: 88px !important;
		height: auto !important;
		max-width: 100% !important;
	}

	.elementor-137 .elementor-element-e9c8308 {
		--width: auto !important;
		width: auto !important;
		flex: 0 1 auto !important;
		min-width: 0 !important;
		overflow: hidden;
		--margin-top: 0px !important;
		margin-top: 0 !important;
		--flex-direction: row !important;
		--justify-content: flex-end !important;
		--align-items: center !important;
		align-self: center !important;
	}

	.elementor-137 .elementor-element-01c750b.elementor-element {
		--align-self: center !important;
		align-self: center !important;
	}

	.elementor-137 .elementor-element-01c750b > .elementor-widget-container {
		display: flex !important;
		align-items: center !important;
		margin: 0 !important;
	}

	.elementor-137 .elementor-element-01c750b .hfe-nav-menu,
	.elementor-137 .elementor-element-01c750b .hfe-nav-menu__layout-horizontal {
		display: flex !important;
		align-items: center !important;
		flex-wrap: nowrap !important;
		margin: 0 !important;
	}

	.elementor-137 .elementor-element-01c750b .hfe-nav-menu > li.menu-item {
		margin: 0 !important;
	}

	.elementor-137 .elementor-element-01c750b #menu-1-1b17b69 li a.hfe-menu-item,
	.elementor-137 .elementor-element-01c750b #menu-1-1b17b69 li a.hfe-sub-menu-item,
	.elementor-137 .elementor-element-01c750b .hfe-nav-menu li a.hfe-menu-item,
	.elementor-137 .elementor-element-01c750b .hfe-nav-menu li a.hfe-sub-menu-item {
		font-size: 12px !important;
		line-height: 1.2 !important;
		padding-left: 5px !important;
		padding-right: 5px !important;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		white-space: nowrap;
	}

	.elementor-137 .elementor-element-a9e0ce8 {
		--width: 40px !important;
		width: 40px !important;
		flex: 0 0 40px !important;
		--margin-top: 0px !important;
		margin-top: 0 !important;
		align-self: center !important;
		display: flex !important;
		align-items: center !important;
	}

	.elementor-137 .elementor-element-22aaed5 {
		--width: auto !important;
		width: auto !important;
		flex: 0 0 auto !important;
		--margin-top: 0px !important;
		margin-top: 0 !important;
		align-self: center !important;
		display: flex !important;
		align-items: center !important;
	}

	.elementor-137 .elementor-element-e4c1e3c > .elementor-widget-container {
		margin: 0 !important;
		padding: 0 !important;
		display: flex !important;
		align-items: center !important;
		transform: none !important;
	}

	.elementor-137 .elementor-element-e4c1e3c .elementor-button {
		font-size: 12px !important;
		line-height: 1.2 !important;
		padding: 8px 14px !important;
		white-space: nowrap;
		margin: 0 !important;
		display: inline-flex !important;
		align-items: center !important;
	}

	/* Locale bar alignment on tablet */
	.elementor-1160 .firsttopheader ~ .e-con:has(.lameris-locale-bar),
	.elementor-1160 .e-con-inner > .e-con:has(.lameris-locale-bar-widget) {
		margin-top: 0 !important;
	}
}

/* Narrow tablet (768–920): tighter type so the whole row fits one line */
@media (max-width: 920px) and (min-width: 768px) {
	.elementor-1160 .elementor-element-c028acb,
	.elementor-137 .elementor-element-a8b28e3 {
		--gap: 4px 8px !important;
		--column-gap: 8px !important;
		--padding-left: 12px !important;
		--padding-right: 12px !important;
	}

	.elementor-1160 .elementor-element-de1db66,
	.elementor-137 .elementor-element-1e8d55f {
		--width: 80px !important;
		width: 80px !important;
		flex: 0 0 80px !important;
	}

	.elementor-1160 .elementor-element-0869202 .hfe-site-logo img,
	.elementor-137 .elementor-element-b1288a0 img {
		width: 72px !important;
		height: auto !important;
	}

	.elementor-1160 #menu-1-1b17b69 li a.hfe-menu-item,
	.elementor-137 .elementor-element-01c750b #menu-1-1b17b69 li a.hfe-menu-item,
	.elementor-137 .elementor-element-01c750b .hfe-nav-menu li a.hfe-menu-item {
		font-size: 11px !important;
		padding-left: 4px !important;
		padding-right: 4px !important;
	}

	.elementor-1160 .elementor-element-10f3fdf .elementor-button,
	.elementor-137 .elementor-element-e4c1e3c .elementor-button {
		font-size: 11px !important;
		padding: 7px 10px !important;
	}
}

/* -------------------------------------------------------------------------- */
/* Compact header (≤1024): theme .header-mobile takes over — reference design */
/* Layout/markup lives in the theme; here only the locale bar is tuned.       */
/* -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
	.header-mobile__locale .lameris-locale-bar {
		display: inline-flex;
		align-items: center;
		justify-content: flex-end;
		gap: 16px;
		font-size: 13px;
		line-height: 1;
		min-width: 0;
	}

	/* Compact top bar — slim toggles so the bar stays ~32px tall */
	.header-mobile__locale .lameris-locale-bar__toggle {
		padding: 5px 0;
		gap: 7px;
		min-height: 0;
		margin: 0;
	}

	.header-mobile__locale .lameris-locale-bar__menu {
		right: 0;
		left: auto;
		z-index: 111113;
	}
}

/* Phones: slightly tighter locale bar */
@media (max-width: 767px) {
	.header-mobile__locale .lameris-locale-bar {
		gap: 8px;
		font-size: 13px;
	}

	.header-mobile__locale .lameris-locale-bar__country-name {
		flex: 0 1 auto;
		min-width: 0;
		max-width: 110px;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
}

/* Very small phones */
@media (max-width: 380px) {
	.header-mobile__locale .lameris-locale-bar {
		font-size: 12px;
		gap: 6px;
	}

	.header-mobile__locale .lameris-locale-bar__country-name {
		max-width: 72px;
	}
}

/* -------------------------------------------------------------------------- */
/* Home banner — hide broken absolute desktop title on tablet/mobile          */
/* -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
	/* Heroes/pages were pulled up (-140px home, -138px inner pages, -50px inner
	 * banners) to slide under the old in-flow masthead. The compact header is
	 * position:fixed (no flow space), so those pulls now hide the image tops
	 * and texts behind the header — restore normal flow. */
	.elementor-18889 .elementor-element-5a5cccc {
		--margin-top: 0px !important;
		margin-top: 0 !important;
	}

	.site-content > .elementor {
		margin-top: 0 !important;
	}

	.site-content .mainbannerimg {
		--margin-top: 0px !important;
		margin-top: 0 !important;
	}

	.elementor-18889 .elementor-element-d09c0c9.bannertitle,
	.elementor-18889 .bannertitle.elementor-absolute {
		display: none !important;
	}

	.elementor-18889 .elementor-element-89878d7.bannerdisc,
	.elementor-18889 .elementor-element-30f5a0d.bannerhomebtn {
		display: none !important;
	}

	/* Tablet: bring the description + CTA back, re-anchored to the banner and
	 * aligned with the right-hand title column (desktop absolute coords broken) */
	@media (min-width: 768px) {
		.elementor-18889 .elementor-element-5a5cccc {
			position: relative !important;
		}

		/* Static so the abs widgets anchor to the banner, not this column */
		.elementor-18889 .elementor-element-208c025.bannerheadingtitle {
			position: static !important;
		}

		.elementor-18889 .elementor-element-89878d7.bannerdisc {
			display: block !important;
			position: absolute !important;
			left: 59% !important;
			right: 4% !important;
			top: 200px !important;
			bottom: auto !important;
			width: auto !important;
			max-width: none !important;
			z-index: 5;
		}

		.elementor-18889 .elementor-element-89878d7.bannerdisc > .elementor-widget-container {
			margin: 0 !important;
			transform: none !important;
		}

		.elementor-18889 .elementor-element-89878d7.bannerdisc .elementor-heading-title,
		.elementor-18889 .elementor-element-89878d7.bannerdisc p {
			font-size: 15px !important;
			line-height: 1.55 !important;
			color: #12414f !important;
		}

		.elementor-18889 .elementor-element-30f5a0d.bannerhomebtn {
			display: block !important;
			position: absolute !important;
			left: 59% !important;
			right: auto !important;
			top: 310px !important;
			bottom: auto !important;
			width: auto !important;
			max-width: none !important;
			z-index: 5;
		}

		.elementor-18889 .elementor-element-30f5a0d.bannerhomebtn > .elementor-widget-container {
			margin: 0 !important;
			transform: none !important;
		}
	}

	.elementor-18889 .elementor-element-1532d5f.tabbannertext .elementor-heading-title,
	.elementor-18889 .tabbannertext .elementor-heading-title {
		font-family: "filision-pro", Sans-serif !important;
		font-weight: 600 !important;
		font-size: clamp(22px, 3.2vw, 32px) !important;
		line-height: 1.25 !important;
		color: #002b44 !important;
	}
}

/* Tablet hero: keep the in-flow description + title visible and comfortable */
@media (max-width: 1024px) and (min-width: 768px) {
	.elementor-18889 .elementor-element-208c025.bannerheadingtitle {
		--margin-top: 24px !important;
		margin-top: 24px !important;
	}

	.elementor-18889 .tabbannertext .elementor-heading-title {
		margin-top: 24px !important;
	}
}

/* -------------------------------------------------------------------------- */
/* Footer footlogo — overlap seam + mobile menu stacking                      */
/* Theme CSS: .hfe-site-logo-img { z-index:999999999 } (generatepress).        */
/* -------------------------------------------------------------------------- */
.elementor-location-footer .hfe-site-logo-img,
.elementor-1968 .elementor-element-1f5c77f .hfe-site-logo-img,
.site-footer .hfe-site-logo-img {
	z-index: 6 !important;
	position: relative !important;
}

.ehf-footer,
.site-footer,
.elementor-location-footer {
	position: relative;
	z-index: 5;
}

.ehf-header .hfe-site-logo-img {
	z-index: 5 !important;
}

.header-mobile .logo img {
	z-index: 112 !important;
	position: relative;
	width: auto !important;
	height: 44px !important;
	max-height: 44px !important;
	max-width: 48px !important;
	object-fit: contain;
}

@media (max-width: 767px) {
	.header-mobile .logo img {
		height: 40px !important;
		max-height: 40px !important;
		max-width: 44px !important;
	}
}

@media (max-width: 767px) {
	/* Mobile banner also pulled up -50px for the old in-flow header — reset */
	.elementor-18889 .elementor-element-72a5c10.tabbannerbanner,
	.elementor-18889 .tabbannerbanner {
		--margin-top: 0px !important;
		margin-top: 0 !important;
	}

	/* Sized so "Totaalleverancier" fits the narrow text column — no mid-word breaks */
	.elementor-18889 .elementor-element-72a5c10.tabbannerbanner .elementor-heading-title,
	.elementor-18889 .tabbannerbanner .elementor-heading-title {
		font-family: "filision-pro", Sans-serif !important;
		font-weight: 600 !important;
		font-size: clamp(15px, 4.5vw, 19px) !important;
		line-height: 1.35 !important;
		color: #002b44 !important;
		word-break: normal !important;
		overflow-wrap: normal !important;
		hyphens: manual;
	}
}
