.flex-layout.contact {
	padding-block: max(6.1875rem, calc(6.1875 * var(--su)));
}

.flex-layout.contact .title-col {
	margin-bottom: max(3rem, calc(3 * var(--su)));
}

.flex-layout.contact .title-col .pk-heading {
	color: var(--pk-color-knal-rood);
}

.flex-layout.contact .cta-col {
	display: flex;
	flex-direction: column;
	gap: max(1.5rem, calc(1.5 * var(--su)));
}

.flex-layout.contact .form-col {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--pk-color-knal-rood);
	padding: max(2rem, calc(2 * var(--su)));
	justify-content: center;
}

.flex-layout.contact .form-title {
	margin-bottom: max(1rem, calc(1 * var(--su)));
	color: var(--pk-color-knal-rood);
}

.flex-layout.contact .form-col .pk-text {
	font-size: var(--desktop-body-sm);
	margin-bottom: max(1.5rem, calc(1.5 * var(--su)));
	color: var(--pk-color-knal-rood);
}

.flex-layout.contact .cta-block {
	background-color: var(--pk-color-knal-rood);
	color: var(--pk-color-white);
	padding: max(1.5rem, calc(3.5 * var(--su)));
	display: flex;
	flex-direction: column;
	gap: max(1rem, calc(1.56 * var(--su)));
}

.flex-layout.contact .cta-title {
	margin: 0;
	color: var(--pk-color-white);
}

.flex-layout.contact .cta-block .pk-text {
	color: var(--pk-color-white);
	font-size: var(--desktop-body-sm);
}

.flex-layout.contact .social-list {
	display: flex;
	flex-wrap: wrap;
	gap: max(0.75rem, calc(0.75 * var(--su)));
}

.flex-layout.contact .social-link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: max(2.25rem, calc(2.25 * var(--su)));
	height: max(2.25rem, calc(2.25 * var(--su)));
	background-color: var(--pk-color-white);
	border-radius: 4px;
}

.flex-layout.contact .social-link svg {
	width: 50%;
	height: 50%;
}

.flex-layout.contact .social-link svg path {
	fill: var(--pk-color-knal-rood);
}

.flex-layout.contact .link-list {
	display: flex;
	flex-direction: column;
	gap: max(0.5rem, calc(0.5 * var(--su)));
}

.flex-layout.contact .text-link {
	color: var(--pk-color-white);
	text-decoration: underline;
}

@media screen and (max-width: 992px) {
	.flex-layout.contact .form-col {
		margin-bottom: max(2rem, calc(2 * var(--su)));
	}
}

.flex-layout.contact .gform_wrapper .gform_fields {
	column-gap: max(1rem, calc(1 * var(--su))) !important;
	row-gap: max(1rem, calc(1 * var(--su))) !important;
}

.flex-layout.contact .gform_wrapper .gfield_required {
	display: none;
}

/* Gravity Forms: label als placeholder, vliegt omhoog bij focus/invoer */

.flex-layout.contact .gform_wrapper {
	--label-padding: max(.25rem, calc(.25 * var(--su)));
	--sublabel-theme-padding: 1%;
}

.flex-layout.contact .gform_wrapper .gfield,
.flex-layout.contact .gform_wrapper .ginput_complex .gform-grid-col {
	position: relative;
}

.flex-layout.contact .gform_wrapper input::placeholder,
.flex-layout.contact .gform_wrapper textarea::placeholder {
	opacity: 0;
}

.flex-layout.contact .gform_wrapper.gravity-theme .ginput_container_address {
	--sublabel-theme-padding: .9804%;
}

.flex-layout.contact .gform_wrapper .gfield--input-type-text .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--type-text .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--input-type-email .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--type-email .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--input-type-tel .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--type-phone .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--type-textarea .gfield_label,
.flex-layout.contact .gform_wrapper .ginput_complex .gform-grid-col .gform-field-label--type-sub {
	position: absolute;
	color: var(--pk-color-knal-rood);
	font-weight: 400;
	font-size: max(1rem, calc(1 * var(--su))) !important;
	letter-spacing: 0.32px;
	left: max(.75rem, calc(1 * var(--su)));
	top: 50%;
	translate: 0 -50%;
	margin: 0;
	padding: 0 var(--label-padding);
	pointer-events: none;
	transition: top 0.15s ease, font-size 0.15s ease, background-color .15s ease, padding .15s ease;
	background-color: transparent;
	z-index: 2;
}

.flex-layout.contact .gform_wrapper .gfield--type-textarea .gfield_label {
	top: max(1rem, calc(1.5 * var(--su)));
	left: max(1rem, calc(1 * var(--su)));
	translate: 0 -50%;
}

.flex-layout.contact .gform_wrapper .gfield--input-type-text:focus-within .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--type-text:focus-within .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--input-type-email:focus-within .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--type-email:focus-within .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--input-type-tel:focus-within .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--type-phone:focus-within .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--type-textarea:focus-within .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--input-type-text:has(input:not(:placeholder-shown)) .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--type-text:has(input:not(:placeholder-shown)) .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--input-type-email:has(input:not(:placeholder-shown)) .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--type-email:has(input:not(:placeholder-shown)) .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--input-type-tel:has(input:not(:placeholder-shown)) .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--type-phone:has(input:not(:placeholder-shown)) .gfield_label,
.flex-layout.contact .gform_wrapper .gfield--type-textarea:has(textarea:not(:placeholder-shown)) .gfield_label,
.flex-layout.contact .gform_wrapper .ginput_complex .gform-grid-col:focus-within .gform-field-label--type-sub,
.flex-layout.contact .gform_wrapper .ginput_complex .gform-grid-col:has(input:not(:placeholder-shown)) .gform-field-label--type-sub {
	top: 0;
	background-color: var(--pk-color-white) !important;
	padding-inline: var(--label-padding);
}

.flex-layout.contact .gform_wrapper .ginput_complex .gform-grid-col:not(:first-child) .gform-field-label--type-sub,
.flex-layout.contact .gform_wrapper .ginput_complex .gform-grid-col.ginput_full .gform-field-label--type-sub {
	translate: calc(1 * (var(--label-padding) + var(--sublabel-theme-padding))) -50%
}

.flex-layout.contact .gform_wrapper input[type="text"],
.flex-layout.contact .gform_wrapper input[type="email"],
.flex-layout.contact .gform_wrapper input[type="tel"],
.flex-layout.contact .gform_wrapper input[type="number"],
.flex-layout.contact .gform_wrapper input[type="url"],
.flex-layout.contact .gform_wrapper textarea {
	border: 1px solid var(--pk-color-knal-rood);
	padding: max(1.25rem, calc(1.25 * var(--su))) max(1.5rem, calc(1.5 * var(--su))) !important;
	color: var(--pk-color-knal-rood) !important;
	background-color: transparent !important;
	outline: none !important;
	box-shadow: none !important;
	font-size: max(1rem, calc(1 * var(--su))) !important;
}

.flex-layout.contact .gform_wrapper input[type="text"]:focus,
.flex-layout.contact .gform_wrapper input[type="email"]:focus,
.flex-layout.contact .gform_wrapper input[type="tel"]:focus,
.flex-layout.contact .gform_wrapper input[type="number"]:focus,
.flex-layout.contact .gform_wrapper input[type="url"]:focus,
.flex-layout.contact .gform_wrapper textarea:focus {
	outline: none !important;
	box-shadow: none !important;
}

.flex-layout.contact .gform_wrapper .gfield--type-select .gfield_label {
	display: none !important;
}

.flex-layout.contact .gform_wrapper select.pk-visually-hidden-select {
	position: absolute;
	width: 100%;
	height: 100%;
	opacity: 0;
	pointer-events: none;
	z-index: -1;
}

.flex-layout.contact .gform_wrapper .pk-custom-select {
	position: relative;
	display: block;
	width: 100%;
}

.flex-layout.contact .gform_wrapper .pk-custom-select-trigger {
	appearance: none !important;
	-webkit-appearance: none !important;
	box-sizing: border-box !important;
	margin: 0 !important;
	display: block !important;
	width: 100% !important;
	height: auto !important;
	min-height: 0 !important;
	max-height: none !important;
	cursor: pointer;
	border: 1px solid var(--pk-color-knal-rood) !important;
	padding: max(1rem, calc(1 * var(--su))) max(1.5rem, calc(1.5 * var(--su))) !important;
	padding-right: max(3rem, calc(3 * var(--su))) !important;
	color: var(--pk-color-knal-rood) !important;
	background-color: transparent !important;
	font-size: max(1rem, calc(1 * var(--su))) !important;
	font-weight: 400 !important;
	font-family: inherit;
	line-height: var(--pk-text-line-height) !important;
	text-align: left !important;
	justify-content: flex-start !important;
	outline: none !important;
	box-shadow: none !important;
	background-repeat: no-repeat;
	background-position: right max(.75rem, calc(.75 * var(--su))) center;
	background-size: max(1.5rem, calc(1.5 * var(--su)));
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cmask id='mask0_163_1091' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='24' height='24'%3E%3Crect width='24' height='24' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_163_1091)'%3E%3Cpath d='M18.6537 15.0388L13 9.38481L14.0537 8.33105L18.6537 12.9158L23.2537 8.33105L24.3075 9.38481L18.6537 15.0388Z' fill='%23D11F2F'/%3E%3C/g%3E%3C/svg%3E");
}

.flex-layout.contact .gform_wrapper .pk-custom-select-options {
	position: absolute;
	top: calc(100% + max(.5rem, calc(.5 * var(--su))));
	left: 0;
	right: 0;
	z-index: 10;
	margin: 0;
	padding: max(.5rem, calc(.5 * var(--su)));
	list-style: none;
	border: 1px solid var(--pk-color-knal-rood);
	background-color: var(--pk-color-white);
	max-height: max(15rem, calc(15 * var(--su)));
	overflow-y: auto;
}

.flex-layout.contact .gform_wrapper .pk-custom-select-option {
	padding: max(.75rem, calc(.75 * var(--su))) max(1rem, calc(1 * var(--su)));
	color: var(--pk-color-knal-rood);
	font-size: max(1rem, calc(1 * var(--su)));
	cursor: pointer;
}

.flex-layout.contact .gform_wrapper .pk-custom-select-option:hover,
.flex-layout.contact .gform_wrapper .pk-custom-select-option.is-selected {
	background-color: var(--pk-color-knal-rood);
	color: var(--pk-color-white);
}

.flex-layout.contact .gform_wrapper .gform_button {
	appearance: none !important;
	-webkit-appearance: none !important;
	cursor: pointer !important;
	background-color: transparent !important;
	background-image: linear-gradient(currentColor, currentColor) !important;
	background-repeat: no-repeat !important;
	background-position: left calc(100% + 2px) !important;
	background-size: 100% 1px !important;
	color: var(--pk-color-knal-rood) !important;
	font-size: max(1.25rem, calc(1.25 * var(--su))) !important;
	text-decoration: none !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0 !important;
	transition: background-size 0.35s ease !important;
}

.flex-layout.contact .gform_wrapper .gform_button:hover,
.flex-layout.contact .gform_wrapper .gform_button:focus,
.flex-layout.contact .gform_wrapper .gform_button:active {
	background-size: 0% 1px !important;
}