/* Hover effect for top level items */
@media screen and (min-width: 1026px) {
	/* Fade other items on hover */
	header ul.primary-navigation:has(li > a:hover) > li > a {
		opacity: 0.6;
	}

	header ul.primary-navigation:has(> li:hover) > li:hover a {
		opacity: 1;
	}
	
		header ul.primary-navigation li.contact-us a {
		opacity: 1!important;
	}

	a.desktop-logo:is(:focus-visible) {
		outline: 2px solid var(--accent);
		outline-offset: 5px;
	}

	/* Hover-effect for child items */
	ul.child-pages li:hover {
		transition: 0.05s ease-out !important;
	}
	.primary-navigation ul.child-pages li {
		transition: 0s;
	}

	ul.child-pages li.current-child > a {
		text-decoration: underline;
	}

	/* Hover effect when not scrolling*/
	body:not(.scrolled) header .btn--primary:is(:hover, :focus-visible)::after {
		background: var(--white) !important;
		transition-property: background, width;
		transition-duration: 0s, 0.4s;
	}
	body:not(.scrolled) header .btn--primary:is(:hover, :focus-visible) {
		color: var(--base) !important;
	}

	/* Hover effect when scrolling */
	body.scrolled header .btn--primary {
		background: var(--primary) !important;
	}
	body.scrolled header .btn--primary:is(:hover, :focus-visible) {
		color: var(--base) !important;
	}
	header .btn--primary.btn--primary::after {
		background: white !important;
	}
}