/**
 * Full-Page Centered Scrolling
 * Date: 2025-11-08
 * Jede Section nimmt volle Viewport-Höhe ein und ist zentriert
 */

/* ================================================================
   HTML & BODY - Smooth Scrolling Setup
   ================================================================ */

html {
    scroll-behavior: smooth;
    /* scroll-snap-type: y proximity; DEAKTIVIERT - verhindert Footer */
}

body {
    overflow-x: hidden; /* Kein horizontales Scrollen */
    overflow-y: auto !important; /* Scrollen erlauben */
}

/* ================================================================
   MAIN CONTAINER - Scroll Snap Container
   ================================================================ */

main#main-content {
    /* scroll-snap-type: y proximity; DEAKTIVIERT */
}

/* ================================================================
   ALLE SECTIONS - Full Viewport Height & Zentriert
   ================================================================ */

.scroll-section {
    min-height: auto !important; /* GEÄNDERT von 100vh zu auto */
    display: flex !important;
    align-items: center !important; /* Vertikal zentriert */
    justify-content: center !important; /* Horizontal zentriert */
    /* scroll-snap-align: start; DEAKTIVIERT */
    /* scroll-snap-stop: normal; DEAKTIVIERT */
    position: relative;
    width: 100%;

    /* Padding wird nach innen verlegt, nicht nach außen */
    box-sizing: border-box;
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
}

/* Container innerhalb der Sections */
.scroll-section > .container {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 2rem;

    /* Zentrierter Content */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

/* ================================================================
   HERO SECTION - Bereits zentriert, behält seine Höhe
   ================================================================ */

.hero-b2b {
    min-height: 100vh !important; /* Hero bleibt Fullscreen */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ================================================================
   SERVICES SECTION - SPEZIELLES LAYOUT (kein Flex!)
   ================================================================ */

.services.scroll-section {
    /* WICHTIG: Services Section braucht BLOCK Layout, kein Flex! */
    display: block !important; /* Override das Flex von .scroll-section */
    min-height: auto !important; /* Auto height für Carousel */
    padding: 0 !important;
    align-items: initial !important;
    justify-content: initial !important;
}

.services.scroll-section > .container {
    display: block !important; /* Auch Container auf Block */
    justify-content: initial !important;
    align-items: initial !important;
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ================================================================
   PORTFOLIO SECTION - Zentrierte Grid-Cards
   ================================================================ */

.portfolio.scroll-section {
    min-height: auto !important; /* Auto statt 100vh */
}

.portfolio.scroll-section > .container {
    justify-content: center;
}

.portfolio-grid {
    width: 100%;
    max-width: 1400px;
}

/* ================================================================
   LEAD MAGNET - Perfekt zentriert
   ================================================================ */

.lead-magnet.scroll-section {
    min-height: auto !important; /* Auto statt 100vh */
}

.lead-magnet-box {
    max-width: 1200px;
    margin: 0 auto;
}

/* ================================================================
   TESTIMONIALS - Auto Height, NICHT Fullscreen
   ================================================================ */

.testimonials.scroll-section {
    min-height: auto !important; /* NICHT 100vh - Section soll kompakt sein */
    display: block !important; /* Block statt Flex */
    align-items: initial !important;
    justify-content: initial !important;
}

.testimonials.scroll-section > .container {
    display: block !important; /* Auch Container auf Block */
    justify-content: initial !important;
    align-items: initial !important;
}

/* ================================================================
   SEMINARE & ABOUT CTA - Zentriert
   ================================================================ */

.about#seminare.scroll-section,
.services#ueber-uns.scroll-section {
    min-height: auto !important; /* Auto statt 100vh */
}

/* ================================================================
   RESPONSIVE - Mobile Anpassungen
   ================================================================ */

@media (max-width: 1024px) {
    /* Tablet: Sections können kleiner sein */
    .scroll-section {
        min-height: auto !important;
        padding: 3rem 0 !important;
    }

    /* Aber zentriert bleiben */
    .scroll-section > .container {
        padding: 1.5rem;
    }
}

@media (max-width: 768px) {
    /* Mobile: Auto-Height, aber zentriert */
    .scroll-section {
        min-height: auto !important;
        padding: 2rem 0 !important;
        scroll-snap-align: none; /* Kein Snap auf Mobile */
    }

    .scroll-section > .container {
        padding: 1rem;
    }

    /* Hero bleibt Fullscreen auch auf Mobile */
    .hero-b2b {
        min-height: 100vh !important;
    }
}

/* ================================================================
   SMOOTH SCROLL BEHAVIOR
   ================================================================ */

/* Bei Anchor-Links sanft scrollen */
@media (prefers-reduced-motion: no-preference) {
    html {
        scroll-behavior: smooth;
    }
}

/* Für Nutzer die reduced motion bevorzugen */
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .scroll-section {
        scroll-snap-align: none;
    }
}

/* ================================================================
   NAVIGATION SPACING FIX
   ================================================================ */

/* Header-Höhe berücksichtigen für erste Section */
.scroll-section:first-of-type {
    padding-top: 0 !important;
}

/* ================================================================
   CONTENT CENTERING - Verfeinert
   ================================================================ */

/* Section Header zentriert */
.scroll-section .section-header {
    text-align: center;
    width: 100%;
}

/* Grid-basierte Sections behalten ihr Layout */
.portfolio-grid,
.testimonials-grid,
.services-carousel-wrapper {
    width: 100%;
}

/* ================================================================
   OVERFLOW FIXES
   ================================================================ */

/* Verhindere horizontales Scrollen durch Carousel */
.services-carousel-wrapper {
    overflow-x: hidden;
}

/* Container dürfen nicht überlaufen */
.scroll-section > .container {
    overflow: visible;
}

/* ================================================================
   FOOTER - Sichtbar und scrollbar
   ================================================================ */

.footer {
    min-height: auto !important;
    position: relative !important;
    z-index: 10 !important;
    display: block !important;
}