.contactformulier-layout{
	background: var(--pk-grey-blue);
}
.contactformulier-layout > .pk-row > .pk-grid-container {
    gap: calc(5 * var(--su));
}

.contactformulier-layout .pk-col-left{
	padding:max(4rem, calc(4 * var(--su)));
	color: var(--pk-white);
}

.contactformulier-layout .pk-col-left .pk-label{
	margin-bottom: max(1rem, calc(1 * var(--su)));
	background: rgba(76, 84, 101, 0.9);
}

.contactformulier-layout .pk-col-left .pk-heading{
	color: var(--pk-white);
}

.contactformulier-layout .pk-col-left .pk-button-group{
	flex-direction: column;
	gap: max(1.125rem, calc(1.125 * var(--su)));
	margin-top: max(2.5rem, calc(2.5 * var(--su)));
}

.contactformulier-layout .pk-col-left .pk-button-group .pk-button-item{
	display: flex;
	align-items: center;
	gap: max(1rem, calc(1 * var(--su)));
}
.contactformulier-layout .pk-col-left .pk-button-group .icon-wrap{
	width: max(2.5rem, calc(2.5 * var(--su)));
	height: max(2.5rem, calc(2.5 * var(--su)));
	padding: max(0.75rem, calc(0.75 * var(--su)));
	flex-shrink: 0;
	border-radius: 999px;
	background: var(--pk-red);
}

.contactformulier-layout .pk-col-left .pk-button-group .txt-wrap{
	display: flex;
	flex-direction: column;
}

.contactformulier-layout .pk-col-left .pk-button-group a,
.contactformulier-layout .pk-col-left .pk-button-group a:hover{
	color: var(--pk-white);
	border: unset;
	background: unset;
}

.contactformulier-layout .pk-col-left .pk-button-group a {
	transition: color 0.2s ease;
}

.contactformulier-layout .pk-col-left .pk-button-group a:hover,
.contactformulier-layout .pk-col-left .pk-button-group a:focus-visible {
	color: rgba(255, 255, 255, 0.78);
}

.contactformulier-layout .pk-col-left .pk-button-group .txt-wrap > span{
	display: block;
	font-size: max(0.875rem, calc(0.875 * var(--su)));
	color: #AFB3BB;
	margin-bottom: 3.5px;
}

.contactformulier-layout .pk-col-left .pk-button-group .pk-button::after {
	content: '';
	all: unset;
}

.contactformulier-layout .pk-col-right{
	border-radius: max(1.5rem, calc(1.5 * var(--su)));
	padding-block: max(2.5rem, calc(2.5 * var(--su)));
	padding-inline: max(3rem, calc(3 * var(--su)));
	background: var(--pk-white);
}


.contactformulier-layout .pk-form-heading {
    margin-bottom: max(1.5rem, calc(1.5 * var(--su)));
}
.contactformulier-layout .pk-form-heading .pk-heading {
	font-size: var(--scaling-h3);
    margin-bottom: 0.25rem;
}

.contactformulier-layout .pk-form-heading p {
    font-size: max(0.875rem, calc(0.875 * var(--su)));
    color: rgba(136, 141, 152, 0.6);
}
.contactformulier-layout .gform_wrapper .ginput_container input {
    min-height: max(2.75rem, calc(2.75 * var(--su)));
	box-shadow: none !important;
}

.contactformulier-layout .gform_wrapper .ginput_container input,
.contactformulier-layout .gform_wrapper .ginput_container textarea {
    border: 1px solid #d7d9dd;
    border-radius: max(0.25rem, calc(0.25 * var(--su)));
	box-shadow: none !important;
}

.contactformulier-layout .gform_wrapper .gform_required_legend{
	display: none !important;
}

.contactformulier-layout form .gform_footer {
    margin-top: max(1.5rem, calc(1.5 * var(--su)));
}

.contactformulier-layout form .gform_footer .gform_button {
    width: 100% !important;
    font-size: max(1rem, calc(1 * var(--su))) !important;
    padding: max(0.875rem, calc(0.875 * var(--su))) !important;
    border-radius: max(0.5rem, calc(0.5 * var(--su))) !important;
    background: var(--pk-red) !important;
	transition: background-color 0.2s ease, box-shadow 0.2s ease !important;
}

.contactformulier-layout form .gform_footer .gform_button:hover,
.contactformulier-layout form .gform_footer .gform_button:focus-visible {
	background: var(--pk-red-hover) !important;
	box-shadow: 0 0 0 3px rgba(255, 80, 65, 0.25) !important;
}

/**
 * Animated Labels
 */
.contactformulier-layout .gform_wrapper .gfield {
    position: relative;
    height: fit-content;
}

	.contactformulier-layout .gform_wrapper .gform_fields{
		column-gap: 1rem;
		row-gap:1rem;
	}

.contactformulier-layout .gform_wrapper .ginput_container_date input {
    width: 100%;
}

.contactformulier-layout .gform_wrapper .gfield > label {
    position: absolute;
    left: max(1.25rem, calc(1.25 * var(--su)));
    color: var(--label-color);
    margin-bottom: 0;
    padding-top: 0;
    transition:
        top 0.3s ease-in-out,
        font-size 0.3s ease-in-out;
    background-color: var(--pk-white);
}

.contactformulier-layout
    .gform_wrapper
    .gfield:not(.gfield--type-textarea)
    > label {
    top: 50%;
    transform: translate(0, -50%);
}

.contactformulier-layout .gform_wrapper .gfield--type-textarea > label {
    top: max(0.75rem, calc(0.75 * var(--su)));
    transition:
        top 0.3s ease-in-out,
        font-size 0.3s ease-in-out,
        transform 0.3s ease-in-out;
}

.contactformulier-layout
    .gform_wrapper
    .gfield--type-textarea
    .gfield_description {
    font-size: var(--label-font-size);
    font-style: italic;
    color: var(--label-color);
    margin-top: 0;
    padding-top: 0;
}

.contactformulier-layout .gform_wrapper .gfield option {
    padding-inline: var(--input-padding-inline);
}

.contactformulier-layout .gform_wrapper .gfield > label,
.contactformulier-layout .gform_wrapper .gfield > input {
    cursor: text;
    font-size: var(--label-font-size);
    font-weight: 400;
	box-shadow: none !important;
}

.contactformulier-layout .gform_wrapper .ginput_container > input {
	outline: none !important;
    padding-block: max(0.625rem, calc(0.625 * var(--su)));
    padding-inline: max(1.25rem, calc(1.25 * var(--su)));
}
.contactformulier-layout .gform_wrapper .ginput_container > input:focus-visible,
.contactformulier-layout .gform_wrapper .ginput_container > input:focus-within,
.contactformulier-layout .gform_wrapper .ginput_container > input:focus,
.contactformulier-layout .gform_wrapper .ginput_container textarea:focus-visible,
.contactformulier-layout .gform_wrapper .ginput_container textarea:focus-within,
.contactformulier-layout .gform_wrapper .ginput_container textarea:focus{
	outline: none !important;
	border-color: #384154;
}

.contactformulier-layout .gform_wrapper .ginput_container textarea{
	outline: none !important;
}

.contactformulier-layout .gform_wrapper .ginput_container_consent input {
    padding: 0;
    border-radius: 0.156rem;
    min-height: fit-content;
	box-shadow: none !important;
}

.contactformulier-layout .gform_wrapper .ginput_container_consent input::before {
	color: var(--pk-grey-blue);
}

.contactformulier-layout .gform_wrapper input::placeholder,
.contactformulier-layout .gform_wrapper textarea::placeholder {
    font-size: 0;
}

.contactformulier-layout .gform_wrapper .gfield:focus-within > label,
.contactformulier-layout
    .gform_wrapper
    .gfield:has(input:not([type="hidden"]):not(:placeholder-shown))
    > label,
.contactformulier-layout
    .gform_wrapper
    .gfield:has(option:not(.gf_placeholder):checked)
    > label {
    top: 0;
    font-size: 0.75em;
	font-weight: 500;
}

.contactformulier-layout
    .gform_wrapper
    .gfield:has(textarea):focus-within
    > label,
.contactformulier-layout
    .gform_wrapper
    .gfield:has(textarea:not(:placeholder-shown))
    > label {
    font-size: 0.75em;
    top: 0;
	font-weight: 500;
    transform: translate(0, -50%);
}

@media screen and (max-width: 767px) {
	.contactformulier-layout .pk-col-left{
		padding-block: 0 max(1.5rem, calc(1.5 * var(--su)));
		padding-inline: 0;
	}

	.contactformulier-layout .pk-col-right{
		border-radius: max(1rem, calc(1 * var(--su)));
		padding: max(1.5rem, calc(1.5 * var(--su)));
	}
	.contactformulier-layout .gform_wrapper .gform_fields{
		row-gap: 0.5rem;
	}
}