/**
 * Synovion global header and primary navigation.
 *
 * Scoped to Blocksy's header and off-canvas panel so page, Elementor, and
 * WooCommerce content remain unaffected.
 */

#header,
#header [data-row],
#offcanvas {
	--synovion-header-primary: #6d28d9;
	--synovion-header-primary-hover: #5b21b6;
	--synovion-header-heading: #0f172a;
	--synovion-header-muted: #475569;
	--synovion-header-border: #e2e8f0;
	--synovion-header-tint: #f8fafc;
}

#header [data-row] {
	background: #ffffff;
}

#header [data-row] > div {
	border-color: var(--synovion-header-border);
}

#header .site-logo-container {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}

#header .site-branding {
	display: flex;
	align-items: center;
}

/* The logo image already contains the Synovion name; do not repeat it below. */
#header .site-branding .site-title-container {
	display: none;
}

#header .site-logo-container img {
	display: block;
	width: auto;
	max-height: 58px;
}

#header .menu > .menu-item > a {
	min-height: 44px;
	color: var(--synovion-header-heading);
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: -0.01em;
}

#header .menu > .menu-item > a:hover,
#header .menu > .menu-item.current-menu-item > a,
#header .menu > .menu-item.current-menu-ancestor > a {
	color: var(--synovion-header-primary);
}

#header .menu .child-indicator {
	color: currentColor;
}

#header .menu .sub-menu {
	min-width: 270px;
	padding: 0.5rem;
	background: #ffffff;
	border: 1px solid var(--synovion-header-border);
	border-radius: 12px;
	box-shadow: 0 18px 45px rgba(15, 23, 42, 0.12), 0 4px 12px rgba(15, 23, 42, 0.06);
}

#header .menu .sub-menu .menu-item:not(:last-child) {
	border-bottom: 0;
}

#header .menu .sub-menu a {
	display: flex;
	align-items: center;
	min-height: 44px;
	padding: 0.65rem 0.75rem;
	border-radius: 8px;
	color: var(--synovion-header-muted);
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.35;
}

#header .menu .sub-menu a:hover,
#header .menu .sub-menu a:focus-visible {
	color: var(--synovion-header-primary-hover);
	background: #f5f3ff;
}

#header .menu .synovion-sign-in > a,
#header .menu .synovion-request-demo > a,
#offcanvas .mobile-menu .synovion-sign-in > a,
#offcanvas .mobile-menu .synovion-request-demo > a {
	justify-content: center;
	min-height: 44px;
	padding: 0.625rem 1rem;
	border-radius: 9px;
	font-weight: 700;
	text-align: center;
	transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

#header .menu .synovion-sign-in > a,
#offcanvas .mobile-menu .synovion-sign-in > a {
	color: var(--synovion-header-primary);
	background: #ffffff;
	border: 1px solid var(--synovion-header-primary);
}

#header .menu .synovion-sign-in > a:hover,
#offcanvas .mobile-menu .synovion-sign-in > a:hover {
	color: var(--synovion-header-primary-hover);
	background: #f5f3ff;
	border-color: var(--synovion-header-primary-hover);
}

#header .menu .synovion-request-demo > a,
#offcanvas .mobile-menu .synovion-request-demo > a {
	color: #ffffff;
	background: var(--synovion-header-primary);
	border: 1px solid var(--synovion-header-primary);
}

#header .menu .synovion-request-demo.current-menu-item > a,
#header .menu .synovion-request-demo.current-menu-ancestor > a,
#offcanvas .mobile-menu .synovion-request-demo.current-menu-item > a,
#offcanvas .mobile-menu .synovion-request-demo.current-menu-ancestor > a {
	color: #ffffff;
}

#header .menu .synovion-request-demo > a:hover,
#header .menu .synovion-request-demo.current-menu-item > a:hover,
#offcanvas .mobile-menu .synovion-request-demo > a:hover {
	color: #ffffff;
	background: var(--synovion-header-primary-hover);
	border-color: var(--synovion-header-primary-hover);
}

#header a:focus-visible,
#header button:focus-visible,
#header [role='button']:focus-visible,
#offcanvas a:focus-visible,
#offcanvas button:focus-visible,
#offcanvas [role='button']:focus-visible {
	outline: 3px solid rgba(109, 40, 217, 0.38);
	outline-offset: 3px;
	box-shadow: 0 0 0 2px #ffffff;
}

@media (min-width: 1000px) {
	#header [data-device='desktop'] [data-row='middle'] > div {
		height: 74px;
		min-height: 74px;
		border-bottom: 1px solid var(--synovion-header-border);
		box-shadow: 0 4px 18px rgba(15, 23, 42, 0.04);
	}

	#header [data-device='desktop'] [data-row='middle'] {
		--height: 74px;
	}

	#header [data-device='desktop'] [data-row='middle'] .ct-container,
	#header [data-device='desktop'] [data-row='bottom'] .ct-container {
		width: 100%;
		max-width: 1600px;
		padding-inline: clamp(1rem, 2vw, 2rem);
	}

	#header [data-device='desktop'] [data-row='middle'] .ct-container {
		grid-template-columns: auto minmax(0, 1fr) auto;
		column-gap: clamp(0.75rem, 1.5vw, 2rem);
	}

	#header [data-device='desktop'] .site-logo-container img {
		height: 60px;
		max-height: 60px;
	}

	#header [data-device='desktop'] .site-logo-container {
		height: auto;
		align-self: center;
	}

	#header [data-device='desktop'] [data-row='bottom'] > div {
		min-height: 64px;
		border-bottom: 1px solid var(--synovion-header-border);
	}

	#header [data-device='desktop'] .menu {
		--menu-items-spacing: clamp(0.625rem, 1vw, 1.125rem);
		align-items: center;
		justify-content: flex-end;
		gap: 0;
	}

	#header [data-device='desktop'] .menu > .menu-item {
		display: flex;
		align-items: center;
	}

	#header [data-device='desktop'] .menu > .menu-item > a {
		height: 44px;
		padding-inline: clamp(0.3125rem, 0.55vw, 0.625rem);
		font-size: 0.8125rem;
	}

	#header [data-device='desktop'] .menu > .synovion-sign-in {
		margin-left: clamp(0.375rem, 0.75vw, 0.75rem);
	}

	#header [data-device='desktop'] .menu > .synovion-request-demo {
		margin-left: clamp(0.375rem, 0.5vw, 0.5rem);
	}

	#header [data-device='desktop'] .menu > .synovion-sign-in > a,
	#header [data-device='desktop'] .menu > .synovion-request-demo > a {
		height: 44px;
		min-height: 44px;
		padding-inline: clamp(0.75rem, 1vw, 1rem);
		border-radius: 8px;
	}
}

@media (max-width: 999.98px) {
	#header [data-device='mobile'] [data-row='middle'] > div {
		min-height: 70px;
		border-bottom: 1px solid var(--synovion-header-border);
		box-shadow: 0 4px 16px rgba(15, 23, 42, 0.04);
	}

	#header [data-device='mobile'] .ct-container {
		padding-inline: 1rem;
	}

	#header [data-device='mobile'] .site-logo-container img {
		height: 56px;
		max-height: 56px;
	}

	#header .ct-header-trigger,
	#header .ct-header-trigger .ct-icon,
	#offcanvas .ct-toggle-close {
		min-width: 44px;
		min-height: 44px;
	}

	#offcanvas,
	#offcanvas .ct-panel-inner,
	#offcanvas .ct-panel-content {
		background: #ffffff;
	}

	#offcanvas .ct-panel-content {
		padding: 1rem;
	}

	#offcanvas .mobile-menu a {
		display: flex;
		align-items: center;
		min-height: 48px;
		color: var(--synovion-header-heading);
		font-size: 0.9375rem;
		font-weight: 600;
		line-height: 1.35;
	}

	#offcanvas .mobile-menu .sub-menu {
		padding: 0.25rem 0 0.625rem 0.875rem;
		border-left: 1px solid var(--synovion-header-border);
	}

	#offcanvas .mobile-menu .sub-menu a {
		min-height: 44px;
		color: var(--synovion-header-muted);
		font-size: 0.875rem;
		font-weight: 500;
	}

	#offcanvas .mobile-menu .child-indicator {
		min-width: 44px;
		min-height: 44px;
		color: var(--synovion-header-muted);
	}

	#offcanvas .mobile-menu .synovion-sign-in,
	#offcanvas .mobile-menu .synovion-request-demo {
		margin-top: 0.75rem;
	}

	#offcanvas .mobile-menu .synovion-sign-in > a,
	#offcanvas .mobile-menu .synovion-request-demo > a {
		width: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	#header .menu .synovion-sign-in > a,
	#header .menu .synovion-request-demo > a,
	#offcanvas .mobile-menu .synovion-sign-in > a,
	#offcanvas .mobile-menu .synovion-request-demo > a {
		transition: none;
	}
}