.h-pr-a {
position:relative;
z-index:1;
width:100%;
overflow:hidden;
padding-top:7vw;
padding-bottom:15vw;
}

.h-pr-b {
width:100%;
margin:0 0 80px;
text-align:center;
}

.h-pr-c {
--bildbreite:clamp(320px,44.270833vw,850px);
--position-eins:clamp(231px,32.096354vw,616.25px);
--position-zwei:clamp(335px,46.484375vw,892.5px);
position:relative;
width:100%;
height:clamp(300px,33.854167vw,650px);
overflow:hidden;
touch-action:pan-y;
cursor:grab;
z-index:1;
}

@media (min-width:1921px) {

.h-pr-c {
--bildbreite:44.270833vw;
--position-eins:32.096354vw;
--position-zwei:46.484375vw;
height:33.854167vw;
}

}

@media (min-width:2561px) {

.h-pr-c {
--bildbreite:1113.04px;
--position-eins:806.96px;
--position-zwei:1168.70px;
height:851.15px;
}

.h-pr-b {
margin-bottom:80px;
}

.h-pr-a {
padding-top:179px;
padding-bottom:384px;
}

}


.h-pr-c.zieht {
cursor:grabbing;
}

.h-pr-g {
position:relative;
width:100%;
height:100%;
}

.h-pr-d {
position:absolute;
top:50%;
left:50%;
z-index:0;
width:var(--bildbreite);
opacity:0;
pointer-events:none;
transform:translate(-50%,-50%) translateX(0) scale(0.2);
transform-origin:center;
transition:transform 0.7s cubic-bezier(.22,.61,.36,1),opacity 0.5s ease;
will-change:transform,opacity;
}

.h-pr-d img {
display:block;
width:100%;
height:auto;
pointer-events:none;
user-select:none;
-webkit-user-drag:none;
}

.h-pr-d.h-pr-aktiv {
z-index:5;
opacity:1;
pointer-events:auto;
transform:translate(-50%,-50%) translateX(0) scale(1);
}

.h-pr-d.h-pr-links-eins {
z-index:4;
opacity:1;
pointer-events:auto;
transform:translate(-50%,-50%) translateX(calc(var(--position-eins) * -1)) scale(0.45);
}

.h-pr-d.h-pr-rechts-eins {
z-index:4;
opacity:1;
pointer-events:auto;
transform:translate(-50%,-50%) translateX(var(--position-eins)) scale(0.45);
}

.h-pr-d.h-pr-links-zwei {
z-index:3;
opacity:1;
pointer-events:auto;
transform:translate(-50%,-50%) translateX(calc(var(--position-zwei) * -1)) scale(0.2);
}

.h-pr-d.h-pr-rechts-zwei {
z-index:3;
opacity:1;
pointer-events:auto;
transform:translate(-50%,-50%) translateX(var(--position-zwei)) scale(0.2);
}

.h-pr-e {
position:absolute;
top:50%;
z-index:20;
width:50px;
height:50px;
display:flex;
justify-content:center;
align-items:center;
padding:0;
border:0;
border-radius:50%;
font-family:'Outfit',sans-serif;
font-size:24px;
line-height:1;
color:#01070f;
background:rgba(1,7,15,0.15);
-webkit-backdrop-filter:blur(5px);
backdrop-filter:blur(5px);
cursor:pointer;
transform:translateY(-50%);
transition:background 0.2s ease,transform 0.2s ease;
}

.h-pr-f {
position:absolute;
bottom:0;
left:50%;
z-index:30;
display:flex;
gap:8px;
transform:translateX(-50%);
}

.h-pr-punkt {
width:8px;
height:8px;
padding:0;
border:0;
border-radius:50%;
background:#01070f;
opacity:0.25;
cursor:pointer;
}

.h-pr-punkt.aktiv {
opacity:1;
}

.h-pr-d.ohne-animation {
transition:none;
}

@media (min-width:360px) and (max-width:834px) {
.h-pr-c {
--bildbreite:100vw;
--position-eins:65vw;
height:58vw;
}
.h-pr-d.h-pr-aktiv {
transform:translate(-50%,-50%) translateX(0) scale(0.78);
}
.h-pr-d.h-pr-links-eins {
opacity:1;
visibility:visible;
pointer-events:auto;
transform:translate(-50%,-50%) translateX(calc(var(--position-eins) * -1)) scale(0.38);
}
.h-pr-d.h-pr-rechts-eins {
opacity:1;
visibility:visible;
pointer-events:auto;
transform:translate(-50%,-50%) translateX(var(--position-eins)) scale(0.38);
}
.h-pr-d.h-pr-links-zwei,
.h-pr-d.h-pr-rechts-zwei {
opacity:0;
visibility:hidden;
pointer-events:none;
}
}

@media (max-width:600px) {
.h-pr-a{
padding-bottom:25vw;
}
.h-b-c{
width:calc((100% - 20px) / 2);
max-width:none;
flex:0 0 calc((100% - 20px) / 2);
}
}