/**
 * Autonano site overrides (Elementor)
 * Typography alignment, nav states, CTA sizing, logo caps, footer grid, focus rings.
 */

/* -------------------------------------------------------------------------
   Fallbacks when kit variables are not in scope
   ------------------------------------------------------------------------- */
:root {
	--autonano-primary: #ff8c00;
	--autonano-secondary: #00426c;
}

/* -------------------------------------------------------------------------
   Header (template post-140): typography + nav hover/active + CTA + logo
   ------------------------------------------------------------------------- */

/* Unify header nav with global kit (Montserrat) */
.elementor-140 .elementor-element-7b701782 .elementor-nav-menu .elementor-item {
	font-family: var(--e-global-typography-primary-font-family, "Montserrat"), sans-serif !important;
	font-weight: 500 !important;
}

/* Default main nav: light text on dark bar (unchanged intent, explicit) */
.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--main .elementor-item {
	color: var(--e-global-color-accent, #f7f7f7) !important;
	fill: var(--e-global-color-accent, #f7f7f7) !important;
}

/* Hover / focus: primary orange — visible feedback */
.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--main .elementor-item:hover,
.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--main .elementor-item:focus {
	color: var(--e-global-color-primary, var(--autonano-primary)) !important;
	fill: var(--e-global-color-primary, var(--autonano-primary)) !important;
}

/* Current page: distinct from default links */
.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--main .elementor-item.elementor-item-active,
.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--main .elementor-item.highlighted {
	color: #ffffff !important;
	fill: #ffffff !important;
}

.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--main .elementor-item.elementor-item-active:hover,
.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--main .elementor-item.highlighted:hover {
	color: var(--e-global-color-primary, var(--autonano-primary)) !important;
	fill: var(--e-global-color-primary, var(--autonano-primary)) !important;
}

.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--main .elementor-item:focus-visible {
	outline: 2px solid var(--e-global-color-primary, var(--autonano-primary));
	outline-offset: 4px;
	border-radius: 2px;
}

/* Dropdown links */
.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--dropdown a:hover,
.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--dropdown a:focus {
	color: var(--e-global-color-primary, var(--autonano-primary)) !important;
}

/* -------------------------------------------------------------------------
   Mobile nav: full-screen overlay when burger is opened.
   Solid dark background covers the whole viewport so every item is legible
   and tappable. Toggle (X) stays visible above the overlay to close it.
   ------------------------------------------------------------------------- */
@media (max-width: 1024px) {
	/* Defensive: hide desktop main nav when the burger is in play. */
	.elementor-140 .elementor-element-7b701782.elementor-nav-menu--dropdown-mobile .elementor-nav-menu--main {
		display: none !important;
	}

	/* Full-screen overlay panel. Height/display are toggled inline by
	   Elementor's slideDown — when open, the panel fills the viewport. */
	.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--dropdown {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		width: 100vw !important;
		max-width: 100vw !important;
		height: 100vh !important;
		max-height: 100vh !important;
		background-color: var(--e-global-color-secondary, var(--autonano-secondary)) !important;
		z-index: 9998;
		padding: 96px 0 32px;
		overflow-y: auto !important;
		overscroll-behavior: contain;
	}

	/* Stretch the inner UL so items can fill the overlay. */
	.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--dropdown .elementor-nav-menu {
		display: flex !important;
		flex-direction: column;
		width: 100%;
	}

	/* Each item: large, centered, full-width row, ≥56px tap target. */
	.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--dropdown .elementor-item {
		color: #ffffff !important;
		font-size: 20px !important;
		font-weight: 500 !important;
		line-height: 1.3 !important;
		padding: 18px 24px !important;
		min-height: 56px;
		display: flex !important;
		align-items: center;
		justify-content: center;
		text-align: center;
		border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	}

	.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--dropdown .elementor-item.elementor-item-active,
	.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--dropdown .elementor-item.highlighted {
		color: var(--e-global-color-primary, var(--autonano-primary)) !important;
		background-color: rgba(255, 255, 255, 0.05);
	}

	.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--dropdown .elementor-item:hover,
	.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--dropdown .elementor-item:focus {
		color: var(--e-global-color-primary, var(--autonano-primary)) !important;
		background-color: rgba(255, 255, 255, 0.08) !important;
	}

	/* Burger toggle: 44px tap target, sits above overlay so user can close it. */
	.elementor-140 .elementor-element-7b701782 .elementor-menu-toggle {
		min-width: 44px;
		min-height: 44px;
		position: relative;
		z-index: 9999;
	}

	/* When toggle is in "open" state, force its icon to white for visibility
	   against the dark overlay. */
	.elementor-140 .elementor-element-7b701782 .elementor-menu-toggle.elementor-active,
	.elementor-140 .elementor-element-7b701782 .elementor-menu-toggle[aria-expanded="true"] {
		color: #ffffff !important;
	}

	/* "Book a Free Trial" CTA: hidden in the collapsed mobile header (no room
	   next to the burger), but docked at the bottom of the menu overlay when
	   the menu is open. Pattern modeled on Shopify mobile login button. */
	.elementor-140 .elementor-element-444e0439 {
		display: none !important;
	}

	/* :has() targets the header container that owns both the toggle and the CTA,
	   so we can flip the CTA on whenever the burger is in the open state. */
	.elementor-140 .e-con:has(.elementor-menu-toggle[aria-expanded="true"]) .elementor-element-444e0439,
	.elementor-140 .elementor-section:has(.elementor-menu-toggle[aria-expanded="true"]) .elementor-element-444e0439 {
		display: block !important;
		position: fixed !important;
		left: 16px !important;
		right: 16px !important;
		bottom: 24px !important;
		width: auto !important;
		max-width: none !important;
		z-index: 10000;
	}

	.elementor-140 .e-con:has(.elementor-menu-toggle[aria-expanded="true"]) .elementor-element-444e0439 .elementor-button-wrapper,
	.elementor-140 .elementor-section:has(.elementor-menu-toggle[aria-expanded="true"]) .elementor-element-444e0439 .elementor-button-wrapper {
		width: 100%;
	}

	.elementor-140 .e-con:has(.elementor-menu-toggle[aria-expanded="true"]) .elementor-element-444e0439 .elementor-button,
	.elementor-140 .elementor-section:has(.elementor-menu-toggle[aria-expanded="true"]) .elementor-element-444e0439 .elementor-button {
		display: flex !important;
		width: 100% !important;
		justify-content: center;
		align-items: center;
		font-size: 18px !important;
		font-weight: 600 !important;
		padding: 16px 24px !important;
		min-height: 56px;
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
	}

	/* Reserve room at the bottom of the overlay so the long menu list doesn't
	   slide under the docked CTA on small screens. */
	.elementor-140 .elementor-element-7b701782 .elementor-nav-menu--dropdown {
		padding-bottom: 120px !important;
	}
}

/* Header CTA: replace vw font size with clamp */
.elementor-140 .elementor-element-444e0439 .elementor-button {
	font-size: clamp(0.875rem, 0.35vw + 0.78rem, 1.125rem) !important;
	font-style: normal !important;
}

.elementor-140 .elementor-element-444e0439 .elementor-button:focus-visible {
	outline: 2px solid var(--e-global-color-primary, var(--autonano-primary));
	outline-offset: 3px;
	border-radius: 4px;
}

/* Logo: stable max height instead of 10vh */
.elementor-140 .elementor-element-6aab811a img {
	height: auto !important;
	max-height: 56px !important;
	width: auto !important;
	object-fit: contain;
}

@media (max-width: 767px) {
	.elementor-140 .elementor-element-6aab811a img {
		max-height: 48px !important;
	}
}

/* -------------------------------------------------------------------------
   Footer (template post-55): Montserrat + footer logo + grid + form focus
   ------------------------------------------------------------------------- */

.elementor-55 .elementor-heading-title {
	font-family: var(--e-global-typography-primary-font-family, "Montserrat"), sans-serif !important;
	font-weight: 700 !important;
	font-style: normal !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	line-height: 1.3 !important;
}

.elementor-55 .elementor-widget-text-editor,
.elementor-55 .elementor-widget-text-editor p,
.elementor-55 .elementor-nav-menu .elementor-item,
.elementor-55 .elementor-element-5350b233 .elementor-field-group .elementor-field,
.elementor-55 .elementor-element-5350b233 .elementor-field-group .elementor-field:not(.elementor-select-wrapper),
.elementor-55 .elementor-element-5350b233 .elementor-button,
.elementor-55 .elementor-element-300d3c54 .elementor-heading-title {
	font-family: var(--e-global-typography-text-font-family, "Montserrat"), sans-serif !important;
	font-weight: 400 !important;
	letter-spacing: normal !important;
}

.elementor-55 .elementor-element-45728f42 img {
	height: auto !important;
	max-height: 58px !important;
	width: auto !important;
	object-fit: contain;
}

/* Footer: icon list + social icons — keep first/left icons from rendering smaller than siblings */
.elementor-55 .elementor-widget-icon-list .elementor-icon-list-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.elementor-55 .elementor-widget-icon-list .elementor-icon-list-icon i,
.elementor-55 .elementor-widget-icon-list .elementor-icon-list-icon svg {
	width: 1.35em;
	height: 1.35em;
	font-size: 1.35em;
	line-height: 1;
}

.elementor-55 .elementor-widget-social-icons .elementor-social-icon {
	font-size: 1.25rem;
	line-height: 1;
}

.elementor-55 .elementor-widget-social-icons .elementor-social-icon svg {
	width: 1em;
	height: 1em;
}

/* Copyright / bottom bar: standalone icon widgets */
.elementor-55 .elementor-element-7edb984a .elementor-widget-icon .elementor-icon {
	font-size: 1.75rem;
}

.elementor-55 .elementor-element-7edb984a .elementor-widget-icon .elementor-icon svg {
	width: 1em;
	height: 1em;
}

/* Tablet: 5-column footer → 3 columns */
@media (max-width: 1024px) and (min-width: 768px) {
	.elementor-55 .elementor-element-2c9ee38 {
		--e-con-grid-template-columns: repeat(3, 1fr) !important;
	}
}

/* Form + buttons: keyboard focus */
.elementor-55 .elementor-element-5350b233 .elementor-button:focus-visible,
.elementor-55 .elementor-element-5350b233 input[type="email"]:focus-visible,
.elementor-55 .elementor-element-5350b233 input[type="text"]:focus-visible,
.elementor-55 .elementor-element-5350b233 input[type="tel"]:focus-visible,
.elementor-55 .elementor-element-5350b233 textarea:focus-visible,
.elementor-55 .elementor-element-5350b233 select:focus-visible {
	outline: 2px solid var(--e-global-color-primary, var(--autonano-primary));
	outline-offset: 2px;
}