/**
 * Seamless Gradient - Sanfte Farbübergänge über die gesamte Seite
 * Datum: 2025-11-08
 */

/* Body - Durchgehender Gradient von oben nach unten */
body {
    background: linear-gradient(
        to bottom,
        #f8f9ff 0%,      /* Sehr helles Blau-Weiß (Hero) */
        #ffffff 15%,     /* Reines Weiß (Services) */
        #fafbff 30%,     /* Leichtes Blau-Weiß (Portfolio) */
        #ffffff 45%,     /* Weiß (About) */
        #f9fafb 60%,     /* Sehr helles Grau (Lead Magnet) */
        #ffffff 75%,     /* Weiß (Testimonials) */
        #f5f7fa 90%,     /* Hellgrau für Footer-Übergang */
        #1f2937 100%     /* Dunkel (Footer) */
    ) !important;
    background-attachment: fixed !important;
    min-height: 100vh;
}

/* Alle Sections transparent machen - Gradient durchscheinen lassen */
.hero-b2b,
.services,
.portfolio,
.about-section,
#seminare,
.lead-magnet,
.testimonials {
    background: transparent !important;
}

/* Section-Overlays entfernen - stören den durchgehenden Gradient */
.hero-b2b::before,
.services::before,
.portfolio::before,
.about-section::before,
.lead-magnet::before,
.testimonials::before {
    display: none !important;
}

/* Sanfte Übergänge zwischen Sections */
.services,
.portfolio,
.about-section,
.lead-magnet,
.testimonials {
    position: relative;
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
}

/* Optionaler Übergangs-Gradient an Section-Grenzen */
.services::after,
.portfolio::after,
.about-section::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100px;
    background: linear-gradient(
        to bottom,
        transparent 0%,
        rgba(255, 255, 255, 0.3) 100%
    );
    pointer-events: none;
    z-index: 0;
}

/* Glassmorphism Cards behalten ihre weiße Optik */
.service-card,
.portfolio-card-white,
.testimonial-card,
.lead-magnet-box,
.about-highlight-card {
    background: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: blur(20px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
}

/* Footer behält seinen dunklen Hintergrund */
.footer {
    background: linear-gradient(135deg, #1f2937 0%, #111827 100%) !important;
    position: relative;
    z-index: 1;
}

/* Sanfter Übergang zum Footer */
.testimonials {
    padding-bottom: 4rem !important;
}

.testimonials::after {
    display: none !important; /* Kein Gradient-Overlay vor Footer */
}

/* Mobile Anpassungen */
@media (max-width: 768px) {
    body {
        background: linear-gradient(
            to bottom,
            #f8f9ff 0%,
            #ffffff 10%,
            #fafbff 25%,
            #ffffff 40%,
            #f9fafb 55%,
            #ffffff 70%,
            #f5f7fa 85%,
            #1f2937 100%
        ) !important;
    }

    .services,
    .portfolio,
    .about-section,
    .lead-magnet,
    .testimonials {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }
}