/* Reset für die Master-Seite */
body, html {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow: hidden; /* Verhindert Scrollen der Master-Seite selbst */
    background-color: #111;
}

/* Der Container für das native Scrollen/Swipen */
.slider-container {
    display: flex;
    width: 100vw;
    height: 100vh;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; /* Firefox */
}

/* Chrome/Safari Scrollbar ausblenden */
.slider-container::-webkit-scrollbar {
    display: none;
}

/* Iframes als native Scroll-Snap Elemente */
iframe {
    flex: 0 0 100vw;
    width: 100vw;
    height: 100vh;
    border: none;
    scroll-snap-align: start;
    scroll-snap-stop: always; /* Zwingt das Einrasten auf jede einzelne Seite */
    order: 0; /* Wird vom JavaScript dynamisch gesteuert */
}

/* --- Navigations-Buttons (wie zuvor) --- */
.nav-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #fff;
    font-size: 24px;
    cursor: pointer;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    z-index: 10;
    transition: background 0.3s, transform 0.2s;
    display: none; 
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0,0,0,0.5);
}

.nav-btn:hover { background: rgba(255, 255, 255, 0.3); }
.nav-btn:active { transform: translateY(-50%) scale(0.95); }

#btn-prev { left: 20px; }
#btn-next { right: 20px; }

@media (min-width: 800px) {
    .nav-btn { display: flex; }
}