.elementor-102941 .elementor-element.elementor-element-5d06a3d{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-102941 .elementor-element.elementor-element-5d06a3d.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-102941 .elementor-element.elementor-element-3fa39c3{width:100%;max-width:100%;}.elementor-102941 .elementor-element.elementor-element-3fa39c3.elementor-element{--align-self:center;}@media(min-width:768px){.elementor-102941 .elementor-element.elementor-element-5d06a3d{--width:110.155%;}}/* Start custom CSS for html, class: .elementor-element-3fa39c3 *//* ========================================
   MITTEL-BAR FOTOBOX – VOLLSTÄNDIGES CSS V2
   Neue Petrol-Farben + Gold-Petrol-Gradient by ML
   Alle Buttons/Farben mit !important
======================================== */

/* ========================================
   1. CSS VARIABLEN
======================================== */

:root {
    /* Petrol-Farben (neu) */
    --mb-petrol: #005F6B;
    --mb-petrol-light: #0F7D8C;
    --mb-petrol-dark: #003F48;
    --mb-petrol-complement: #A64B2A;
    
    /* Neutral */
    --mb-white: #FFFFFF;
    --mb-cream: #F5F2EE;
    --mb-beige: #E8E4DF;
    --mb-gray: #7A7570;
    --mb-gray-dark: #4A4543;
    --mb-black: #2C2826;
    
    /* Akzent */
    --mb-gold: #B08D2D;
    --mb-gold-dark: #9A7825;
    
    /* Typografie */
    --mb-font-body: 'Source Sans 3', 'Inter', sans-serif;
    --mb-font-heading: 'Playfair Display', Georgia, serif;
    
    /* Abstände */
    --mb-spacing-xs: 0.5rem;
    --mb-spacing-sm: 1rem;
    --mb-spacing-md: 1.5rem;
    --mb-spacing-lg: 2rem;
    --mb-spacing-xl: 3rem;
    --mb-spacing-2xl: 4rem;
    --mb-spacing-3xl: 6rem;
    
    /* Schatten */
    --mb-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --mb-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.12);
    --mb-shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.16);
    
    /* Border Radius */
    --mb-radius-sm: 8px;
    --mb-radius-md: 12px;
    --mb-radius-lg: 16px;
    --mb-radius-full: 9999px;
    
    /* Transition */
    --mb-transition: all 0.3s ease;
}

/* ========================================
   2. LOKALE SCHRIFTEN
======================================== */



@font-face {
    font-family: 'Inter';
    src: url('/wp-content/uploads/fonts/subset-Inter-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* Fonts */


/* playfair-display-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: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  src: url('/wp-content/uploads/fonts/playfair-display-v40-latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* playfair-display-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: 'Playfair Display';
  font-style: italic;
  font-weight: 400;
  src: url('/wp-content/uploads/fonts/playfair-display-v40-latin_latin-ext-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* playfair-display-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: 'Playfair Display';
  font-style: normal;
  font-weight: 500;
  src: url('/wp-content/uploads/fonts/playfair-display-v40-latin_latin-ext-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* playfair-display-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: 'Playfair Display';
  font-style: italic;
  font-weight: 500;
  src: url('/wp-content/uploads/fonts/playfair-display-v40-latin_latin-ext-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* playfair-display-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: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  src: url('/wp-content/uploads/fonts/playfair-display-v40-latin_latin-ext-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* playfair-display-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: 'Playfair Display';
  font-style: italic;
  font-weight: 600;
  src: url('/wp-content/uploads/fonts/playfair-display-v40-latin_latin-ext-600italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* playfair-display-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: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  src: url('/wp-content/uploads/fonts/playfair-display-v40-latin_latin-ext-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* playfair-display-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: 'Playfair Display';
  font-style: italic;
  font-weight: 700;
  src: url('/wp-content/uploads/fonts/playfair-display-v40-latin_latin-ext-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* playfair-display-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: 'Playfair Display';
  font-style: normal;
  font-weight: 800;
  src: url('/wp-content/uploads/fonts/playfair-display-v40-latin_latin-ext-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* playfair-display-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: 'Playfair Display';
  font-style: italic;
  font-weight: 800;
  src: url('/wp-content/uploads/fonts/playfair-display-v40-latin_latin-ext-800italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* playfair-display-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: 'Playfair Display';
  font-style: normal;
  font-weight: 900;
  src: url('/wp-content/uploads/fonts/playfair-display-v40-latin_latin-ext-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* playfair-display-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: 'Playfair Display';
  font-style: italic;
  font-weight: 900;
  src: url('/wp-content/uploads/fonts/playfair-display-v40-latin_latin-ext-900italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-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: 'Source Sans 3';
  font-style: normal;
  font-weight: 200;
  src: url('/wp-content/uploads/fonts/source-sans-3-v19-latin_latin-ext-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-200italic - 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: 'Source Sans 3';
  font-style: italic;
  font-weight: 200;
  src: url('/wp-content/uploads/fonts/source-sans-3-v19-latin_latin-ext-200italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-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: 'Source Sans 3';
  font-style: normal;
  font-weight: 300;
  src: url('/wp-content/uploads/fonts/source-sans-3-v19-latin_latin-ext-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-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: 'Source Sans 3';
  font-style: italic;
  font-weight: 300;
  src: url('/wp-content/uploads/fonts/source-sans-3-v19-latin_latin-ext-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-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: 'Source Sans 3';
  font-style: normal;
  font-weight: 400;
  src: url('/wp-content/uploads/fonts/source-sans-3-v19-latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-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: 'Source Sans 3';
  font-style: italic;
  font-weight: 400;
  src: url('/wp-content/uploads/fonts/source-sans-3-v19-latin_latin-ext-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-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: 'Source Sans 3';
  font-style: normal;
  font-weight: 500;
  src: url('/wp-content/uploads/fonts/source-sans-3-v19-latin_latin-ext-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-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: 'Source Sans 3';
  font-style: italic;
  font-weight: 500;
  src: url('/wp-content/uploads/fonts/source-sans-3-v19-latin_latin-ext-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-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: 'Source Sans 3';
  font-style: normal;
  font-weight: 600;
  src: url('/wp-content/uploads/fonts/source-sans-3-v19-latin_latin-ext-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-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: 'Source Sans 3';
  font-style: italic;
  font-weight: 600;
  src: url('/wp-content/uploads/fonts/source-sans-3-v19-latin_latin-ext-600italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-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: 'Source Sans 3';
  font-style: normal;
  font-weight: 700;
  src: url('/wp-content/uploads/fonts/source-sans-3-v19-latin_latin-ext-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-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: 'Source Sans 3';
  font-style: italic;
  font-weight: 700;
  src: url('/wp-content/uploads/fonts/source-sans-3-v19-latin_latin-ext-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-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: 'Source Sans 3';
  font-style: normal;
  font-weight: 800;
  src: url('/wp-content/uploads/fonts/source-sans-3-v19-latin_latin-ext-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-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: 'Source Sans 3';
  font-style: italic;
  font-weight: 800;
  src: url('/wp-content/uploads/fonts/source-sans-3-v19-latin_latin-ext-800italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-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: 'Source Sans 3';
  font-style: normal;
  font-weight: 900;
  src: url('/wp-content/uploads/fonts/source-sans-3-v19-latin_latin-ext-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-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: 'Source Sans 3';
  font-style: italic;
  font-weight: 900;
  src: url('/wp-content/uploads/fonts/source-sans-3-v19-latin_latin-ext-900italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/* ========================================
   3. RESET & CONTAINER
======================================== */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--mb-font-body);
    font-size: 1rem;
    line-height: 1.6;
    color: var(--mb-gray-dark);
    background: var(--mb-white);
}

.mb-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 var(--mb-spacing-lg);
}

@media (max-width: 768px) {
    .mb-container {
        padding: 0 var(--mb-spacing-md);
    }
}

/* ========================================
   4. TRUST-BAR (STICKY TOP)
======================================== */

.mb-fotobox-trust-bar {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: var(--mb-petrol) !important;
    color: var(--mb-white) !important;
    padding: var(--mb-spacing-sm) 0;
    box-shadow: var(--mb-shadow-sm);
}

.mb-fotobox-trust-bar__items {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--mb-spacing-xl);
    flex-wrap: wrap;
}

.mb-fotobox-trust-bar__item {
    display: flex;
    align-items: center;
    gap: var(--mb-spacing-xs);
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--mb-white) !important;
}

.mb-fotobox-trust-bar__item svg {
    flex-shrink: 0;
}

/* Desktop: Zeige lange Texte, verstecke kurze */
.mb-fotobox-trust-bar__text-desktop {
    display: inline;
}

.mb-fotobox-trust-bar__text-mobile {
    display: none;
}

/* ========================================
   MOBILE OPTIMIERUNG
======================================== */

@media (max-width: 768px) {
    .mb-fotobox-trust-bar {
        padding: var(--mb-spacing-xs) 0; /* Weniger Padding */
    }
    
    .mb-fotobox-trust-bar__items {
        gap: var(--mb-spacing-sm); /* Weniger Gap */
        flex-wrap: nowrap; /* KEINE Umbrüche! */
        justify-content: space-between; /* Gleichmäßig verteilen */
    }
    
    .mb-fotobox-trust-bar__item {
        font-size: 0.75rem;
        gap: 4px; /* Weniger Gap zwischen Icon und Text */
    }
    
    .mb-fotobox-trust-bar__item svg {
        width: 16px;
        height: 16px;
    }
    
    /* Mobile: Zeige kurze Texte, verstecke lange */
    .mb-fotobox-trust-bar__text-desktop {
        display: none;
    }
    
    .mb-fotobox-trust-bar__text-mobile {
        display: inline;
    }
}

/* Sehr kleine Screens (< 480px) */
@media (max-width: 480px) {
    .mb-fotobox-trust-bar__item {
        font-size: 0.7rem; /* Noch kleiner */
    }
    
    .mb-fotobox-trust-bar__item svg {
        width: 14px;
        height: 14px;
    }
}


/* ========================================
   5. VIDEO HERO (GOLD-PETROL GRADIENT)
======================================== */

.mb-fotobox-hero {
    position: relative;
    min-height: 80vh;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.mb-fotobox-hero__video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

.mb-fotobox-hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Gold-Petrol-Gradient (120deg) */
    background: linear-gradient(120deg, 
        rgba(176, 141, 45, 0.7) 0%,     /* Gold */
        rgba(15, 125, 140, 0.85) 50%,   /* Petrol Light (mit Grün-Touch) */
        rgba(0, 95, 107, 0.9) 100%      /* Petrol */
    ) !important;
    z-index: 1;
}

.mb-fotobox-hero__content {
    position: relative;
    z-index: 100;
    max-width: 700px;
    color: var(--mb-white) !important;
}

.mb-fotobox-hero__trust-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--mb-spacing-xs);
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
    padding: var(--mb-spacing-xs) var(--mb-spacing-md);
    border-radius: var(--mb-radius-full);
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: var(--mb-spacing-md);
    color: var(--mb-white) !important;
}

.mb-fotobox-hero__title {
    font-family: var(--mb-font-heading);
    font-size: 3rem;
    font-weight: 400;
    line-height: 1.2;
    margin-bottom: var(--mb-spacing-md);
    color: var(--mb-white) !important;
}

.mb-fotobox-hero__title em {
    font-style: italic;
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-hero__subtitle {
    font-size: 1.25rem;
    line-height: 1.6;
    margin-bottom: var(--mb-spacing-xl) !important;
    color: var(--mb-white) !important;
}

.mb-fotobox-hero__subtitle strong {
    color: var(--mb-petrol-dark) !important;
    font-weight: 700;
}

.mb-fotobox-hero__fomo {
    display: flex !important;
    flex-direction: column !important;
    gap: var(--mb-spacing-sm) !important;
    margin-bottom: var(--mb-spacing-xl);
}

.mb-fotobox-hero__fomo-item {
    display: flex;
    align-items: center;
    gap: var(--mb-spacing-xs);
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--mb-white) !important;
}

.mb-fotobox-hero__ctas {
    display: flex;
    gap: var(--mb-spacing-md);
    flex-wrap: wrap;
    z-index: 100 !important;
}

.mb-fotobox-hero__cta {
    display: inline-block;
    font-family: var(--mb-font-body);
    font-size: 1.125rem;
    font-weight: 600;
    padding: var(--mb-spacing-md) var(--mb-spacing-xl);
    border-radius: var(--mb-radius-full);
    text-decoration: none;
    transition: var(--mb-transition);
    position: relative;
    z-index: 100 !important;
}

.mb-fotobox-hero__cta--primary {
    background: var(--mb-gold) !important;
    color: var(--mb-white) !important;
}

.mb-fotobox-hero__cta--primary:hover {
    background: var(--mb-gold-dark) !important;
    transform: translateY(-2px);
    box-shadow: var(--mb-shadow-md);
}

.mb-fotobox-hero__cta--secondary {
    background: transparent !important;
    color: var(--mb-white) !important;
    border: 2px solid var(--mb-white) !important;
}

.mb-fotobox-hero__cta--secondary:hover {
    background: var(--mb-white) !important;
    color: var(--mb-petrol) !important;
    transform: translateY(-2px);
    box-shadow: var(--mb-shadow-md);
}

@media (max-width: 768px) {
    .mb-fotobox-hero {
        min-height: 70vh;
    }
    
    .mb-fotobox-hero__title {
        font-size: 2rem;
    }
    
    .mb-fotobox-hero__subtitle {
        font-size: 1rem;
    }
    
    .mb-fotobox-hero__cta {
        font-size: 1rem;
        padding: var(--mb-spacing-sm) var(--mb-spacing-lg);
    }
}

/* Seitliches Overlay-Bild im Hero */
.mb-fotobox-hero__side-image {
    position: absolute;
    top: 30px !important;
    left: 0 !important;
    height: 750px; /* ← Höhe frei anpassbar */
    width: auto;
    z-index: 2 !important; /* über Video & Overlay */
    display: flex;
    align-items: flex-start;
    pointer-events: none !important; /* verhindert Klick-Blocker */
}

.mb-fotobox-hero__side-image img {
    height: 100%;
    width: auto;
    object-fit: contain;
    display: block;
}

/* Seitliches Overlay-Bild im Hero */
.mb-fotobox-hero__side-image1 {
    position: absolute;
    top: 180px !important;
    right: 0 !important;
    height: 550px; /* ← Höhe frei anpassbar */
    width: auto;
    z-index: 2 !important; /* über Video & Overlay */
    display: flex;
    align-items: flex-start;
    pointer-events: none !important; /* verhindert Klick-Blocker */
}

.mb-fotobox-hero__side-image1 img {
    height: 100%;
    width: auto;
    object-fit: contain;
    display: block;
}

@media (max-width: 768px) {
    .mb-fotobox-hero__side-image {
        height: 260px;
        opacity: 0.6; /* optional */
    }
        .mb-fotobox-hero__side-image1 {
        height: 260px;
        opacity: 0.6; /* optional */
    }
}

@media (max-width: 480px) {
    .mb-fotobox-hero__side-image {
        display: none; /* oder kleiner anzeigen */
    }
    .mb-fotobox-hero__side-image1 {
        display: none; /* oder kleiner anzeigen */
    }
}



/* ========================================
   6. FEATURES (3x2 GRID)
======================================== */

.mb-fotobox-features {
    padding: var(--mb-spacing-3xl) 0;
    background: var(--mb-white) !important;
}

.mb-fotobox-features__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--mb-spacing-xl);
}

@media (max-width: 768px) {
    .mb-fotobox-features__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--mb-spacing-lg);
    }
}

.mb-fotobox-features__item {
    text-align: center;
}

.mb-fotobox-features__icon {
    width: 80px;
    height: 80px;
    margin: 0 auto var(--mb-spacing-md);
    background: var(--mb-cream) !important;
    border-radius: var(--mb-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
}

.mb-fotobox-features__icon svg {
    stroke: var(--mb-petrol) !important;
}

.mb-fotobox-features__title {
    font-family: var(--mb-font-heading);
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: var(--mb-spacing-xs);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-features__text {
    font-size: 0.875rem;
    color: var(--mb-gray) !important;
}

/* Fortsetzung folgt in Teil 2... */

/* ========================================
   7. PAKETE & PREISE (MIT PARALLAX-HINTERGRUND)
======================================== */

.mb-fotobox-pakete {
    padding: var(--mb-spacing-3xl) 0;
    position: relative; /* Für Parallax */
    overflow: hidden; /* Verhindert Overflow */
    background: var(--mb-cream) !important; /* Fallback */
}

/* Parallax-Hintergrund */
.mb-fotobox-pakete__parallax {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('/wp-content/uploads/2026/02/fotobox_setting.jpg') !important; /* ← DEIN BILD HIER */
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important; /* Parallax-Effekt */
    z-index: 1;
}

/* Gradient-Overlay (weiß → cremefarben, oben deckend → unten transparent) */
.mb-fotobox-pakete__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        to bottom,
        rgba(255, 255, 255, 0.95) 0%,      /* Oben: Fast deckend (weiß) */
        rgba(245, 242, 238, 0.85) 30%,     /* Mitte-oben: Cremefarben */
        rgba(245, 242, 238, 0.7) 60%,      /* Mitte-unten: Weniger deckend */
        rgba(245, 242, 238, 0.5) 100%      /* Unten: Noch weniger deckend */
    ) !important;
    z-index: 2;
}

/* Container über Parallax */
.mb-fotobox-pakete .mb-container {
    position: relative;
    z-index: 3; /* Über Parallax + Overlay */
}

.mb-fotobox-pakete__title {
    font-family: var(--mb-font-heading);
    font-size: 2.5rem;
    font-weight: 400;
    text-align: center;
    margin-bottom: var(--mb-spacing-md);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-pakete__title em {
    font-style: italic;
    color: var(--mb-petrol) !important;
}

.mb-fotobox-pakete__subtitle {
    text-align: center;
    font-size: 1.125rem;
    color: var(--mb-gray) !important;
    margin-bottom: var(--mb-spacing-xl);
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.mb-fotobox-pakete__fomo {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--mb-spacing-sm);
    background: rgba(166, 75, 42, 0.1);
    border: 2px solid var(--mb-petrol-complement);
    border-radius: var(--mb-radius-md);
    padding: var(--mb-spacing-md);
    margin-bottom: var(--mb-spacing-xl);
    font-size: 1rem;
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-pakete__fomo svg {
    stroke: var(--mb-petrol-complement) !important;
    flex-shrink: 0;
}

.mb-fotobox-pakete__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--mb-spacing-xl);
    margin-bottom: var(--mb-spacing-xl);
}

@media (max-width: 1024px) {
    .mb-fotobox-pakete__grid {
        grid-template-columns: 1fr;
        max-width: 500px;
        margin-left: auto;
        margin-right: auto;
    }
}

.mb-fotobox-paket {
    background: var(--mb-white) !important;
    border-radius: var(--mb-radius-lg);
    padding: var(--mb-spacing-xl);
    box-shadow: var(--mb-shadow-sm);
    transition: var(--mb-transition);
    position: relative;
}

.mb-fotobox-paket:hover {
    transform: translateY(-4px);
    box-shadow: var(--mb-shadow-md);
}

.mb-fotobox-paket--featured {
    transform: scale(1.05);
    border: 3px solid var(--mb-petrol) !important;
}

.mb-fotobox-paket--featured:hover {
    transform: scale(1.05) translateY(-4px);
}

.mb-fotobox-paket__badge {
    display: inline-block;
    padding: var(--mb-spacing-xs) var(--mb-spacing-md);
    border-radius: var(--mb-radius-full);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: var(--mb-spacing-md);
    color: var(--mb-white) !important;
}

.mb-fotobox-paket__badge--basis {
    background: var(--mb-gray) !important;
}

.mb-fotobox-paket__badge--beliebt {
    background: var(--mb-petrol) !important;
}

.mb-fotobox-paket__badge--premium {
    background: var(--mb-gold) !important;
}

.mb-fotobox-paket__name {
    font-family: var(--mb-font-heading);
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: var(--mb-spacing-md);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-paket__price {
    margin-bottom: var(--mb-spacing-lg);
}

.mb-fotobox-paket__price-old {
    display: block;
    font-size: 1rem;
    text-decoration: line-through;
    color: var(--mb-gray) !important;
    margin-bottom: var(--mb-spacing-xs);
}

.mb-fotobox-paket__price-current {
    display: block;
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--mb-petrol) !important;
}

.mb-fotobox-paket__price-note {
    display: block;
    font-size: 0.875rem;
    color: var(--mb-gray) !important;
    margin-top: var(--mb-spacing-xs);
}

.mb-fotobox-paket__features {
    list-style: none;
    margin-bottom: var(--mb-spacing-lg);
}

.mb-fotobox-paket__features li {
    padding: var(--mb-spacing-xs) 0;
    font-size: 0.875rem;
    color: var(--mb-gray-dark) !important;
}

.mb-fotobox-paket__features li strong {
    color: var(--mb-petrol) !important;
}

.mb-fotobox-paket__fomo {
    display: flex;
    align-items: center;
    gap: var(--mb-spacing-xs);
    background: rgba(166, 75, 92, 0.1) !important;
    padding: var(--mb-spacing-sm);
    border-radius: var(--mb-radius-sm);
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--mb-petrol-complement) !important;
    margin-bottom: var(--mb-spacing-md);
}

.mb-fotobox-paket__fomo svg {
    stroke: var(--mb-petrol-complement) !important;
    flex-shrink: 0;
}

.mb-fotobox-paket__cta {
    display: block;
    font-family: var(--mb-font-body) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    color: var(--mb-white) !important;
    background: var(--mb-petrol) !important;
    padding: var(--mb-spacing-md) var(--mb-spacing-lg);
    border-radius: var(--mb-radius-full);
    text-align: center;
    text-decoration: none;
    transition: var(--mb-transition);
}

.mb-fotobox-paket__cta:hover {
    background: var(--mb-petrol-dark) !important;
    transform: translateY(-2px);
    box-shadow: var(--mb-shadow-md);
}

.mb-fotobox-pakete__bonus {
    background: rgba(176, 141, 45, 0.5) !important;
    border: 2px solid var(--mb-gold);
    border-radius: var(--mb-radius-md);
    padding: var(--mb-spacing-lg);
    text-align: center;
}

.mb-fotobox-pakete__bonus h4 {
    font-size: 1.25rem !important;
    font-weight: 700 !important;
    margin-bottom: var(--mb-spacing-xs);
    color: var(--mb-petrol) !important;
}

.mb-fotobox-pakete__bonus p {
    font-size: 1rem;
    color: var(--mb-gray-dark) !important;
}

.mb-fotobox-pakete__bonus strong {
    color: var(--mb-petrol) !important;
}

/* ========================================
   MOBILE OPTIMIERUNG
======================================== */

@media (max-width: 768px) {
    /* Parallax auf Mobile deaktivieren (Performance) */
    .mb-fotobox-pakete__parallax {
        background-attachment: scroll; /* Kein Parallax */
    }
    
    .mb-fotobox-pakete__title {
        font-size: 1.875rem;
    }
    
    .mb-fotobox-pakete__subtitle {
        font-size: 1rem;
    }
}

/* ========================================
   GALERIE (FOTOBOX IN AKTION)
======================================== */

.mb-fotobox-galerie {
    padding: var(--mb-spacing-3xl) 0;
    background: var(--mb-white) !important;
}

.mb-fotobox-galerie__title {
    font-family: var(--mb-font-heading);
    font-size: 2.5rem;
    font-weight: 400;
    text-align: center;
    margin-bottom: var(--mb-spacing-md);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-galerie__title em {
    font-style: italic;
    color: var(--mb-petrol) !important;
}

.mb-fotobox-galerie__subtitle {
    text-align: center;
    font-size: 1.125rem;
    color: var(--mb-gray) !important;
    margin-bottom: var(--mb-spacing-2xl);
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.mb-fotobox-galerie__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--mb-spacing-md);
    margin-bottom: var(--mb-spacing-2xl);
}

@media (max-width: 1024px) {
    .mb-fotobox-galerie__grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .mb-fotobox-galerie__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--mb-spacing-sm);
    }
}

.mb-fotobox-galerie__item {
    position: relative;
    aspect-ratio: 1 / 1;
    border-radius: var(--mb-radius-md);
    overflow: hidden;
    cursor: pointer;
    transition: var(--mb-transition);
}

.mb-fotobox-galerie__item:hover {
    transform: scale(1.05);
    box-shadow: var(--mb-shadow-lg);
    z-index: 10;
}

.mb-fotobox-galerie__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.mb-fotobox-galerie__overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: var(--mb-spacing-md);
    background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
    color: var(--mb-white) !important;
    font-size: 0.875rem;
    font-weight: 600;
    opacity: 0;
    transition: var(--mb-transition);
}

.mb-fotobox-galerie__item:hover .mb-fotobox-galerie__overlay {
    opacity: 1;
}

.mb-fotobox-galerie__cta {
    text-align: center;
    padding: var(--mb-spacing-xl);
    background: var(--mb-cream) !important;
    border-radius: var(--mb-radius-lg);
}

.mb-fotobox-galerie__cta p {
    font-size: 1.125rem;
    color: var(--mb-gray-dark) !important;
    margin-bottom: var(--mb-spacing-md);
}

.mb-fotobox-galerie__button {
    display: inline-block;
    font-family: var(--mb-font-body);
    font-size: 1rem;
    font-weight: 600;
    color: var(--mb-white) !important;
    background: var(--mb-petrol) !important;
    padding: var(--mb-spacing-md) var(--mb-spacing-xl);
    border-radius: var(--mb-radius-full);
    text-decoration: none;
    transition: var(--mb-transition);
}

.mb-fotobox-galerie__button:hover {
    background: var(--mb-petrol-dark) !important;
    transform: translateY(-2px);
    box-shadow: var(--mb-shadow-md);
}

/* ========================================
   FOTO-LAYOUT-BEISPIELE
======================================== */

.mb-fotobox-layouts {
    padding: var(--mb-spacing-3xl) 0;
    background: var(--mb-cream) !important;
}

.mb-fotobox-layouts__title {
    font-family: var(--mb-font-heading);
    font-size: 2.5rem;
    font-weight: 400;
    text-align: center;
    margin-bottom: var(--mb-spacing-md);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-layouts__title em {
    font-style: italic;
    color: var(--mb-petrol) !important;
}

.mb-fotobox-layouts__subtitle {
    text-align: center;
    font-size: 1.125rem;
    color: var(--mb-gray) !important;
    margin-bottom: var(--mb-spacing-2xl);
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.mb-fotobox-layouts__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--mb-spacing-xl);
    margin-bottom: var(--mb-spacing-2xl);
}

@media (max-width: 1024px) {
    .mb-fotobox-layouts__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .mb-fotobox-layouts__grid {
        grid-template-columns: 1fr;
    }
}

.mb-fotobox-layouts__item {
    text-align: center;
}

.mb-fotobox-layouts__preview {
    background: var(--mb-white) !important;
    border-radius: var(--mb-radius-lg);
    padding: var(--mb-spacing-lg);
    margin-bottom: var(--mb-spacing-md);
    box-shadow: var(--mb-shadow-sm);
    transition: var(--mb-transition);
}

.mb-fotobox-layouts__preview:hover {
    transform: translateY(-4px);
    box-shadow: var(--mb-shadow-md);
}

.mb-fotobox-layouts__frame {
    aspect-ratio: 2 / 3;
    border: 3px solid var(--mb-petrol) !important;
    border-radius: var(--mb-radius-sm);
    padding: var(--mb-spacing-md);
    display: flex;
    flex-direction: column;
    background: var(--mb-white) !important;
}

.mb-fotobox-layouts__frame--firma {
    border-color: var(--mb-gray-dark) !important;
}

.mb-fotobox-layouts__frame--geburtstag {
    border-color: var(--mb-gold) !important;
}

.mb-fotobox-layouts__frame--konfirmation {
    border-color: var(--mb-gray) !important;
}

.mb-fotobox-layouts__frame--oktoberfest {
    border-color: #1E5A8E !important; /* Bayerisch Blau */
    background: linear-gradient(135deg, #FFFFFF 25%, #1E5A8E 25%, #1E5A8E 50%, #FFFFFF 50%, #FFFFFF 75%, #1E5A8E 75%) !important;
    background-size: 20px 20px !important;
}

.mb-fotobox-layouts__frame--weihnachten {
    border-color: #C41E3A !important; /* Weihnachtsrot */
    background: linear-gradient(to bottom, #FFFFFF, #F0F8FF) !important;
}

.mb-fotobox-layouts__header {
    margin-bottom: var(--mb-spacing-sm);
    padding-bottom: var(--mb-spacing-sm);
    border-bottom: 1px solid var(--mb-beige);
}

.mb-fotobox-layouts__names,
.mb-fotobox-layouts__company,
.mb-fotobox-layouts__birthday,
.mb-fotobox-layouts__konfirmation,
.mb-fotobox-layouts__oktoberfest,
.mb-fotobox-layouts__weihnachten {
    font-family: var(--mb-font-heading);
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--mb-petrol) !important;
    margin-bottom: 4px;
}

.mb-fotobox-layouts__date,
.mb-fotobox-layouts__event,
.mb-fotobox-layouts__name {
    font-size: 0.875rem;
    color: var(--mb-gray) !important;
}

.mb-fotobox-layouts__photo {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--mb-cream) !important;
    border-radius: var(--mb-radius-sm);
    margin-bottom: var(--mb-spacing-sm);
}

.mb-fotobox-layouts__photo svg {
    stroke: var(--mb-gray) !important;
}

.mb-fotobox-layouts__footer {
    padding-top: var(--mb-spacing-sm);
    border-top: 1px solid var(--mb-beige);
    font-size: 0.875rem;
    color: var(--mb-gray-dark) !important;
}

.mb-fotobox-layouts__item h3 {
    font-family: var(--mb-font-heading);
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: var(--mb-spacing-xs);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-layouts__item p {
    font-size: 0.875rem;
    color: var(--mb-gray) !important;
}

.mb-fotobox-layouts__info {
    max-width: 800px;
    margin: 0 auto var(--mb-spacing-2xl);
}

.mb-fotobox-layouts__info-box {
    display: flex;
    gap: var(--mb-spacing-md);
    background: rgba(15, 125, 140, 0.1);
    border: 2px solid var(--mb-petrol);
    border-radius: var(--mb-radius-md);
    padding: var(--mb-spacing-lg);
}

.mb-fotobox-layouts__info-box svg {
    flex-shrink: 0;
    stroke: var(--mb-petrol) !important;
}

.mb-fotobox-layouts__info-box h4 {
    font-family: var(--mb-font-heading);
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: var(--mb-spacing-xs);
    color: var(--mb-petrol) !important;
}

.mb-fotobox-layouts__info-box p {
    font-size: 1rem;
    color: var(--mb-gray-dark) !important;
}

.mb-fotobox-layouts__info-box strong {
    color: var(--mb-petrol) !important;
}

.mb-fotobox-layouts__cta {
    text-align: center;
}

.mb-fotobox-layouts__button {
    display: inline-block;
    font-family: var(--mb-font-body);
    font-size: 1rem;
    font-weight: 600;
    color: var(--mb-white) !important;
    background: var(--mb-petrol) !important;
    padding: var(--mb-spacing-md) var(--mb-spacing-xl);
    border-radius: var(--mb-radius-full);
    text-decoration: none;
    transition: var(--mb-transition);
}

.mb-fotobox-layouts__button:hover {
    background: var(--mb-petrol-dark) !important;
    transform: translateY(-2px);
    box-shadow: var(--mb-shadow-md);
}

/* ========================================
   MOBILE OPTIMIERUNGEN
======================================== */

@media (max-width: 768px) {
    .mb-fotobox-galerie__title,
    .mb-fotobox-layouts__title {
        font-size: 1.875rem;
    }
    
    .mb-fotobox-galerie__subtitle,
    .mb-fotobox-layouts__subtitle {
        font-size: 1rem;
    }
    
    .mb-fotobox-layouts__info-box {
        flex-direction: column;
    }
}



/* ========================================
   8. USPs (WARUM MITTEL-BAR?)
======================================== */

.mb-fotobox-usps {
    padding: var(--mb-spacing-3xl) 0;
    background: var(--mb-white) !important;
}

.mb-fotobox-usps__title {
    font-family: var(--mb-font-heading);
    font-size: 2.5rem;
    font-weight: 400;
    text-align: center;
    margin-bottom: var(--mb-spacing-md);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-usps__subtitle {
    text-align: center;
    font-size: 1.125rem;
    color: var(--mb-gray) !important;
    margin-bottom: var(--mb-spacing-2xl);
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.mb-fotobox-usps__subtitle strong {
    color: var(--mb-petrol) !important;
}

.mb-fotobox-usps__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--mb-spacing-xl);
}

@media (max-width: 1024px) {
    .mb-fotobox-usps__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .mb-fotobox-usps__grid {
        grid-template-columns: 1fr;
    }
}

.mb-fotobox-usps__item {
    text-align: center;
    padding: var(--mb-spacing-lg);
}

.mb-fotobox-usps__icon {
    font-size: 3rem;
    margin-bottom: var(--mb-spacing-md);
}

.mb-fotobox-usps__item h3 {
    font-family: var(--mb-font-heading);
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: var(--mb-spacing-sm);
    color: var(--mb-petrol) !important;
}

.mb-fotobox-usps__item p {
    font-size: 0.875rem;
    color: var(--mb-gray) !important;
}

/* ========================================
   9. MARCEL (PERSÖNLICHER SERVICE)
======================================== */

.mb-fotobox-marcel {
    padding: var(--mb-spacing-3xl) 0;
    background: var(--mb-cream) !important;
}

.mb-fotobox-marcel__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--mb-spacing-2xl);
    align-items: center;
}

@media (max-width: 1024px) {
    .mb-fotobox-marcel__grid {
        grid-template-columns: 1fr;
    }
}

.mb-fotobox-marcel__title {
    font-family: var(--mb-font-heading);
    font-size: 2.5rem;
    font-weight: 400;
    margin-bottom: var(--mb-spacing-lg);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-marcel__title em {
    font-style: italic;
    color: var(--mb-petrol) !important;
}

.mb-fotobox-marcel__text {
    font-size: 1rem;
    line-height: 1.8;
    color: var(--mb-gray-dark) !important;
    margin-bottom: var(--mb-spacing-lg);
}

.mb-fotobox-marcel__text p {
    margin-bottom: var(--mb-spacing-md);
}

.mb-fotobox-marcel__text strong {
    color: var(--mb-petrol) !important;
    font-weight: 700;
}

.mb-fotobox-marcel__signature {
    font-family: var(--mb-font-heading);
    font-size: 1.25rem;
    font-style: italic;
    color: var(--mb-petrol) !important;
}

.mb-fotobox-marcel__cta {
    display: inline-block;
    font-family: var(--mb-font-body);
    font-size: 1rem;
    font-weight: 600;
    color: var(--mb-white) !important;
    background: var(--mb-petrol) !important;
    padding: var(--mb-spacing-md) var(--mb-spacing-xl);
    border-radius: var(--mb-radius-full);
    text-decoration: none;
    transition: var(--mb-transition);
}

.mb-fotobox-marcel__cta:hover {
    background: var(--mb-petrol-dark) !important;
    transform: translateY(-2px);
    box-shadow: var(--mb-shadow-md);
}

.mb-fotobox-marcel__video {
    position: relative;
}

.mb-fotobox-marcel__video video {
    width: 100%;
    border-radius: var(--mb-radius-lg);
    box-shadow: var(--mb-shadow-lg);
}

.mb-fotobox-marcel__video-caption {
    text-align: center;
    font-size: 0.875rem;
    color: var(--mb-gray) !important;
    margin-top: var(--mb-spacing-sm);
}

/* ========================================
   10. PREIS-BOX (TRANSPARENZ)
======================================== */

.mb-fotobox-preis-box {
    padding: var(--mb-spacing-2xl) 0;
    background: var(--mb-white) !important;
}

.mb-fotobox-preis-box__title {
    font-family: var(--mb-font-heading);
    font-size: 2rem;
    font-weight: 400;
    text-align: center;
    margin-bottom: var(--mb-spacing-xl);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-preis-box__title em {
    font-style: italic;
    color: var(--mb-gold) !important;
}

.mb-fotobox-preis-box__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--mb-spacing-lg);
    max-width: 800px;
    margin: 0 auto var(--mb-spacing-lg);
}

@media (max-width: 768px) {
    .mb-fotobox-preis-box__grid {
        grid-template-columns: 1fr;
    }
}

.mb-fotobox-preis-box__item {
    text-align: center;
    padding: var(--mb-spacing-lg);
    background: var(--mb-cream) !important;
    border-radius: var(--mb-radius-md);
    border: 2px solid transparent;
    transition: var(--mb-transition);
}

.mb-fotobox-preis-box__item:hover {
    border-color: var(--mb-petrol) !important;
    transform: translateY(-4px);
}

.mb-fotobox-preis-box__item--featured {
    border-color: var(--mb-petrol) !important;
    background: var(--mb-white) !important;
}

.mb-fotobox-preis-box__price {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--mb-petrol) !important;
    margin-bottom: var(--mb-spacing-xs);
}

.mb-fotobox-preis-box__label {
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--mb-gray) !important;
}

.mb-fotobox-preis-box__note {
    text-align: center;
    font-size: 0.875rem;
    color: var(--mb-gray) !important;
}

/* Fortsetzung folgt in Teil 3... */

/* ========================================
   11. VIDEO-CAROUSEL
======================================== */

.mb-fotobox-videos {
    padding: var(--mb-spacing-3xl) 0;
    background: var(--mb-cream) !important;
}

.mb-fotobox-videos__title {
    font-family: var(--mb-font-heading);
    font-size: 2.5rem;
    font-weight: 400;
    text-align: center;
    margin-bottom: var(--mb-spacing-md);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-videos__title em {
    font-style: italic;
    color: var(--mb-petrol) !important;
}

.mb-fotobox-videos__subtitle {
    text-align: center;
    font-size: 1.125rem;
    color: var(--mb-gray) !important;
    margin-bottom: var(--mb-spacing-2xl);
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.mb-fotobox-videos__carousel {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
}

.mb-fotobox-videos__track {
    display: flex;
    gap: var(--mb-spacing-md);
    overflow: hidden;
    transition: transform 0.5s ease;
}

.mb-fotobox-videos__slide {
    flex: 0 0 calc((100% - 2 * var(--mb-spacing-md)) / 3);
    position: relative;
}

@media (max-width: 1024px) {
    .mb-fotobox-videos__slide {
        flex: 0 0 calc((100% - var(--mb-spacing-md)) / 2);
    }
}

@media (max-width: 768px) {
    .mb-fotobox-videos__slide {
        flex: 0 0 100%;
    }
}

.mb-fotobox-videos__slide a {
    display: block;
    position: relative;
    text-decoration: none;
    border-radius: var(--mb-radius-md);
    overflow: hidden;
    box-shadow: var(--mb-shadow-sm);
    transition: var(--mb-transition);
}

.mb-fotobox-videos__slide a:hover {
    transform: translateY(-4px);
    box-shadow: var(--mb-shadow-md);
}

.mb-fotobox-videos__slide img {
    width: 100%;
    aspect-ratio: 9 / 16;
    object-fit: cover;
    display: block;
}

.mb-fotobox-videos__play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
    height: 60px;
    background: rgba(0, 95, 107, 0.9) !important;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: var(--mb-white) !important;
    transition: var(--mb-transition);
}

.mb-fotobox-videos__slide a:hover .mb-fotobox-videos__play {
    background: var(--mb-petrol) !important;
    transform: translate(-50%, -50%) scale(1.1);
}

.mb-fotobox-videos__slide p {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: var(--mb-spacing-md);
    background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
    color: var(--mb-white) !important;
    font-size: 0.875rem;
    font-weight: 600;
}

.mb-fotobox-videos__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
    background: var(--mb-white) !important;
    border: 2px solid var(--mb-petrol) !important;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: var(--mb-transition);
    z-index: 10;
}

.mb-fotobox-videos__nav:hover:not(:disabled) {
    background: var(--mb-petrol) !important;
}

.mb-fotobox-videos__nav:hover:not(:disabled) svg {
    stroke: var(--mb-white) !important;
}

.mb-fotobox-videos__nav:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.mb-fotobox-videos__nav svg {
    stroke: var(--mb-petrol) !important;
}

.mb-fotobox-videos__nav--prev {
    left: -25px;
}

.mb-fotobox-videos__nav--next {
    right: -25px;
}

@media (max-width: 768px) {
    .mb-fotobox-videos__nav {
        width: 40px;
        height: 40px;
    }
    
    .mb-fotobox-videos__nav--prev {
        left: 0;
    }
    
    .mb-fotobox-videos__nav--next {
        right: 0;
    }
}

/* ========================================
   12. TESTIMONIALS (MIT BILDERN)
======================================== */

.mb-fotobox-testimonials {
    padding: var(--mb-spacing-3xl) 0;
    background: var(--mb-white) !important;
}

.mb-fotobox-testimonials__title {
    font-family: var(--mb-font-heading);
    font-size: 2.5rem;
    font-weight: 400;
    text-align: center;
    margin-bottom: var(--mb-spacing-2xl);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-testimonials__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--mb-spacing-xl);
    margin-bottom: var(--mb-spacing-xl);
}

@media (max-width: 1024px) {
    .mb-fotobox-testimonials__grid {
        grid-template-columns: 1fr;
        max-width: 600px;
        margin-left: auto;
        margin-right: auto;
    }
}

.mb-fotobox-testimonial {
    background: var(--mb-cream) !important;
    border-radius: var(--mb-radius-lg);
    overflow: hidden;
    box-shadow: var(--mb-shadow-sm);
    transition: var(--mb-transition);
}

.mb-fotobox-testimonial:hover {
    transform: translateY(-4px);
    box-shadow: var(--mb-shadow-md);
}

.mb-fotobox-testimonial__image {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    display: block;
}

.mb-fotobox-testimonial__content {
    padding: var(--mb-spacing-lg);
}

.mb-fotobox-testimonial__stars {
    display: flex;
    gap: 4px;
    margin-bottom: var(--mb-spacing-md);
}

.mb-fotobox-testimonial__quote {
    font-size: 0.875rem;
    font-style: italic;
    line-height: 1.6;
    color: var(--mb-gray-dark) !important;
    margin-bottom: var(--mb-spacing-md);
}

.mb-fotobox-testimonial__name {
    font-weight: 700;
    color: var(--mb-petrol) !important;
    margin-bottom: 4px;
}

.mb-fotobox-testimonial__event {
    font-size: 0.875rem;
    color: var(--mb-gray) !important;
}

.mb-fotobox-testimonials__link {
    text-align: center;
}

.mb-fotobox-testimonials__link a {
    display: inline-block;
    font-size: 1rem;
    font-weight: 600;
    color: var(--mb-petrol) !important;
    text-decoration: none;
    transition: var(--mb-transition);
}

.mb-fotobox-testimonials__link a:hover {
    color: var(--mb-petrol-dark) !important;
    text-decoration: underline;
}

/* ========================================
   13. SUPPORT-SEKTION (MIT PARALLAX-HINTERGRUND)
======================================== */

.mb-fotobox-support {
    padding: var(--mb-spacing-3xl) 0;
    position: relative; /* Für Parallax */
    overflow: hidden; /* Verhindert Overflow */
    background: var(--mb-cream) !important; /* Fallback */
}

/* Parallax-Hintergrund */
.mb-fotobox-support__parallax {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('/wp-content/uploads/2026/02/2024-12-31-16.13.06-scaled-400x4001-1.jpg'); /* ← DEIN BILD HIER */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed; /* Parallax-Effekt */
    z-index: 1;
}

/* Gradient-Overlay (weiß → cremefarben, oben deckend → unten transparent) */
.mb-fotobox-support__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        to bottom,
        rgba(255, 255, 255, 0.95) 0%,      /* Oben: Fast deckend (weiß) */
        rgba(245, 242, 238, 0.85) 30%,     /* Mitte-oben: Cremefarben */
        rgba(245, 242, 238, 0.7) 60%,      /* Mitte-unten: Weniger deckend */
        rgba(245, 242, 238, 0.5) 100%      /* Unten: Noch weniger deckend */
    ) !important;
    z-index: 2;
}

/* Container über Parallax */
.mb-fotobox-support .mb-container {
    position: relative;
    z-index: 3; /* Über Parallax + Overlay */
}

.mb-fotobox-support__title {
    font-family: var(--mb-font-heading);
    font-size: 2.5rem;
    font-weight: 400;
    text-align: center;
    margin-bottom: var(--mb-spacing-md);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-support__subtitle {
    text-align: center;
    font-size: 1.125rem;
    color: var(--mb-gray) !important;
    margin-bottom: var(--mb-spacing-2xl);
}

.mb-fotobox-support__buttons {
    display: flex;
    justify-content: center;
    gap: var(--mb-spacing-md);
    flex-wrap: wrap;
}

.mb-fotobox-support__button {
    display: inline-flex;
    align-items: center;
    gap: var(--mb-spacing-sm);
    font-family: var(--mb-font-body);
    font-size: 1rem;
    font-weight: 600;
    padding: var(--mb-spacing-md) var(--mb-spacing-xl);
    border-radius: var(--mb-radius-full);
    text-decoration: none;
    transition: var(--mb-transition);
}

.mb-fotobox-support__button--phone {
    background: var(--mb-petrol) !important;
    color: var(--mb-white) !important;
}

.mb-fotobox-support__button--phone:hover {
    background: var(--mb-petrol-dark) !important;
    transform: translateY(-2px);
    box-shadow: var(--mb-shadow-md);
}

.mb-fotobox-support__button--whatsapp {
    background: #25D366 !important;
    color: var(--mb-white) !important;
}

.mb-fotobox-support__button--whatsapp:hover {
    background: #1DA851 !important;
    transform: translateY(-2px);
    box-shadow: var(--mb-shadow-md);
}

.mb-fotobox-support__button--email {
    background: var(--mb-gold) !important;
    color: var(--mb-white) !important;
}

.mb-fotobox-support__button--email:hover {
    background: var(--mb-gold-dark) !important;
    transform: translateY(-2px);
    box-shadow: var(--mb-shadow-md);
}

/* ========================================
   MOBILE OPTIMIERUNG
======================================== */

@media (max-width: 768px) {
    /* Parallax auf Mobile deaktivieren (Performance) */
    .mb-fotobox-support__parallax {
        background-attachment: scroll; /* Kein Parallax */
    }
    
    .mb-fotobox-support__title {
        font-size: 1.875rem;
    }
    
    .mb-fotobox-support__subtitle {
        font-size: 1rem;
    }
    
    .mb-fotobox-support__buttons {
        flex-direction: column;
        align-items: stretch;
    }
    
    .mb-fotobox-support__button {
        justify-content: center;
    }
}

/* ========================================
   14. FAQ (AKKORDEON)
======================================== */

.mb-fotobox-faq {
    padding: var(--mb-spacing-3xl) 0;
    background: var(--mb-white) !important;
}

.mb-fotobox-faq__title {
    font-family: var(--mb-font-heading) !important;
    font-size: 2.5rem !important;
    font-weight: 400 !important;
    text-align: center !important;
    margin-bottom: var(--mb-spacing-2xl) !important;
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-faq__items {
    max-width: 800px !important;
    margin: 0 auto !important;
}

.mb-fotobox-faq__item {
    border-bottom: 1px solid var(--mb-beige) !important;
}

.mb-fotobox-faq__question {
    width: 100% !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: var(--mb-spacing-md) !important;
    padding: var(--mb-spacing-lg) 0 !important;
    background: none !important;
    border: none !important;
    font-family: var(--mb-font-body) !important;
    font-size: 1.125rem !important;
    font-weight: 600 !important;
    text-align: left !important;
    color: var(--mb-petrol-dark) !important;
    cursor: pointer !important;
    transition: var(--mb-transition) !important;
}

.mb-fotobox-faq__question:hover {
    color: var(--mb-petrol) !important;
}

.mb-fotobox-faq__icon {
    flex-shrink: 0 !important;
    transition: transform 0.3s ease !important;
    stroke: var(--mb-petrol) !important;
}

.mb-fotobox-faq__item.is-open .mb-fotobox-faq__icon {
    transform: rotate(180deg) !important;
}

.mb-fotobox-faq__answer {
    max-height: 0 !important;
    overflow: hidden !important;
    transition: max-height 0.3s ease !important;
}

.mb-fotobox-faq__item.is-open .mb-fotobox-faq__answer {
    max-height: 500px !important;
}

.mb-fotobox-faq__answer p {
    padding-bottom: var(--mb-spacing-lg);
    font-size: 1rem;
    line-height: 1.6;
    color: var(--mb-gray-dark) !important;
}

.mb-fotobox-faq__answer strong {
    color: var(--mb-petrol) !important;
}

/* Fortsetzung folgt in Teil 4... */

/* ========================================
   15. BUCHUNGSFORMULAR
======================================== */

.mb-fotobox-buchung {
    padding: var(--mb-spacing-3xl) 0;
    background: var(--mb-cream) !important;
}

.mb-fotobox-buchung__title {
    font-family: var(--mb-font-heading);
    font-size: 2.5rem;
    font-weight: 400;
    text-align: center;
    margin-bottom: var(--mb-spacing-md);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-buchung__subtitle {
    text-align: center;
    font-size: 1.125rem;
    color: var(--mb-gray) !important;
    margin-bottom: var(--mb-spacing-xl);
}

.mb-fotobox-buchung__fomo {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--mb-spacing-sm);
    background: rgba(166, 75, 42, 0.1);
    border: 2px solid var(--mb-petrol-complement);
    border-radius: var(--mb-radius-md);
    padding: var(--mb-spacing-md);
    margin-bottom: var(--mb-spacing-xl);
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    font-size: 1rem;
    font-weight: 600;
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-buchung__fomo svg {
    stroke: var(--mb-petrol-complement) !important;
    flex-shrink: 0;
}

.mb-fotobox-buchung__form {
    max-width: 800px;
    margin: 0 auto;
    background: var(--mb-white) !important;
    border-radius: var(--mb-radius-lg);
    padding: var(--mb-spacing-2xl);
    box-shadow: var(--mb-shadow-lg);
}

@media (max-width: 768px) {
    .mb-fotobox-buchung__form {
        padding: var(--mb-spacing-md);
    }
    
    .mb-fotobox-buchung .mb-container {
        padding: 0 var(--mb-spacing-sm);
    }
}

.mb-fotobox-buchung__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--mb-spacing-md);
}

@media (max-width: 768px) {
    .mb-fotobox-buchung__row {
        grid-template-columns: 1fr;
    }
}

.mb-fotobox-buchung__field {
    margin-bottom: var(--mb-spacing-lg);
}

.mb-fotobox-buchung__field label {
    display: block;
    font-weight: 600;
    margin-bottom: var(--mb-spacing-xs);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-buchung__field input[type="text"],
.mb-fotobox-buchung__field input[type="email"],
.mb-fotobox-buchung__field input[type="tel"],
.mb-fotobox-buchung__field textarea {
    width: 100%;
    padding: var(--mb-spacing-sm);
    border: 2px solid var(--mb-beige);
    border-radius: var(--mb-radius-sm);
    font-family: var(--mb-font-body);
    font-size: 1rem;
    color: var(--mb-gray-dark) !important;
    transition: var(--mb-transition);
}

.mb-fotobox-buchung__field input:focus,
.mb-fotobox-buchung__field textarea:focus {
    outline: none;
    border-color: var(--mb-petrol) !important;
}

.mb-fotobox-buchung__radios,
.mb-fotobox-buchung__checkboxes {
    display: flex;
    flex-direction: column;
    gap: var(--mb-spacing-sm);
}

.mb-fotobox-buchung__radio,
.mb-fotobox-buchung__checkbox {
    display: flex;
    align-items: center;
    gap: var(--mb-spacing-sm);
    cursor: pointer;
}

.mb-fotobox-buchung__radio input[type="radio"],
.mb-fotobox-buchung__checkbox input[type="checkbox"] {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    cursor: pointer;
}

.mb-fotobox-buchung__radio span,
.mb-fotobox-buchung__checkbox span {
    font-size: 0.875rem;
    color: var(--mb-gray-dark) !important;
}

.mb-fotobox-buchung__checkbox a {
    color: var(--mb-petrol) !important;
    text-decoration: underline;
}

.mb-fotobox-buchung__submit {
    width: 100%;
    font-family: var(--mb-font-body);
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--mb-white) !important;
    background: var(--mb-petrol) !important;
    border: none !important;
    border-radius: var(--mb-radius-full);
    padding: var(--mb-spacing-md) var(--mb-spacing-xl);
    cursor: pointer;
    transition: var(--mb-transition);
}

.mb-fotobox-buchung__submit:hover {
    background: var(--mb-petrol-dark) !important;
    transform: translateY(-2px);
    box-shadow: var(--mb-shadow-md);
}


/* CF7-Formular-Styling */
.mb-fotobox-buchung .wpcf7 {
    max-width: 800px;
    margin: 0 auto;
    background: var(--mb-white) !important;
    border-radius: var(--mb-radius-lg);
    padding: var(--mb-spacing-2xl);
    box-shadow: var(--mb-shadow-lg);
}

@media (max-width: 768px) {
    .mb-fotobox-buchung .wpcf7 {
        padding: var(--mb-spacing-md);
    }
}

.mb-fotobox-buchung .wpcf7 label {
    display: block;
    font-weight: 600;
    margin-bottom: var(--mb-spacing-xs);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-buchung .wpcf7 input[type="text"],
.mb-fotobox-buchung .wpcf7 input[type="email"],
.mb-fotobox-buchung .wpcf7 input[type="tel"],
.mb-fotobox-buchung .wpcf7 textarea {
    width: 100%;
    padding: var(--mb-spacing-sm);
    border: 2px solid var(--mb-beige);
    border-radius: var(--mb-radius-sm);
    font-family: var(--mb-font-body);
    font-size: 1rem;
    color: var(--mb-gray-dark) !important;
    transition: var(--mb-transition);
    margin-bottom: var(--mb-spacing-lg);
}

.mb-fotobox-buchung .wpcf7 input:focus,
.mb-fotobox-buchung .wpcf7 textarea:focus {
    outline: none;
    border-color: var(--mb-petrol) !important;
}

.mb-fotobox-buchung .wpcf7 .wpcf7-radio {
    display: flex;
    flex-direction: column;
    gap: var(--mb-spacing-sm);
    margin-bottom: var(--mb-spacing-lg);
}

.mb-fotobox-buchung .wpcf7 .wpcf7-checkbox {
    display: flex;
    flex-direction: column;
    gap: var(--mb-spacing-sm);
    margin-bottom: var(--mb-spacing-lg);
}

.mb-fotobox-buchung .wpcf7 .wpcf7-list-item {
    margin: 0;
}

.mb-fotobox-buchung .wpcf7 .wpcf7-list-item label {
    display: flex;
    align-items: center;
    gap: var(--mb-spacing-sm);
    font-weight: 400;
    cursor: pointer;
}

.mb-fotobox-buchung .wpcf7 input[type="radio"],
.mb-fotobox-buchung .wpcf7 input[type="checkbox"] {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    cursor: pointer;
}

.mb-fotobox-buchung .wpcf7 .wpcf7-submit {
    width: 100%;
    font-family: var(--mb-font-body);
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--mb-white) !important;
    background: var(--mb-petrol) !important;
    border: none !important;
    border-radius: var(--mb-radius-full);
    padding: var(--mb-spacing-md) var(--mb-spacing-xl);
    cursor: pointer;
    transition: var(--mb-transition);
}

.mb-fotobox-buchung .wpcf7 .wpcf7-submit:hover {
    background: var(--mb-petrol-dark) !important;
    transform: translateY(-2px);
    box-shadow: var(--mb-shadow-md);
}

.mb-fotobox-buchung .wpcf7 .wpcf7-acceptance label {
    font-size: 0.875rem;
    font-weight: 400;
}

.mb-fotobox-buchung .wpcf7 .wpcf7-acceptance a {
    color: var(--mb-petrol) !important;
    text-decoration: underline;
}

/* Erfolgs- und Fehlermeldungen */
.mb-fotobox-buchung .wpcf7-response-output {
    margin: var(--mb-spacing-lg) 0 0;
    padding: var(--mb-spacing-md);
    border-radius: var(--mb-radius-sm);
    font-size: 1rem;
}

.mb-fotobox-buchung .wpcf7-mail-sent-ok {
    background: rgba(15, 125, 140, 0.1);
    border: 2px solid var(--mb-petrol);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-buchung .wpcf7-validation-errors {
    background: rgba(166, 75, 42, 0.1);
    border: 2px solid var(--mb-petrol-complement);
    color: var(--mb-petrol-dark) !important;
}





/* ========================================
   16. FINALER CTA
======================================== */

.mb-fotobox-final-cta {
    padding: var(--mb-spacing-3xl) 0;
    background: var(--mb-white) !important;
}

.mb-fotobox-final-cta__title {
    font-family: var(--mb-font-heading);
    font-size: 2.5rem;
    font-weight: 400;
    text-align: center;
    margin-bottom: var(--mb-spacing-md);
    color: var(--mb-petrol-dark) !important;
}

.mb-fotobox-final-cta__title em {
    font-style: italic;
    color: var(--mb-petrol) !important;
}

.mb-fotobox-final-cta__subtitle {
    text-align: center;
    font-size: 1.125rem;
    color: var(--mb-gray) !important;
    margin-bottom: var(--mb-spacing-2xl);
}

.mb-fotobox-final-cta__buttons {
    display: flex;
    justify-content: center;
    gap: var(--mb-spacing-md);
    flex-wrap: wrap;
}

.mb-fotobox-final-cta__button {
    display: inline-block;
    font-family: var(--mb-font-body);
    font-size: 1.125rem;
    font-weight: 600;
    padding: var(--mb-spacing-md) var(--mb-spacing-xl);
    border-radius: var(--mb-radius-full);
    text-decoration: none;
    transition: var(--mb-transition);
}

.mb-fotobox-final-cta__button--primary {
    color: var(--mb-white) !important;
    background: var(--mb-petrol) !important;
}

.mb-fotobox-final-cta__button--primary:hover {
    background: var(--mb-petrol-dark) !important;
    transform: translateY(-2px);
    box-shadow: var(--mb-shadow-md);
}

.mb-fotobox-final-cta__button--secondary {
    color: var(--mb-petrol) !important;
    background: transparent !important;
    border: 2px solid var(--mb-petrol) !important;
}

.mb-fotobox-final-cta__button--secondary:hover {
    background: var(--mb-petrol) !important;
    color: var(--mb-white) !important;
    transform: translateY(-2px);
    box-shadow: var(--mb-shadow-md);
}

/* ========================================
   17. MOBILE OPTIMIERUNGEN
======================================== */

@media (max-width: 768px) {
    .mb-fotobox-pakete__title,
    .mb-fotobox-usps__title,
    .mb-fotobox-marcel__title,
    .mb-fotobox-videos__title,
    .mb-fotobox-testimonials__title,
    .mb-fotobox-support__title,
    .mb-fotobox-faq__title,
    .mb-fotobox-buchung__title,
    .mb-fotobox-final-cta__title {
        font-size: 1.875rem;
    }
    
    .mb-fotobox-pakete__subtitle,
    .mb-fotobox-usps__subtitle,
    .mb-fotobox-videos__subtitle,
    .mb-fotobox-support__subtitle,
    .mb-fotobox-buchung__subtitle,
    .mb-fotobox-final-cta__subtitle {
        font-size: 1rem;
    }
    
    .mb-fotobox-preis-box__title {
        font-size: 1.5rem;
    }
}

/* ========================================
   18. UTILITY CLASSES
======================================== */

.mb-text-center {
    text-align: center;
}

.mb-text-petrol {
    color: var(--mb-petrol) !important;
}

.mb-text-gold {
    color: var(--mb-gold) !important;
}

.mb-bg-petrol {
    background: var(--mb-petrol) !important;
}

.mb-bg-cream {
    background: var(--mb-cream) !important;
}

.mb-bg-white {
    background: var(--mb-white) !important;
}

/* ========================================
   19. SMOOTH SCROLL
======================================== */

html {
    scroll-behavior: smooth;
}

/* ========================================
   20. ACCESSIBILITY
======================================== */

*:focus-visible {
    outline: 3px solid var(--mb-petrol) !important;
    outline-offset: 2px;
}

button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ========================================
   ENDE DES CSS
======================================== *//* End custom CSS */