/*
 Theme Name:   Divi Child Bulli Bande
 Description:  Clean Light Edition - High Contrast & Fresh Look
 Template:     Divi
 Version:      5.3.0
*/

/* ==========================================================================
   1. DESIGN SYSTEM (Light & Fresh)
   ========================================================================== */
:root {
    --bb-bg-light: #ffffff;
    --bb-bg-alt: #f4f7f6;
    --bb-primary: #54a59d;
    --bb-primary-hover: #3d7e77;
    --bb-text-dark: #2c3e50;
    --bb-text-muted: #7f8c8d;
    --bb-heading: #1a252f;
    --bb-border: #e0e6e6;
    --bb-radius: 8px;
}

/* ==========================================================================
   2. GLOBAL RESET
   ========================================================================== */
body, #page-container {
    background-color: var(--bb-bg-light) !important;
    color: var(--bb-text-dark);
}

.et_pb_section {
    background-color: var(--bb-bg-light) !important;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--bb-heading) !important;
}

/* ==========================================================================
   3. HEADER & MENU (Pure White & Wide Sub-Menu)
   ========================================================================== */
#main-header,
#top-header,
#main-header .nav li ul,
#top-menu .sub-menu,
.et_mobile_menu {
    background-color: var(--bb-bg-light) !important;
    box-shadow: 0 2px 15px rgba(0,0,0,0.05) !important;
}

#top-menu li a {
    color: var(--bb-text-dark) !important;
    font-weight: 600;
}

#top-menu li a:hover {
    color: var(--bb-primary) !important;
}

#top-menu .sub-menu {
    min-width: 320px !important;
    border-top: 3px solid var(--bb-primary) !important;
}

#top-menu li li a {
    width: 280px !important;
    white-space: nowrap !important;
    padding: 10px 20px !important;
}


/* ==========================================================================
   4. HEADER IMAGE STYLES (The Spectacular "Glow & Texture" Treatment)
   ========================================================================== */
.et_pb_fullwidth_header {
    position: relative;
    background-color: var(--bb-bg-light) !important;
    overflow: hidden;
}

/* Der "Master Filter": Kombiniert Farbe, Textur und Tiefe */
.et_pb_fullwidth_header:before {
    content: "";
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    
    /* 1. Ein kräftiger Petrol-Verlauf von den Seiten (Vignette)
       2. Ein diagonales Raster-Muster (kaschiert Unschärfe)
       3. Ein weicher Glow-Effekt in der Mitte
    */
    background: 
        /* Dezentes Linien-Raster für den "Techno-Food"-Look */
        repeating-linear-gradient(45deg, rgba(255,255,255, 0.03) 0px, rgba(255,255,255, 0.03) 1px, transparent 1px, transparent 4px),
        /* Kräftige farbige Vignette */
        radial-gradient(circle at center, transparent 10%, rgba(84, 165, 157, 0.5) 70%, rgba(44, 62, 80, 0.9) 100%),
        /* Weißer Auslauf nach unten (Light Theme Bridge) */
        linear-gradient(to bottom, transparent 70%, var(--bb-bg-light) 100%);
    
    /* Multiply sorgt dafür, dass die Textur mit dem Bild verschmilzt */
    background-blend-mode: overlay, multiply, normal; 
    
    z-index: 1 !important;
    pointer-events: none;
    display: block !important;
}

/* --- TEXT TREATMENT (3D-Floating Effekt) --- */
.et_pb_fullwidth_header_container { 
    z-index: 2 !important; 
    position: relative; 
}

.et_pb_fullwidth_header h1 {
    /* Ein "Heavy Weight" Schatten: Scharfer Kern + weiter Glow */
    text-shadow: 
        0 4px 10px rgba(0,0,0,0.8), 
        0 0 40px rgba(84, 165, 157, 0.6) !important; 
    color: #ffffff !important;
    text-transform: uppercase;
    letter-spacing: 3px;
    /* Optionaler kleiner Zoom-Effekt beim Laden */
    animation: header-zoom 1.5s ease-out;
}

@keyframes header-zoom {
    from { transform: scale(1.1); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

/* --- TEXT DROP SHADOW FIX --- */

.et_pb_fullwidth_header_container {
    z-index: 2 !important;
    position: relative;
}

/* Gezielter Schatten für alle Texte im Header-Modul */
.et_pb_fullwidth_header h1,

.et_pb_fullwidth_header .et_pb_module_header,
.et_pb_fullwidth_header .et_pb_header_content_wrapper,
.et_pb_fullwidth_header p {
    text-shadow: 4px 4px 4px rgba(0, 0, 0, 0.75) !important;
    color: #ffffff !important; /* Erzwingt Weiß, damit der Schatten wirkt */
}

.et_pb_fullwidth_header_subhead {
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.75) !important;
    color: #ffffff !important; /* Erzwingt Weiß, damit der Schatten wirkt */
}


.et_pb_fullwidth_header .et_pb_fullwidth_header_container {
    width: 90%;
}

.et_pb_fullwidth_header .et_pb_fullwidth_header_container.center .header-content {
    margin: 20px auto;
    width: 100%;
    max-width: 100%;
}    
    
/* ==========================================================================
   5. KARTEN & MODULE
   ========================================================================== */
.bulli-card, .grw-slice-container {
    background-color: #ffffff !important;
    border: 1px solid var(--bb-border) !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05) !important;
    border-radius: var(--bb-radius) !important;
}

.et_pb_module.et_pb_divider:before {
    border-top-color: var(--bb-border) !important;
}





/* ==========================================================================
   4. FOOTER STYLING (Final Light Theme Fix)
   ========================================================================== */
footer,
.et_pb_section_0_tb_footer.et_pb_section {
    background-color: var(--bb-bg-alt) !important;
    border-top: 1px solid var(--bb-border) !important;
    padding: 0 0 0 0 !important;
    display: block !important;
}

/* Alle Texte im Footer auf Dunkelgrau zwingen */
footer p,
footer span,
footer li,
footer a,
footer div,
footer label,
.et_pb_section_0_tb_footer .et_pb_text_inner,
.et_pb_menu_0_tb_footer .nav li a {
    font-size: 15px !important;
}

/* Footer Überschriften in Petrol */
footer h4,
footer .widget_title,
.et_pb_section_0_tb_footer h1,
.et_pb_section_0_tb_footer h2,
.et_pb_section_0_tb_footer h3 {
    color: var(--bb-primary) !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    margin-bottom: 15px !important;
}

/* Hover-Effekte für Footer-Links */
footer a:hover,
.et_pb_section_0_tb_footer a:hover {
    color: var(--bb-primary-hover) !important;
    text-decoration: underline !important;
}

/* Social Media Icons */
footer .et-social-icon a:before {
    color: var(--bb-text-dark) !important;
}

footer .et-social-icon a:hover:before {
    color: var(--bb-primary) !important;
}

/* Unterste Copyright-Leiste (falls vorhanden) */
#footer-bottom {
    background-color: var(--bb-bg-light) !important;
    border-top: 1px solid var(--bb-border) !important;
}