.hero_primair-layout {
    position: relative;
    color: #ffffff;
    overflow: hidden;
    min-height: calc(100vh - 80px);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.hero_primair-layout::before,
.hero_primair-layout::after {
    content: "";
    position: absolute;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center right;
}

.hero_primair-layout::before {
    width: max(40rem, calc(40 * var(--su)));
    height: 100%;
    left: 0;
    bottom: max(11.25rem, calc(11.25 * var(--su)));
    background-size: 100% 100%;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%22642%22%20height%3D%22718%22%20viewBox%3D%220%200%20642%20718%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle%20cx%3D%2256%22%20cy%3D%22132%22%20r%3D%22582%22%20stroke%3D%22white%22%20stroke-width%3D%228%22%20stroke-linejoin%3D%22round%22%20stroke-dasharray%3D%226%2020%22%2F%3E%3C%2Fsvg%3E");
    z-index: 1;
}

.hero_primair-layout::after {
    width: max(18.75rem, calc(18.75 * var(--su)));
    height: max(35.875rem, calc(35.875 * var(--su)));
    bottom: 0;
    right: 0;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%22298%22%20height%3D%22574%22%20viewBox%3D%220%200%20298%20574%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle%20cx%3D%22586%22%20cy%3D%22586%22%20r%3D%22582%22%20stroke%3D%22white%22%20stroke-width%3D%228%22%20stroke-linejoin%3D%22round%22%20stroke-dasharray%3D%226%2020%22%2F%3E%3C%2Fsvg%3E");
}

.hero_primair-layout .hero-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
	object-position: center top;
    z-index: 0;
}

.hero_primair-layout .pk-row {
    position: relative;
    padding-bottom: max(4.5rem, calc(6 * var(--su)));
    z-index: 10;
}

.hero_primair-layout .hero-content-col {
    color: var(--dc-black);
    padding-block: max(2rem, calc(3 * var(--su)));
    padding-inline: max(2rem, calc(2 * var(--su)));
    border-radius: 0.5rem;
    background: var(--dc-white);
	background: var(#FCEEE4);
    overflow: hidden;
}

.hero_primair-layout .pk-heading {
    font-size: var(--scaling-h1);
    color: var(--dc-black);
}

.hero_primair-layout .pk-button-group .pk-button:nth-child(2) {
	border-color:#CCCCCC;
}

@media screen and (min-width: 1640px) {
    .hero_primair-layout .hero-content-col {
        padding-block: max(3rem, calc(3 * var(--su)));
        padding-inline: max(3rem, calc(2.5 * var(--su)));
    }
}

@media screen and (max-width: 992px) {
    .hero_primair-layout .hero-content-col {
        padding: 1.5rem;
    }
}

@media screen and (max-width: 767px) {
    .hero_primair-layout::before {
        width: max(25rem, calc(25 * var(--su)));
        bottom: max(6rem, calc(9 * var(--su)));
    }

    .hero_primair-layout::after {
        width: max(10rem, calc(10 * var(--su)));
        height: max(20rem, calc(20 * var(--su)));
    }

	  .hero_primair-layout .pk-button-group .pk-button {
        justify-content: center;
        width: 100%;
    }
}


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