body {
	opacity: 1 !important;
}

/* Legacy Locomotive classes: geen effect meer met Lenis */
html.has-scroll-smooth .navbar6_component,
html.has-lenis .navbar6_component {
	position: sticky;
	top: 0;
	z-index: 1000;
	background-color: #fff;
}
html.has-scroll-native .loco-scroll-container,
html:not(.has-scroll-smooth) .loco-scroll-container {
	padding-top: 0 !important;
}

/* Footer credit rechts */
.footer3_bottom-wrapper {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem 1.5rem;
}
.footer3_credit {
	margin: 0;
	margin-left: auto;
	font-size: 0.875rem;
	line-height: 1.4;
	color: inherit;
	white-space: nowrap;
}
.footer3_credit-link {
	color: inherit;
	text-decoration: none;
}
.footer3_credit-link:hover {
	text-decoration: underline;
}
.footer3_credit-net {
	color: #313BFF;
}
@media (max-width: 767px) {
	.footer3_bottom-wrapper {
		flex-direction: column;
		align-items: flex-start;
	}
	.footer3_credit {
		margin-left: 0;
		white-space: normal;
	}
}

/* Primary buttons: was black, now brand green (not secondary / not white hero CTA) */
.button:not(.is-secondary):not(.is-link):not(.is-tertiary):not(.is-alternate),
a.button:not(.is-secondary):not(.is-link):not(.is-tertiary):not(.is-alternate),
input.button:not(.is-secondary),
input[type="submit"].button,
input[type="submit"].w-button,
#service-contact-form .button,
#service-contact-form input[type="submit"],
.button-2:not(.is-secondary):not(.is-link) {
	background-color: #5F774E !important;
	border-color: #5F774E !important;
	color: #fff !important;
}
.button:not(.is-secondary):not(.is-link):not(.is-tertiary):not(.is-alternate):hover,
a.button:not(.is-secondary):not(.is-link):not(.is-tertiary):not(.is-alternate):hover,
input.button:not(.is-secondary):hover,
input[type="submit"].button:hover,
input[type="submit"].w-button:hover,
#service-contact-form .button:hover,
#service-contact-form input[type="submit"]:hover,
.button-2:not(.is-secondary):not(.is-link):hover {
	background-color: #4E6340 !important;
	border-color: #4E6340 !important;
	color: #fff !important;
}
/* Secondary buttons: light grey hover */
.button.is-secondary:hover,
a.button.is-secondary:hover,
.button-2.is-secondary:hover {
	background-color: #E8E8E8 !important;
	border-color: #E8E8E8 !important;
	color: #000 !important;
}

/* Keep white CTA on dark service heroes */
.service-hero .button,
.service-hero a.button {
	background-color: #fff !important;
	border-color: #fff !important;
	color: #000 !important;
}
.service-hero .button:hover,
.service-hero a.button:hover {
	background-color: transparent !important;
	border-color: #fff !important;
	color: #fff !important;
}

.navbar6_component {
	z-index: 2000;
	top: 0;
	transition: transform 0.35s ease;
}
.navbar6_component.nav-hidden {
	transform: translateY(-110%);
}

body:has(.service-hero) .navbar6_component {
	position: fixed;
	left: 0;
	right: 0;
	width: 100%;
}


/* Darker hero overlay on engineering pages (bright CAD screenshots) */
.service-hero--eng .service-hero-overlay {
	background: rgba(0, 0, 0, 0.58) !important;
}
.service-hero {
	margin-top: 0 !important;
	min-height: 100svh !important;
	min-height: 100dvh !important;
	background: #1a1a1a;
}
.service-hero-bg,
.service-hero-overlay {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}
.service-hero-bg img,
.service-hero-bg .Ukiyo-wrapper,
.service-hero-bg .Ukiyo-wrapper img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	object-position: center;
}

/* Dropdown: tekst schuift in + balletje links bij hover (primary #5F774E) */
.navbar6_dropdown-menu .navbar6_dropdown-link {
	position: relative;
	padding-left: 1.25rem !important;
	transition: color 0.18s ease, padding-left 0.18s ease !important;
}
.navbar6_dropdown-menu .navbar6_dropdown-link::before {
	content: '';
	position: absolute;
	left: 0.45rem;
	top: 50%;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: #5F774E;
	transform: translateY(-50%) scale(0.35);
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.18s ease, transform 0.18s ease;
}
.navbar6_dropdown-menu .navbar6_dropdown-link:hover,
.navbar6_dropdown-menu .navbar6_dropdown-link:focus-visible {
	color: #5F774E !important;
	padding-left: 1.65rem !important;
}
.navbar6_dropdown-menu .navbar6_dropdown-link:hover::before,
.navbar6_dropdown-menu .navbar6_dropdown-link:focus-visible::before {
	opacity: 1;
	transform: translateY(-50%) scale(1);
}

@media (max-width: 991px) {
	.navbar6_dropdown-menu {
		display: none !important;
		text-align: left;
	}
	.navbar6_dropdown.is-open .navbar6_dropdown-menu {
		display: block !important;
	}
	.navbar6_dropdown-link {
		text-align: left !important;
	}
	.navbar6_dropdown-menu .navbar6_dropdown-link {
		padding-left: 0 !important;
	}
	.navbar6_dropdown-menu .navbar6_dropdown-link:hover,
	.navbar6_dropdown-menu .navbar6_dropdown-link:focus-visible {
		padding-left: 0.85rem !important;
	}
	.navbar6_dropdown-menu .navbar6_dropdown-link::before {
		left: 0;
	}
	.navbar6_menu .navbar6_dropdown {
		width: 100%;
	}
	.navbar6_menu.w-nav-menu,
	.navbar6_menu[data-nav-menu-open],
	.w-nav-overlay .w-nav-menu {
		background-color: #fff !important;
		background: #fff !important;
	}
}

@media (max-width: 767px) {
	.service-hero-content {
		padding: 7.5rem 0 3rem !important;
	}
}

/* Expertise: poster tot video autoplay in beeld */
.media-hover-video {
	position: relative;
	overflow: hidden;
}
.media-hover-video__poster,
.media-hover-video__video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.media-hover-video__video {
	position: absolute;
	inset: 0;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.35s ease;
}
.media-hover-video__poster {
	transition: opacity 0.35s ease;
}
.media-hover-video.is-playing .media-hover-video__video {
	opacity: 1;
}
.media-hover-video.is-playing .media-hover-video__poster {
	opacity: 0;
}
@media (prefers-reduced-motion: reduce) {
	.media-hover-video__video,
	.media-hover-video__poster {
		transition: none;
	}
}

/* City hub + interactive NL map */
.city-hub {
	margin-bottom: 1.5rem;
}
.city-hub > h2 {
	text-align: left;
	margin-bottom: 2.25rem;
}
.city-hub-intro {
	margin: 0.35rem 0 1.25rem;
	color: #555;
	line-height: 1.5;
}
.city-hub-layout {
	display: grid;
	grid-template-columns: minmax(240px, 0.95fr) minmax(280px, 1.05fr);
	gap: 2rem 2.5rem;
	align-items: stretch;
}
.city-hub-lists-panel {
	min-width: 0;
}
.city-hub-lists {
	min-width: 0;
	height: min(70vh, 640px);
	overflow-y: auto;
	overflow-x: hidden;
	column-count: 2;
	column-gap: 1.75rem;
	column-fill: auto;
	padding-right: 0.35rem;
	scrollbar-width: thin;
	scrollbar-color: #c5cebf transparent;
}
.city-hub-more {
	display: none;
}
.city-hub-lists::-webkit-scrollbar {
	width: 4px;
}
.city-hub-lists::-webkit-scrollbar-thumb {
	background: #c5cebf;
	border-radius: 4px;
}
.city-hub-region {
	margin: 0.85rem 0 0.3rem;
	font-size: 0.78rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #666;
	break-after: avoid;
	break-inside: avoid;
}
.city-hub-region:first-child {
	margin-top: 0;
}
.city-hub-list {
	display: block;
	list-style: none;
	padding: 0;
	margin: 0 0 0.35rem;
	break-inside: avoid;
}
.city-hub-list li {
	break-inside: avoid;
}
.city-hub-list a {
	display: block;
	color: #3a3a3a;
	text-decoration: none;
	font-size: 0.92rem;
	line-height: 1.45;
	padding: 0.12rem 0.4rem 0.12rem 0.2rem;
	border-radius: 2px;
	transition: color 0.15s ease, background 0.15s ease;
}
.city-hub-list a:hover,
.city-hub-list a.is-active {
	color: #5F774E;
	background: transparent;
	text-decoration: none;
}
.city-hub-map-wrap {
	position: relative;
	min-width: 0;
	height: min(70vh, 640px);
	display: flex;
	flex-direction: column;
}
.city-hub-map {
	position: relative;
	flex: 1 1 auto;
	width: 100%;
	min-height: 0;
}
.city-hub-map svg {
	width: 100%;
	height: 100%;
	display: block;
}
.city-hub-map .nl-provinces .is-other {
	fill: #eceee9;
}
.city-hub-map .nl-provinces .is-work {
	fill: #cfd8c8;
}
.city-hub-map .nl-provinces .is-zh,
.contact-office-map .nl-provinces .is-zh {
	fill: #5F774E;
}
.city-hub-map #NLFL {
	fill: #c5d2bc;
}
.contact-office-map #NLFL,
.contact-office-map .nl-provinces .is-other {
	fill: #eceee9 !important;
}
.contact-office-map .office-marker {
	cursor: pointer;
}
.contact-office-map .city-marker-label.is-active {
	opacity: 1;
}
.city-hub-map .city-marker {
	cursor: pointer;
}
.city-hub-map .city-marker circle {
	fill: #5F774E;
	stroke: #fff;
	stroke-width: 2;
	transition: fill 0.15s ease;
}
.city-hub-map .city-marker.is-active circle,
.city-hub-map .city-marker:hover circle {
	fill: #3f5334;
}
.city-hub-map .nl-city-labels {
	pointer-events: none;
}
.city-hub-map .city-marker-label {
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.15s ease;
}
.city-hub-map .city-marker-label.is-active {
	opacity: 1;
}
.city-hub-map .city-marker-label text {
	font-family: inherit;
	font-size: 22px;
	font-weight: 500;
	fill: #1a1a1a;
}
.city-hub-map .city-marker-label rect {
	fill: #fff;
	stroke: #e4e4e0;
	stroke-width: 1;
	filter: drop-shadow(0 2px 6px rgba(0,0,0,0.12));
}
.city-hub-map-hint {
	margin: 0.75rem 0 0;
	font-size: 0.8rem;
	color: #888;
	text-align: center;
}
.section_city-hub .service-related {
	margin-top: 1.75rem;
}
.section_city-hub .service-related-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.6rem;
}
.section_city-hub .service-related a {
	display: block;
	padding: 0.75rem 0.9rem;
	background: #f5f5f0;
	color: #5F774E;
	text-decoration: none;
	border-radius: 4px;
	line-height: 1.35;
	font-size: 0.95rem;
}
.section_city-hub .service-related a:hover {
	background: #ecece4;
}
.section_city-hub .service-related a span {
	display: block;
	font-size: 0.78rem;
	color: #666;
	margin-top: 0.2rem;
}
@media (max-width: 991px) {
	.city-hub-layout {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}
	.city-hub-map-wrap {
		order: -1;
		max-width: 420px;
		margin: 0 auto;
		width: 100%;
		height: auto;
		aspect-ratio: 804 / 949;
		max-height: 420px;
	}
	.city-hub-lists-panel {
		position: relative;
	}
	.city-hub-lists {
		height: auto;
		max-height: none;
		column-count: 2;
		column-fill: balance;
		column-gap: 1.25rem;
		overflow: visible;
		padding-right: 0;
	}
	.city-hub-lists-panel:not(.is-expanded) .city-hub-lists {
		max-height: 13.5rem;
		overflow: hidden;
	}
	.city-hub-lists-fade {
		display: none;
		position: absolute;
		left: 0;
		right: 0;
		bottom: 3.4rem;
		height: 5.5rem;
		background: linear-gradient(180deg, rgba(249, 249, 249, 0) 0%, #F9F9F9 78%);
		pointer-events: none;
		z-index: 1;
	}
	.city-hub-lists-panel:not(.is-expanded) .city-hub-lists-fade {
		display: block;
	}
	.city-hub-more {
		display: inline-flex !important;
		margin-top: 0.85rem;
		position: relative;
		z-index: 2;
	}
	.city-hub-region,
	.city-hub-list {
		break-inside: avoid;
		page-break-inside: avoid;
	}
	.city-hub-map-hint {
		display: none;
	}
	.section_city-hub .service-related-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media (min-width: 992px) {
	.city-hub-more,
	.city-hub-lists-fade {
		display: none !important;
	}
}
@media (max-width: 767px) {
	.city-hub-lists {
		column-count: 2;
		column-gap: 1rem;
	}
	.city-hub-list a {
		font-size: 0.88rem;
		padding-left: 0;
		padding-right: 0;
	}
	.city-hub-map-wrap {
		max-width: 320px;
		max-height: 340px;
	}
	.section_city-hub .padding-section-large {
		padding-top: 2.5rem !important;
		padding-bottom: 2.5rem !important;
	}
	.section_city-hub .service-related a {
		padding: 0.6rem 0.7rem;
		font-size: 0.88rem;
	}
	.section_city-hub .service-related a span {
		display: none;
	}
}

.site-call {
	position: fixed;
	right: max(1.1rem, env(safe-area-inset-right));
	bottom: max(1.1rem, env(safe-area-inset-bottom));
	z-index: 1900;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3.5rem;
	height: 3.5rem;
	padding: 0;
	background: #5F774E;
	color: #fff;
	border: 1px solid #5F774E;
	border-radius: 50%;
	text-decoration: none;
	box-shadow: 0 10px 28px rgba(95, 119, 78, 0.35);
	transition: transform 0.28s ease, background 0.28s ease, color 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease, opacity 0.28s ease;
}
.site-call svg {
	width: 18px;
	height: 18px;
	stroke: currentColor;
	fill: none;
}
.site-call-copy {
	position: absolute;
	right: calc(100% + 0.7rem);
	top: 50%;
	transform: translateY(-50%);
	padding: 0.45rem 0.75rem;
	background: #fff;
	color: #1a1a1a;
	border: 1px solid #e8e8e8;
	border-radius: 2px;
	font-size: 0.8rem;
	letter-spacing: 0.02em;
	line-height: 1;
	white-space: nowrap;
	opacity: 0;
	pointer-events: none;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
	transition: opacity 0.22s ease, transform 0.22s ease;
	transform: translate(4px, -50%);
}
.site-call-label {
	display: block;
}
.site-call-nr {
	display: none;
}
.site-call:hover,
.site-call:focus-visible {
	background: #4E6340;
	color: #fff;
	border-color: #4E6340;
	box-shadow: 0 12px 32px rgba(95, 119, 78, 0.45);
	outline: none;
	transform: scale(1.06);
}
.site-call:hover .site-call-copy,
.site-call:focus-visible .site-call-copy {
	opacity: 1;
	transform: translate(0, -50%);
}
.site-call.is-away {
	opacity: 0;
	pointer-events: none;
	transform: translateY(8px);
}
@media (max-width: 991px) {
	.site-call-copy {
		display: none;
	}
}
@media (prefers-reduced-motion: reduce) {
	.site-call,
	.site-call-copy {
		transition: none;
	}
}
@media print {
	.site-call {
		display: none !important;
	}
}