/**
 * Energia Ora responsive header — v1.1.1
 *
 * Scope:
 * - Foxiz Ruby/Elementor header template on compact desktop (1121–1799px)
 * - Foxiz native tablet/mobile header at <=1120px
 *
 * Stable structural selectors are used because Elementor regenerates element
 * IDs when a template is exported/imported. No page-content selector is used.
 */

/* Defensive flex constraints; visually neutral on wide desktop. */
body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con {
	max-width: 100%;
}

body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con > .e-con {
	min-width: 0;
}

body.eo-responsive-header #site-header.header-template .header-template-inner .elementor-widget-foxiz-navigation,
body.eo-responsive-header #site-header.header-template .header-template-inner .main-menu-wrap,
body.eo-responsive-header #site-header.header-template .header-template-inner .main-menu {
	min-width: 0;
}

/*
 * Keep the lower row on one stable baseline in the compact-desktop band.
 * The Elementor document adds a 6px top offset to this row; that offset is
 * what lets the menu settle lower after the header layout has initialized.
 */
@media (min-width: 1121px) and (max-width: 1799px) {
	body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con > .e-con:nth-child(2) > .e-con:nth-child(2) {
		min-height: 68px !important;
		padding-top: 0 !important;
		flex: 0 0 68px !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		transform: none !important;
		transition: none !important;
	}

	body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con > .e-con:nth-child(2) > .e-con:nth-child(2) > .elementor-widget-foxiz-navigation,
	body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con > .e-con:nth-child(2) > .e-con:nth-child(2) > .e-con {
		align-self: center !important;
		margin-top: 0 !important;
		top: auto !important;
		transform: none !important;
	}
}

/*
 * The source Elementor document assigns a 23% logo column but a 370px image.
 * That image visibly enters the menu column on common 1280–1600px desktops.
 * Constrain it to its own column without changing its wide-screen upper limit.
 */
body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con > .e-con:first-child .elementor-widget-foxiz-logo {
	width: 100% !important;
	max-width: 100% !important;
}

body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con > .e-con:first-child .elementor-widget-foxiz-logo > .elementor-widget-container {
	max-width: 100%;
}

body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con > .e-con:first-child .the-logo img {
	display: block;
	width: min(370px, 100%) !important;
	max-width: 100% !important;
	height: auto;
}

/*
 * Compact desktop.
 * The current 370px logo plus the fixed 390px action container only fit safely
 * on very wide screens. This band scales those intrinsic widths while keeping
 * every desktop control visible and on its intended row.
 */
@media (min-width: 1121px) and (max-width: 1799px) {
	body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con {
		padding-inline: clamp(12px, 1.5vw, 20px) !important;
	}

	/* Logo area scales smoothly and never forces the right column to overlap. */
	body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con > .e-con:first-child {
		width: clamp(258px, 24vw, 380px) !important;
		min-width: 258px;
		flex: 0 1 clamp(258px, 24vw, 380px) !important;
	}

	body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con > .e-con:first-child .elementor-widget-foxiz-logo > .elementor-widget-container {
		margin-right: 0 !important;
	}

	/* Right area consumes the remaining width and may shrink safely. */
	body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con > .e-con:nth-child(2) {
		width: auto !important;
		min-width: 0;
		flex: 1 1 auto !important;
	}

	/* Both menu rows use their available width without wrapping over the logo. */
	body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con > .e-con:nth-child(2) > .e-con {
		min-width: 0;
	}

	body.eo-responsive-header #site-header.header-template .header-template-inner .elementor-widget-foxiz-navigation {
		--menu-item-spacing: clamp(5px, 0.55vw, 9px) !important;
		--nav-height: 44px !important;
	}

	body.eo-responsive-header #site-header.header-template .header-template-inner .main-menu {
		flex-flow: row nowrap;
	}

	body.eo-responsive-header #site-header.header-template .header-template-inner .main-menu > li {
		flex: 0 0 auto;
	}

	/* The fixed 390px Elementor action box caused the medium-width collision. */
	body.eo-responsive-header #site-header.header-template .header-template-inner .elementor-widget-foxiz-navigation + .e-con {
		width: auto !important;
		min-width: 236px;
		flex: 0 0 auto !important;
		gap: clamp(6px, 0.75vw, 10px) !important;
	}

	body.eo-responsive-header #site-header.header-template .header-template-inner .elementor-widget-foxiz-navigation + .e-con .elementor-widget-container {
		margin-right: clamp(4px, 0.6vw, 8px) !important;
	}
}

/*
 * Use Foxiz's own accessible mobile header slightly earlier than its stock
 * 1024px threshold. This removes the unsafe 1025–1120px squeeze without
 * cloning markup, JavaScript, search, dark-mode, or drawer behavior.
 */
@media (min-width: 1025px) and (max-width: 1120px) {
	body.eo-responsive-header #site-header.header-template .header-template-inner {
		display: none;
	}

	body.eo-responsive-header #site-header.header-template #header-mobile {
		z-index: 1000;
		display: flex;
		max-height: 100vh;
		flex-flow: column nowrap;
	}

	/* Foxiz moves the sticky class to the mobile holder only up to 1024px. */
	body.eo-responsive-header.sticky-on #site-header.header-template #header-template-holder {
		position: fixed;
		top: 0;
		right: 0;
		left: 0;
		margin-top: 0;
		transform: translate3d(0, 0, 0);
	}

	body.eo-responsive-header.stick-animated #site-header.header-template #header-template-holder {
		animation-name: stick-animation;
		animation-duration: .2s;
		animation-timing-function: ease-out;
		animation-iteration-count: 1;
		will-change: transform;
	}

	body.eo-responsive-header.sticky-on #site-header.header-template #header-template-holder > #header-mobile {
		position: static;
	}
}

/*
 * Foxiz owns the tablet/mobile shell at <=1024px; this child extends that shell
 * through 1120px. These rules only improve
 * sizing and scrolling; they do not replace its interaction or accessibility.
 */
@media (max-width: 1120px) {
	/* Keep the mapped utility menu attached whenever the smart header returns. */
	body.eo-responsive-header.sticky-on #site-header.header-template #header-mobile .mobile-qview {
		display: block;
	}

	body.eo-responsive-header #site-header.header-template #header-mobile .mbnav {
		gap: 12px;
	}

	body.eo-responsive-header #site-header.header-template #header-mobile .navbar-left {
		min-width: 0;
	}

	body.eo-responsive-header #site-header.header-template #header-mobile .mobile-logo-wrap {
		min-width: 0;
		max-width: min(360px, calc(100vw - 170px));
	}

	body.eo-responsive-header #site-header.header-template #header-mobile .mobile-logo-wrap a {
		display: flex;
		align-items: center;
		min-width: 0;
	}

	body.eo-responsive-header #site-header.header-template #header-mobile .mobile-logo-wrap img {
		width: auto;
		max-width: 100%;
		height: auto;
		object-fit: contain;
	}

	body.eo-responsive-header #site-header.header-template #header-mobile .mobile-qview {
		overflow-x: auto;
		overflow-y: hidden;
		overscroll-behavior-inline: contain;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}

	body.eo-responsive-header #site-header.header-template #header-mobile .mobile-qview::-webkit-scrollbar {
		display: none;
	}

	body.eo-responsive-header #site-header.header-template #header-mobile .mobile-qview-inner {
		width: max-content;
		min-width: 100%;
	}

	body.eo-responsive-header #site-header.header-template #header-mobile .mobile-qview a {
		padding-inline: clamp(12px, 2.4vw, 18px);
	}

	body.eo-responsive-header #site-header.header-template #header-mobile .mobile-menu-wrap {
		width: 100%;
	}

	body.eo-responsive-header #site-header.header-template #header-mobile .mobile-menu > li > a {
		min-height: 44px;
		padding-block: 11px;
	}

	body.eo-responsive-header #site-header.header-template #header-mobile .mobile-menu .sub-menu a {
		min-height: 40px;
		padding-block: 9px;
	}
}

@media (max-width: 767px) {
	body.eo-responsive-header #site-header.header-template #header-mobile .mbnav {
		padding-inline: 16px;
		gap: 8px;
	}

	body.eo-responsive-header #site-header.header-template #header-mobile .mobile-logo-wrap {
		max-width: calc(100vw - 145px);
	}

	body.eo-responsive-header #site-header.header-template #header-mobile .mobile-qview a {
		padding-inline: 12px;
		font-size: 14px;
	}

	body.eo-responsive-header #site-header.header-template #header-mobile .mobile-menu .sub-menu > * {
		flex-basis: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.eo-responsive-header #site-header.header-template #header-mobile .mobile-collapse {
		transition: none;
	}
}

/* ==========================================================================
 * Centered desktop header v2 — added in Energia Ora child v2.3.6
 * ========================================================================== */

/*
 * The original responsive rules above intentionally target the old 23% logo /
 * 77% right-column Elementor document. The new header is marked with the
 * eo-header-centered-v2 class, allowing us to neutralize only those structural
 * assumptions while leaving the native Foxiz mobile header unchanged.
 */
body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con.eo-header-centered-v2 {
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
}

/* Top row: logo remains mathematically centered while actions stay at right. */
body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-top {
	position: relative;
	width: 100% !important;
	min-width: 0 !important;
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	flex-wrap: nowrap !important;
}

body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-top::before {
	content: "";
	flex: 1 1 0;
	min-width: 0;
}

body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-logo {
	width: auto !important;
	min-width: 0 !important;
	flex: 0 0 auto !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-actions {
	width: auto !important;
	min-width: 0 !important;
	flex: 1 1 0 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: flex-end !important;
}

body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-actions > .e-con {
	width: auto !important;
	min-width: 0 !important;
	flex: 0 0 auto !important;
}

body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-logo .elementor-widget-foxiz-logo,
body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-logo .elementor-widget-container,
body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-logo .the-logo {
	width: auto !important;
	max-width: 100% !important;
}

body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-logo .the-logo img {
	display: block;
	width: min(340px, 31vw) !important;
	max-width: 100% !important;
	height: auto !important;
}

/* Second row: a dedicated divider and one centered Foxiz navigation. */
body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-nav-row {
	width: 100% !important;
	min-width: 0 !important;
	flex: 0 0 auto !important;
	border-top: 1px solid rgba(0, 0, 0, .30) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-nav-row > .elementor-widget-foxiz-navigation {
	width: auto !important;
	max-width: 100% !important;
	min-width: 0 !important;
	flex: 0 0 auto !important;
}

/*
 * Override the old compact-desktop first-child/second-child sizing only for
 * this v2 root. The old selectors are intentionally left untouched for the
 * current header and for rollback.
 */
@media (min-width: 1121px) and (max-width: 1799px) {
	body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con.eo-header-centered-v2 {
		padding-inline: clamp(12px, 1.5vw, 20px) !important;
	}

	body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con.eo-header-centered-v2 > .e-con:first-child,
	body.eo-responsive-header #site-header.header-template .header-template-inner > .elementor > .e-con.eo-header-centered-v2 > .e-con:nth-child(2) {
		width: 100% !important;
		min-width: 0 !important;
		flex: 0 0 auto !important;
	}

	body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-logo .the-logo img {
		width: min(320px, 29vw) !important;
	}

	body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-nav-row .elementor-widget-foxiz-navigation {
		--menu-item-spacing: clamp(5px, .6vw, 10px) !important;
		--nav-height: 48px !important;
	}
}

/*
 * <=1120px remains owned by the existing Foxiz native mobile header. Because
 * the PHP module extends the real eo-main WordPress menu, About and Contatti
 * are automatically available there as well—no duplicate mobile markup.
 */

/* ==========================================================================
 * Unified header refinements — v2.4.0
 * ========================================================================== */

/* One menu means one mobile navigation too: remove the old eo-utility quick row. */
@media (max-width: 1120px) {
	body.eo-responsive-header #site-header.header-template #header-mobile .mobile-qview {
		display: none !important;
	}
}

/* Keep the IF-inspired desktop header airy and centered without a date/left utility. */
@media (min-width: 1121px) {
	body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-top {
		min-height: 112px;
		padding-block: 12px !important;
	}

	body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-nav-row {
		min-height: 52px;
	}

	body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-logo .the-logo img {
		width: min(350px, 30vw) !important;
	}
}

@media (min-width: 1121px) and (max-width: 1279px) {
	body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-logo .the-logo img {
		width: min(300px, 28vw) !important;
	}

	body.eo-responsive-header #site-header.header-template .eo-header-centered-v2 .eo-header-centered-nav-row .elementor-widget-foxiz-navigation {
		--menu-item-spacing: 5px !important;
		--nav-height: 48px !important;
	}
}


/* ==========================================================================
 * Current native "Header Network" redesign — v2.4.2
 * ==========================================================================
 *
 * Reflows the existing classic Elementor Header Network without rewriting its
 * saved template or WordPress menu data.
 *
 * Desktop:
 *   [                 centered LOGO                 ][actions →]
 *   -----------------------------------------------------------
 *        centered Foxiz main menu on its own row
 *
 * <=1120px: Foxiz native mobile header remains authoritative.
 * ========================================================================== */

@media (min-width: 1121px) {

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child {
		width: 100% !important;
		max-width: none !important;
		min-height: 0 !important;
		height: auto !important;
		margin: 0 !important;
		padding: 0 !important;
		background: #fff !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container {
		position: relative !important;
		display: block !important;
		width: 100% !important;
		max-width: none !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	/* Column 1 owns the actual visual flow: Logo first, Navigation second. */
	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:first-child {
		display: block !important;
		width: 100% !important;
		max-width: none !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:first-child
	> .elementor-widget-wrap {
		display: flex !important;
		flex-direction: column !important;
		align-items: stretch !important;
		width: 100% !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	/* ---------------- Centered logo row ---------------- */
	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-logo {
		box-sizing: border-box !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: 100% !important;
		max-width: none !important;
		min-height: 112px !important;
		margin: 0 !important;
		/*
		 * Equal safe-zones reserve room for the right-side action group while
		 * keeping the logo mathematically centered in the viewport.
		 */
		padding:
			12px
			clamp(220px, 18vw, 320px)
			14px !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-logo > .elementor-widget-container,
	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-logo .the-logo,
	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-logo .the-logo a {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-logo .the-logo img {
		display: block !important;
		width: clamp(285px, 24vw, 420px) !important;
		max-width: 100% !important;
		height: auto !important;
		margin: 0 auto !important;
		object-fit: contain !important;
	}

	/* ---------------- Existing right-side actions ---------------- */
	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:nth-child(2) {
		position: absolute !important;
		z-index: 5 !important;
		top: 0 !important;
		right: 0 !important;
		display: flex !important;
		align-items: center !important;
		width: auto !important;
		max-width: clamp(220px, 18vw, 320px) !important;
		height: 112px !important;
		margin: 0 !important;
		padding: 0 clamp(18px, 3vw, 48px) 0 10px !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:nth-child(2)
	> .elementor-widget-wrap {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		justify-content: flex-end !important;
		gap: clamp(7px, .75vw, 12px) !important;
		width: auto !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:nth-child(2)
	.elementor-widget {
		flex: 0 0 auto !important;
		width: auto !important;
		max-width: none !important;
		margin: 0 !important;
		align-self: center !important;
	}

	/* ---------------- Main menu row below logo ---------------- */
	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-navigation {
		width: 100% !important;
		max-width: none !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		border-top: 1px solid rgba(0, 0, 0, .26) !important;
		border-bottom: 1px solid rgba(0, 0, 0, .08) !important;
		background: #fff !important;
		--nav-height: 50px !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-navigation > .elementor-widget-container {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: 100% !important;
		max-width: none !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 clamp(16px, 3vw, 48px) !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-navigation .main-menu-wrap {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: auto !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin-inline: auto !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-navigation .main-menu {
		justify-content: center !important;
		flex-flow: row nowrap !important;
		width: auto !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin-inline: auto !important;
	}

	/* Compact desktop: preserve a single menu row. */
	@media (max-width: 1399px) {
		body.eo-responsive-header
		#site-header.header-template
		.header-template-inner > .elementor
		> .elementor-section:first-child
		.elementor-widget-foxiz-navigation {
			--menu-item-spacing: clamp(5px, .55vw, 8px) !important;
			--nav-height: 48px !important;
		}
	}

	/* Last desktop band before Foxiz's native mobile header takes over. */
	@media (max-width: 1199px) {
		body.eo-responsive-header
		#site-header.header-template
		.header-template-inner > .elementor
		> .elementor-section:first-child
		.elementor-widget-foxiz-logo {
			padding-inline: 215px !important;
		}

		body.eo-responsive-header
		#site-header.header-template
		.header-template-inner > .elementor
		> .elementor-section:first-child
		.elementor-widget-foxiz-logo .the-logo img {
			width: 285px !important;
		}

		body.eo-responsive-header
		#site-header.header-template
		.header-template-inner > .elementor
		> .elementor-section:first-child
		> .elementor-container
		> .elementor-column:nth-child(2) {
			max-width: 215px !important;
			padding-right: 16px !important;
			padding-left: 8px !important;
		}
	}
}

/* Foxiz owns tablet/mobile; keep the secondary quick menu out of the UI. */
@media (max-width: 1120px) {
	body.eo-responsive-header
	#site-header.header-template
	#header-mobile .mobile-qview {
		display: none !important;
	}
}


/* ==========================================================================
 * Mobile logo — true center + 20% enlargement (v2.4.7)
 * ==========================================================================
 * - Keeps Foxiz's light/dark/mobile logo visibility logic intact.
 * - Removes the logo from the flex balancing of hamburger/search controls.
 * - Pins the logo to the mathematical center of the mobile header.
 * - Enlarges the v2.4.6 responsive target by exactly 20%:
 *     v2.4.6: min(300px, 100vw - 155px)
 *     v2.4.7: min(360px, 120vw - 186px)
 * - Raises the previous 120px height cap by 20% -> 144px.
 * ========================================================================== */
@media (max-width: 767px) {
	body.eo-responsive-header
	#site-header.header-template
	#header-mobile {
		--hd-logo-height: 144px !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	#header-mobile .mbnav {
		position: relative !important;
		min-height: 96px !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	#header-mobile .mobile-logo-wrap {
		position: absolute !important;
		z-index: 2 !important;
		left: 50% !important;
		top: 50% !important;
		transform: translate(-50%, -50%) !important;
		flex: none !important;
		width: min(360px, calc(120vw - 186px)) !important;
		max-width: min(360px, calc(120vw - 186px)) !important;
		min-width: 0 !important;
		margin: 0 !important;
		overflow: visible !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	#header-mobile .mobile-logo-wrap a {
		align-items: center !important;
		justify-content: center !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	/*
	 * Do not alter display/visibility. Foxiz decides which light/dark/mobile
	 * image variant is active; this rule changes only dimensions.
	 */
	body.eo-responsive-header
	#site-header.header-template
	#header-mobile .mobile-logo-wrap img {
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
		max-height: 144px !important;
		object-fit: contain !important;
	}
}

/* ==========================================================================
 * Mobile hamburger submenu accordion — v2.6.3
 * ==========================================================================
 * Sub-items stay collapsed under their parent until the dedicated arrow (or a
 * structural # parent label) is tapped. CSS activates only after JS has added
 * .eo-mobile-accordion-ready, so the menu remains usable if JS is unavailable.
 * ========================================================================== */
@media (max-width: 1120px) {
	body.eo-responsive-header
	#site-header.header-template
	#header-mobile.eo-mobile-accordion-ready
	.mobile-menu > li.menu-item-has-children {
		position: relative;
	}

	body.eo-responsive-header
	#site-header.header-template
	#header-mobile.eo-mobile-accordion-ready
	.mobile-menu > li.menu-item-has-children > a {
		box-sizing: border-box;
		padding-right: 54px !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	#header-mobile.eo-mobile-accordion-ready
	.mobile-menu > li.menu-item-has-children > .sub-menu {
		display: none !important;
		width: 100%;
		margin: 0 !important;
		padding-top: 2px !important;
		padding-bottom: 6px !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	#header-mobile.eo-mobile-accordion-ready
	.mobile-menu > li.eo-mobile-submenu-open > .sub-menu {
		display: block !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	#header-mobile.eo-mobile-accordion-ready
	.mobile-menu > li.menu-item-has-children > .eo-mobile-submenu-toggle {
		position: absolute;
		top: 0;
		right: 0;
		z-index: 3;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 48px;
		height: 46px;
		margin: 0;
		padding: 0;
		border: 0;
		background: transparent;
		color: currentColor;
		cursor: pointer;
		-webkit-tap-highlight-color: transparent;
	}

	body.eo-responsive-header
	#site-header.header-template
	#header-mobile.eo-mobile-accordion-ready
	.eo-mobile-submenu-chevron {
		display: block;
		width: 9px;
		height: 9px;
		border-right: 2px solid currentColor;
		border-bottom: 2px solid currentColor;
		transform: rotate(45deg) translate(-1px, -1px);
		transform-origin: center;
		transition: transform 160ms ease;
	}

	body.eo-responsive-header
	#site-header.header-template
	#header-mobile.eo-mobile-accordion-ready
	.eo-mobile-submenu-toggle[aria-expanded="true"] .eo-mobile-submenu-chevron {
		transform: rotate(225deg) translate(-1px, -1px);
	}

	body.eo-responsive-header
	#site-header.header-template
	#header-mobile.eo-mobile-accordion-ready
	.mobile-menu > li > .sub-menu > li > a {
		padding-left: 20px !important;
		padding-right: 16px !important;
		font-size: .94em;
	}

	body.eo-responsive-header
	#site-header.header-template
	#header-mobile.eo-mobile-accordion-ready
	.eo-mobile-submenu-toggle:focus-visible {
		outline: 2px solid currentColor;
		outline-offset: -4px;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.eo-responsive-header
	#site-header.header-template
	#header-mobile .eo-mobile-submenu-chevron {
		transition: none !important;
	}
}


/* ==========================================================================
 * Mobile menu equal row spacing — v2.6.4
 * ==========================================================================
 * v2.6.3 gave box-sizing:border-box only to parent items with submenus.
 * Plain top-level links stayed content-box, so their 44px min-height plus
 * vertical padding made those rows taller. Normalize every top-level row to
 * the same 44px border-box height — matching the compact Notizie/Reports gap.
 * ========================================================================== */
@media (max-width: 1120px) {
	body.eo-responsive-header
	#site-header.header-template
	#header-mobile
	.mobile-menu > li {
		box-sizing: border-box !important;
		margin-top: 0 !important;
		margin-bottom: 0 !important;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	#header-mobile
	.mobile-menu > li > a {
		box-sizing: border-box !important;
		display: flex !important;
		align-items: center !important;
		min-height: 44px !important;
		height: 44px !important;
		margin: 0 !important;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	#header-mobile.eo-mobile-accordion-ready
	.mobile-menu > li.menu-item-has-children > .eo-mobile-submenu-toggle {
		top: 0 !important;
		height: 44px !important;
	}
}

/* ==========================================================================
 * C&C-style desktop social actions — v2.6.11
 * ==========================================================================
 * Build a deterministic four-icon strip in JS so X, Facebook, LinkedIn and
 * Instagram are always visible even when the Foxiz Social List widget has
 * only a subset of account URLs configured. Existing Energia Ora account
 * URLs are preserved when available. Missing URLs remain non-clickable.
 * ========================================================================== */
@media (min-width: 1121px) {
	/* Remove only the obsolete Join US quick-link from Header Network actions. */
	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:nth-child(2)
	.elementor-widget-foxiz-quick-links {
		display: none !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:nth-child(2)
	.elementor-widget-foxiz-social-list,
	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:nth-child(2)
	.elementor-widget-foxiz-social-list > .elementor-widget-container {
		margin: 0 !important;
		padding: 0 !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:nth-child(2)
	.header-social-list,
	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:nth-child(2)
	.header-social-list .e-social-holder {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: flex-end !important;
		flex-wrap: nowrap !important;
		gap: 15px !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	/* Optical centering against the adjacent Foxiz light/dark switch.
	 * v2.6.18: raise the whole strip by 3px from the previous position so
	 * the visual centres of the 26px social glyphs and the theme switch align. */
	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	.e-social-holder.eo-social-strip {
		position: relative !important;
		top: 3px !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:nth-child(2)
	.e-social-holder.eo-social-strip .eo-social-icon {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: 26px !important;
		height: 30px !important;
		min-width: 26px !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		border-radius: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
		text-decoration: none !important;
		line-height: 1 !important;
		transition: opacity 160ms ease, transform 160ms ease !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:nth-child(2)
	.e-social-holder.eo-social-strip .eo-social-icon:not(.eo-social-no-url) {
		cursor: pointer !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:nth-child(2)
	.e-social-holder.eo-social-strip .eo-social-no-url {
		cursor: default !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:nth-child(2)
	.e-social-holder.eo-social-strip .eo-social-svg {
		display: block !important;
		width: 26px !important;
		height: 26px !important;
		overflow: visible !important;
	}

	/* Brand colours, matching the C&C top strip. */
	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	.e-social-holder.eo-social-strip .eo-social-svg-x path {
		fill: #000000 !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	.e-social-holder.eo-social-strip .eo-social-svg-facebook path {
		fill: #1877f2 !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	.e-social-holder.eo-social-strip .eo-social-svg-linkedin path {
		fill: #0a66c2 !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	.e-social-holder.eo-social-strip .eo-social-icon:hover {
		opacity: .72 !important;
		transform: translateY(-1px) !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	.e-social-holder.eo-social-strip a.eo-social-icon:focus-visible {
		outline: 2px solid currentColor !important;
		outline-offset: 3px !important;
	}
}


/* ========================================================================== 
 * Stable sticky header + IF-style desktop dropdown frames — v2.6.13
 * ========================================================================== 
 * Fixes two issues visible in the 2026-09-04 screen recording:
 * 1) the empty white strip that appeared below the compact header;
 * 2) the logo/header slowly travelling upward and eventually being clipped.
 *
 * Root cause: making #site-header itself position:sticky left it constrained by
 * Foxiz's header wrapper and left the theme's original flow-height/shadow below
 * the visibly smaller header.  Desktop now pins #header-template-holder with
 * position:fixed and keeps #site-header only as an exactly-synchronised flow
 * placeholder. JavaScript updates that placeholder while the 30% compact
 * transition is running, so there is no stale white band and no scroll jump.
 *
 * Mobile/tablet keeps Foxiz's native sticky system and never receives the
 * desktop compact state.
 * ========================================================================== */

@media (min-width: 1121px) {
	/* The outer header is only the flow placeholder on desktop. Never make this
	 * node sticky: its ancestor geometry is what caused the recorded clipping. */
	body.eo-responsive-header.eo-sticky-header-ready
	#site-header.header-template {
		position: relative !important;
		top: auto !important;
		right: auto !important;
		bottom: auto !important;
		left: auto !important;
		width: 100% !important;
		height: var(--eo-header-flow-height) !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
		transform: none !important;
		translate: none !important;
		overflow: visible !important;
	}

	/* Pin the complete two-row desktop header directly to the viewport. This is
	 * independent from Foxiz's smart-sticky travel/animation, so the logo cannot
	 * drift above the viewport on long or fast scrolls. */
	body.eo-responsive-header.eo-sticky-header-ready
	#site-header.header-template
	#header-template-holder {
		position: fixed !important;
		z-index: 9990 !important;
		top: 0 !important;
		right: 0 !important;
		bottom: auto !important;
		left: 0 !important;
		display: block !important;
		width: 100% !important;
		max-width: none !important;
		margin: 0 !important;
		padding: 0 !important;
		background: #fff !important;
		box-shadow: none !important;
		transform: translate3d(0, 0, 0) !important;
		translate: none !important;
		animation: none !important;
		will-change: auto !important;
		opacity: 1 !important;
		visibility: visible !important;
		overflow: visible !important;
	}

	body.eo-responsive-header.admin-bar.eo-sticky-header-ready
	#site-header.header-template
	#header-template-holder {
		top: 32px !important;
	}

	/* Foxiz can keep toggling sticky-on / stick-animated in the background. Its
	 * animation must never be allowed to move our pinned holder. */
	body.eo-responsive-header.eo-sticky-header-ready.sticky-on
	#site-header.header-template
	#header-template-holder,
	body.eo-responsive-header.eo-sticky-header-ready.stick-animated
	#site-header.header-template
	#header-template-holder {
		transform: translate3d(0, 0, 0) !important;
		animation: none !important;
	}

	/* Put the shadow on the actual visible fixed holder, not the flow placeholder.
	 * In v2.6.12 the shadow stayed at the old full-header height and visually
	 * exposed the empty white strip below the compact navigation. */
	body.eo-responsive-header.eo-header-scrolled.eo-sticky-header-ready
	#site-header.header-template
	#header-template-holder {
		box-shadow: 0 5px 16px rgba(18, 28, 45, .10) !important;
	}

	/* Smooth only the elements that physically change size. The flow placeholder
	 * is synchronised by ResizeObserver while these transitions run. */
	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-logo,
	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:nth-child(2),
	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-logo .the-logo img {
		transition: min-height 220ms ease, height 220ms ease, padding 220ms ease, width 220ms ease !important;
	}

	/* About 30% shorter than the normal 112px logo/action row. */
	body.eo-responsive-header.eo-header-condensed
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-logo {
		min-height: 78px !important;
		padding-top: 7px !important;
		padding-bottom: 8px !important;
	}

	body.eo-responsive-header.eo-header-condensed
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-logo .the-logo img {
		width: clamp(210px, 17vw, 294px) !important;
	}

	body.eo-responsive-header.eo-header-condensed
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:nth-child(2) {
		height: 78px !important;
	}

	/* Keep the navigation readable; only tighten its vertical footprint. */
	body.eo-responsive-header.eo-header-condensed
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-navigation {
		--nav-height: 40px !important;
	}

	/* ---------------- IF-style dropdown frame ---------------- */
	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner
	.elementor-widget-foxiz-navigation
	.main-menu .sub-menu {
		border: 1px solid rgba(20, 79, 133, .14) !important;
		border-radius: 0 0 4px 4px !important;
		outline: 0 !important;
		box-shadow: 0 8px 20px rgba(22, 42, 63, .12) !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner
	.elementor-widget-foxiz-navigation
	.main-menu > li > .sub-menu {
		border-top-color: rgba(20, 79, 133, .08) !important;
	}
}


@media (min-width: 1121px) and (max-width: 1199px) {
	body.eo-responsive-header.eo-header-condensed
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-logo .the-logo img {
		width: 210px !important;
	}
}

/* Tablet/mobile: restore the native Foxiz sticky shell. No compact sizing and
 * no desktop flow-placeholder/fixed-holder logic is applied here. */
@media (max-width: 1120px) {
	body.eo-responsive-header #site-header.header-template {
		position: relative !important;
		top: auto !important;
		height: auto !important;
		min-height: 0 !important;
		transform: none !important;
	}

	body.eo-responsive-header.eo-header-condensed #site-header.header-template #header-mobile,
	body.eo-responsive-header.eo-header-condensed #site-header.header-template #header-mobile .mbnav,
	body.eo-responsive-header.eo-header-condensed #site-header.header-template #header-mobile .mobile-logo-wrap,
	body.eo-responsive-header.eo-header-condensed #site-header.header-template #header-mobile .mobile-logo-wrap img {
		transform: none !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.eo-responsive-header #site-header.header-template .elementor-widget-foxiz-logo,
	body.eo-responsive-header #site-header.header-template .elementor-widget-foxiz-logo .the-logo img {
		transition: none !important;
	}
}

/* ========================================================================== 
 * Scroll-proportional desktop header sizing — v2.6.14
 * ========================================================================== 
 * The previous binary compact class + ResizeObserver could leave the flow
 * placeholder one paint behind the fixed holder. On HiDPI displays Math.ceil()
 * could also reserve a fractional extra pixel. The result was the recorded
 * white strip and a visible logo jump while returning to the top.
 *
 * v2.6.14 is driven continuously by header-sticky.js. Every scroll frame writes
 * the real row/logo dimensions first, then writes the exact (non-rounded) holder
 * height to #site-header before paint. No threshold transition and no observer.
 * ========================================================================== */
@media (min-width: 1121px) {
	body.eo-responsive-header.eo-sticky-header-ready
	#site-header.header-template {
		height: var(--eo-header-flow-height) !important;
		min-height: var(--eo-header-flow-height) !important;
		line-height: normal !important;
		background: transparent !important;
	}

	/* Remove any theme-side spacing on the fixed shell itself; the navigation's
	 * own subtle bottom border remains the only separator below the header. */
	body.eo-responsive-header.eo-sticky-header-ready
	#site-header.header-template
	#header-template-holder,
	body.eo-responsive-header.eo-sticky-header-ready
	#site-header.header-template
	.header-template-inner {
		margin-bottom: 0 !important;
		padding-bottom: 0 !important;
		border-bottom-width: 0 !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-logo {
		min-height: var(--eo-scroll-logo-row, 112px) !important;
		padding-top: var(--eo-scroll-pad-top, 12px) !important;
		padding-bottom: var(--eo-scroll-pad-bottom, 14px) !important;
		transition: none !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	> .elementor-container
	> .elementor-column:nth-child(2) {
		height: var(--eo-scroll-logo-row, 112px) !important;
		transition: none !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-logo .the-logo img {
		width: var(--eo-scroll-logo-width, clamp(285px, 24vw, 420px)) !important;
		transition: none !important;
		transform: none !important;
	}

	body.eo-responsive-header
	#site-header.header-template
	.header-template-inner > .elementor
	> .elementor-section:first-child
	.elementor-widget-foxiz-navigation {
		--nav-height: var(--eo-scroll-nav-row, 50px) !important;
		margin-bottom: 0 !important;
	}
}

/* ========================================================================== 
 * Cold-load header seam hardening — v2.6.15
 * ========================================================================== 
 * The first uncached render can resolve Elementor/logo/font geometry a little
 * later than footer JavaScript. The JS now settles those late changes. This
 * 1px flow overlap is an additional anti-seam guard for Retina/sub-pixel layout:
 * page content begins one CSS pixel behind the opaque fixed header, so a white
 * hairline can never open between the two surfaces.
 * ========================================================================== */
@media (min-width: 1121px) {
	body.eo-responsive-header.eo-sticky-header-ready
	#site-header.header-template {
		--eo-header-seam-overlap: 1px;
		height: max(0px, calc(var(--eo-header-flow-height) - var(--eo-header-seam-overlap))) !important;
		min-height: max(0px, calc(var(--eo-header-flow-height) - var(--eo-header-seam-overlap))) !important;
	}

	/* Do not allow an inherited line-height/border/margin on the flow placeholder
	 * to manufacture its own visible strip underneath the fixed holder. */
	body.eo-responsive-header.eo-sticky-header-ready
	#site-header.header-template,
	body.eo-responsive-header.eo-sticky-header-ready
	#site-header.header-template > #header-template-holder {
		border-bottom: 0 !important;
		margin-bottom: 0 !important;
	}
}

/* ========================================================================== 
 * Fixed-shell intrinsic height — v2.6.17
 * ========================================================================== 
 * Debugging on the live site showed the exact source of the intermittent white
 * strip: while the logo + navigation rows correctly shrank to ~127px, Foxiz's
 * #header-template-holder and .header-template-inner stayed frozen at the
 * original ~180px height.  The remaining ~52px was simply the white background
 * of that stale fixed wrapper.
 *
 * Keep #site-header as one stable FULL-SIZE document-flow placeholder (so
 * scrolling never changes page geometry), but let the fixed shell itself use
 * intrinsic/auto height.  This makes its bottom edge follow the navigation row
 * on every frame and removes both the white strip and the scroll feedback that
 * caused the logo jump near the top.
 * ========================================================================== */
@media (min-width: 1121px) {
	body.eo-responsive-header.eo-sticky-header-ready
	#site-header.header-template {
		--eo-header-seam-overlap: 0px;
		height: var(--eo-header-flow-height) !important;
		min-height: var(--eo-header-flow-height) !important;
	}

	/* Foxiz may retain an inline/theme-calculated full header height on these
	 * wrappers.  It must not constrain the fixed shell after our rows shrink. */
	body.eo-responsive-header.eo-sticky-header-ready
	#site-header.header-template
	#header-template-holder,
	body.eo-responsive-header.eo-sticky-header-ready
	#site-header.header-template
	#header-template-holder > .header-template-inner,
	body.eo-responsive-header.eo-sticky-header-ready
	#site-header.header-template
	#header-template-holder > .header-template-inner > .elementor,
	body.eo-responsive-header.eo-sticky-header-ready
	#site-header.header-template
	#header-template-holder > .header-template-inner > .elementor > .elementor-section:first-child,
	body.eo-responsive-header.eo-sticky-header-ready
	#site-header.header-template
	#header-template-holder > .header-template-inner > .elementor > .elementor-section:first-child > .elementor-container {
		height: auto !important;
		min-height: 0 !important;
		max-height: none !important;
	}

	/* The holder itself must end exactly where its real children end. */
	body.eo-responsive-header.eo-sticky-header-ready
	#site-header.header-template
	#header-template-holder {
		bottom: auto !important;
		background-clip: padding-box !important;
	}
}
