.flex-layout.oplossing_hero_detail-layout {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
	padding: 0;
	   padding-top: clamp(
        75px,
        75px + (150 - 75) * ((100vw - 350px) / (1130 - 350)),
        150px
    );
	padding-bottom:  clamp(
        45px,
        45px + (100 - 45) * ((100vw - 350px) / (1130 - 350)),
        100px
    );
    color: var(--pk-white);
    background: var(--pk-primary-blue);
    overflow: hidden;
}


.oplossing_hero_detail-layout .pk-breadcrumb {
	padding-inline: 20px;
    margin-bottom: clamp(
        30px,
        30px + (70 - 30) * ((100vw - 350px) / (1130 - 350)),
        70px
    );
}

.oplossing_hero_detail-layout .pk-breadcrumb a {
    display: flex;
    align-items: center;
    font-size: 13px;
    color: var(--pk-white);
    text-decoration: none;
    transition: opacity 0.5s ease-in-out;
}

.oplossing_hero_detail-layout .pk-breadcrumb a::before {
    content: "\e5c4";
    font-family: "Material Symbols outlined";
    font-size: 18px;
    transition: transform 0.3s ease-in-out;
}

.oplossing_hero_detail-layout .pk-breadcrumb a:hover {
    opacity: 0.7;
}

.oplossing_hero_detail-layout .blok-hero-image{
	max-width: 125px;
	margin-bottom: 25px;
}

.oplossing_hero_detail-layout h1.pk-heading {
    color: var(--pk-white);
    margin-bottom: 30px;
}

.oplossing_hero_detail-layout .pk-row .pk-row-content {
    position: relative;
}


.oplossing_hero_detail-layout .pk-heading {
    line-height: 0.9;
}

.oplossing_hero_detail-layout .pk-button-hero {
    margin-top: 40px;
}


.oplossing_hero_detail-layout .pk-text p:first-child{
	font-size: 1rem;
	font-weight: 400;
	line-height:26px;

}
.oplossing_hero_detail-layout .pk-text p:first-child{
	font-size: 1.625rem;
	font-weight: 500;
	line-height: 34px;
	margin-bottom: 25px;
}

/*Hero Shapes */
.oplossing_hero_detail-layout .hero-shape {
    position: absolute;
    height: 48px;
    background: var(--pk-blue-4);
    z-index: 5;
}

.oplossing_hero_detail-layout .hero-shape-1 {
    width: 130px;
    top: calc(35% - 25px);
    right: 25px;
    background: var(--pk-blue-4);
}

.oplossing_hero_detail-layout .hero-shape-2 {
    width: 95px;
    top: 32%;
    left: 0;
 background: var(--pk-blue-2);
}

.oplossing_hero_detail-layout .hero-shape-3 {
    width: 130px;
	bottom: calc(20% - 25px);
    right: calc(20% - 25px);
}

.oplossing_hero_detail-layout .hero-shape-4 {
    width: 186px;
 	bottom: calc(40% - 25px);
    right: 0;
    margin: 0 auto;
    background: var(--pk-blue-2);
}


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

    .oplossing_hero_detail-layout .pk-hero-content {
        padding: 0 20px;
        margin-top: 20px;
    }

    .oplossing_hero_detail-layout .pk-button-hero {
        margin-top: 20px;
    }

    .oplossing_hero_detail-layout .hero-shape-1,
    .oplossing_hero_detail-layout .hero-shape-2,
    .oplossing_hero_detail-layout .hero-shape-3,
    .oplossing_hero_detail-layout .hero-shape-4 {
        display: none;
    }
}
