.flex-layout.hero_secondary_small_job_werkenbij {
	--layout-spacing-top: max(1rem, calc(1.5 * var(--su)));
	--layout-spacing-bottom: 0;
	--text-color: var(--white-100);
	--overlay-height: max(5rem, calc(5 * var(--su)));
	position: relative;
	/* min-height: max(31rem, calc(31 * var(--su))); */
	--hero-gradient: radial-gradient(119.16% 178% at 96.2% 162.32%, var(--support-1) 0%, transparent 96.33%);
	--hero-gradient-origin: 96.2% 100%;
	background: var(--hero-gradient), var(--primary-100);
}

.flex-layout.hero_secondary_small_job_werkenbij:has(.nova-cursor) {
	overflow: visible;
}

/* Expliciet i.p.v. leunen op de toevallige globale default — zelfde 2
   varianten als de globale overlay-regel in style.css. */
.flex-layout.hero_secondary_small_job_werkenbij[data-overlay-layout] + .flex-layout,
.flex-content:has(> .flex-layout.hero_secondary_small_job_werkenbij[data-overlay-layout]:last-child) + .flex-content > .flex-layout:first-child {
	--overlay-height: max(5rem, calc(5 * var(--su)));
}

.flex-layout.hero_secondary_small_job_werkenbij .hero-grid {
	position: relative;
	z-index: 2;
	align-items: center;
	pointer-events: none;
}

.flex-layout.hero_secondary_small_job_werkenbij .breadcrumbs-col {
	pointer-events: auto;
}

.flex-layout.hero_secondary_small_job_werkenbij .content-col {
	color: var(--text-color);
	pointer-events: auto;
	height: 100%;
	padding-bottom: max(4rem, calc(4 * var(--su)));
}

.flex-layout.hero_secondary_small_job_werkenbij .cursor-anchor {
	width: 0;
	height: 0;
	margin-block: max(1rem, calc(4 * var(--su)));
}

.flex-layout.hero_secondary_small_job_werkenbij .content-col .pk-heading {
	color: inherit;
}

.flex-layout.hero_secondary_small_job_werkenbij .content-col .job-meta {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 1rem max(.5rem, calc(.5 * var(--su)));
	padding: 0;
	list-style: none;
	color: inherit;
}

.flex-layout.hero_secondary_small_job_werkenbij .job-meta li {
	display: flex;
	align-items: center;
	gap: max(.5rem, calc(.5 * var(--su)));
}

.flex-layout.hero_secondary_small_job_werkenbij .job-meta li::before {
	display: none;
}

.flex-layout.hero_secondary_small_job_werkenbij .job-meta .nova-icon {
	flex: 0 0 max(1.25rem, calc(1.25 * var(--su)));
	width: max(1.25rem, calc(1.25 * var(--su)));
	height: auto;
	aspect-ratio: 1;
}

.flex-layout.hero_secondary_small_job_werkenbij .job-buttons {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: max(1rem, calc(1 * var(--su)));
	margin-top: max(1.5rem, calc(1.5 * var(--su)));
}

.flex-layout.hero_secondary_small_job_werkenbij .content-col .job-buttons .pk-button-group {
	display: contents;
	margin: 0;
}

.flex-layout.hero_secondary_small_job_werkenbij .image-col {
	display: flex;
	align-items: end;
	height: 100%;
	width: 100%;
	pointer-events: none;
}

.flex-layout.hero_secondary_small_job_werkenbij .hero-image {
	overflow: hidden;
	aspect-ratio: 563 / 418;
	margin-bottom: calc(-1 * var(--overlay-height));
}

.flex-layout.hero_secondary_small_job_werkenbij .hero-image img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
}

@media screen and (max-width: 991px) {

	.flex-layout.hero_secondary_small_job_werkenbij .content-col {
		padding: unset;
	}

	.flex-layout.hero_secondary_small_job_werkenbij .cursor-anchor, .flex-layout.hero_secondary_small_job_werkenbij .nova-cursor {
		display: none !important;
	}
}


@media only screen and (max-width: 767px) {
	.flex-layout.hero_secondary_small_job_werkenbij .content-col {
		min-width: 0;
	}

	.flex-layout.hero_secondary_small_job_werkenbij .content-col .pk-heading {
		font-size: clamp(2rem, 9vw, 2.75rem);
		line-height: 1.2;
		-webkit-hyphens: none;
		hyphens: none;
		word-break: normal;
		overflow-wrap: break-word;
		text-wrap: balance;
	}

	@supports (hyphenate-limit-chars: 10 5 5) or ((-webkit-hyphenate-limit-before: 5) and (-webkit-hyphenate-limit-after: 5)) {
		.flex-layout.hero_secondary_small_job_werkenbij .content-col .pk-heading {
			-webkit-hyphens: auto;
			hyphens: auto;
			hyphenate-limit-chars: 10 5 5;
			-webkit-hyphenate-limit-before: 5;
			-webkit-hyphenate-limit-after: 5;
		}
	}
}
