html, body {
    overflow-x: hidden !important;
    max-width: 100% !important;
}

.koju-stage-wrap {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
}

.koju-stage {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 2000 / 800 !important;
    background: #111 !important;
    overflow: hidden !important;
}

@media (max-width: 900px) {
    .koju-stage { aspect-ratio: 16 / 9 !important; }
}

.koju-slides {
    position: absolute !important;
    top: 0 !important; right: 0 !important;
    bottom: 0 !important; left: 0 !important;
}

.koju-slide {
    position: absolute !important;
    top: 0 !important; right: 0 !important;
    bottom: 0 !important; left: 0 !important;
    opacity: 0 !important;
    transition: opacity 0.8s ease !important;
    z-index: 1 !important;
}
.koju-slide.active {
    opacity: 1 !important;
    z-index: 2 !important;
}

.koju-slide img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
}

.koju-arrow {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: rgba(255,255,255,0.15) !important;
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
    border: 1px solid rgba(255,255,255,0.25) !important;
    color: #fff !important;
    width: 48px !important;
    height: 48px !important;
    border-radius: 50% !important;
    cursor: pointer !important;
    z-index: 10 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background 0.2s, border-color 0.2s !important;
    padding: 0 !important;
}
.koju-arrow:hover {
    background: rgba(255,255,255,0.28) !important;
    border-color: rgba(255,255,255,0.5) !important;
}
.koju-arrow svg {
    width: 22px !important;
    height: 22px !important;
    stroke: #fff !important;
    stroke-width: 2.2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
    fill: none !important;
    display: block !important;
}
.koju-prev { left: 20px !important; }
.koju-next { right: 20px !important; }

@media (max-width: 900px) {
    .koju-arrow { display: none !important; }
}

.koju-dots {
    position: absolute !important;
    bottom: 14px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    display: flex !important;
    gap: 8px !important;
    z-index: 10 !important;
}
.koju-dot {
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.35) !important;
    cursor: pointer !important;
    border: none !important;
    padding: 0 !important;
    transition: background 0.3s, transform 0.2s !important;
}
.koju-dot:hover              { transform: scale(1.3) !important; }
.koju-dot.active             { background: #fff !important; transform: scale(1.15) !important; }
.koju-dot.priority           { background: rgba(220,160,0,0.75) !important; }
.koju-dot.priority.active    { background: #f0b400 !important; }

@media (prefers-reduced-motion: reduce) {
    .koju-slide { transition: none !important; }
    .koju-arrow { transition: none !important; }
    .koju-dot   { transition: none !important; }
}