.m30_hero_sub { position: relative; overflow: hidden; }
.m30_inner { position: relative; z-index: 2; width: 100%; padding: 56px 0 64px; } .m30_content { max-width: 746px; } .m30_hero_sub .m30_titel {
font-size: 55px;
line-height: 60px;
font-weight: 600;
white-space: pre-line;
margin: 0 0 22px;
}
.m30_text { font-size: 1.0625rem; margin: 0; max-width: 640px; } .m30_hero_sub--image {
height: 75dvh;
min-height: 795px; display: flex;
align-items: flex-start; background: linear-gradient(180deg, var(--strobl-blue-deep) 0, var(--strobl-blue-deep) 50%, transparent 50%);
} .m30_hero_sub--image:has(+ section.m23_jump_marker_navigation) {
background: linear-gradient(180deg, var(--strobl-blue-deep) 0, var(--strobl-blue-deep) 50%, var(--strobl-blue) 50%, var(--strobl-blue) 100%);
}
.m30_hero_sub--image .m30_card {
position: absolute;
inset: 0;
overflow: hidden;
z-index: 0;
} .m30_hero_sub--image .m30_card {
top: var(--strobl-topline-h, 44px);
border-radius: var(--strobl-radius);
} .m30_hero_sub--image .m30_slides,
.m30_hero_sub--image .m30_slide { position: absolute; inset: 0; }
.m30_hero_sub--image .m30_slide img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: 75% top;
}
@media all and (max-width: 1199px) {
.m30_hero_sub--image .m30_slide img {
object-position: 85% top;
}
}
@media all and (max-width: 991px) {
.m30_hero_sub--image .m30_slide img {
object-position: 85% top;
}
}
.m30_hero_sub--image .m30_slides .slick-list,
.m30_hero_sub--image .m30_slides .slick-track { height: 100%; } .m30_hero_sub--image .m30_overlay {
position: absolute;
inset: 0;
background:
linear-gradient(180deg, rgba(255,255,255,.5) 0%, rgba(255,255,255,0) 45%),
linear-gradient(90deg, rgba(255,255,255,.97) 0%, rgba(255,255,255,.92) 22%, rgba(255,255,255,.72) 55%, rgba(255,255,255,.6) 80%, rgba(255,255,255,.56) 100%);
pointer-events: none;
}
@media all and (max-width: 991px) {
.m30_hero_sub--image .m30_overlay {
background:
linear-gradient(0deg, rgba(255,255,255,.5) 0%, rgba(255,255,255,0) 45%),
linear-gradient(0deg, rgba(255,255,255,.97) 0%, rgba(255,255,255,.92) 22%, rgba(255,255,255,.72) 55%, rgba(255,255,255,.6) 80%, rgba(255,255,255,.56) 100%);
}
} .m30_hero_sub--image .m30_inner { padding: calc(var(--strobl-topline-h, 44px) + 272px) 0 60px; }
.m30_hero_sub .slick-dots {
position: absolute;
left: 0;
bottom: 34px;
display: flex;
gap: 10px;
z-index: 3;
padding: 0;
margin: 0;
list-style: none;
}
.m30_hero_sub .slick-dots li button {
font-size: 0;
width: 12px;
height: 12px;
border-radius: 50%;
border: 0;
background: rgba(18, 38, 91, .3);
cursor: pointer;
padding: 0;
}
.m30_hero_sub .slick-dots li.slick-active button { background: var(--strobl-blue); }
@media all and (max-width: 991px) {  .m30_hero_sub--image { height: auto; min-height: 695px; }
.m30_hero_sub--image .m30_inner { padding: calc(var(--strobl-header-h, 213px) + 28px) 0 48px; padding-top: 400px; }
body[data-title="Leistungen"] .m30_hero_sub--image .m30_inner { padding: calc(var(--strobl-header-h, 213px) + 28px) 0 75px; padding-top: 400px; }
.m30_hero_sub .m30_titel { font-size: 40px; line-height: 46px; }
}
@media all and (max-width: 575px) { .m30_hero_sub--image .m30_inner { padding-top: 350px;padding-left: 20px; padding-right: 20px; }
body[data-title="Leistungen"] .m30_hero_sub--image .m30_inner { padding-top: 350px;padding-left: 20px; padding-right: 20px; padding-bottom: 75px; }
}