/* ==========================================================================
   AZ Portfolio — header & footer (UAE Header Footer Builder templates).
   Menu colors/typography are set in the Navigation Menu widget itself.
   ========================================================================== */

/* Anchor jumps land below the sticky header. */
html { scroll-behavior: smooth; }
[id] { scroll-margin-top: 96px; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
}

/* ---------- Sticky header ---------- */
#masthead:has(.az-el-header) {
	backdrop-filter: blur(10px);
	background: rgba(5, 11, 23, 0.92);
	border-bottom: 1px solid rgba(79, 165, 138, 0.18);
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 100;
}

@media (max-width: 600px) {
	/* The WP admin bar is not fixed on small screens. */
	#masthead:has(.az-el-header) { top: 0; }
}

.e-con.az-el-header {
	--content-width: var(--az-container);
	--padding-top: 14px;
	--padding-bottom: 14px;
	--padding-left: var(--az-gutter);
	--padding-right: var(--az-gutter);
	color: var(--az-text);
	font-family: var(--az-font);
}

.az-el-header .e-con {
	--padding-top: 0;
	--padding-bottom: 0;
	--padding-left: 0;
	--padding-right: 0;
}

.az-el-header > .e-con-inner > .elementor-element,
.az-el-header .az-el-header__actions > .elementor-element { width: auto; }

.az-el-header .elementor-button { white-space: nowrap; }

/* Tablet/mobile: logo left, actions + hamburger right; menu drops down full width under the header. */
@media (max-width: 1024px) {
	.az-el-header > .e-con-inner > .az-el-logo { flex-shrink: 0; }

	.az-el-header > .e-con-inner > .az-el-nav {
		flex: 0 0 auto;
		order: 99;
		width: auto;
	}

	.az-el-header > .e-con-inner > .az-el-header__actions { margin-left: auto; }

	/* Position the dropdown against the header container, not the widget. */
	.az-el-header .az-el-nav,
	.az-el-header .az-el-nav > .elementor-widget-container,
	.az-el-header .az-el-nav .hfe-nav-menu {
		position: static;
	}

	.az-el-header .az-el-nav .hfe-nav-menu__toggle + nav {
		background: var(--az-surface);
		left: 0;
		position: absolute;
		right: 0;
		top: 100%;
		width: auto;
		z-index: 99;
	}

	.az-el-header .az-el-nav .hfe-nav-menu__toggle + nav ul.hfe-nav-menu {
		margin: 0 auto;
		max-width: var(--az-container);
	}

	.az-el-header .az-el-nav .hfe-nav-menu__toggle + nav ul.hfe-nav-menu > li > a.hfe-menu-item {
		border-bottom: 1px solid var(--az-border-soft);
		font-size: 1rem;
		min-height: 52px;
		padding: 14px var(--az-gutter);
	}

	.az-el-header .az-el-nav .hfe-nav-menu__toggle + nav ul.hfe-nav-menu > li:last-child > a.hfe-menu-item { border-bottom: 0; }
}

/* ---------- Logo ---------- */
.az-logo {
	align-items: center;
	color: var(--az-text);
	display: inline-flex;
	font-family: var(--az-font);
	font-size: 1.25rem;
	font-weight: 800;
	gap: 10px;
	letter-spacing: -0.02em;
	min-height: 44px;
	text-decoration: none;
}

.az-logo:hover,
.az-logo:focus { color: var(--az-text); }

.az-logo__mark {
	align-items: center;
	border: 2px solid var(--az-accent);
	border-radius: 10px;
	color: var(--az-accent-light);
	display: inline-flex;
	font-family: var(--az-font-mono);
	font-size: 0.9375rem;
	font-weight: 500;
	height: 36px;
	justify-content: center;
	transition: background-color 0.2s var(--az-ease), color 0.2s var(--az-ease);
	width: 36px;
}

.az-logo:hover .az-logo__mark {
	background: var(--az-accent);
	color: var(--az-on-accent);
}

.az-logo--image img {
	display: block;
	height: auto;
	max-height: 44px;
	width: auto;
}

/* ---------- Navigation (UAE) ---------- */
.az-el-nav .hfe-nav-menu a.hfe-menu-item:focus-visible,
.az-el-footer-nav .hfe-nav-menu a.hfe-menu-item:focus-visible {
	outline: 2px solid var(--az-accent-light);
	outline-offset: 2px;
}

.az-el-nav .hfe-nav-menu__toggle {
	min-height: 44px;
	min-width: 44px;
}

.az-el-nav .hfe-nav-menu-icon {
	border: 1px solid rgba(79, 165, 138, 0.45);
	border-radius: var(--az-pill);
	padding: 10px;
}

/* Mobile dropdown panel. */
.az-el-nav nav.hfe-dropdown {
	border-bottom: 1px solid var(--az-border);
	border-top: 1px solid var(--az-border-soft);
	box-shadow: 0 24px 48px rgba(0, 0, 0, 0.45);
}

/* ---------- Language switcher ---------- */
.az-lang {
	align-items: center;
	border: 1px solid rgba(79, 165, 138, 0.45);
	border-radius: var(--az-pill);
	display: inline-flex;
	font-family: var(--az-font-mono);
	font-size: 0.8125rem;
	gap: 4px;
	min-height: 40px;
	padding: 0 12px;
}

.az-lang__item {
	color: var(--az-subtle);
	padding: 4px 2px;
	text-decoration: none;
}

a.az-lang__item:hover,
a.az-lang__item:focus { color: var(--az-accent-light); }

.az-lang__item.is-current { color: var(--az-text); }
.az-lang__sep { color: var(--az-subtle); }
.az-lang--placeholder { color: var(--az-subtle); }

/* Header CTA: compact size. */
.elementor-widget.az-el-btn.az-el-btn--sm .elementor-button {
	font-size: 0.9375rem;
	min-height: 44px;
	padding: 10px 22px;
}

/* ---------- Footer ---------- */
.e-con.az-el-footer {
	--content-width: var(--az-container);
	--padding-top: 64px;
	--padding-bottom: 32px;
	--padding-left: var(--az-gutter);
	--padding-right: var(--az-gutter);
	background: var(--az-bg);
	border-top: 1px solid rgba(79, 165, 138, 0.18);
	color: var(--az-muted);
	font-family: var(--az-font);
}

.az-el-footer .e-con {
	--padding-top: 0;
	--padding-bottom: 0;
	--padding-left: 0;
	--padding-right: 0;
}

.e-con.az-el-footer .elementor-widget-text-editor {
	color: var(--az-muted);
	font-size: 0.9375rem;
}

.e-con.az-el-footer .elementor-widget-text-editor p:last-child { margin-bottom: 0; }

.e-con.az-el-footer .az-el-footer__title .elementor-heading-title {
	color: var(--az-subtle);
	font-family: var(--az-font);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.az-el-footer .az-contact-links { gap: 10px; }
.az-el-footer .az-contact-links li::before { flex-basis: 36px; height: 36px; background-size: 16px; }
.az-el-footer .az-contact-links a { font-size: 0.9375rem; }

.e-con.az-el-footer .e-con.az-el-footer__bottom {
	--padding-top: 24px;
	border-top: 1px solid var(--az-border-soft);
}

.az-el-footer .hfe-copyright-wrapper,
.az-el-footer .hfe-copyright-wrapper a,
.az-el-footer__legal,
.az-el-footer__legal a {
	color: var(--az-subtle);
	font-family: var(--az-font);
	font-size: 0.875rem;
}

.az-el-footer__legal a { text-decoration: none; }

.az-el-footer__legal a:hover,
.az-el-footer__legal a:focus,
.az-el-footer .hfe-copyright-wrapper a:hover { color: var(--az-accent-light); }
