.vacature_introductie-layout {
	background: var(--dc-white);
	color: rgba(var(--dc-black-rgb), .8);
}

body .vacature_introductie-layout {
	box-sizing: border-box;
}

.vacature_introductie-layout .pk-row {
	padding-block: max(6rem, calc(9.25 * var(--su)));
}

.vacature_introductie__grid {
	align-items: start;
	row-gap: max(3rem, calc(3 * var(--su)));
}

.vacature_introductie__main,
.vacature_introductie__copy,
.vacature_introductie__sidebar,
.vacature_introductie__card,
.vacature_introductie__card-copy {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.vacature_introductie__main {
	gap: max(2rem, calc(2 * var(--su)));
}

.vacature_introductie__copy {
	gap: max(1.5rem, calc(1.5 * var(--su)));
	width: 100%;
}

.vacature_introductie__form-intro {
	display: flex;
	flex-direction: column;
	gap: max(.375rem, calc(.375 * var(--su)));
}

body .vacature_introductie-layout .vacature_introductie__form-intro p {
	margin: 0;
}

body .vacature_introductie-layout .vacature_introductie__required-note {
	color: rgba(var(--dc-black-rgb), .6);
	font-size: max(.875rem, calc(.875 * var(--su)));
	font-style: italic;
}

body .vacature_introductie-layout .vacature_introductie__heading,
body .vacature_introductie-layout .vacature_introductie__content,
body .vacature_introductie-layout .vacature_introductie__content > :first-child,
body .vacature_introductie-layout .vacature_introductie__content > :last-child,
body .vacature_introductie-layout .vacature_introductie__card-heading,
body .vacature_introductie-layout .vacature_introductie__card-text,
body .vacature_introductie-layout .vacature_introductie__card-text p {
	margin: 0;
}

body .vacature_introductie-layout .vacature_introductie__content #apply_button{
	display: none;
}

body .vacature_introductie-layout .vacature_introductie__content #apply_form #apply_button{
	display: block;
}

.vacature_introductie__content,
.vacature_introductie__card-text,
.vacature_introductie__card-heading {
	color: inherit;
}

.vacature_introductie__content {
	width: 100%;
}

body .vacature_introductie-layout .vacature_introductie__content > .cx_h4 {
	margin: max(2.5rem, calc(2.5 * var(--su))) 0 max(.75rem, calc(.75 * var(--su)));
	font-size: var(--scaling-h3);
	line-height: var(--scaling-h3-line-height, 1.1);
}

body .vacature_introductie-layout .vacature_introductie__content > .cx_h4:first-child {
	margin-top: 0;
}

body .vacature_introductie-layout .vacature_introductie__content p {
	margin: 0;
}

body .vacature_introductie-layout .vacature_introductie__content p + p {
	margin-top: max(1rem, calc(1 * var(--su)));
}

body .vacature_introductie-layout .vacature_introductie__content ul,
body .vacature_introductie-layout .vacature_introductie__content ol {
	margin: max(.75rem, calc(.75 * var(--su))) 0 0;
	padding-left: 1.25em;
}

body .vacature_introductie-layout .vacature_introductie__content li + li {
	margin-top: max(.625rem, calc(.625 * var(--su)));
}

/* Carerix sollicitatieformulier. De specifieke scope houdt provider-CSS buiten andere formulieren. */
body.cx-applicationform .vacature_introductie-layout #apply_form,
body.cx-applicationform .vacature_introductie-layout #apply_form form {
	width: 100%;
}

body.cx-applicationform .vacature_introductie-layout #apply_form {
	max-width: max(40.625rem, calc(40.625 * var(--su)));
}

body.cx-applicationform .vacature_introductie-layout #apply_form form {
	display: flex;
	flex-direction: column;
	gap: max(1rem, calc(1 * var(--su)));
}

body.cx-applicationform .vacature_introductie-layout #apply_form form > div {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: max(.375rem, calc(.375 * var(--su)));
	width: 100%;
	margin: 0;
}

body.cx-applicationform .vacature_introductie-layout #apply_form .cx_h3 {
	margin: max(1.25rem, calc(1.25 * var(--su))) 0 max(.25rem, calc(.25 * var(--su)));
	font-size: var(--scaling-h4);
	line-height: var(--scaling-h4-line-height, 1.1);
}

body.cx-applicationform .vacature_introductie-layout #apply_form .cx_h3:first-of-type {
	margin-top: 0;
}

body.cx-applicationform .vacature_introductie-layout #apply_form label {
	display: inline-block;
	width: auto;
	margin: 0;
	color: var(--dc-black);
	font-size: max(.875rem, calc(.875 * var(--su)));
	font-weight: 600;
	line-height: 1.4;
}

body.cx-applicationform .vacature_introductie-layout #apply_form .cx2_required_marker {
	margin-left: .15em;
	color: var(--dc-orange);
}

body.cx-applicationform .vacature_introductie-layout #apply_form :is(input:not([type="hidden"]):not([type="radio"]):not([type="checkbox"]):not([type="submit"]), textarea, select) {
	box-sizing: border-box;
	width: 100%;
	min-height: max(3rem, calc(3 * var(--su)));
	margin: 0;
	padding: max(.75rem, calc(.75 * var(--su))) max(1rem, calc(1 * var(--su)));
	border: 1px solid rgba(var(--dc-black-rgb), .35);
	border-radius: max(.25rem, calc(.25 * var(--su)));
	background: var(--dc-white);
	color: var(--dc-black);
	font: inherit;
	font-size: max(.875rem, calc(.875 * var(--su)));
	line-height: 1.4;
}

body.cx-applicationform .vacature_introductie-layout #apply_form textarea {
	min-height: max(8rem, calc(8 * var(--su)));
	resize: vertical;
}

body.cx-applicationform .vacature_introductie-layout #apply_form :is(input, textarea, select):focus-visible {
	border-color: var(--dc-orange);
	outline: 2px solid rgba(var(--dc-orange-rgb), .25);
	outline-offset: 1px;
}

body.cx-applicationform .vacature_introductie-layout #apply_form .cx2_personal-cv {
	gap: max(.5rem, calc(.5 * var(--su)));
}

body.cx-applicationform .vacature_introductie-layout #apply_form input[type="file"] {
	min-height: max(4.5rem, calc(4.5 * var(--su)));
	padding: max(.625rem, calc(.625 * var(--su)));
	border-color: var(--dc-orange);
	border-style: dashed;
	background: rgba(var(--dc-orange-rgb), .12);
}

body.cx-applicationform .vacature_introductie-layout #apply_form input[type="file"]::file-selector-button {
	margin-right: max(.75rem, calc(.75 * var(--su)));
	padding: max(.625rem, calc(.625 * var(--su))) max(.875rem, calc(.875 * var(--su)));
	border: 1px solid rgba(var(--dc-black-rgb), .35);
	border-radius: max(.25rem, calc(.25 * var(--su)));
	background: var(--dc-white);
	color: var(--dc-black);
	font: inherit;
	cursor: pointer;
}

body.cx-applicationform .vacature_introductie-layout #apply_form .cx2_personal-cv-info {
	color: rgba(var(--dc-black-rgb), .6);
	font-size: max(.75rem, calc(.75 * var(--su)));
}

body.cx-applicationform .vacature_introductie-layout #apply_form .carerix_labels {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: max(.5rem, calc(.5 * var(--su)));
	font-size: max(.875rem, calc(.875 * var(--su)));
}

body.cx-applicationform .vacature_introductie-layout #apply_form input[type="radio"],
body.cx-applicationform .vacature_introductie-layout #apply_form input[type="checkbox"] {
	width: max(1.125rem, calc(1.125 * var(--su)));
	height: max(1.125rem, calc(1.125 * var(--su)));
	margin: 0;
	accent-color: var(--dc-orange);
}

body.cx-applicationform .vacature_introductie-layout #apply_form #apply_button {
	box-sizing: border-box;
	width: 100%;
	min-height: max(3rem, calc(3 * var(--su)));
	margin: max(.5rem, calc(.5 * var(--su))) 0 0;
	padding: max(.75rem, calc(.75 * var(--su))) max(1.25rem, calc(1.25 * var(--su)));
	border: 1px solid var(--dc-orange);
	border-radius: max(.25rem, calc(.25 * var(--su)));
	background: var(--dc-orange);
	color: var(--dc-black);
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease;
}

body.cx-applicationform .vacature_introductie-layout #apply_form #apply_button:hover,
body.cx-applicationform .vacature_introductie-layout #apply_form #apply_button:focus-visible {
	background: var(--dc-black);
	color: var(--dc-white);
}

body.cx-applicationform .vacature_introductie-layout .cx2_backToJobDetails {
	display: inline-flex;
	margin-top: max(1rem, calc(1 * var(--su)));
	color: var(--dc-black);
	text-decoration: underline;
	text-underline-offset: .2em;
}

body.cx-applicationform .vacature_introductie-layout #apply_form :is(.error, .cx_error) {
	color: #a52525;
	font-size: max(.8125rem, calc(.8125 * var(--su)));
}

.vacature_introductie__actions.pk-button-group {
	gap: max(.75rem, calc(.75 * var(--su)));
	margin: 0;
}

.vacature_introductie__sidebar {
	gap: max(1rem, calc(1 * var(--su)));
	position: sticky;
	top: max(1.4rem, calc(4 * var(--su)));;
}

.vacature_introductie__card {
	box-sizing: border-box;
	gap: max(1.5rem, calc(1.5 * var(--su)));
	width: 100%;
	padding: max(2rem, calc(2 * var(--su)));
	border-radius: max(.5rem, calc(.5 * var(--su)));
	color: var(--dc-black);
}

.vacature_introductie__card--faq {
	background: var(--dc-orange);
}

.vacature_introductie__card--job-alert {
	background: var(--dc-blue);
}

.vacature_introductie__card-copy {
	gap: max(.5rem, calc(.5 * var(--su)));
}

body .vacature_introductie-layout .vacature_introductie__card-heading {
	font-size: var(--scaling-h5);
}

.vacature_introductie__people {
	display: flex;
	width: fit-content;
	padding: max(.25rem, calc(.25 * var(--su)));
	border-radius: 999px;
	background: var(--dc-white);
}

.vacature_introductie__person {
	position: relative;
	display: block;
	flex: 0 0 max(3.5rem, calc(3.5 * var(--su)));
	width: max(3.5rem, calc(3.5 * var(--su)));
	height: max(3.5rem, calc(3.5 * var(--su)));
	overflow: hidden;
	border-radius: 50%;
}

.vacature_introductie__person:not(:first-child) {
	margin-left: max(-1rem, calc(-1 * var(--su)));
}

body .vacature_introductie-layout .vacature_introductie__person img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
}

body .vacature_introductie-layout .vacature_introductie__card-button {
	--pk-button-padding-inline: max(1rem, calc(1 * var(--su)));
	width: 100%;
	justify-content: center;
}

.vacature_introductie__job-icon {
	display: grid;
	width: max(3.5rem, calc(3.5 * var(--su)));
	height: max(3.5rem, calc(3.5 * var(--su)));
	place-items: center;
	border-radius: 50%;
	background: rgba(var(--dc-white-rgb), .4);
}

.vacature_introductie__job-icon svg {
	width: max(1.5rem, calc(1.5 * var(--su)));
	height: max(1.5rem, calc(1.5 * var(--su)));
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.5;
}

.vacature_introductie__job-alert-form:empty {
	display: none;
}

.vacature_introductie__job-alert-form:not(:empty) {
	width: 100%;
}

@media (max-width: 991px) {
	.vacature_introductie-layout .pk-row {
		padding-block: max(5rem, calc(5 * var(--su)));
	}

	.vacature_introductie__sidebar {
		flex-direction: row;
		align-items: stretch;
	}

	.vacature_introductie__card {
		flex: 1 1 0;
	}
}

@media (max-width: 767px) {
	.vacature_introductie-layout .pk-row {
		padding-block: max(4rem, calc(4 * var(--su)));
	}

	.vacature_introductie__sidebar {
		flex-direction: column;
	}

	.vacature_introductie__card {
		flex-basis: auto;
	}

	.vacature_introductie__actions.pk-button-group,
	.vacature_introductie__actions .pk-button {
		width: 100%;
	}

	.vacature_introductie__card {
		padding: max(1.5rem, calc(1.5 * var(--su)));
	}
}