.elementor-329 .elementor-element.elementor-element-c8aa9b2{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-329 .elementor-element.elementor-element-c6b2499{width:100%;max-width:100%;}.elementor-329 .elementor-element.elementor-element-c6b2499.elementor-element{--align-self:center;}/* Start custom CSS for html, class: .elementor-element-c6b2499 *//* ========================================
       FIRMENFEIERN-WEBSITE V5 - KOMPLETTES CSS
       Farben: Burgund-Spektrum
       Schriften: Inter + Inter Italic
       Autor: ML 
       ======================================== */
    
    /* ========================================
       1. CSS VARIABLES (BURGUND-SPEKTRUM)
       ======================================== */
    :root {
        /* Burgund (Firma) */
        --burgund-primary: #8B1A3D;
        --burgund-light: #A73355;
        --burgund-dark: #5E1028;
        --burgund-complement: #1F3B4D;
        
        /* Mittel-BAR Brand */
        --brand-gold: #B08D2D;
        
        /* Neutrale Farben */
        --white: #FFFFFF;
        --cream: #FFF8F0;
        --gray: #666666;
        --gray-dark: #333333;
        --black: #000000;
        
        /* Spacing */
        --spacing-sm: 1rem;
        --spacing-md: 1.5rem;
        --spacing-lg: 2rem;
        --spacing-xl: 3rem;
        --spacing-2xl: 4rem;
        
        /* Border Radius */
        --radius-sm: 8px;
        --radius-lg: 12px;
        --radius-xl: 16px;
        --radius-2xl: 24px;
        
        /* Transitions */
        --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }
    
    /* ========================================
       1A. LOKALE SCHRIFTEN
    ======================================== */
    
    @font-face {
        font-family: 'Source Sans 3';
        src: url('/wp-content/uploads/fonts/subset-SourceSans3-Roman.woff2') format('woff2');
        font-weight: 400;
        font-style: normal;
        font-display: swap;
    }
    
    @font-face {
        font-family: 'Source Sans 3';
        src: url('/wp-content/uploads/fonts/subset-SourceSans3-Italic.woff2') format('woff2');
        font-weight: 400;
        font-style: italic;
        font-display: swap;
    }
    
    /* inter-100 - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: normal;
      font-weight: 100;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-100.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-100italic - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: italic;
      font-weight: 100;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-100italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-200 - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: normal;
      font-weight: 200;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-200italic - latin_latin-ext */
    @font-face {
      font-displaly: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: italic;
      font-weight: 200;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-200italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-300 - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: normal;
      font-weight: 300;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-300italic - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: italic;
      font-weight: 300;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-regular - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: normal;
      font-weight: 400;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-italic - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: italic;
      font-weight: 400;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-500 - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: normal;
      font-weight: 500;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-500italic - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: italic;
      font-weight: 500;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-600 - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: normal;
      font-weight: 600;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-600italic - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: italic;
      font-weight: 600;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-600italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-700 - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: normal;
      font-weight: 700;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-700italic - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: italic;
      font-weight: 700;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-800 - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: normal;
      font-weight: 800;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-800italic - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: italic;
      font-weight: 800;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-800italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-900 - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: normal;
      font-weight: 900;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    /* inter-900italic - latin_latin-ext */
    @font-face {
      font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
      font-family: 'Inter';
      font-style: italic;
      font-weight: 900;
      src: url('/wp-content/uploads/fonts/inter-v20-latin_latin-ext-900italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    }
    
    @font-face {
        font-family: 'Playfair Display';
        src: url('/wp-content/uploads/fonts/PlayfairDisplay-Regular.woff2') format('woff2');
        font-weight: 400;
        font-style: normal;
        font-display: swap;
    }
    
    @font-face {
        font-family: 'Playfair Display';
        src: url('/wp-content/uploads/fonts/PlayfairDisplay-Italic.woff2') format('woff2');
        font-weight: 400;
        font-style: italic;
        font-display: swap;
    }
    
    
    
    
    /* ========================================
       2. SMOOTH SCROLLING (Premium-Feeling)
       ======================================== */
    html {
        scroll-behavior: smooth !important;
    }
    
    /* ========================================
       3. SCHRIFTEN (INTER + INTER ITALIC)
       ======================================== */
    
    .mb-section,
    .mb-hero-firmenfeiern,
    .mb-container,
    .mb-problem,
    .mb-warum,
    .mb-ablauf,
    .mb-anlaesse,
    .mb-social-proof,
    .mb-lead-magnet,
    .mb-faq,
    .mb-final-cta {
        font-family: 'Source Sans 3', sans-serif !important;
        color: var(--gray-dark) !important;
        line-height: 1.6 !important;
    }
    
    /* ========================================
       4. GLOBALE STYLES
       ======================================== */
    .mb-section {
        padding: var(--spacing-2xl) 0 !important;
    }
    
    .mb-container {
        max-width: 1200px !important;
        margin: 0 auto !important;
        padding: 0 var(--spacing-lg) !important;
    }
    
    .mb-section-title {
        font-family: 'Inter', sans-serif !important;
        font-size: clamp(2rem, 5vw, 3rem) !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        color: var(--gray-dark) !important;
        margin-bottom: var(--spacing-lg) !important;
        text-align: center !important;
    }
    
    .mb-section-intro {
        font-family: 'Inter', sans-serif !important;
        font-size: 1.125rem !important;
        line-height: 1.7 !important;
        color: var(--gray) !important;
        margin-bottom: var(--spacing-xl) !important;
        text-align: center !important;
        max-width: 800px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    
    /* ========================================
       5. BUTTONS (KONTRASTREICHE FARBEN!)
       ======================================== */
    .mb-btn {
        display: inline-flex !important;
        flex-direction: column !important;
        align-items: center !important;
        padding: 1rem 2rem !important;
        font-family: 'Inter', sans-serif !important;
        font-size: 1rem !important;
        font-weight: 600 !important;
        text-align: center !important;
        border-radius: var(--radius-lg) !important;
        transition: var(--transition) !important;
        border: 2px solid transparent !important;
        cursor: pointer !important;
        text-decoration: none !important;
    }
    
    .mb-btn--primary {
        background: var(--burgund-primary) !important;
        color: var(--white) !important;
        border-color: var(--burgund-primary) !important;
        box-shadow: 0 4px 12px rgba(139, 26, 61, 0.3) !important;
    }
    
    .mb-btn--primary:hover {
        transform: translateY(-2px) scale(1.02) !important;
        box-shadow: 0 12px 24px rgba(139, 26, 61, 0.4) !important;
        background: var(--burgund-dark) !important;
        color: var(--white) !important;
    }
    
    .mb-btn--outline {
        background: var(--white) !important;
        color: var(--burgund-primary) !important;
        border-color: var(--burgund-primary) !important;
        box-shadow: 0 4px 12px rgba(139, 26, 61, 0.2) !important;
    }
    
    .mb-btn--outline:hover {
        background: var(--burgund-primary) !important;
        color: var(--white) !important;
        transform: translateY(-2px) !important;
        box-shadow: 0 8px 16px rgba(139, 26, 61, 0.3) !important;
    }
    
    .mb-btn--text {
        background: transparent !important;
        color: var(--burgund-primary) !important;
        border-color: transparent !important;
        box-shadow: none !important;
        text-decoration: underline !important;
    }
    
    .mb-btn--text:hover {
        color: var(--burgund-dark) !important;
        transform: none !important;
    }
    
    .mb-btn--large {
        padding: 1.25rem 2.5rem !important;
        font-size: 1.125rem !important;
    }
    
    .mb-btn-subtitle {
        font-size: 0.75rem !important;
        font-weight: 400 !important;
        margin-top: 0.25rem !important;
        opacity: 0.9 !important;
    }
    
    .mb-cta-center {
        text-align: center !important;
        margin-top: var(--spacing-xl) !important;
    }
    
    /* ========================================
       6. SEKTION 1: HERO (bereits in hero-v5.css)
       ======================================== */
    /* ========================================
       HERO-SEKTION: FIRMENFEIERN (V5) by ML
       Farben: Burgund-Spektrum
       Schriften: Inter + Inter Italic
       Transparenz: Hintergrund sichtbar
       Buttons: Kontrastreiche Farben
       ======================================== */
    
    /* ========================================
       1. CSS VARIABLES (BURGUND-SPEKTRUM)
       ======================================== */
    :root {
        /* Burgund (Firma) */
        --burgund-primary: #8B1A3D;
        --burgund-light: #A73355;
        --burgund-dark: #5E1028;
        --burgund-complement: #1F3B4D;
        
        /* Mittel-BAR Brand */
        --brand-gold: #B08D2D;
        
        /* Neutrale Farben */
        --white: #FFFFFF;
        --cream: #FFF8F0;
        --gray: #666666;
        --gray-dark: #333333;
        --black: #000000;
        
        /* Spacing */
        --spacing-sm: 1rem;
        --spacing-md: 1.5rem;
        --spacing-lg: 2rem;
        --spacing-xl: 3rem;
        --spacing-2xl: 4rem;
        
        /* Border Radius */
        --radius-lg: 12px;
        --radius-xl: 16px;
        --radius-2xl: 24px;
        
        /* Transitions */
        --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }
    
    /* ========================================
       2. SMOOTH SCROLLING (Premium-Feeling)
       ======================================== */
    html {
        scroll-behavior: smooth !important;
    }
    
    /* ========================================
       3. SCHRIFTEN (INTER + INTER ITALIC)
       ======================================== */
    
    
    body {
        font-family: 'PlayfairDisplay-Italic', sans-serif;
    }
    
    /* ========================================
       4. HINTERGRUND-BILD + GRADIENT-OVERLAY
       ======================================== */
    /* Hintergrund-Bild (Firmenevent) mit Gradient-Overlay */
    .mb-hero-firmenfeiern::after {
        content: '' !important;
        position: absolute !important;
        inset: 0;
        
        /* Hintergrund-Bild */
        background-image: url('https://eventlocation-erzgebirge.de/wp-content/uploads/2026/02/galaveranstaltung_mittel-bar.png') !important; 
        background-size: cover !important;
        background-position: center !important;
        background-repeat: no-repeat !important;
        
        /* Gradient-Overlay: 100% Weiß (oben) → 80% Burgund (unten) */
        background-image: 
            linear-gradient(180deg, 
                rgba(255, 255, 255, 1) 0%,      /* 100% Weiß oben */
                rgba(255, 255, 255, 0.78) 40%,  /* Fast weiß */
                rgba(167, 51, 85, 0.85) 60%,    /* Burgund-Hell mit Transparenz */
                rgba(139, 26, 61, 0.8) 100%     /* 80% Burgund unten */
            ) ,
            url('https://eventlocation-erzgebirge.de/wp-content/uploads/2026/02/galaveranstaltung_mittel-bar.jpg') !important;
        
        pointer-events: none;
        z-index: 0;
    }
    
    /* ========================================
       5. NOISE SVG (Data-URL)
       ======================================== */
    /* Grainy Texture für organischen Look */
    .mb-hero-firmenfeiern::before {
        content: '';
        position: absolute;
        inset: 0;
        background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMDAiIGhlaWdodD0iMzAwIj48ZmlsdGVyIGlkPSJhIiB4PSIwIiB5PSIwIj48ZmVUdXJidWxlbmNlIHR5cGU9ImZyYWN0YWxOb2lzZSIgYmFzZUZyZXF1ZW5jeT0iMC40IiBudW1PY3RhdmVzPSIzIiBzZWVkPSI4Ii8+PGZlQ29sb3JNYXRyaXggdHlwZT0ibWF0cml4IiB2YWx1ZXM9IjEgMCAwIDAgMCAgMCAxIDAgMCAwICAwIDAgMSAwIDAgIDAgMCAwIDAuMDggMCIvPjwvZmlsdGVyPjxwYXRoIGQ9Ik0wIDBoMzAwdjMwMEgweiIgZmlsdGVyPSJ1cmwoI2EpIiBvcGFjaXR5PSIwLjA1Ii8+PC9zdmc+');
        opacity: 0.9;
        mix-blend-mode: overlay;
        pointer-events: none;
        z-index: 1; /* Über Hintergrund-Bild, aber unter Content */
    }
    
    /* ========================================
       6. HERO-SEKTION
       ======================================== */
    .mb-hero-firmenfeiern {
        position: relative !important;
        min-height: 100vh !important;
        display: flex !important;
        align-items: center !important;
        padding: var(--spacing-2xl) 0 !important;
        overflow: hidden !important;
        
        /* MESH GRADIENT (zusätzlich über Hintergrund-Bild) */
        background: 
            radial-gradient(at 20% 30%, rgba(255, 248, 240, 0.6) 0px, transparent 50%),
            radial-gradient(at 80% 70%, rgba(167, 51, 85, 0.3) 0px, transparent 90%),
            radial-gradient(at 50% 50%, rgba(139, 26, 61, 0.2) 0px, transparent 50%),
            rgba(255, 255, 255, 0.9); /* Leicht transparent, damit Hintergrund-Bild durchscheint */
    }
    
    .mb-hero-container {
        max-width: 1400px !important;
        margin: 0 auto !important;
        padding: 0 var(--spacing-lg) !important;
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: var(--spacing-2xl) !important;
        align-items: stretch !important; /* statt center */
        grid-auto-rows: 1fr !important; /* beide Spalten gleich hoch */
        position: relative;
        z-index: 2;
        
    }
    
    .mb-hero-images {
        min-height: 420px; /* verhindert Mini-Bilder auf Tablet */
        
    }
    @media (max-width: 1024px) {
        .mb-hero-container {
            grid-template-columns: 1fr 1fr; /* weiterhin 50/50 */
            align-items: stretch !important;
        }
    
        .mb-hero-images {
            min-height: 380px !important;
        }
    }
    
    
    /* ========================================
       7. TRANSPARENTE TEXTBOX (Links)
       ======================================== */
.mb-hero-content {
    background: rgba(255, 248, 240, 0.2) !important;
    backdrop-filter: blur(8px) saturate(120%) !important;
    -webkit-backdrop-filter: blur(8px) saturate(140%) !important;
    border: 1px solid rgba(139, 26, 61, 0.25) !important;
    border-radius: var(--radius-2xl) !important;
    box-shadow: 
        0 8px 32px rgba(0, 0, 0, 0.8),
        inset 0 1px 0 rgba(255, 255, 255, 0.6) !important;
    padding: var(--spacing-2xl) !important;
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 0.8s ease-out 0.2s forwards;
    /* NEU: verhindert dass Carousel die Box nach rechts aufbläht */
    overflow: hidden;
    min-width: 0;
}
    
    /* ========================================
       8. OVERSIZED TYPOGRAPHY (Titel)
       ======================================== */
    .mb-hero-title {
        font-family: 'Inter', sans-serif !important;
        font-size: clamp(2.4rem, 5vw, 3.8rem) !important; /* 40px - 64px */
        font-weight: 800 !important;
        line-height: 1.1 !important;
        color: var(--gray-dark) !important;
        margin-bottom: var(--spacing-md) !important;
    }
    
    .mb-hero-title-accent {
        font-style: italic !important;
        font-weight: 700 !important;
        color: var(--burgund-primary) !important;
        display: block !important; /* Eigene Zeile */
    }
    
    /* ========================================
       9. BESCHREIBUNG
       ======================================== */
    .mb-hero-description {
        font-family: 'Inter', sans-serif !important;
        font-size: 1.125rem !important;
        line-height: 1.7 !important;
        color: var(--gray-dark) !important;
        margin-bottom: var(--spacing-xl) !important;
    }
    
    /* ========================================
       10. BUTTONS (KONTRASTREICHE FARBEN!)
       ======================================== */
    .mb-hero-ctas {
        display: flex !important;
        gap: var(--spacing-md) !important;
        margin-bottom: var(--spacing-md) !important;
        flex-wrap: wrap !important;
    }
    
    .mb-btn {
        display: inline-flex !important;
        flex-direction: column !important;
        align-items: center !important;
        padding: 1rem 2rem !important;
        font-size: 1rem !important;
        font-weight: 700 !important;
        text-align: center !important;
        border-radius: var(--radius-lg) !important;
        transition: var(--transition) !important;
        border: 2px solid transparent !important;
        cursor: pointer !important;
        text-decoration: none !important;
    }
    
    .mb-btn--primary {
        background: var(--burgund-primary) !important;
        color: var(--white) !important;
        border-color: var(--burgund-primary) !important;
        box-shadow: 0 4px 12px rgba(139, 26, 61, 0.3) !important;
    }
    
    .mb-btn--primary:hover {
        transform: translateY(-2px) scale(1.02) !important;
        box-shadow: 0 12px 24px rgba(139, 26, 61, 0.4) !important;
        background: var(--burgund-dark) !important;
        color: var(--white) !important;
    }
    
    .mb-btn-subtitle {
        font-size: 0.75rem !important;
        font-weight: 400 !important;
        margin-top: 0.25rem !important;
        opacity: 0.6 !important;
    }
    
    .mb-btn--outline {
        background: var(--white) !important;
        color: var(--burgund-primary) !important;
        border-color: var(--burgund-primary) !important;
        box-shadow: 0 4px 12px rgba(139, 26, 61, 0.2) !important;
    }
    
    .mb-btn--outline:hover {
        background: var(--burgund-primary) !important;
        color: var(--white) !important;
        transform: translateY(-2px) !important;
        box-shadow: 0 8px 16px rgba(139, 26, 61, 0.3) !important;
    }
    
    /* ========================================
       11. MINI-SATZ FÜR GF/HR
       ======================================== */
    .mb-hero-gf-note {
        font-family: 'Inter', sans-serif !important;
        font-size: 0.975rem !important;
        font-style: italic !important;
        line-height: 1.6 !important;
        color: var(--bl) !important;
        margin-bottom: var(--spacing-lg) !important;
        padding-left: var(--spacing-md) !important;
        border-left: 3px solid var(--brand-gold) !important;
    }
    
    /* ========================================
       12. PROOF-LEISTE (ZAHLEN-KACHELN)
       ======================================== */
    .mb-hero-proof {
        display: grid !important;
        grid-template-columns: repeat(5, 1fr) !important;
        gap: var(--spacing-sm) !important;
        padding: var(--spacing-md) !important;
        background: rgba(255, 255, 255, 0.7) !important;
        backdrop-filter: blur(12px) !important;
        border-radius: var(--radius-lg) !important;
        border: 1px solid rgba(139, 26, 61, 0.15) !important;
    }
    
    .mb-hero-proof__item {
        text-align: center !important;
    }
    
    .mb-hero-proof__number {
        font-family: 'Inter', sans-serif !important;
        font-size: 1.5rem !important;
        font-weight: 700 !important;
        color: var(--burgund-primary) !important;
        margin-bottom: 0.25rem !important;
    }
    
    .mb-hero-proof__label {
        font-family: 'Inter', sans-serif !important;
        font-size: 0.75rem !important;
        font-weight: 500 !important;
        color: var(--gray) !important;
        line-height: 1.2 !important;
    }
    
    /* ========================================
       13. BENTO GRID (Rechts)
       ======================================== */
    .mb-hero-images {
        display: grid !important;
        grid-template-columns: 2fr 1fr !important;
      /*  grid-template-rows: 1fr 1fr 0.6fr*/ ;
        gap: 1rem !important;
        position: relative !important;
        
        /* Animation */
        opacity: 0;
        transform: translateY(30px);
        animation: fadeInUp 0.8s ease-out 0.4s forwards;
        
    }
    
    .mb-hero-image {
        position: relative !important;
        overflow: hidden !important;
        border-radius: var(--radius-xl) !important;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
        transition: var(--transition) !important;
    }
    
    .mb-hero-image:hover {
        transform: translateY(-4px) scale(1.02) !important;
        box-shadow: 0 12px 32px rgba(0, 0, 0, 0.16) !important;
    }
    
    .mb-hero-image img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        display: block !important;
    }
    
    .mb-hero-image--large {
        grid-row: 1 / 3 !important;
    }
    
    .mb-hero-image--wide {
        grid-column: 1 / 3 !important;
    }
    
    /* ========================================
       14. LOCATION-BADGE
       ======================================== */
    .mb-hero-location {
        position: absolute !important;
        bottom: 1.5rem !important;
        left: 1.5rem !important;
        display: flex !important;
        align-items: center !important;
        gap: 0.75rem !important;
        padding: 0.75rem 1.25rem !important;
        background: rgba(255, 255, 255, 0.95) !important;
        backdrop-filter: blur(12px) !important;
        border-radius: var(--radius-lg) !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5) !important;
    }
    
    .mb-hero-location__icon {
        color: var(--burgund-primary) !important;
        display: flex !important;
        align-items: center !important;
    }
    
    .mb-hero-location__title {
        font-family: 'Inter', sans-serif !important;
        font-size: 0.875rem !important;
        font-weight: 600 !important;
        color: var(--gray-dark) !important;
        margin-bottom: 0.125rem !important;
    }
    
    .mb-hero-location__subtitle {
        font-family: 'Inter', sans-serif !important;
        font-size: 0.75rem !important;
        color: var(--gray) !important;
    }
    
    /* ========================================
       15. ANIMATIONS
       ======================================== */
    @keyframes fadeInUp {
        from {
            opacity: 0;
            transform: translateY(30px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
    
    /* ========================================
       16. RESPONSIVE (TABLET: 3 SPALTEN, MOBIL: 1 SPALTE)
       ======================================== */
    @media (max-width: 1024px) {
    
        /* Fix 1 */
        .mb-hero-firmenfeiern {
            min-height: auto !important;
        }
    
        /* Fix 2 */
        .mb-hero-container {
            display: block !important;
            grid-template-columns: 1fr !important;
            align-items: start !important;
            gap: var(--spacing-xl) !important;
        }
    
        /* Fix 3 */
        .mb-hero-content {
            height: auto !important;
            min-height: auto !important;
        }
    
        .mb-hero-proof {
            grid-template-columns: repeat(3, 1fr) !important;
        }
    }
    
    @media (max-width: 768px) {
    
        /* Hero: nur vertikal groß, horizontal minimal */
        .mb-hero-firmenfeiern {
            min-height: auto !important;
            padding: var(--spacing-xl) 0 !important;
            overflow-x: hidden !important;
        }
    
        .mb-hero-container {
            padding: 10px 10px !important; /* genau der gewünschte Abstand */
            overflow-x: hidden !important;
        }
    
        
        .mb-hero-content {
            padding: 5px 15px!important;
            width: 100% !important;
            max-width: 100% !important;
        }
    
        .mb-hero-title {
            font-size: clamp(2.8rem, 8vw, 3rem) !important;
        }
    
        .mb-hero-ctas {
            flex-direction: column !important;
        }
    
        .mb-btn {
            width: 100% !important;
        }
    
        .mb-hero-proof {
            grid-template-columns: repeat(2, 1fr) !important;
            gap: 0.75rem !important;
        }
    
        /* Bento-Grid */
        .mb-hero-images {
            grid-template-columns: 1fr !important;
            grid-template-rows: auto !important;
            width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }
    
        .mb-hero-image--large,
        .mb-hero-image--wide {
            grid-column: 1 !important;
            grid-row: auto !important;
        }
    
        .mb-hero-image img {
            width: 100% !important;
            height: auto !important;
            object-fit: cover !important;
        }
    
        .mb-hero-location {
            position: static !important;
            margin-top: 1rem !important;
        }
    }
    
    
    
    
    /* ========================================
       7. SEKTION 2: TEASER-STATION CHECKLISTE
       ======================================== */
    .mb-teaser-checkliste {
        background: linear-gradient(135deg, rgba(255, 248, 240, 0.8) 0%, rgba(255, 255, 255, 1) 100%) !important;
    }
    
    /* 2-Spalten-Layout */
    .mb-teaser-layout {
        display: grid;
        grid-template-columns: 1fr 1fr; /* links flexibel, rechts kompakt */
        gap: var(--spacing-xl);
        align-items: start;
        margin-top: var(--spacing-xl);
    }
    
    .mb-teaser-left {
        display: block;
    }
    
    .mb-teaser-right {
        display: flex;
        flex-direction: column;
        gap: var(--spacing-lg);
    }
    
    
    .mb-benefits-grid {
        display: grid; grid-template-columns: 1fr; /* statt auto-fit */ 
        gap: var(--spacing-lg);
    }
    
    .mb-benefit {
        display: flex !important;
        align-items: flex-start !important;
        gap: var(--spacing-sm) !important;
        padding: 5px !important;
        background: var(--white) !important;
        border-radius: var(--radius-lg) !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18) !important;
        transition: var(--transition) !important;
        min-height: 50%;
    }
    
    .mb-benefit:hover {
        transform: translateY(-4px) !important;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
    }
    
    .mb-benefit__icon {
        font-size: 1.5rem !important;
        color: var(--burgund-primary) !important;
        flex-shrink: 0 !important;
    }
    
    .mb-benefit__text {
        font-family: 'Inter', sans-serif !important;
        font-size: 0.9375rem !important;
        line-height: 1.6 !important;
        color: var(--gray-dark) !important;
    }
    
    .mb-fomo-text {
        font-family: 'Inter', sans-serif !important;
        font-size: 0.875rem !important;
        font-style: italic !important;
        line-height: 1.6 !important;
        color: var(--gray) !important;
        text-align: center !important;
        margin-top: var(--spacing-lg) !important;
        padding: var(--spacing-sm) var(--spacing-md) !important;
        background: rgba(139, 26, 61, 0.05) !important;
        border-left: 3px solid var(--burgund-primary) !important;
        border-radius: var(--radius-sm) !important;
        max-width: 700px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    @media (max-width: 768px) {
        .mb-teaser-layout {
            grid-template-columns: 1fr;
        }
    
        .mb-teaser-right {
            margin-top: var(--spacing-xl);
            align-items: center;
            text-align: center;
        }
    }
    
    
    /* ========================================
       8. SEKTION 3: PROBLEM-SPIEGEL (ANGEPASST)
       Überschrift: Scanbar mit Italic Burgund
       Gradient: Weiß → Burgund
       Boxen: Weiß (nicht Cream)
       Lösung: Burgund-Button-Optik
       Parallax: Dezent (5-10% Opacity, nur Desktop)
       ======================================== */
    
    /* Sektion Hintergrund: Gradient Weiß → Burgund + Parallax */
    .mb-problem {
        background: linear-gradient(135deg, rgba(255, 255, 255, 1) 0%, rgba(139, 26, 61, 0.08) 100%) !important;
        position: relative !important;
        overflow: hidden !important;
    }
    
    /* Parallax-Hintergrund (nur Desktop > 768px) */
    .mb-problem::before {
        content: '' !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        background-image: url('https://eventlocation-erzgebirge.de/wp-content/uploads/2026/02/Titelbild-V3.jpg') !important;
        background-size: cover !important;
        background-position: center !important;
        background-repeat: no-repeat !important;
        opacity: 0.08 !important; /* 8% Opacity = sehr dezent */
        z-index: 0 !important;
        filter: grayscale(100%) !important; /* Graustufen für Dezenz */
    }
    
    /* Content über Parallax-Hintergrund */
    .mb-problem .mb-container {
        position: relative !important;
        z-index: 1 !important;
    }
    
    /* Überschrift: Scanbar mit Italic Burgund */
    .mb-highlight-italic {
        font-family: 'Inter', sans-serif !important;
        font-style: italic !important;
        font-weight: 600 !important;
        color: var(--burgund-primary) !important; /* #8B1A3D */
    }
    
    /* Problem-Grid (3 Spalten) */
    .mb-problem-grid {
        display: grid !important;
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
        gap: var(--spacing-lg) !important;
        margin-bottom: var(--spacing-xl) !important;
    }
    
    /* Problem-Cards: Weiß (nicht Cream) */
    .mb-problem-card {
        padding: var(--spacing-xl) !important;
        background: #FFFFFF !important; /* Weiß statt Cream */
        border-radius: var(--radius-xl) !important;
        border: 2px solid rgba(139, 26, 61, 0.1) !important;
        transition: var(--transition) !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
    }
    
    .mb-problem-card:hover {
        transform: translateY(-4px) !important;
        box-shadow: 0 8px 24px rgba(139, 26, 61, 0.15) !important;
        border-color: rgba(139, 26, 61, 0.3) !important;
    }
    
    .mb-problem-card__icon {
        font-size: 2.5rem !important;
        margin-bottom: var(--spacing-md) !important;
    }
    
    .mb-problem-card__title {
        font-family: 'Inter', sans-serif !important;
        font-size: 1.25rem !important;
        font-weight: 700 !important;
        color: var(--burgund-primary) !important; /* #8B1A3D */
        margin-bottom: var(--spacing-sm) !important;
    }
    
    .mb-problem-card__risk {
        font-family: 'Inter', sans-serif !important;
        font-size: 0.9375rem !important;
        line-height: 1.6 !important;
        color: var(--gray) !important;
        margin-bottom: var(--spacing-md) !important;
    }
    
    /* Lösung: Burgund-Button-Optik (wie links) */
    .mb-problem-solution {
        padding: var(--spacing-md) var(--spacing-lg) !important;
        background: var(--burgund-primary) !important; /* #8B1A3D */
        color: var(--white) !important;
        font-family: 'Inter', sans-serif !important;
        font-size: 0.9375rem !important;
        font-weight: 600 !important;
        line-height: 1.6 !important;
        border-radius: var(--radius-lg) !important;
        border-left: 4px solid var(--brand-gold) !important; /* Gold-Akzent */
        box-shadow: 0 4px 12px rgba(139, 26, 61, 0.3) !important;
        transition: var(--transition) !important;
    }
    
    .mb-problem-card:hover .mb-problem-solution {
        transform: translateY(-2px) !important;
        box-shadow: 0 6px 16px rgba(139, 26, 61, 0.4) !important;
    }
    
    /* Responsive: Parallax nur auf Desktop */
    @media (max-width: 768px) {
        .mb-problem::before {
            display: none !important; /* Kein Parallax auf Mobil */
        }
        
        .mb-problem {
            background: linear-gradient(135deg, rgba(255, 255, 255, 1) 0%, rgba(139, 26, 61, 0.05) 100%) !important;
        }
        
        .mb-problem-grid {
            grid-template-columns: 1fr !important; /* 1 Spalte auf Mobil */
        }
    }
    
    /* Responsive: 3 Spalten auf Tablet */
    @media (min-width: 768px) and (max-width: 1024px) {
        .mb-problem-grid {
            grid-template-columns: repeat(3, 1fr) !important; /* 3 Spalten auf Tablet */
        }
    }
    
    
    /* ========================================
       9. SEKTION 4: WARUM MITTEL-BAR
       ======================================== */
    .mb-warum {
        background: linear-gradient(135deg, rgba(255, 248, 240, 0.5) 0%, rgba(255, 255, 255, 1) 100%) !important;
    }
    
    .mb-features-grid {
        display: grid !important;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
        gap: var(--spacing-lg) !important;
    }
    
    .mb-feature {
        padding: var(--spacing-lg) !important;
        background: var(--white) !important;
        border-radius: var(--radius-lg) !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
        transition: var(--transition) !important;
    }
    
    .mb-feature:hover {
        transform: translateY(-4px) !important;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
    }
    
    .mb-feature__icon {
        font-size: 2rem !important;
        margin-bottom: var(--spacing-sm) !important;
    }
    
    .mb-feature__title {
        font-family: 'Inter', sans-serif !important;
        font-size: 1.125rem !important;
        font-weight: 700 !important;
        color: var(--burgund-primary) !important;
        margin-bottom: var(--spacing-sm) !important;
    }
    
    .mb-feature__text {
        font-family: 'Inter', sans-serif !important;
        font-size: 0.9375rem !important;
        line-height: 1.6 !important;
        color: var(--gray) !important;
    }
    
    /* ========================================
       10. SEKTION 5: EDV-SCHULUNGSRAUM
       ======================================== */
    
    /* Sektion Hintergrund: Gradient Weiß → Burgund + Parallax */
    .mb-schulungsraum {
        background: linear-gradient(
            135deg,
            rgba(255, 255, 255, 1) 0%,
            rgba(139, 26, 61, 0.08) 100%
        ) !important;
        position: relative !important;
        overflow: hidden !important;
    }
    
    /* Parallax-Hintergrund (nur Desktop > 768px) */
    .mb-schulungsraum::before {
        content: '' !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        background-image: url('https://eventlocation-erzgebirge.de/wp-content/uploads/2026/02/schulungsraum_mit_monitoren.jpg') !important;
        background-size: cover !important;
        background-position: center !important;
        background-repeat: no-repeat !important;
        opacity: 0.1 !important; /* 8% Opacity = sehr dezent */
        z-index: 0 !important;
        filter: grayscale(90%) !important; /* Graustufen für Dezenz */
    }
    
    /* Content über Parallax-Hintergrund */
    .mb-schulungsraum .mb-container {
        position: relative !important;
        z-index: 1 !important;
    }
    
    /* Optional: Burgund-Highlight wie in der Problem-Sektion */
    .mb-schulungsraum .mb-highlight-italic {
        font-family: 'Inter', sans-serif !important;
        font-style: italic !important;
        font-weight: 600 !important;
        color: var(--burgund-primary) !important;
    }
    
    
    .mb-schulungsraum {
     
    }
    
    .mb-schulungsraum-content {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: var(--spacing-2xl) !important;
        align-items: center !important;
    }
    
    .mb-schulungsraum-text p {
        font-family: 'Inter', sans-serif !important;
        font-size: 1.125rem !important;
        line-height: 1.7 !important;
        color: var(--gray) !important;
        margin-bottom: var(--spacing-lg) !important;
    }
    
    .mb-schulungsraum-image img {
        width: 100% !important;
        height: auto !important;
        border-radius: var(--radius-xl) !important;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
    }
    
    /* ========================================
       11. SEKTION 6: ANLÄSSE (TABS)
       ======================================== */
    .mb-anlaesse {
        background: linear-gradient(135deg, rgba(255, 248, 240, 0.5) 0%, rgba(255, 255, 255, 1) 100%) !important;
    }
    
    .mb-tabs__nav {
        display: flex !important;
        gap: var(--spacing-sm) !important;
        margin-bottom: var(--spacing-xl) !important;
        border-bottom: 2px solid rgba(139, 26, 61, 0.1) !important;
        flex-wrap: wrap !important;
    }
    
    .mb-tab-btn {
        padding: var(--spacing-md) var(--spacing-lg) !important;
        font-family: 'Inter', sans-serif !important;
        font-size: 1rem !important;
        font-weight: 600 !important;
        color: var(--gray) !important;
        background: transparent !important;
        border: none !important;
        border-bottom: 3px solid transparent !important;
        cursor: pointer !important;
        transition: var(--transition) !important;
    }
    
    .mb-tab-btn:hover {
        color: var(--burgund-primary) !important;
    }
    
    .mb-tab-btn.active {
        color: var(--burgund-primary) !important;
        border-bottom-color: var(--burgund-primary) !important;
    }
    
    .mb-tab-panel {
        display: none !important;
    }
    
    .mb-tab-panel.active {
        display: block !important;
    }
    
    .mb-tab-grid {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: var(--spacing-2xl) !important;
        align-items: center !important;
    }
    
    .mb-tab-image img {
        width: 100% !important;
        height: auto !important;
        border-radius: var(--radius-xl) !important;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
    }
    
    .mb-tab-text h3 {
        font-family: 'Inter', sans-serif !important;
        font-size: 1.5rem !important;
        font-weight: 700 !important;
        color: var(--burgund-primary) !important;
        margin-bottom: var(--spacing-md) !important;
    }
    
    .mb-tab-text p {
        font-family: 'Inter', sans-serif !important;
        font-size: 1.125rem !important;
        line-height: 1.7 !important;
        color: var(--gray) !important;
        margin-bottom: var(--spacing-md) !important;
    }
    
    .mb-tab-highlight {
        font-style: italic !important;
        color: var(--gray-dark) !important;
        padding-left: var(--spacing-md) !important;
        border-left: 3px solid var(--brand-gold) !important;
    }
    
    /* ========================================
       12. SEKTION 7: SOCIAL PROOF / LOGOS / AUTORITÄT
       ======================================== */
    .mb-social-proof {
        background: var(--white) !important;
    }
    
 /* ========================================
   FIRMEN-LOGOS CAROUSEL – KOMPLETT NEU
   ======================================== */

/* BASIS: Carousel-Container */
.mb-logos-carousel {
    width: 100%;
    overflow: hidden;
    position: relative;
    margin-bottom: var(--spacing-2xl);
}

/* Wrapper: overflow hidden, kein overflowX auto */
.mb-logos-wrapper {
    width: 100%;
    overflow: hidden;
    position: relative;
    cursor: grab;
    user-select: none;
    padding: var(--spacing-lg) 0;
}

.mb-logos-wrapper:active {
    cursor: grabbing;
}

/* Fade-Edges links/rechts (Apple Style) */
.mb-logos-wrapper::before,
.mb-logos-wrapper::after {
    content: '';
    position: absolute;
    top: 0;
    width: 80px;
    height: 100%;
    pointer-events: none;
    z-index: 5;
}

.mb-logos-wrapper::before {
    left: 0;
    background: linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0));
}

.mb-logos-wrapper::after {
    right: 0;
    background: linear-gradient(to left, rgba(255,255,255,1), rgba(255,255,255,0));
}

/* Track: flex, Infinite-Scroll-Animation */
.mb-logos-track {
    display: flex;
    gap: 40px;
    width: max-content;
    flex-shrink: 0;
    animation: mbScrollLeft 40s linear infinite;
    will-change: transform;
}

/* Pause bei Hover und beim Draggen */
.mb-logos-wrapper:hover .mb-logos-track,
.mb-logos-wrapper.dragging .mb-logos-track {
    animation-play-state: paused;
}

/* Die Animation selbst */
@keyframes mbScrollLeft {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* Basis-Bild-Styles */
.mb-logos-track img {
    width: auto;
    flex-shrink: 0;
    object-fit: contain;
    filter: grayscale(95%);
    opacity: 0.6;
    transition: filter 0.3s ease, opacity 0.3s ease, transform 0.3s ease;
}

.mb-logos-track img:hover {
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(1.05);
}

/* ========================================
   HERO-CAROUSEL: KLEINE LOGOS
   ======================================== */
.mb-logos--hero .mb-logos-wrapper {
    padding: 1px 0;
    background: transparent;
}

.mb-logos--hero .mb-logos-track {
    animation-duration: 35s;
}

.mb-logos--hero .mb-logos-track img {
    height: 39px;
    opacity: 0.55;
}

/* ========================================
   SOCIAL PROOF: GROSSE LOGOS
   ======================================== */
.mb-logos--social .mb-logos-wrapper {
    padding: var(--spacing-xl) 0;
}

.mb-logos--social .mb-logos-track {
    animation-duration: 25s;
}

.mb-logos--social .mb-logos-track img {
    height: 75px;
    opacity: 0.75;
}

/* ========================================
   CAROUSEL BUTTONS (Prev/Next – optional)
   ======================================== */
.mb-carousel-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: var(--white);
    border: 2px solid var(--burgund-primary);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: var(--burgund-primary);
    cursor: pointer;
    transition: var(--transition);
    z-index: 10;
}

.mb-carousel-btn:hover {
    background: var(--burgund-primary);
    color: var(--white);
}

.mb-carousel-btn--prev { left: 0; }
.mb-carousel-btn--next { right: 0; }

.mb-carousel-pagination {
    display: flex;
    justify-content: center;
    gap: var(--spacing-sm);
    margin-top: var(--spacing-md);
}

.mb-carousel-pagination span {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(139, 26, 61, 0.3);
    cursor: pointer;
    transition: var(--transition);
}

.mb-carousel-pagination span.active {
    background: var(--burgund-primary);
    
}

/* Hero-Carousel: Fade auf transparent statt weiß */
.mb-logos--hero .mb-logos-wrapper::before {
    background: linear-gradient(to right, rgba(255, 248, 240, 0.15), rgba(255, 248, 240, 0));
}

.mb-logos--hero .mb-logos-wrapper::after {
    background: linear-gradient(to left, rgba(255, 248, 240, 0.15), rgba(255, 248, 240, 0));
}





    /* TESTIMONIAL (CHAT-BUBBLE + FOTO + 5★-BADGE) */
    .mb-testimonial {
        max-width: 1000px !important;
        margin: 0 auto var(--spacing-2xl) !important;
    }
    
    .mb-testimonial__bubble {
        background: var(--cream) !important;
        padding: var(--spacing-lg) !important;
        border-radius: var(--radius-xl) !important;
        border: 2px solid rgba(139, 26, 61, 0.1) !important;
        position: relative !important;
        margin-bottom: var(--spacing-lg) !important;
    }
    
    .mb-testimonial__bubble::after {
        content: '' !important;
        position: absolute !important;
        bottom: -10px !important;
        left: 40px !important;
        width: 0 !important;
        height: 0 !important;
        border-left: 10px solid transparent !important;
        border-right: 10px solid transparent !important;
        border-top: 10px solid var(--cream) !important;
    }
    
    .mb-testimonial__stars {
        color: var(--brand-gold) !important;
        font-size: 1.25rem !important;
        margin-bottom: var(--spacing-sm) !important;
    }
    
    .mb-testimonial__quote {
        font-family: 'PlayfairDisplay-Italic', sans-serif !important;
        font-size: 1.125rem !important;
        font-style: italic !important;
        line-height: 1.7 !important;
        color: var(--gray-dark) !important;
    }
    
    /* Container: Bubble oben, Foto rechts */
    .mb-testimonial__author {
        display: flex !important;
        flex-direction: row !important;
        align-items: flex-start !important;
        gap: var(--spacing-xl) !important;
    }
    
    
    .mb-testimonial__photo {
        width: 550px !important;
        max-width: 100% !important;
        height: auto !important;
        border-radius: 15px !important;
        object-fit: cover !important;
        border: 3px solid var(--burgund-primary) !important;
    }
    
    
    /* Bubble + Name/Firma untereinander */
    .mb-testimonial__info {
        display: flex !important;
        flex-direction: column !important;
        gap: var(--spacing-sm) !important;
    }
    
    
    .mb-testimonial__name {
        font-family: 'Inter', sans-serif !important;
        font-size: 1rem !important;
        font-weight: 700 !important;
        color: var(--gray-dark) !important;
        margin-bottom: 0.25rem !important;
    }
    
    .mb-testimonial__company {
        font-family: 'Inter', sans-serif !important;
        font-size: 0.875rem !important;
        color: var(--gray) !important;
    }
    
    .mb-testimonial__badge {
        background: var(--brand-gold) !important;
        color: var(--white) !important;
        font-size: 1rem !important;
        font-weight: 700 !important;
        padding: 0.5rem 1rem !important;
        border-radius: 999px !important;
    }
    
    /* KPI-LEISTE */
    .mb-kpi-bar {
        display: flex !important;
        justify-content: center !important;
        gap: var(--spacing-xl) !important;
        flex-wrap: wrap !important;
        padding: var(--spacing-lg) !important;
        background: rgba(255, 248, 240, 0.5) !important;
        border-radius: var(--radius-lg) !important;
        margin-bottom: var(--spacing-xl) !important;
    }
    
    .mb-kpi-item {
        font-family: 'Inter', sans-serif !important;
        font-size: 0.875rem !important;
        color: var(--gray) !important;
        text-align: center !important;
    }
    
    .mb-kpi-number {
        font-size: 1.5rem !important;
        font-weight: 700 !important;
        color: var(--burgund-primary) !important;
        margin-right: 0.25rem !important;
    }
    
    @media (max-width: 768px) {
        .mb-testimonial__author {
            flex-direction: column !important;
            align-items: center !important;
            text-align: center !important;
        }
    
        .mb-testimonial__photo {
            width: 100% !important;
            max-width: 350px !important;
        }
    
        .mb-testimonial__info {
            align-items: center !important;
        }
    }
    
    
    /* ========================================
       13. SEKTION 8: LEAD-MAGNET VOLLSEKTION
       ======================================== */
    .mb-lead-magnet {
        background: linear-gradient(135deg, rgba(139, 26, 61, 0.05) 0%, rgba(255, 255, 255, 1) 100%) !important;
    }
    
    .mb-lead-magnet-grid {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: var(--spacing-2xl) !important;
        align-items: center !important;
    }
    
    .mb-lead-magnet-mockup img {
        width: 100% !important;
        height: auto !important;
        border-radius: var(--radius-xl) !important;
        box-shadow: 0 12px 32px rgba(0, 0, 0, 0.15) !important;
    }
    
    .mb-lead-magnet-title {
        font-family: 'Inter', sans-serif !important;
        font-size: clamp(1.75rem, 4vw, 2.5rem) !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        color: var(--burgund-primary) !important;
        margin-bottom: var(--spacing-md) !important;
    }
    
    .mb-lead-magnet-intro {
        font-family: 'Inter', sans-serif !important;
        font-size: 1.125rem !important;
        line-height: 1.7 !important;
        color: var(--gray) !important;
        margin-bottom: var(--spacing-lg) !important;
    }
    
    .mb-lead-magnet-benefits {
        margin-bottom: var(--spacing-lg) !important;
    }
    
    .mb-lead-magnet-benefit {
        display: flex !important;
        align-items: flex-start !important;
        gap: var(--spacing-sm) !important;
        margin-bottom: var(--spacing-md) !important;
    }
    
    .mb-lead-magnet-benefit__icon {
        font-size: 1.5rem !important;
        color: var(--burgund-primary) !important;
        flex-shrink: 0 !important;
    }
    
    .mb-lead-magnet-benefit__text {
        font-family: 'Inter', sans-serif !important;
        font-size: 0.9375rem !important;
        line-height: 1.6 !important;
        color: var(--gray-dark) !important;
    }
    
    .mb-lead-magnet-form {
        margin-bottom: var(--spacing-md) !important;
    }
    
    .mb-lead-magnet-microcopy {
        font-family: 'Inter', sans-serif !important;
        font-size: 0.75rem !important;
        font-style: italic !important;
        line-height: 1.6 !important;
        color: var(--gray) !important;
    }
    
    /* ========================================
       14. SEKTION 9: ABLAUF / PROZESS
       ======================================== */
    .mb-ablauf {
        background: var(--white) !important;
    }
    
    .mb-timeline {
        max-width: 800px !important;
        margin: 0 auto !important;
    }
    
    .mb-timeline-item {
        display: flex !important;
        gap: var(--spacing-lg) !important;
        margin-bottom: var(--spacing-2xl) !important;
        position: relative !important;
    }
    
    .mb-timeline-item::before {
        content: '' !important;
        position: absolute !important;
        left: 30px !important;
        top: 60px !important;
        bottom: -40px !important;
        width: 2px !important;
        background: rgba(139, 26, 61, 0.2) !important;
    }
    
    .mb-timeline-item:last-child::before {
        display: none !important;
    }
    
    .mb-timeline-icon {
        font-size: 2.5rem !important;
        flex-shrink: 0 !important;
        width: 60px !important;
        height: 60px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: var(--cream) !important;
        border-radius: 50% !important;
        border: 3px solid var(--burgund-primary) !important;
    }
    
    .mb-timeline-content {
        flex: 1 !important;
    }
    
    .mb-timeline-title {
        font-family: 'Inter', sans-serif !important;
        font-size: 1.25rem !important;
        font-weight: 700 !important;
        color: var(--burgund-primary) !important;
        margin-bottom: var(--spacing-sm) !important;
    }
    
    .mb-timeline-text {
        font-family: 'Inter', sans-serif !important;
        font-size: 1rem !important;
        line-height: 1.6 !important;
        color: var(--gray) !important;
        margin-bottom: var(--spacing-sm) !important;
    }
    
    .mb-timeline-time {
        font-family: 'Inter', sans-serif !important;
        font-size: 0.875rem !important;
        font-weight: 600 !important;
        color: var(--brand-gold) !important;
    }
    
    /* ========================================
       15. SEKTION 10: FAQ
       ======================================== */
    .mb-faq {
        background: linear-gradient(135deg, rgba(255, 248, 240, 0.5) 0%, rgba(255, 255, 255, 1) 100%) !important;
    }
    
    .mb-faq-list {
        max-width: 800px !important;
        margin: 0 auto !important;
    }
    
    .mb-faq-item {
        margin-bottom: var(--spacing-md) !important;
        background: var(--white) !important;
        border-radius: var(--radius-lg) !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
        overflow: hidden !important;
    }
    
    .mb-faq-question {
        width: 100% !important;
        padding: var(--spacing-lg) !important;
        font-family: 'Inter', sans-serif !important;
        font-size: 1.125rem !important;
        font-weight: 600 !important;
        color: var(--gray-dark) !important;
        background: transparent !important;
        border: none !important;
        text-align: left !important;
        cursor: pointer !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        transition: var(--transition) !important;
    }
    
    .mb-faq-question:hover {
        color: var(--burgund-primary) !important;
    }
    
    .mb-faq-icon {
        font-size: 1.5rem !important;
        color: var(--burgund-primary) !important;
        transition: var(--transition) !important;
    }
    
    .mb-faq-item.active .mb-faq-icon {
        transform: rotate(45deg) !important;
    }
    
    .mb-faq-answer {
        max-height: 0 !important;
        overflow: hidden !important;
        transition: max-height 0.3s ease-out !important;
    }
    
    .mb-faq-item.active .mb-faq-answer {
        max-height: 500px !important;
    }
    
    .mb-faq-answer p {
        padding: 0 var(--spacing-lg) var(--spacing-lg) var(--spacing-lg) !important;
        font-family: 'Inter', sans-serif !important;
        font-size: 1rem !important;
        line-height: 1.6 !important;
        color: var(--gray) !important;
    }
    
    /* Tablet: FAQ-Titel darf umbrechen */
    @media (max-width: 1024px) {
        .mb-faq-question {
            flex-wrap: wrap !important;
            gap: 0.5rem !important;
            align-items: flex-start !important;
        }
    
        .mb-faq-question .mb-faq-icon {
            flex-shrink: 0 !important;
            margin-left: auto !important;
        }
    }
    
    
    /* Mobile: noch klarer untereinander */
    @media (max-width: 768px) {
        .mb-faq-question {
            flex-wrap: wrap !important;
            gap: 0.5rem !important;
            padding: 0.75rem 1rem !important;
    
        }
    
        .mb-faq-question .mb-faq-icon {
            margin-left: auto !important; /* Icon bleibt rechts */
        }
    }
    
    
    
    /* ========================================
       16. SEKTION 11: FINAL CTA
       ======================================== */
    .mb-final-cta {
    background: linear-gradient(to right, #810120, #2f4f4f);
        text-align: center !important;
    }
    
    .mb-final-cta-title {
        font-family: 'Inter', sans-serif !important;
        font-size: clamp(2rem, 5vw, 3rem) !important;
        font-weight: 900 !important;
        line-height: 1.2 !important;
        color: var(--burgund-primary) !important;
        margin-bottom: var(--spacing-md) !important;
    }
    
    .mb-final-cta-subtitle {
        font-family: 'Inter', sans-serif !important;
        font-size: 1.125rem !important;
        line-height: 1.7 !important;
        color: var(--gray) !important;
        margin-bottom: var(--spacing-xl) !important;
        max-width: 700px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    
    .mb-final-cta-buttons {
        display: flex !important;
        justify-content: center !important;
        gap: var(--spacing-md) !important;
        flex-wrap: wrap !important;
    }
    
    /* ========================================
       17. STICKY BANNER (PLATZSPAREND!)
       ======================================== */
    .mb-sticky-banner {
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        background: linear-gradient(to right, #810120, #2f4f4f);
        border-top: 2px solid var(--burgund-primary) !important;
        box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.1) !important;
        z-index: 998 !important;
        transform: translateY(100%) !important;
        transition: transform 0.3s ease-out !important;
        bottom: env(safe-area-inset-bottom) !important;
        padding-bottom: env(safe-area-inset-bottom) !important;
    }
    
    .mb-sticky-banner.visible {
        transform: translateY(0) !important;
    }
    
    .mb-sticky-banner__content {
        max-width: 1200px !important;
        margin: 0 auto !important;
        padding: var(--spacing-sm) var(--spacing-lg) !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        gap: var(--spacing-md) !important;
        flex-wrap: nowrap !important;
    }
    
    .mb-sticky-banner__stars {
        font-family: 'Inter', sans-serif !important;
        font-size: 0.875rem !important;
        font-weight: 600 !important;
        color: var(--brand-gold) !important;
    }
    
    .mb-sticky-banner__btn {
        padding: 0.5rem 1rem !important;
        font-family: 'Inter', sans-serif !important;
        font-size: 0.875rem !important;
        font-weight: 600 !important;
        background: var(--burgund-primary) !important;
        color: var(--white) !important;
        border: none !important;
        border-radius: var(--radius-sm) !important;
        text-decoration: none !important;
        cursor: pointer !important;
        transition: var(--transition) !important;
    }
    
    .mb-sticky-banner__btn:hover {
        background: var(--burgund-dark) !important;
    }
    
    .mb-sticky-banner__btn--secondary {
        background: var(--white) !important;
        color: var(--burgund-primary) !important;
        border: 2px solid var(--burgund-primary) !important;
    }
    
    .mb-sticky-banner__btn--secondary:hover {
        background: var(--burgund-primary) !important;
        color: var(--white) !important;
    }
    
    /* ========================================
       18. SCROLL-TO-TOP-BUTTON
       ======================================== */
    .mb-scroll-to-top {
        position: fixed !important;
        bottom: calc(env(safe-area-inset-bottom) + var(--spacing-lg)) !important;
        right: var(--spacing-lg) !important;
        width: 50px !important;
        height: 50px !important;
        background: var(--burgund-primary) !important;
        color: var(--white) !important;
        border: none !important;
        border-radius: 50% !important;
        box-shadow: 0 4px 12px rgba(139, 26, 61, 0.3) !important;
        cursor: pointer !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        opacity: 0 !important;
        visibility: hidden !important;
        transition: var(--transition) !important;
        z-index: 999 !important;
    }
    
    
    .mb-scroll-to-top.visible {
        opacity: 1 !important;
        visibility: visible !important;
    }
    
    .mb-scroll-to-top:hover {
        background: var(--burgund-dark) !important;
        transform: translateY(-4px) !important;
        box-shadow: 0 8px 24px rgba(139, 26, 61, 0.4) !important;
    }
    
    /* ========================================
       19. RESPONSIVE (TABLET: 3 SPALTEN, MOBIL: 1 SPALTE)
       ======================================== */
    @media (max-width: 1024px) {
        .mb-hero-container,
        .mb-schulungsraum-content,
        .mb-tab-grid,
        .mb-lead-magnet-grid {
            grid-template-columns: 1fr !important;
        }
        
        .mb-problem-grid,
        .mb-features-grid {
            grid-template-columns: repeat(3, 1fr) !important;
        }
    }
    
    @media (max-width: 768px) {
        .mb-section {
            padding: var(--spacing-xl) 0 !important;
        }
        
        .mb-section-title {
            font-size: clamp(1.5rem, 6vw, 2rem) !important;
        }
        
        .mb-problem-grid,
        .mb-features-grid,
        .mb-benefits-grid {
            grid-template-columns: 1fr !important;
        }
        
        .mb-tabs__nav {
            flex-direction: column !important;
        }
        
        .mb-tab-btn {
            width: 100% !important;
            text-align: left !important;
        }
        
        .mb-final-cta-buttons {
            flex-direction: column !important;
        }
        
        .mb-btn {
            width: 100% !important;
        }
        
        .mb-sticky-banner__content {
            justify-content: center !important;
        }
        
        .mb-scroll-to-top {
            bottom: 80px !important; /* Über Sticky-Banner */
        }
    }
    
    /* ========================================
       20. ANIMATIONS
       ======================================== */
    @keyframes fadeInUp {
        from {
            opacity: 0;
            transform: translateY(30px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }/* End custom CSS */