/* Header Section - Mobile First */

/* Base styles - Mobile */
.site-header {
	width: 100%;
	position: relative;
	z-index: 1000;
	transition: all 0.3s ease;
	background: var(--primary-violet-dark);
	height: 80px;
	flex-shrink: 0;
}

.grey-header {
	background: var(--grey-primary);
}

.grey-header .hamburger {
	background: var(--primary-violet-dark);
}

.grey-header .nav-menu a {
	color: var(--primary-violet-dark);
	font-weight: 400;
	border: 1px solid transparent;
}

.grey-header .nav-menu .sub-menu a {
	color: var(--primary-violet-dark);
	text-align: left;
}

.site-header.transparent-header {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	background: transparent;
}

.site-header.transparent-header li a {
	color: var(--font-color-primary);
}

.header-container.main-active-header li a {
	color: var(--white-primary);
}

.home .header-container button * {
	background: var(--font-color-primary);
}

.home .header-container.main-active-header button * {
	background: var(--white-primary);
}

.header-container.main-active-header a {
	border: 1px solid transparent;
}

.light-header {
	background: var(--white-primary);
}

.light-header .nav-menu a {
	color: var(--primary-violet-dark);
	border: 1px solid transparent;
	font-weight: 400;
}

.light-header .hamburger {
	background: var(--primary-violet-dark);
}

.header-container {
	height: 100%;
	width: 100%;
	max-width: 1600px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0;
	justify-self: center;
	padding-top: 1rem;
}

.site-branding {
	flex-shrink: 0;
	margin-left: 0;
}

.site-title a {
	text-decoration: none;
	font-weight: 600;
	font-size: 1.25rem; /* Mobile: 20px */
	letter-spacing: -0.02em;
	color: white;
}

.site-logo {
	height: 40px; /* Mobile: smaller logo */
	width: 134px;
	display: block;
}

.transparent-header .site-title a {
	color: white;
}

.main-navigation {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: var(--spacing-md);
	flex: 1;
	margin-right: 0;
	margin-left: 0;
	position: relative; /* Add relative positioning for mobile CTA button */
}

.nav-menu {
	display: flex;
	position: fixed;
	top: 0;
	/* left: 0; */
	right: 0;
	width: 70%;
	max-width: 100vw;
	max-height: 0;
	background: var(--primary-violet-dark);
	flex-direction: column;
	padding-left: var(--spacing-md);
	/* 	gap: var(--spacing-sm); */
	z-index: 1000;
	transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	backdrop-filter: blur(16px);
	align-items: flex-start;
	text-align: left;
	opacity: 0;
	transform: translateX(100%);
	overflow: hidden;
	border: 1px solid;
	border-image-source: linear-gradient(263.25deg, rgba(255, 255, 255, 0) 2.18%, #8a38f5 97.82%);
	pointer-events: none;
	visibility: hidden;
}

/* Light header mobile menu styling */
.light-header .nav-menu {
	background: var(--white-primary);
}

.nav-menu a {
	font-family: var(--font-family-primary);
	color: var(--white-primary);
	font-weight: 400;
	font-size: 16px;
	line-height: 150%;
	letter-spacing: -2%;
	padding: 0.75rem 0;
	text-align: left;
	display: block;
	width: auto;
	text-decoration: none;
	transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	opacity: 0;
	transform: translateY(20px);
}

.nav-menu .sub-menu a {
	border: 1px solid transparent;
	transition: none !important;
	width: auto;
	/* padding: 0.4rem 1rem; */
	font-size: 0.9rem;
	color: var(--white-primary);
	text-align: left;
	display: block;
	text-wrap: nowrap;
}

/* Light header mobile submenu styling */
.light-header .nav-menu .sub-menu a {
	font-family: var(--font-family-primary);
	color: var(--primary-violet-dark);
	text-align: left;
	width: auto;
}

.nav-menu .sub-menu {
	display: block;
	width: 100%;
	background: transparent;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--spacing-xs);
	opacity: 0;
	max-height: 0;
	overflow: hidden;
	transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	border-radius: var(--border-radius-md);
	margin-top: var(--spacing-xs);
	visibility: hidden;
}

/* Transparent header mobile menu - show logo and CTA over menu */
@media (max-width: 767px) {
	.transparent-header .main-navigation.toggled .site-branding {
		z-index: 1001;
		position: relative;
	}

	.transparent-header .main-navigation.toggled .header-cta {
		z-index: 1001;
		position: relative;
	}

	/* Grey header mobile menu - show logo and CTA over menu */
	.grey-header .main-navigation.toggled .site-branding {
		z-index: 1001;
		position: relative;
	}

	.grey-header .main-navigation.toggled .header-cta {
		z-index: 1001;
		position: relative;
	}

	/* Light header mobile menu - show logo and CTA over menu */
	.light-header .main-navigation.toggled .site-branding {
		z-index: 1001;
		position: relative;
	}

	.light-header .main-navigation.toggled .header-cta {
		z-index: 1001;
		position: relative;
	}
	
	.light-header .main-navigation.toggled .nav-menu li a {
		color: var(--primary-violet-dark);
	}

	.light-header .main-navigation.toggled .nav-menu > li:last-child a {
		color: var(--primary-violet-dark);
	}

	/* Site header mobile menu - show logo and CTA over menu */
	.site-header:not(.transparent-header):not(.light-header):not(.grey-header) .main-navigation.toggled .site-branding {
		z-index: 1001;
		position: relative;
	}

	.site-header:not(.transparent-header):not(.light-header):not(.grey-header) .main-navigation.toggled .header-cta {
		z-index: 1001;
		position: relative;
	}

	/* Transparent header mobile CTA button */
	.transparent-header .nav-menu .cta-button-mobile {
		background: var(--white-primary);
		color: var(--primary-violet-dark);
		border: 1px solid var(--primary-violet-dark);
	}

	.transparent-header .nav-menu .cta-button-mobile:active {
		background: var(--cta-button-hover-gradient);
		color: var(--white-primary);
	}

	@media (hover: hover) and (pointer: fine) {
		.transparent-header .nav-menu .cta-button-mobile:hover {
			background: var(--cta-button-hover-gradient);
			color: var(--white-primary);
		}
	}

	.nav-menu {
		max-height: 80vh;
	}

	/* Add close button to transparent header mobile menu */
	.transparent-header .nav-menu::before {
		content: '×';
		position: absolute;
		top: var(--spacing-sm);
		right: var(--spacing-sm);
		font-size: 1.5rem;
		color: var(--white-primary);
		cursor: pointer;
		z-index: 1001;
		background: none;
		border: none;
		padding: var(--spacing-sm);
	}

	/* Add close button to grey header mobile menu */
	.grey-header .nav-menu::before {
		content: '×';
		position: absolute;
		top: var(--spacing-sm);
		right: var(--spacing-sm);
		font-size: 1.5rem;
		color: var(--primary-violet-dark);
		cursor: pointer;
		z-index: 1001;
		background: none;
		border: none;
		padding: var(--spacing-sm);
	}

	/* Add close button to light header mobile menu */
	.light-header .nav-menu::before {
		content: '×';
		position: absolute;
		top: var(--spacing-sm);
		right: var(--spacing-sm);
		font-size: 1.5rem;
		color: var(--primary-violet-dark);
		cursor: pointer;
		z-index: 1001;
		background: none;
		border: none;
		padding: var(--spacing-sm);
	}

	/* Add close button to site header mobile menu */
	.site-header:not(.transparent-header):not(.light-header):not(.grey-header) .nav-menu::before {
		content: '×';
		position: absolute;
		top: var(--spacing-sm);
		right: var(--spacing-sm);
		font-size: 1.5rem;
		color: var(--white-primary);
		cursor: pointer;
		z-index: 1001;
		background: none;
		border: none;
		padding: var(--spacing-sm);
	}

	/* Adjust transparent header menu positioning */
	.transparent-header .nav-menu {
		padding-top: calc(var(--spacing-xl) + 2rem);
		padding-bottom: 5rem; /* Make space for CTA button at bottom */
	}

	/* Adjust grey header menu positioning */
	.grey-header .nav-menu {
		padding-top: calc(var(--spacing-xl) + 2rem);
		padding-bottom: 5rem; /* Make space for CTA button at bottom */
	}

	/* Adjust light header menu positioning */
	.light-header .nav-menu {
		padding-top: calc(var(--spacing-xl) + 2rem);
		padding-bottom: 5rem; /* Make space for CTA button at bottom */
	}

	/* Adjust site header menu positioning */
	.site-header:not(.transparent-header):not(.light-header):not(.grey-header) .nav-menu {
		padding-top: calc(var(--spacing-xl) + 2rem);
		padding-bottom: 5rem; /* Make space for CTA button at bottom */
	}

	/* Transparent header submenu positioning */
	.transparent-header .nav-menu .sub-menu {
		position: relative;
		width: 100%;
		background: transparent;
	}

	.transparent-header .sub-menu a {
		font-family: var(--font-family-secondary);
		font-weight: 500;
		font-style: normal;
		font-size: 0.9rem;
		color: var(--white-primary);
		padding: 0.5rem 0 0.5rem var(--spacing-sm);
	}

	/* Grey header submenu positioning */
	.grey-header .nav-menu .sub-menu {
		position: relative;
		width: 100%;
/* 		background: var(--grey-primary); */
		margin-left: var(--spacing-md);
		padding: var(--spacing-sm) 0;
	}

	.grey-header .sub-menu a {
		color: var(--primary-violet-dark);
		padding: 0.5rem 0 0.5rem var(--spacing-sm);
		font-size: 0.9rem;
	}

	/* Light header submenu positioning */
	.light-header .nav-menu .sub-menu {
		position: static;
		width: 100%;
		background: var(--white-primary);
	}

	.light-header .sub-menu a {
		color: var(--primary-violet-dark);
		padding: 0.5rem 0 0.5rem var(--spacing-sm);
		font-size: 0.9rem;
	}

	/* Site header submenu positioning */
	.site-header:not(.transparent-header):not(.light-header):not(.grey-header) .nav-menu .sub-menu {
		position: static;
		width: 100%;
		background: var(--primary-violet-dark);
	}

	.site-header:not(.transparent-header):not(.light-header):not(.grey-header) .sub-menu a {
		color: var(--white-primary);
		padding: 0.5rem 0 0.5rem var(--spacing-sm);
		font-size: 0.9rem;
	}
}

.grey-header .nav-menu a:hover {
	border: 1px solid var(--primary-violet-dark);
	transition: all 0.5s ease-in;
}

.nav-menu .sub-menu a:hover {
	border: 1px solid transparent;
	border: none !important;
}

.light-header .nav-menu .sub-menu a:hover {
	border: 1px solid transparent;
	border: none !important;
	color: var(--primary-violet-dark);
}

/* Mobile menu overlay - background blur effect (mobile only) */
@media (max-width: 767px) {
	.nav-menu-overlay {
		display: none;
		position: fixed;
		top: 0;
		left: 0;
		width: 50%;
		height: 100vh;
		background: rgba(0, 0, 0, 0.2);
		backdrop-filter: blur(10px);
		z-index: 999;
		opacity: 0;
		transition: opacity 0.3s ease;
	}

	/* Show overlay when mobile menu is toggled */
	.main-navigation.toggled .nav-menu-overlay {
		display: block;
		opacity: 1;
	}
}

/* Hide overlay on tablet and desktop */
@media (min-width: 768px) {
	.nav-menu-overlay {
		display: none !important;
	}
}

/* Prevent body scroll when mobile menu is open */
@media (max-width: 767px) {
	body.mobile-menu-open {
		overflow: hidden;
	}
}

/* Mobile menu toggle */
.menu-toggle {
	display: block;
	background: none;
	border: none;
	cursor: pointer;
	padding: var(--spacing-sm);
}

.hamburger {
	display: block;
	width: 25px;
	height: 3px;
	background: white;
	margin: 5px 0;
	transition: 0.3s;
}

.hamburger:last-child {
	width: 12.5px;
	margin-left: auto;
	margin-right: 0;
}

.main-navigation.toggled .nav-menu {
	opacity: 1;
	max-height: 100vh;
	transform: translateX(0);
	pointer-events: auto;
	visibility: visible;
}

.main-navigation.toggled .nav-menu a {
	opacity: 1;
	transform: translateY(0);
	transition-delay: 0.2s;
	color: var(--white-primary);
}

/* Show mobile CTA button when menu is toggled */
.main-navigation.toggled .nav-menu .cta-button-mobile {
	display: block;
	position: fixed;
	z-index: 1001;
	margin-top: 0.8rem;
	color: var(--primary-violet-dark);
	background: var(--white-primary);
	font-weight: 500;
	border-radius: 4px;
}

/* Ensure mobile menu has enough padding at bottom for CTA button */
.main-navigation.toggled .nav-menu {
	padding-bottom: 5rem; /* Make space for CTA button at bottom */
}

/* Light header mobile submenu background */
.light-header .nav-menu .sub-menu {
	background: var(--white-primary);
	align-items: flex-start;
}

/* Light header mobile CTA button */
.light-header .nav-menu .cta-button-mobile {
	background: var(--primary-violet-dark);
	color: var(--white-primary);
	border: 1px solid var(--primary-violet-dark);
}

.light-header .nav-menu .cta-button-mobile:active {
	background: var(--cta-button-hover-gradient);
	color: var(--white-primary);
}

@media (hover: hover) and (pointer: fine) {
	.light-header .nav-menu .cta-button-mobile:hover {
		background: var(--cta-button-hover-gradient);
		color: var(--white-primary);
	}
}

/* Light header mobile dropdown arrows */
.light-header .nav-menu .menu-item-has-children > a::after {
	border-right: 2px solid var(--primary-violet-dark);
	border-bottom: 2px solid var(--primary-violet-dark);
}

/* Grey header mobile submenu background */
.grey-header .nav-menu .sub-menu {
/* 	background: var(--grey-primary); */
	align-items: flex-start;
}

/* Grey header mobile CTA button */
.grey-header .nav-menu .cta-button-mobile {
	background: var(--primary-violet-dark);
	color: var(--white-primary);
	border: 1px solid var(--primary-violet-dark);
}

.grey-header .nav-menu .cta-button-mobile:active {
	background: var(--cta-button-hover-gradient);
	color: var(--white-primary);
}

@media (hover: hover) and (pointer: fine) {
	.grey-header .nav-menu .cta-button-mobile:hover {
		background: var(--cta-button-hover-gradient);
		color: var(--white-primary);
	}
}

/* Grey header mobile dropdown arrows */
.grey-header .nav-menu .menu-item-has-children > a::after {
	border-right: 2px solid var(--primary-violet-dark);
	border-bottom: 2px solid var(--primary-violet-dark);
}

/* Mobile dropdown arrows */
.nav-menu .menu-item-has-children > a::after {
	content: '';
	width: 6px;
	height: 6px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	margin-left: 8px;
	transition: transform 0.3s ease;
	display: inline-block;
	vertical-align: middle;
	position: relative;
	top: -2px;
}

.nav-menu .menu-item-has-children.active > a::after {
	transform: rotate(225deg);
}

.nav-menu .menu-item-has-children.active .sub-menu {
	display: flex;
	opacity: 1;
	max-height: 300px; /* Wystarczająco dużo dla większości submenu */
	/* padding: var(--spacing-sm) var(--spacing-md) var(--spacing-sm) 5rem; */
	visibility: visible;
}

.header-cta {
	display: none; /* Mobile: hidden */
}

/* Mobile CTA button - visible only on mobile */
.header-cta-mobile {
	display: none; /* Hidden by default */
}

.nav-menu .cta-button-mobile {
	font-family: var(--font-family-primary);
	background: white;
	color: var(--primary-violet-dark);
	text-decoration: none;
	font-weight: 500;
	font-size: 14px;
	transition: all 0.3s ease;
	border: 1px solid var(--primary-violet-dark);
	cursor: pointer;
	display: inline-block;
	letter-spacing: 0.025em;
	white-space: nowrap;
	padding: 0.75rem 0.5rem;
	text-align: center;
	width: fit-content;
	box-sizing: border-box;
}

.nav-menu .cta-button-mobile:active {
	background: var(--cta-button-hover-gradient);
	color: var(--white-primary);
}

@media (hover: hover) and (pointer: fine) {
	.nav-menu .cta-button-mobile:hover {
		background: var(--cta-button-hover-gradient);
		color: var(--white-primary);
	}
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
	.header-container {
		padding: var(--spacing-sm) var(--spacing-xl) var(--spacing-md) var(--spacing-xl);
	}

	/* Ensure light header has consistent padding */
	.light-header .header-container {
		padding: var(--spacing-sm) var(--spacing-xl) var(--spacing-md) var(--spacing-xl);
	}

	.site-logo {
		height: 45px;
		width: 150px;
	}

	.nav-menu a {
		font-size: 1rem;
	}
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
	.header-container {
		padding: 1.5rem 0 0 0;
	}

	/* Ensure light header has consistent padding */
	.light-header .header-container {
		padding: 1.5rem 2rem 0 1.5rem;
	}

	.site-logo {
		height: 50px;
		width: 160px;
	}

	.main-navigation {
		gap: var(--spacing-xl);
	}

	.menu-toggle {
		display: none;
	}

	.light-header .cta-button {
		color: var(--primary-violet-dark);
		border: 1px solid var(--primary-violet-dark);
	}

	.light-header .main-navigation {
		gap: var(--spacing-xxl);
	}

	.grey-header .cta-button {
		border: 1px solid var(--primary-violet-dark);
	}

	.grey-header .breadcrumbs {
		display: none;
	}

	.grey-header .header-container {
		padding: 1.5rem 2.5rem 1.5rem 2.5rem;
	}

	.nav-menu {
		display: flex !important;
		position: static;
		width: auto;
		height: auto;
		max-height: none;
		background: transparent;
		flex-direction: row;
		padding: 0;
		gap: var(--spacing-md);
		backdrop-filter: none;
		opacity: 1;
		transform: none;
		overflow: visible;
		transition: none;
		pointer-events: auto;
		visibility: visible;
	}

	.nav-menu a {
		font-size: 16px;
		padding: 6px 11px;
		text-align: left;
		display: inline-block;
		width: auto;
		border: 1px solid transparent;
		border-radius: 4px;
		transition: padding 0.4s ease, border-color 0.4s ease;
		position: relative;
		opacity: 1;
		transform: none;
		transition-delay: 0s;
	}

	.nav-menu a:hover {
		border: 1px solid var(--white-primary);
		transition: all 0.5s ease-in;
	}

	.light-header .nav-menu a {
		padding: 5px 10px;
		border: 1px solid transparent;
		transition: border-color 0.4s ease;
	}

	.header-cta {
		display: block;
		margin-left: var(--spacing-xs);
	}

	/* Hide mobile CTA button on desktop */
	.main-navigation .nav-menu .cta-button-mobile {
		display: none !important;
	}

	/* Additional specificity to ensure mobile CTA is hidden on desktop */
	.main-navigation:not(.toggled) .nav-menu .cta-button-mobile {
		display: none !important;
	}

	.cta-button {
		background: white;
		color: #6b46c1;
		text-decoration: none;
		font-weight: 400;
		font-size: 2rem;
		transition: all 0.3s ease;
		border: none;
		cursor: pointer;
		display: inline-block;
		letter-spacing: 0.025em;
		white-space: nowrap;
	}

	.cta-button:hover {
		background: var(--cta-button-hover-gradient);
		color: var(--white-primary);
	}

	.grey-header .nav-menu a:hover {
		border: 1px solid var(--primary-violet-dark);
		transition: all 0.5s ease-in;
	}

	.light-header .nav-menu a:hover {
		border: 1px solid var(--primary-violet-dark);
		transition: all 0.5s ease-in;
	}
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.site-logo {
		height: 72px;
		width: 210px;
	}

	.light-header .site-logo {
		width: 100%;
	}

	.nav-menu a {
		font-size: 16px;
	}

	.cta-button {
		padding: 5px 10px 7px 10px;
		font-size: 16px;
		border-radius: 4px;
		border: 1px solid var(--primary-violet-dark);
		color: var(--primary-violet-dark);
	}

	/* Hide mobile CTA button on desktop */
	.main-navigation .nav-menu .cta-button-mobile {
		display: none !important;
	}
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	.site-logo {
		height: 72px;
		width: 210px;
	}
	/* Hide mobile CTA button on desktop */
	.main-navigation .nav-menu .cta-button-mobile {
		display: none !important;
	}

	.main-navigation {
		gap: 0;
	}

	.nav-menu a {
		font-size: 16px;
	}
}

/* Breadcrumbs - Independent component, Desktop only */
@media (min-width: 768px) {
	.breadcrumbs {
		width: 100%;
		max-width: 1600px;
		margin: 0 auto;
		display: block;
		position: relative;
		/* padding: 1rem 2rem 0 1rem; */
		background: transparent;
		font-family: Montserrat;
		font-weight: 500;
		font-style: Medium;
		font-size: 14px;
		line-height: 150%;
		letter-spacing: -2%;
		text-align: left;
		text-transform: uppercase;

		.breadcrumb-list {
			display: flex;
			align-items: center;
			justify-content: flex-start;
			list-style: none;
			margin-left: 1.5rem;
			font-size: 14px;
			color: var(--breadcrumbs-text);
			max-width: var(--max-width-container);
			text-transform: uppercase;
		}

		.breadcrumb-item {
			margin: 0;
			color: var(--breadcrumbs-text);
			text-transform: uppercase;
		}

		.breadcrumb-item a {
			color: var(--breadcrumbs-text);
			text-decoration: none;
			transition: color 0.3s ease;
		}

		.breadcrumb-item a:hover {
			color: var(--breadcrumbs-text);
		}

		.breadcrumb-item.current {
			color: var(--breadcrumbs-text);
			font-weight: 500;
		}

		.breadcrumb-separator {
			margin: 0 0.5rem;
			display: flex;
			align-items: center;
		}

		.separator-icon {
			width: 16px;
			height: 16px;
			display: block;
		}
		/* Hide mobile CTA button on desktop */
		.main-navigation .nav-menu .cta-button-mobile {
			display: none !important;
		}
	}
}
/* Dropdown menu styles - Desktop only */
@media (min-width: 768px) {
	/* Reset mobile submenu styles for desktop */
	.nav-menu .sub-menu {
		position: absolute;
		top: 100%;
		left: 0;
		width: max-content;
		min-width: 100%;
		height: auto;
		background: var(--primary-violet-dark);
		flex-direction: column;
		padding: 0;
		color: var(--white-primary);
		z-index: 1000;
		opacity: 0;
		transform: translateY(-10px);
		transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
		border-radius: 2px;
		box-shadow: none;
		align-items: flex-start;
		visibility: hidden;
		overflow: visible;
		max-height: 0;
	}

	/* Standard header submenu styling - ensure violet background */
	.site-header:not(.light-header):not(.grey-header):not(.transparent-header) .nav-menu .sub-menu {
		background: var(--primary-violet-dark);
	}

	/* Transparent header submenu styling */
	.transparent-header .nav-menu .sub-menu {
		background: transparent;
	}

	/* Light header submenu styling */
	.light-header .nav-menu .sub-menu {
		background: var(--white-primary);
		color: var(--primary-violet-dark);
		align-items: flex-start;
		left: 0;
		transform: translateY(-10px);
	}

	/* Grey header submenu styling */
	.grey-header .nav-menu .sub-menu {
		background: var(--grey-primary);
		color: var(--primary-violet-dark);
		align-items: flex-start;
		left: 0;
		transform: translateY(-10px);
	}

	.nav-menu .menu-item-has-children {
		position: relative;
	}

	.nav-menu .menu-item-has-children > a::after {
		content: '';
		width: 7px;
		height: 7px;
		border-right: 2px solid currentColor;
		border-bottom: 2px solid currentColor;
		transform: rotate(45deg);
		margin-left: 8px;
		transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1);
		display: inline-block;
		vertical-align: middle;
		position: relative;
		top: -2px;
	}

	.nav-menu .menu-item-has-children.active > a::after {
		transform: rotate(225deg);
	}

	.nav-menu .sub-menu {
		display: block;
		background-color: transparent;
		padding-left: 0;
	}

	.nav-menu .menu-item-has-children.active .sub-menu {
		display: flex !important;
		opacity: 1;
		transform: translateY(0);
		padding: var(--spacing-md) 0;
		visibility: visible;
		max-height: 500px;
	}

	.light-header .nav-menu .menu-item-has-children.active .sub-menu {
		transform: translateY(0);
		padding: var(--spacing-md) 0;
		visibility: visible;
		max-height: 500px;
	}

	.grey-header .nav-menu .menu-item-has-children.active .sub-menu {
		transform: translateY(0);
		padding: var(--spacing-md) 0;
		visibility: visible;
		max-height: 500px;
	}

	.nav-menu .sub-menu a {
		padding: 0.3rem 1rem;
		font-size: 0.9rem;
		color: var(--white-primary);
		text-align: left;
		border: 1px solid transparent;
		transition: all 0.3s ease;
		white-space: nowrap;
		display: block;
		width: 100%;
	}

	.light-header .nav-menu .sub-menu a {
		color: var(--primary-violet-dark);
		border: 1px solid transparent;
		text-align: left;
		white-space: nowrap;
	}

	.grey-header .nav-menu .sub-menu a {
		color: var(--primary-violet-dark);
		border-bottom: 1px solid rgba(107, 70, 193, 0.1);
		text-align: left;
		white-space: nowrap;
	}

	.nav-menu .sub-menu a:last-child {
		border-bottom: none;
	}
	.nav-menu .sub-menu a::before {
		display: none;
	}

	.nav-menu .sub-menu a:hover {
		text-decoration: underline;
	}

	.light-header .nav-menu .sub-menu a:hover {
		text-decoration: underline;
	}

	.grey-header .nav-menu .sub-menu a:hover {
		text-decoration: underline;
	}
}

@media (min-width: 1200px) {
	.site-header {
		height: 120px;
		padding: var(--spacing-sm) var(--spacing-lg) var(--spacing-xl) var(--spacing-lg);
	}

	/* Light header needs consistent padding with other headers */
	.light-header {
		padding: var(--spacing-sm) var(--spacing-lg) var(--spacing-sm) var(--spacing-lg);
	}

	.light-header .main-navigation {
		gap: 0;
	}
	/* Hide mobile CTA button on desktop */
	.main-navigation .nav-menu .cta-button-mobile {
		display: none !important;
	}

	.light-header .cta-button {
		padding: 5px 10px 7px 10px;
	}

	.breadcrumbs {
		padding-left: 1rem;
	}
}

@media (min-width: 1400px) {
	.nav-menu a {
		font-size: 16px;
	}
	.light-header .nav-menu a {
		font-size: 16px;
	}
	.cta-button {
		font-size: 16px;
	}
	.header-container {
		padding: 1.5rem 1.5rem 0 0.5rem;
	}
}

@media (min-width: 1600px) {
	.light-header .cta-button {
		font-size: 16px;
	}

	.cta-button {
		font-size: 16px;
	}
}

@media (min-width: 1800px) {
	.nav-menu a {
		font-size: 20px;
	}

	.cta-button {
		font-size: 20px;
	}

	.header-container {
		padding: 1.5rem 0.8rem 0 0;
	}

	.light-header .nav-menu a {
		font-size: 20px;
	}

	.light-header .cta-button {
		font-size: 20px;
	}

	.breadcrumb-list {
		font-size: 20px;
	}

	.breadcrumbs {
		padding-left: 0;
	}

	.light-header .header-container {
		padding: 1.5rem 0 0 0;
	}
}

/* Hide breadcrumbs on mobile */
@media (max-width: 767px) {
	.breadcrumbs {
		display: none;
	}
}