/* Kruize motion layer. Static and fully visible without JS or with reduced motion. */

:root {
	--kz-ease: cubic-bezier(.2, .7, .2, 1);
}

/* Intro: hero columns rise in on load (CSS only). */
@keyframes kz-up {
	from { opacity: 0; transform: translateY(28px); }
	to { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: no-preference) {
	.kz-js .wp-block-post-content > .alignfull:first-child .wp-block-column {
		animation: kz-up .9s var(--kz-ease) both;
	}
	.kz-js .wp-block-post-content > .alignfull:first-child .wp-block-column + .wp-block-column {
		animation-delay: .15s;
	}
}

/* Scroll reveals (classes added by JS only for elements below the fold). */
.kz-motion .kz-reveal {
	opacity: 0;
	transform: translateY(32px);
	transition: opacity .8s var(--kz-ease), transform .8s var(--kz-ease);
}
.kz-motion .kz-reveal.is-in {
	opacity: 1;
	transform: none;
}

/* Hairlines draw themselves in blue. */
.hairline-top {
	position: relative;
}
.hairline-top::before {
	content: '';
	position: absolute;
	top: -1px;
	left: 0;
	width: 100%;
	height: 2px;
	background: var(--wp--preset--color--primary);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 1.1s var(--kz-ease) .2s;
}
.hairline-top.is-in::before,
.kz-reduced .hairline-top::before {
	transform: scaleX(1);
}

/* Rotating word in a headline. */
.kz-rotator em {
	font-style: normal;
	color: var(--wp--preset--color--primary);
	white-space: nowrap;
}
.kz-rotate {
	position: relative;
	display: inline-block;
	vertical-align: bottom;
	height: 1.15em;
	overflow: hidden;
	transition: width .5s var(--kz-ease);
	padding-bottom: .08em;
}
.kz-rotate__word {
	position: absolute;
	left: 0;
	top: 0;
	white-space: nowrap;
	transform: translateY(110%);
	opacity: 0;
	transition: transform .7s var(--kz-ease), opacity .7s var(--kz-ease);
}
.kz-rotate__word.is-active {
	transform: none;
	opacity: 1;
}
.kz-rotate__word.is-leaving {
	transform: translateY(-110%);
	opacity: 0;
}

.kz-rotate::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: .02em;
	height: .07em;
	background: currentColor;
	opacity: .25;
	border-radius: 2px;
}

/* Marquee band. */
.kz-marquee {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.kz-marquee__track {
	display: flex;
	width: max-content;
	animation: kz-marquee 38s linear infinite;
}
.kz-marquee:hover .kz-marquee__track {
	animation-play-state: paused;
}
.kz-marquee__group {
	display: flex;
	flex-shrink: 0;
	gap: 0;
}
.kz-marquee__group > * {
	margin: 0 !important;
	padding-right: 3rem;
	white-space: nowrap;
}
@keyframes kz-marquee {
	to { transform: translateX(-50%); }
}
.kz-reduced .kz-marquee__track {
	animation: none;
	flex-wrap: wrap;
	width: auto;
}
.kz-reduced .kz-marquee__group[aria-hidden] {
	display: none;
}

/* Tilt cards with spotlight. */
.kz-tilt {
	--kz-rx: 0deg;
	--kz-ry: 0deg;
	--kz-mx: 50%;
	--kz-my: 50%;
	position: relative;
	transform: perspective(900px) rotateX(var(--kz-rx)) rotateY(var(--kz-ry));
	transition: transform .35s var(--kz-ease), box-shadow .35s var(--kz-ease);
	will-change: transform;
}
.kz-tilt:hover {
	box-shadow: 0 12px 32px rgba(17, 19, 24, .12);
}
.kz-tilt::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: inherit;
	pointer-events: none;
	background: radial-gradient(420px circle at var(--kz-mx) var(--kz-my), rgba(255, 255, 255, .45), transparent 45%);
	opacity: 0;
	transition: opacity .35s;
}
.kz-tilt.is-style-card-dark::after {
	background: radial-gradient(420px circle at var(--kz-mx) var(--kz-my), rgba(52, 170, 226, .35), transparent 50%);
}
.kz-tilt:hover::after {
	opacity: 1;
}

/* Magnetic buttons. */
.kz-magnetic {
	transition: transform .25s var(--kz-ease), background-color .15s ease, border-color .15s ease;
}

/* Blue callout glow. */
.kz-glow {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}
.kz-glow::before {
	content: '';
	position: absolute;
	width: 520px;
	height: 520px;
	left: calc(var(--kz-gx, 80%) - 260px);
	top: calc(var(--kz-gy, 20%) - 260px);
	background: radial-gradient(circle, rgba(255, 255, 255, .22), transparent 60%);
	pointer-events: none;
	z-index: -1;
	transition: left .4s var(--kz-ease), top .4s var(--kz-ease);
}

/* Spinning badge on the portrait. */
.kz-portrait {
	position: relative;
}
.kz-badge {
	position: absolute;
	left: -44px;
	bottom: 48px;
	width: 132px;
	height: 132px;
	z-index: 2;
	margin: 0 !important;
}
.kz-badge svg {
	width: 100%;
	height: 100%;
	display: block;
	animation: kz-spin 18s linear infinite;
}
.kz-badge .kz-badge__core {
	position: absolute;
	inset: 34px;
	border-radius: 50%;
	background: var(--wp--preset--color--primary);
	color: #fff;
	display: grid;
	place-items: center;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: 24px;
	line-height: 1;
	box-shadow: 0 12px 30px -10px rgba(52, 170, 226, .5);
}
@keyframes kz-spin {
	to { transform: rotate(360deg); }
}
.kz-reduced .kz-badge svg {
	animation: none;
}
@media (max-width: 781px) {
	.kz-badge {
		left: auto;
		right: 12px;
		bottom: -36px;
		width: 104px;
		height: 104px;
	}
	.kz-badge .kz-badge__core {
		inset: 27px;
		font-size: 19px;
	}
}

/* Horizontal portfolio scroll. */
.kz-hscroll {
	position: relative;
}
.kz-hscroll__sticky {
	overflow: hidden;
}
.kz-track {
	display: flex !important;
	flex-wrap: nowrap !important;
	gap: 32px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	padding-bottom: 12px;
	scrollbar-width: none;
}
.kz-track::-webkit-scrollbar {
	display: none;
}
.kz-track > * {
	flex: 0 0 min(78vw, 560px);
	scroll-snap-align: start;
	margin: 0 !important;
}
.kz-track figure img {
	transition: transform .6s var(--kz-ease);
}
.kz-track figure:hover img {
	transform: translateY(-6px) rotate(-.6deg);
}
.kz-hscroll.is-pinned .kz-hscroll__sticky {
	position: sticky;
	top: 64px;
	height: calc(100vh - 64px);
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.admin-bar .kz-hscroll.is-pinned .kz-hscroll__sticky {
	top: 96px;
	height: calc(100vh - 96px);
}
.kz-hscroll.is-pinned .kz-track {
	overflow: visible;
	will-change: transform;
}
.kz-hscroll__bar {
	height: 2px;
	background: var(--wp--preset--color--hairline);
	margin-top: 24px;
	position: relative;
	overflow: hidden;
}
.kz-hscroll__bar::after {
	content: '';
	position: absolute;
	inset: 0;
	background: var(--wp--preset--color--primary);
	transform-origin: left;
	transform: scaleX(var(--kz-progress, 0));
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
	.kz-tilt,
	.kz-magnetic {
		transform: none !important;
	}
}

/* Marquee separators. */
.kz-marquee__group > p::after {
	content: '';
	display: inline-block;
	width: .28em;
	height: .28em;
	border-radius: 50%;
	background: var(--wp--preset--color--primary);
	margin-left: 3rem;
	vertical-align: middle;
}

.kz-hscroll:not(.is-pinned) .kz-hscroll__bar {
	display: none;
}

/* Diensten: hover list with a floating preview. */
.kz-hoverlist .kz-hoverlist__row .wp-block-heading {
	transition: transform .5s var(--kz-ease), color .3s ease;
}
.kz-hoverlist.is-live .kz-hoverlist__row:hover .wp-block-heading {
	transform: translateX(14px);
	color: var(--wp--preset--color--primary);
}
.kz-hoverlist .kz-hoverlist__img {
	max-width: 220px;
	margin-top: 16px;
}
.kz-hoverlist.is-live .kz-hoverlist__img {
	display: none;
}
.kz-hoverlist__float {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 40;
	width: 300px;
	margin: -110px 0 0 28px;
	pointer-events: none;
	opacity: 0;
	scale: .85;
	transition: opacity .3s ease, scale .4s var(--kz-ease);
}
.kz-hoverlist__float.is-on {
	opacity: 1;
	scale: 1;
}
.kz-hoverlist__float img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 12px;
	box-shadow: 0 30px 60px -25px rgba(17, 19, 24, .4);
}

/* Website: fanned screenshots. */
.kz-fan.is-live {
	position: relative;
	aspect-ratio: 4 / 3.3;
}
.kz-fan.is-live > figure {
	position: absolute !important;
	inset: 8% 8% auto 8%;
	margin: 0 !important;
	transition: transform 1.1s var(--kz-ease), box-shadow .4s ease;
	transform-origin: 50% 110%;
}
.kz-fan.is-live > figure:nth-child(1) { z-index: 1; }
.kz-fan.is-live > figure:nth-child(2) { z-index: 2; }
.kz-fan.is-live > figure:nth-child(3) { z-index: 3; }
.kz-fan.is-spread > figure:nth-child(1) { transform: translate(-14%, 6%) rotate(-9deg); }
.kz-fan.is-spread > figure:nth-child(2) { transform: translate(0, -4%) rotate(1deg); }
.kz-fan.is-spread > figure:nth-child(3) { transform: translate(14%, 10%) rotate(8deg); }
.kz-fan.is-spread:hover > figure:nth-child(1) { transform: translate(-22%, 4%) rotate(-13deg); }
.kz-fan.is-spread:hover > figure:nth-child(3) { transform: translate(22%, 12%) rotate(12deg); }
.kz-fan.is-live > figure:hover {
	z-index: 5;
}

/* Marketing: search results that reorder. */
.kz-serp__q {
	border: 1px solid var(--wp--preset--color--hairline);
	background: var(--wp--preset--color--canvas);
	border-radius: 999px;
	padding: 10px 18px 10px 42px !important;
	position: relative;
}
.kz-serp__q::before {
	content: '';
	position: absolute;
	left: 17px;
	top: 50%;
	width: 11px;
	height: 11px;
	border: 2px solid var(--wp--preset--color--muted);
	border-radius: 50%;
	transform: translateY(-62%);
}
.kz-serp__row {
	position: relative;
	padding: 12px 14px;
	border-radius: 8px;
	transition: background-color .6s ease, box-shadow .6s ease;
}
.kz-serp__row p {
	margin: 0 !important;
}
.kz-serp__you.is-top {
	background: var(--wp--preset--color--canvas);
	box-shadow: 0 0 0 2px var(--wp--preset--color--primary);
}
.kz-serp__you.is-top::after {
	content: '1';
	position: absolute;
	right: -12px;
	top: -12px;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--wp--preset--color--primary);
	color: #fff;
	font: 600 14px/30px var(--wp--preset--font-family--sans);
	text-align: center;
	animation: kz-pop .5s var(--kz-ease) 1.2s both;
}
@keyframes kz-pop {
	from { transform: scale(0); }
	to { transform: scale(1); }
}

/* Ontwerp: live type specimen and swatches. */
.kz-specimen {
	transition: font-weight .25s ease, letter-spacing .25s ease;
	font-weight: 600;
}
.kz-specimen.is-breathing {
	animation: kz-breathe 5s ease-in-out infinite alternate;
}
@keyframes kz-breathe {
	from { font-weight: 300; }
	to { font-weight: 800; }
}
.kz-swatches {
	display: flex !important;
	gap: 10px;
	min-height: 220px;
}
.kz-swatches > .wp-block-group {
	flex: 1 1 0;
	margin: 0 !important;
	border-radius: 12px;
	padding: 18px !important;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	transition: flex-grow .6s var(--kz-ease);
	min-width: 0;
}
.kz-swatches > .wp-block-group:hover {
	flex-grow: 2.6;
}
.kz-swatches p {
	margin: 0 !important;
	white-space: nowrap;
	line-height: 1.35;
}
@media (max-width: 781px) {
	.kz-swatches {
		flex-direction: column;
		min-height: 0;
	}
	.kz-swatches > .wp-block-group {
		min-height: 64px;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}
}

/* Beveiliging: typewriter scan. */
.kz-typewriter .is-bad { color: #F87171; }
.kz-typewriter .is-warn { color: #FBBF24; }
.kz-typewriter .is-ok { color: #34D399; }
.kz-caret {
	display: inline-block;
	width: .6em;
	height: 1.1em;
	vertical-align: text-bottom;
	background: var(--wp--preset--color--on-dark);
	margin-left: 2px;
	animation: kz-blink 1s steps(1) infinite;
}
@keyframes kz-blink {
	50% { opacity: 0; }
}

/* Portfolio: parallax columns. */
.kz-parallax .wp-block-column {
	will-change: transform;
}

/* Keep decorative overflow (fan, badge) from creating sideways scroll. */
main.wp-block-group {
	overflow-x: clip;
}

/* AI Architect: guided conversation. */
.kz-chat {
	display: flex !important;
	flex-direction: column;
	gap: 10px;
}
.kz-chat > * {
	margin: 0 !important;
	max-width: 86%;
	padding: 12px 16px !important;
	border-radius: 16px;
	font-size: 15px;
	line-height: 1.5;
}
.kz-chat .kz-chat__q {
	align-self: flex-start;
	background: var(--wp--preset--color--surface-dark-elevated);
	border: 1px solid var(--wp--preset--color--border-dark);
	color: var(--wp--preset--color--on-dark);
	border-bottom-left-radius: 4px;
}
.kz-chat .kz-chat__a {
	align-self: flex-end;
	background: var(--wp--preset--color--primary);
	color: #fff;
	border-bottom-right-radius: 4px;
}
.kz-chat.is-live :is(.kz-chat__q, .kz-chat__a) {
	opacity: 0;
	transform: translateY(10px) scale(.98);
	transition: opacity .45s var(--kz-ease), transform .45s var(--kz-ease);
}
.kz-chat.is-live .is-shown {
	opacity: 1;
	transform: none;
}
.kz-chat__typing {
	align-self: flex-end;
	display: inline-flex;
	gap: 5px;
	padding: 12px 14px;
	border-radius: 16px;
	background: var(--wp--preset--color--primary);
}
.kz-chat__typing.is-q {
	align-self: flex-start;
	background: var(--wp--preset--color--surface-dark-elevated);
}
.kz-chat__typing span {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .8);
	animation: kz-dot 1s infinite ease-in-out;
}
.kz-chat__typing span:nth-child(2) { animation-delay: .15s; }
.kz-chat__typing span:nth-child(3) { animation-delay: .3s; }
@keyframes kz-dot {
	0%, 80%, 100% { transform: translateY(0); opacity: .5; }
	40% { transform: translateY(-4px); opacity: 1; }
}

/* Homepage hero: the work fan sits in a narrower column, so it spreads inward. */
.kz-portrait .kz-fan.is-live > figure {
	inset: 6% 12% auto 4%;
}
.kz-portrait .kz-fan.is-spread > figure:nth-child(1) { transform: translate(-6%, 4%) rotate(-7deg); }
.kz-portrait .kz-fan.is-spread > figure:nth-child(2) { transform: translate(2%, -4%) rotate(1deg); }
.kz-portrait .kz-fan.is-spread > figure:nth-child(3) { transform: translate(10%, 12%) rotate(5deg); }
.kz-portrait .kz-fan.is-spread:hover > figure:nth-child(1) { transform: translate(-10%, 2%) rotate(-10deg); }
.kz-portrait .kz-fan.is-spread:hover > figure:nth-child(3) { transform: translate(13%, 14%) rotate(7deg); }
.kz-portrait .kz-badge {
	z-index: 6;
}

/* Tarieven: cards in a row share a baseline, prices and buttons sit at the bottom. */
.kz-pricegrid .wp-block-column > .is-style-card,
.kz-pricegrid .wp-block-column > .is-style-card-dark {
	display: flex;
	flex-direction: column;
	height: 100%;
}
.kz-pricegrid .kz-price {
	margin-top: auto !important;
	padding-top: 16px;
}
@media (min-width: 782px) {
	.kz-pricegrid .is-style-card > h4,
	.kz-pricegrid .is-style-card-dark > h4 {
		min-height: 2.7em;
	}
}
.kz-pricegrid .is-style-card-dark {
	padding: 32px !important;
}

/* Cookie settings: a small round cookie icon that reveals its label on hover or focus. */
.seopress-user-consent.seopress-edit-choice {
	left: 16px !important;
	right: auto !important;
	bottom: 16px !important;
	width: auto !important;
	padding: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	border: 0 !important;
}
.seopress-edit-choice #seopress-user-consent-edit {
	position: relative;
	width: 44px !important;
	height: 44px !important;
	min-width: 0 !important;
	margin: 0 !important;
	box-sizing: border-box !important;
	padding: 0 0 0 44px !important;
	border-radius: 999px !important;
	border: 1px solid var(--wp--preset--color--primary) !important;
	background: var(--wp--preset--color--primary) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3a9 9 0 1 0 9 9 3 3 0 0 1-3.5-3A3 3 0 0 1 14 5.5 3 3 0 0 1 12 3z'/%3E%3Ccircle cx='8.5' cy='10.5' r='.9' fill='%23ffffff'/%3E%3Ccircle cx='15.5' cy='15' r='.9' fill='%23ffffff'/%3E%3Ccircle cx='10' cy='16' r='.9' fill='%23ffffff'/%3E%3C/svg%3E") no-repeat 11px center / 20px 20px !important;
	color: #fff !important;
	font: 600 13px/44px var(--wp--preset--font-family--display) !important;
	white-space: nowrap;
	overflow: hidden;
	box-shadow: var(--wp--preset--shadow--card) !important;
	cursor: pointer;
	transition: width .35s cubic-bezier(.2, .7, .2, 1), border-color .2s ease;
}
.seopress-edit-choice #seopress-user-consent-edit:hover,
.seopress-edit-choice #seopress-user-consent-edit:focus-visible {
	width: 200px !important;
	padding-right: 16px !important;
	background-color: var(--wp--preset--color--primary-active) !important;
	border-color: var(--wp--preset--color--primary-active) !important;
}
.seopress-edit-choice #seopress-user-consent-edit:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
	.seopress-edit-choice #seopress-user-consent-edit {
		transition: none;
	}
}

/* Portfolio: linked browser screenshots lift on hover. */
.wp-block-image.is-style-browser:has(> a) {
	transition: transform .35s cubic-bezier(.2, .7, .2, 1);
}
.wp-block-image.is-style-browser > a {
	display: block;
	border-radius: 0 0 16px 16px;
}
.wp-block-image.is-style-browser > a img {
	transition: box-shadow .35s cubic-bezier(.2, .7, .2, 1), filter .35s ease;
}
.wp-block-image.is-style-browser:has(> a)::before {
	transition: border-color .25s ease;
}
.wp-block-image.is-style-browser:has(> a) figcaption {
	transition: color .25s ease;
}
.wp-block-image.is-style-browser:has(> a) figcaption::after {
	content: "\2197";
	display: inline-block;
	margin-left: 6px;
	opacity: 0;
	transform: translate(-4px, 2px);
	transition: opacity .25s ease, transform .35s cubic-bezier(.2, .7, .2, 1);
}
.wp-block-image.is-style-browser:has(> a:hover),
.wp-block-image.is-style-browser:has(> a:focus-visible) {
	transform: translateY(-6px);
}
.wp-block-image.is-style-browser:has(> a:hover)::before,
.wp-block-image.is-style-browser:has(> a:focus-visible)::before {
	border-color: var(--wp--preset--color--primary);
}
.wp-block-image.is-style-browser > a:hover img,
.wp-block-image.is-style-browser > a:focus-visible img {
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 22px 44px -18px rgba(52, 170, 226, .45);
	filter: saturate(1.06);
}
.wp-block-image.is-style-browser:has(> a:hover) figcaption,
.wp-block-image.is-style-browser:has(> a:focus-visible) figcaption {
	color: var(--wp--preset--color--primary);
}
.wp-block-image.is-style-browser:has(> a:hover) figcaption::after,
.wp-block-image.is-style-browser:has(> a:focus-visible) figcaption::after {
	opacity: 1;
	transform: translate(0, 0);
}
.wp-block-image.is-style-browser > a:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 4px;
}
@media (prefers-reduced-motion: reduce) {
	.wp-block-image.is-style-browser:has(> a),
	.wp-block-image.is-style-browser > a img,
	.wp-block-image.is-style-browser:has(> a) figcaption::after {
		transition: none;
	}
	.wp-block-image.is-style-browser:has(> a:hover),
	.wp-block-image.is-style-browser:has(> a:focus-visible) {
		transform: none;
	}
}

/* Footer: Kinsta hosting badge. */
.footer-hosting {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: var(--wp--preset--spacing--40);
	color: var(--wp--preset--color--on-dark-soft);
}
.footer-hosting a {
	display: inline-flex;
	opacity: .85;
	transition: opacity .2s ease;
}
.footer-hosting a:hover,
.footer-hosting a:focus-visible {
	opacity: 1;
}
.footer-hosting img {
	display: block;
	height: auto;
}

/* Mobile menu: slide-in panel from the right. */
.kz-nav-cta {
	display: none !important;
}
@media (max-width: 599px) {
	.wp-block-navigation__responsive-container.is-menu-open {
		padding: 0 !important;
		background: rgba(17, 19, 24, .45) !important;
		animation: kz-menu-fade .3s ease both;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		width: min(86vw, 380px);
		max-width: none;
		margin: 0;
		overflow-y: auto;
		background: var(--wp--preset--color--canvas);
		border-left: 1px solid var(--wp--preset--color--hairline);
		box-shadow: -24px 0 60px -24px rgba(17, 19, 24, .4);
		animation: kz-menu-slide .45s cubic-bezier(.2, .7, .2, 1) both;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
		box-sizing: border-box;
		min-height: 100%;
		padding: 100px 28px 32px;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog::before {
		content: '';
		position: absolute;
		top: 22px;
		left: 28px;
		width: 124px;
		height: 37px;
		background: url('/wp-content/uploads/2026/10/logo-kruize-zachtblauw.png') no-repeat left center / contain;
		animation: kz-menu-item .5s cubic-bezier(.2, .7, .2, 1) .08s both;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
		top: 18px;
		right: 18px;
		display: grid;
		place-items: center;
		width: 44px;
		height: 44px;
		border: 1px solid var(--wp--preset--color--hairline);
		border-radius: 50%;
		background: var(--wp--preset--color--surface);
		color: var(--wp--preset--color--ink);
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close svg {
		width: 20px;
		height: 20px;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		align-items: stretch !important;
		padding-top: 0 !important;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
		align-items: stretch !important;
		gap: 0 !important;
		width: 100%;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item {
		flex-direction: column;
		align-items: flex-start !important;
		padding: 14px 0;
		border-bottom: 1px solid var(--wp--preset--color--hairline);
		animation: kz-menu-item .5s cubic-bezier(.2, .7, .2, 1) both;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(1) { animation-delay: .12s; }
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(2) { animation-delay: .17s; }
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(3) { animation-delay: .22s; }
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(4) { animation-delay: .27s; }
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(5) { animation-delay: .32s; }
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
		font-family: var(--wp--preset--font-family--display);
		font-size: 26px;
		font-weight: 800;
		line-height: 1.15;
		letter-spacing: -.02em;
		color: var(--wp--preset--color--ink);
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon {
		display: none !important;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
		align-items: flex-start !important;
		gap: 2px !important;
		padding: 10px 0 2px !important;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
		justify-content: flex-start !important;
		text-align: left;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
		padding: 5px 0 !important;
		font-family: var(--wp--preset--font-family--sans);
		font-size: 16px;
		font-weight: 500;
		color: var(--wp--preset--color--muted);
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover,
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:focus-visible,
	.wp-block-navigation__responsive-container.is-menu-open .current-menu-item > .wp-block-navigation-item__content {
		color: var(--wp--preset--color--primary);
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .kz-nav-cta {
		display: flex !important;
		padding-top: 28px;
		border-bottom: 0;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .kz-nav-cta > .wp-block-navigation-item__content {
		display: inline-flex;
		padding: 14px 28px;
		border-radius: 10px;
		background: var(--wp--preset--color--primary);
		color: var(--wp--preset--color--on-primary);
		font-size: 16px;
		font-weight: 600;
		letter-spacing: 0;
		box-shadow: var(--wp--preset--shadow--subtle);
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .kz-nav-cta > .wp-block-navigation-item__content:hover {
		background: var(--wp--preset--color--primary-active);
		color: var(--wp--preset--color--on-primary);
	}
}
@keyframes kz-menu-fade {
	from { opacity: 0; }
}
@keyframes kz-menu-slide {
	from { transform: translateX(100%); }
}
@keyframes kz-menu-item {
	from { opacity: 0; transform: translateX(24px); }
}
@media (prefers-reduced-motion: reduce) {
	.wp-block-navigation__responsive-container.is-menu-open,
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
		animation: none !important;
	}
}