.ka-pss-slider{
    margin:16px 0 28px;
    border-radius:26px;
    background:linear-gradient(180deg,#0b221d 0%,#0f2b24 100%);
    padding:18px;
    box-shadow:0 20px 45px rgba(16,24,23,.12);
}

.ka-pss-viewport{
    position:relative;
    overflow:hidden;
    border-radius:20px;
    background:#07130f;
    aspect-ratio:16 / 10;
}

.ka-pss-track{
    display:flex;
    height:100%;
    transition:transform .35s ease;
    will-change:transform;
}

.ka-pss-slide{
    flex:0 0 100%;
    min-width:100%;
    height:100%;
    box-sizing:border-box;
    position:relative;
    background:#07130f;
}

.ka-pss-image-button{
    display:block;
    width:100%;
    height:100%;
    margin:0;
    padding:0;
    border:0;
    background:transparent;
    cursor:zoom-in;
}

.ka-pss-slide img{
    display:block !important;
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    object-fit:contain !important;
    object-position:center center !important;
}

.ka-pss-button{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:46px;
    height:46px;
    margin:0;
    padding:0;
    border:0;
    border-radius:999px;
    background:rgba(8,18,15,.78);
    color:#fff;
    font-size:24px;
    line-height:1;
    cursor:pointer;
    z-index:4;
}

.ka-pss-button:hover{
    background:rgba(8,18,15,.96);
}

.ka-pss-button.prev{left:12px}
.ka-pss-button.next{right:12px}

.ka-pss-counter{
    position:absolute;
    right:14px;
    bottom:14px;
    z-index:4;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(8,18,15,.76);
    color:#fff;
    font-size:.84rem;
    font-weight:700;
}

.ka-pss-dots{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    justify-content:center;
    padding-top:14px;
}

.ka-pss-dot{
    width:11px;
    height:11px;
    min-width:11px;
    min-height:11px;
    margin:0;
    padding:0;
    border:0;
    border-radius:999px;
    background:rgba(255,255,255,.35);
    cursor:pointer;
}

.ka-pss-dot.is-active{
    background:#d9a15a;
}

/* Wichtig: keine Grid-Verzerrung mehr.
   Die Vorschauen liegen jetzt in einer waagerechten Scrollleiste. */
.ka-pss-thumbs{
    display:flex;
    gap:10px;
    margin-top:14px;
    padding:2px 2px 7px;
    overflow-x:auto;
    overflow-y:hidden;
    scrollbar-width:thin;
    scroll-snap-type:x proximity;
}

.ka-pss-thumb{
    flex:0 0 76px !important;
    width:76px !important;
    height:76px !important;
    min-width:76px !important;
    min-height:76px !important;
    max-width:76px !important;
    max-height:76px !important;
    aspect-ratio:1 / 1;
    box-sizing:border-box;
    margin:0;
    padding:0;
    border:2px solid transparent;
    border-radius:14px;
    overflow:hidden;
    background:#102a22;
    cursor:pointer;
    scroll-snap-align:start;
}

.ka-pss-thumb img{
    display:block !important;
    width:100% !important;
    height:100% !important;
    min-width:0 !important;
    min-height:0 !important;
    max-width:none !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    object-fit:cover !important;
    object-position:center center !important;
}

.ka-pss-thumb.is-active{
    border-color:#d9a15a;
}

.ka-pss-original-grid{
    display:none !important;
}

/* Lightbox */
.ka-pss-lightbox{
    position:fixed;
    inset:0;
    z-index:999999;
    display:none;
    align-items:center;
    justify-content:center;
    padding:54px 76px;
    background:rgba(3,8,7,.94);
}

.ka-pss-lightbox.is-open{
    display:flex;
}

body.ka-pss-lightbox-open{
    overflow:hidden;
}

.ka-pss-lightbox-image{
    display:block !important;
    width:auto !important;
    height:auto !important;
    max-width:calc(100vw - 152px) !important;
    max-height:calc(100vh - 108px) !important;
    object-fit:contain !important;
    border-radius:12px;
    box-shadow:0 20px 70px rgba(0,0,0,.5);
}

.ka-pss-lightbox-close,
.ka-pss-lightbox-prev,
.ka-pss-lightbox-next{
    position:absolute;
    display:grid;
    place-items:center;
    margin:0;
    padding:0;
    border:0;
    border-radius:999px;
    background:rgba(255,255,255,.12);
    color:#fff;
    cursor:pointer;
}

.ka-pss-lightbox-close{
    top:18px;
    right:18px;
    width:46px;
    height:46px;
    font-size:28px;
}

.ka-pss-lightbox-prev,
.ka-pss-lightbox-next{
    top:50%;
    transform:translateY(-50%);
    width:52px;
    height:52px;
    font-size:30px;
}

.ka-pss-lightbox-prev{left:16px}
.ka-pss-lightbox-next{right:16px}

.ka-pss-lightbox-count{
    position:absolute;
    left:50%;
    bottom:18px;
    transform:translateX(-50%);
    padding:6px 11px;
    border-radius:999px;
    background:rgba(255,255,255,.12);
    color:#fff;
    font-size:.84rem;
    font-weight:700;
}

@media(max-width:720px){
    .ka-pss-slider{
        padding:10px;
        border-radius:20px;
    }

    .ka-pss-viewport{
        aspect-ratio:4 / 3;
        border-radius:15px;
    }

    .ka-pss-button{
        width:40px;
        height:40px;
    }

    .ka-pss-thumb{
        flex-basis:62px !important;
        width:62px !important;
        height:62px !important;
        min-width:62px !important;
        min-height:62px !important;
        max-width:62px !important;
        max-height:62px !important;
    }

    .ka-pss-lightbox{
        padding:60px 12px 54px;
    }

    .ka-pss-lightbox-image{
        max-width:calc(100vw - 24px) !important;
        max-height:calc(100vh - 120px) !important;
    }

    .ka-pss-lightbox-prev,
    .ka-pss-lightbox-next{
        width:42px;
        height:42px;
    }
}