/*
 * ============================================================
 * BUSINESS — DIENST DETAIL
 * ============================================================
 */

@media screen and (min-width: 969px) {

body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-intro {
    padding:
        85px
        0 !important;

    background:
        #ffffff !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-intro-grid {
    display:
        grid !important;

    grid-template-columns:
        .9fr
        1.1fr !important;

    gap:
        0 !important;

    min-height:
        450px !important;

    border:
        1px solid
        var(--pb-business-line) !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-intro-grid > div:first-child {
    display:
        flex !important;

    flex-direction:
        column !important;

    justify-content:
        center !important;

    padding:
        55px
        60px !important;

    background:
        var(--pb-business-soft) !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-intro-image {
    min-height:
        450px !important;

    border-radius:
        0 !important;
}


/*
 * Vier voordelen als specificatiestrook.
 */

body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-benefits {
    padding:
        0
        0
        85px !important;

    background:
        #ffffff !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-benefits-grid {
    display:
        grid !important;

    grid-template-columns:
        repeat(4,minmax(0,1fr)) !important;

    gap:
        0 !important;

    border:
        1px solid
        var(--pb-business-line) !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-benefit {
    padding:
        32px
        28px !important;

    background:
        var(--pb-business-soft) !important;

    border:
        0 !important;

    border-radius:
        0 !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-benefit
+ .vokk-detail-benefit {
    border-left:
        1px solid
        var(--pb-business-line) !important;
}


/*
 * Tweede inhoudssplit.
 */

body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-section {
    padding:
        85px
        0 !important;

    background:
        var(--pb-business-soft) !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-section-grid {
    display:
        grid !important;

    grid-template-columns:
        1fr
        1fr !important;

    gap:
        0 !important;

    min-height:
        470px !important;

    border:
        1px solid
        var(--pb-business-line) !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-image {
    min-height:
        470px !important;

    border-radius:
        0 !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-content {
    display:
        flex !important;

    flex-direction:
        column !important;

    justify-content:
        center !important;

    padding:
        55px
        60px !important;

    background:
        #ffffff !important;
}


/*
 * Proces = formele 4-staps procedure.
 */

body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-process {
    padding:
        80px
        0 !important;

    background:
        #ffffff !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-process-head {
    max-width:
        720px !important;

    margin:
        0
        0
        42px !important;

    text-align:
        left !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-process-grid {
    display:
        grid !important;

    grid-template-columns:
        repeat(4,minmax(0,1fr)) !important;

    gap:
        0 !important;

    background:
        var(--pb-business-dark) !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-step {
    padding:
        35px
        30px !important;

    background:
        transparent !important;

    border:
        0 !important;

    border-radius:
        0 !important;

    color:
        #ffffff !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-step h3,
body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-step p {
    color:
        #ffffff !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-step
+ .vokk-detail-step {
    border-left:
        1px solid
        rgba(255,255,255,.14) !important;
}


/*
 * FAQ als documentatie.
 */

body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-faq-section {
    padding:
        85px
        0 !important;

    background:
        var(--pb-business-soft) !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-faq-grid {
    display:
        grid !important;

    grid-template-columns:
        .7fr
        1.3fr !important;

    gap:
        70px !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-faq {
    border-top:
        1px solid
        var(--pb-business-line) !important;
}


body.pb-layout-pack-business
:is(
    .pb-template-page-warmtepompen,
    .pb-template-page-installatie,
    .pb-template-page-sanitair,
    .pb-template-page-zonne-energie
)
.vokk-detail-faq-item {
    padding:
        24px
        0 !important;

    background:
        transparent !important;

    border:
        0 !important;

    border-bottom:
        1px solid
        var(--pb-business-line) !important;

    border-radius:
        0 !important;
}

}