.vacature_contentblok-layout {
    background: var(--pk-white);
}

.vacature_contentblok-layout .pk-row {
    padding-block: max(3rem, calc(4.5 * var(--su))) max(4rem, calc(5.5 * var(--su)));
    padding-inline: 0;
}

.vacature_contentblok-layout .pk-row-content {
    padding-inline: calc(5.625 * var(--su));
    align-items: start;
    row-gap: max(2rem, calc(2.5 * var(--su)));
}

.vacature_contentblok-layout .pk-content-col {
    color: var(--pk-purple);
}

.vacature_contentblok-layout .pk-content-entry {
    max-width: calc(40.5 * var(--su));
}

.vacature_contentblok-layout .pk-content-entry > *:first-child {
    margin-top: 0;
}

.vacature_contentblok-layout .pk-content-entry > *:last-child {
    margin-bottom: 0;
}

.vacature_contentblok-layout .pk-content-entry h2,
.vacature_contentblok-layout .pk-content-entry h3,
.vacature_contentblok-layout .pk-content-entry h4 {
    color: var(--pk-purple);
    font-weight: 400;
    line-height: 1.1;
    letter-spacing: -0.02em;
    margin: 0 0 max(1rem, calc(1.25 * var(--su)));
}

.vacature_contentblok-layout .pk-content-entry h2 {
    font-size: max(1.75rem, calc(2.375 * var(--su)));
}

.vacature_contentblok-layout .pk-content-entry h3,
.vacature_contentblok-layout .pk-content-entry h4 {
    font-size: max(1.063rem, calc(1.188 * var(--su)));
    font-weight: 700;
}

.vacature_contentblok-layout .pk-content-entry p,
.vacature_contentblok-layout .pk-content-entry li {
    font-size: max(0.938rem, calc(0.938 * var(--su)));
    line-height: max(1.438rem, calc(1.438 * var(--su)));
}

.vacature_contentblok-layout .pk-content-entry p,
.vacature_contentblok-layout .pk-content-entry ul,
.vacature_contentblok-layout .pk-content-entry ol {
    margin: 0 0 max(1rem, calc(1.125 * var(--su)));
}

.vacature_contentblok-layout .pk-content-entry ul,
.vacature_contentblok-layout .pk-content-entry ol {
    padding-left: max(1.125rem, calc(1.25 * var(--su)));
}

.vacature_contentblok-layout .pk-content-entry hr {
    border: 0;
    border-top: 1px solid rgba(87, 89, 145, 0.35);
    margin: max(1rem, calc(1.125 * var(--su))) 0;
}

.vacature_contentblok-layout .pk-sidebar-col {
    display: grid;
    gap: 0;
    position: relative;
    z-index: 2;
    align-self: start;
}

/* Sidebar Top */
.vacature_contentblok-layout .pk-sidebar-top {
    display: flex;
    flex-wrap: wrap;
    align-content: start;
    height: fit-content;
    color: var(--pk-beige);
    padding: max(2.875rem, calc(2.875 * var(--su)));
    padding-block: max(2rem, calc(2 * var(--su))) max(2.5rem, calc(2.5 * var(--su)));
    padding-inline: max(3.438rem, calc(3.438 * var(--su)));
    width: 100%;
    border-radius: calc(1.625 * var(--su));
    border-top-right-radius: calc(1.625 * var(--su));
    border-bottom-left-radius: calc(2.5 * var(--su));
    border-bottom-right-radius: calc(1.625 * var(--su));
    background: var(--pk-purple);
}

.vacature_contentblok-layout .pk-sidebar-logo {
    display: flex;
    align-items: center;
    max-width: max(7.5rem, calc(8.75 * var(--su)));
    margin-bottom: max(0.875rem, calc(0.875 * var(--su)));
}

.vacature_contentblok-layout .pk-sidebar-logo img {
    width: 100%;
    height: auto;
    aspect-ratio: unset;
    margin-block: max(1rem, calc(0.625 * var(--su)));
}

.vacature_contentblok-layout .pk-sidebar-top h3 {
    font-size: max(2rem, calc(2 * var(--su)));
    font-weight: 400;
    color: var(--pk-beige);
    letter-spacing: -2%;
    line-height: max(2rem, calc(2.375 * var(--su)));
    margin-bottom: max(1.563rem, calc(1.563 * var(--su)));
}

.vacature_contentblok-layout .pk-sidebar-top .pk-ups-list {
    padding: 0;
    margin: 0;
    list-style: none;
}

.vacature_contentblok-layout .pk-sidebar-top .pk-ups-list li {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    line-height: max(1.438rem, calc(1.438 * var(--su)));
    margin-bottom: max(0.375rem, calc(0.375 * var(--su)));
}

.vacature_contentblok-layout .pk-sidebar-top .pk-ups-list li span {
    flex-shrink: 0;
}

.vacature_contentblok-layout .pk-sidebar-top .pk-check-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1.438rem;
    color: var(--pk-beige);
}

.vacature_contentblok-layout .pk-sidebar-top .pk-button-group {
    margin-top: max(2rem, calc(2 * var(--su)));
}

.vacature_contentblok-layout .pk-sidebar-top .pk-button {
    font-size: max(1rem, calc(1 * var(--su)));
    color: var(--pk-purple);
    width: 100%;
    justify-content: space-between;
}

.vacature_contentblok-layout .pk-sidebar-bottom {
    display: flex;
    flex-wrap: wrap;
    align-content: start;
    height: fit-content;
    color: var(--pk-beige);
    padding-block: max(2.875rem, calc(2.875 * var(--su)));
    padding-inline: max(3.438rem, calc(3.438 * var(--su)));
    width: 100%;
    border-radius: calc(1.625 * var(--su));
    border-top-left-radius: calc(2.5 * var(--su));
    border-top-right-radius: calc(1.625 * var(--su));
    background: var(--pk-purple);
}

.vacature_contentblok-layout .pk-sidebar-bottom .pk-images {
    display: flex;
    margin-bottom: calc(1.75 * var(--su));
}

.vacature_contentblok-layout .pk-sidebar-bottom .pk-images img {
    width: calc(4.5 * var(--su));
    height: calc(4.5 * var(--su));
    object-fit: cover;
    border-radius: 999px;
}

.vacature_contentblok-layout
    .pk-sidebar-bottom
    .pk-images
    img:not(:first-child) {
    margin-left: calc(-1.875 * var(--su));
}

.vacature_contentblok-layout .pk-sidebar-bottom .pk-heading {
    font-size: max(2rem, calc(2 * var(--su)));
    font-weight: 400;
    color: var(--pk-beige);
    letter-spacing: -2%;
    line-height: max(2rem, calc(2.375 * var(--su)));
    margin-bottom: max(1rem, calc(1.125 * var(--su)));
}

.vacature_contentblok-layout .pk-sidebar-bottom .pk-content-wrap p {
    color: var(--pk-white);
    margin: 0 0 max(0.75rem, calc(0.75 * var(--su)));
}

.vacature_contentblok-layout .pk-sidebar-bottom .pk-button {
    display: flex;
    align-items: center;
    gap: 0.438rem;
    font-size: max(1rem, calc(1 * var(--su)));
    width: fit-content;
}

.vacature_contentblok-layout .pk-sidebar-bottom .pk-button-group {
    display: grid;
    gap: max(0.875rem, calc(0.875 * var(--su)));
    margin-top: max(1.5rem, calc(1.75 * var(--su)));
}

.vacature_contentblok-layout .pk-sidebar-bottom .pk-button .icon,
.vacature_contentblok-layout .pk-sidebar-top .pk-button .icon {
    display: inline-flex;
    align-items: center;
}

@media screen and (max-width: 991px) {
    .vacature_contentblok-layout .pk-row {
        padding-block: max(2.5rem, calc(2.5 * var(--su))) max(3rem, calc(3 * var(--su)));
    }

    .vacature_contentblok-layout .pk-row-content {
        padding-inline: calc(2 * var(--su));
    }

    .vacature_contentblok-layout .pk-content-entry {
        max-width: none;
    }

    .vacature_contentblok-layout .pk-sidebar-top,
    .vacature_contentblok-layout .pk-sidebar-bottom {
        padding: max(1.5rem, calc(1.5 * var(--su)));
        border-radius: calc(1.5 * var(--su));
    }
}

@media screen and (max-width: 767px) {
    .vacature_contentblok-layout .pk-row-content {
        row-gap: max(1.5rem, calc(1.5 * var(--su)));
    }

    .vacature_contentblok-layout .pk-content-entry h2 {
        font-size: max(1.5rem, calc(1.75 * var(--su)));
    }

    .vacature_contentblok-layout .pk-sidebar-col {
        gap: 0;
    }

    .vacature_contentblok-layout .pk-sidebar-logo {
        max-width: max(6rem, calc(6rem * var(--su)));
        margin-bottom: max(0.75rem, calc(0.75 * var(--su)));
    }

    .vacature_contentblok-layout .pk-sidebar-top h3,
    .vacature_contentblok-layout .pk-sidebar-bottom .pk-heading {
        font-size: max(1.5rem, calc(1.5 * var(--su)));
        line-height: 1.1;
    }

    .vacature_contentblok-layout .pk-sidebar-bottom .pk-images img {
        width: calc(3.5 * var(--su));
        height: calc(3.5 * var(--su));
    }

    .vacature_contentblok-layout .pk-sidebar-bottom .pk-images img:not(:first-child) {
        margin-left: calc(-1.25 * var(--su));
    }

    .vacature_contentblok-layout .pk-sidebar-top .pk-button,
    .vacature_contentblok-layout .pk-sidebar-bottom .pk-button {
        width: 100%;
        justify-content: center;
    }
}

@media screen and (min-width: 992px) {
    .vacature_contentblok-layout .pk-sidebar-col {
        width: 100%;
        max-width: calc(24.75 * var(--su));
        justify-self: end;
        margin-top: calc(-7.5 * var(--su));
    }

    .vacature_contentblok-layout .pk-sidebar-top {
        margin-top: 0;
    }

    .vacature_contentblok-layout .pk-sidebar-bottom {
        margin-top: 0;
    }
}
