/* ==========================================================================
   Dark hero header navigation — DESKTOP ONLY (≥768px)
   Mobile uses opaque white header from mobile-nav.css
   ========================================================================== */

@media (min-width: 768px) {
	/* Kontakt — dark header cijela stranica */
	body.is-contact-page.has-dark-hero .wm-header .wm-header__logo-img,
	body.is-contact-page.has-dark-hero .wm-header .custom-logo-link img {
		filter: brightness(0) invert(1);
	}

	body.is-contact-page.has-dark-hero .wm-header .wm-header__logo-text,
	body.is-contact-page.has-dark-hero .wm-header .wm-header__burger,
	body.is-contact-page.has-dark-hero .wm-header .wm-header__nav a,
	body.is-contact-page.has-dark-hero .wm-header .wm-nav-menu a {
		color: #ffffff !important;
		opacity: 1;
	}

	body.is-contact-page.has-dark-hero .wm-header .wm-header__nav-shell {
		background: rgba(0, 0, 0, 0.18) !important;
		border: 1px solid rgba(255, 255, 255, 0.25) !important;
		border-radius: 999px !important;
		backdrop-filter: blur(12px);
		-webkit-backdrop-filter: blur(12px);
		box-shadow: none !important;
		padding-block: 6px !important;
		padding-inline: 28px !important;
	}

	body.is-contact-page.has-dark-hero .wm-header .wm-nav-indicator {
		background: #ffffff;
		transition:
			left 420ms cubic-bezier(0.22, 1, 0.36, 1),
			width 420ms cubic-bezier(0.22, 1, 0.36, 1),
			transform 420ms cubic-bezier(0.22, 1, 0.36, 1),
			background-color 0.25s ease;
	}

	body.is-contact-page.has-dark-hero .wm-header .wm-nav-menu a,
	body.is-contact-page.has-dark-hero .wm-header .wm-header__nav a {
		background: transparent !important;
		transition:
			background-color 0.25s ease,
			color 0.25s ease,
			opacity 0.25s ease;
	}

	body.is-contact-page.has-dark-hero .wm-header .wm-header__nav-shell .wm-nav-menu a.is-nav-pill-active {
		color: #000000 !important;
		background: transparent !important;
	}

	body.is-contact-page.has-dark-hero .wm-header .wm-header__nav .current-menu-item > a::after,
	body.is-contact-page.has-dark-hero .wm-header .wm-header__nav .current_page_item > a::after,
	body.is-contact-page.has-dark-hero .wm-header .wm-header__nav a.is-active::after {
		content: none;
	}

	/* Usluge — dark hero samo dok header nije scrolled */
	body.is-services-page.has-dark-hero .wm-header:not(.is-scrolled) .wm-header__logo-img,
	body.is-services-page.has-dark-hero .wm-header:not(.is-scrolled) .custom-logo-link img {
		filter: brightness(0) invert(1);
	}

	body.is-services-page.has-dark-hero .wm-header:not(.is-scrolled) .wm-header__logo-text,
	body.is-services-page.has-dark-hero .wm-header:not(.is-scrolled) .wm-header__burger,
	body.is-services-page.has-dark-hero .wm-header:not(.is-scrolled) .wm-header__nav a,
	body.is-services-page.has-dark-hero .wm-header:not(.is-scrolled) .wm-nav-menu a {
		color: #ffffff !important;
		opacity: 1;
	}

	body.is-services-page.has-dark-hero .wm-header:not(.is-scrolled) .wm-header__nav-shell {
		background: rgba(0, 0, 0, 0.18) !important;
		border: 1px solid rgba(255, 255, 255, 0.25) !important;
		border-radius: 999px !important;
		backdrop-filter: blur(12px);
		-webkit-backdrop-filter: blur(12px);
		box-shadow: none !important;
		padding-block: 6px !important;
		padding-inline: 28px !important;
	}

	body.is-services-page.has-dark-hero .wm-header:not(.is-scrolled) .wm-nav-indicator {
		background: #ffffff;
		transition:
			left 420ms cubic-bezier(0.22, 1, 0.36, 1),
			width 420ms cubic-bezier(0.22, 1, 0.36, 1),
			transform 420ms cubic-bezier(0.22, 1, 0.36, 1),
			background-color 0.25s ease;
	}

	body.is-services-page.has-dark-hero .wm-header:not(.is-scrolled) .wm-nav-menu a,
	body.is-services-page.has-dark-hero .wm-header:not(.is-scrolled) .wm-header__nav a {
		background: transparent !important;
		transition:
			background-color 0.25s ease,
			color 0.25s ease,
			opacity 0.25s ease;
	}

	body.is-services-page.has-dark-hero .wm-header:not(.is-scrolled) .wm-header__nav-shell .wm-nav-menu a.is-nav-pill-active {
		color: #000000 !important;
		background: transparent !important;
	}

	body.is-services-page.has-dark-hero .wm-header:not(.is-scrolled) .wm-header__nav .current-menu-item > a::after,
	body.is-services-page.has-dark-hero .wm-header:not(.is-scrolled) .wm-header__nav .current_page_item > a::after,
	body.is-services-page.has-dark-hero .wm-header:not(.is-scrolled) .wm-header__nav a.is-active::after {
		content: none;
	}

	/* Case study — dok je hero u viewportu */
	body.is-single-rad.has-dark-hero.is-rad-hero-active .wm-header:not(.is-scrolled) .wm-header__logo-img,
	body.is-single-rad.has-dark-hero.is-rad-hero-active .wm-header:not(.is-scrolled) .custom-logo-link img,
	body.is-single-rad:has(.wm-rad-hero) .wm-header:not(.is-scrolled) .wm-header__logo-img,
	body.is-single-rad:has(.wm-rad-hero) .wm-header:not(.is-scrolled) .custom-logo-link img,
	body.is-single-rad.is-rad-hero-active .wm-header__logo-img,
	body.is-single-rad.is-rad-hero-active .custom-logo-link img {
		filter: brightness(0) invert(1);
	}

	body.is-single-rad.has-dark-hero.is-rad-hero-active .wm-header:not(.is-scrolled) .wm-header__logo-text,
	body.is-single-rad.has-dark-hero.is-rad-hero-active .wm-header:not(.is-scrolled) .wm-header__burger,
	body.is-single-rad.has-dark-hero.is-rad-hero-active .wm-header:not(.is-scrolled) .wm-header__nav a,
	body.is-single-rad:has(.wm-rad-hero) .wm-header:not(.is-scrolled) .wm-header__logo-text,
	body.is-single-rad:has(.wm-rad-hero) .wm-header:not(.is-scrolled) .wm-header__nav a,
	body.is-single-rad:has(.wm-rad-hero) .wm-header:not(.is-scrolled) .wm-header__burger,
	body.is-single-rad.is-rad-hero-active .wm-header__logo-text,
	body.is-single-rad.is-rad-hero-active .wm-header__nav a,
	body.is-single-rad.is-rad-hero-active .wm-header__burger {
		color: #ffffff !important;
		opacity: 1;
	}

	body.is-single-rad.has-dark-hero.is-rad-hero-active .wm-header:not(.is-scrolled) .wm-header__nav-shell,
	body.is-single-rad:has(.wm-rad-hero) .wm-header:not(.is-scrolled) .wm-header__nav-shell,
	body.is-single-rad.is-rad-hero-active .wm-header__nav-shell {
		background: rgba(0, 0, 0, 0.18) !important;
		border: 1px solid rgba(255, 255, 255, 0.25) !important;
		backdrop-filter: blur(12px);
		-webkit-backdrop-filter: blur(12px);
		box-shadow: none !important;
	}

	body.is-single-rad.has-dark-hero.is-rad-hero-active .wm-header:not(.is-scrolled) .wm-nav-indicator,
	body.is-single-rad:has(.wm-rad-hero) .wm-header:not(.is-scrolled) .wm-nav-indicator,
	body.is-single-rad.is-rad-hero-active .wm-header:not(.is-scrolled) .wm-nav-indicator {
		background: #ffffff;
		transition:
			left 420ms cubic-bezier(0.22, 1, 0.36, 1),
			width 420ms cubic-bezier(0.22, 1, 0.36, 1),
			transform 420ms cubic-bezier(0.22, 1, 0.36, 1),
			background-color 0.25s ease;
	}

	body.is-single-rad.has-dark-hero.is-rad-hero-active .wm-header:not(.is-scrolled) .wm-nav-menu a,
	body.is-single-rad.has-dark-hero.is-rad-hero-active .wm-header:not(.is-scrolled) .wm-header__nav a,
	body.is-single-rad:has(.wm-rad-hero) .wm-header:not(.is-scrolled) .wm-nav-menu a,
	body.is-single-rad:has(.wm-rad-hero) .wm-header:not(.is-scrolled) .wm-header__nav a,
	body.is-single-rad.is-rad-hero-active .wm-header:not(.is-scrolled) .wm-nav-menu a,
	body.is-single-rad.is-rad-hero-active .wm-header:not(.is-scrolled) .wm-header__nav a {
		color: #ffffff !important;
		background: transparent !important;
		transition:
			background-color 0.25s ease,
			color 0.25s ease,
			opacity 0.25s ease;
	}

	body.is-single-rad.has-dark-hero.is-rad-hero-active .wm-header:not(.is-scrolled) .wm-header__nav-shell .wm-nav-menu a.is-nav-pill-active,
	body.is-single-rad:has(.wm-rad-hero) .wm-header:not(.is-scrolled) .wm-header__nav-shell .wm-nav-menu a.is-nav-pill-active,
	body.is-single-rad.is-rad-hero-active .wm-header:not(.is-scrolled) .wm-header__nav-shell .wm-nav-menu a.is-nav-pill-active {
		color: #000000 !important;
		background: transparent !important;
	}

	body.is-single-rad.has-dark-hero.is-rad-hero-active .wm-header:not(.is-scrolled) .wm-header__nav .current-menu-item > a::after,
	body.is-single-rad.has-dark-hero.is-rad-hero-active .wm-header:not(.is-scrolled) .wm-header__nav .current_page_item > a::after,
	body.is-single-rad.has-dark-hero.is-rad-hero-active .wm-header:not(.is-scrolled) .wm-header__nav a.is-active::after,
	body.is-single-rad:has(.wm-rad-hero) .wm-header:not(.is-scrolled) .wm-header__nav .current-menu-item > a::after,
	body.is-single-rad:has(.wm-rad-hero) .wm-header:not(.is-scrolled) .wm-header__nav .current_page_item > a::after,
	body.is-single-rad:has(.wm-rad-hero) .wm-header:not(.is-scrolled) .wm-header__nav a.is-active::after,
	body.is-single-rad.is-rad-hero-active .wm-header__nav .current-menu-item > a::after,
	body.is-single-rad.is-rad-hero-active .wm-header__nav .current_page_item > a::after,
	body.is-single-rad.is-rad-hero-active .wm-header__nav a.is-active::after {
		content: none;
	}

	body.is-single-rad.has-dark-hero.is-rad-hero-active .wm-header,
	body.is-single-rad.is-rad-hero-active .wm-header {
		background: transparent !important;
		border-bottom: none !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.has-dark-hero .wm-header .wm-nav-menu a {
		transition: none;
	}
}
