/* ------------------------------------------------------------------------------------ 
   ______ ____  ____   ______ ____   ___     __  ___ ______ 
  /_  __// __ \/ __ \ / ____// __ \ /   |   /  |/  // ____/ 
   / /  / / / / /_/ // /_   / /_/ // /| |  / /|_/ // __/    
  / /  / /_/ / ____// __/  / _, _// ___ | / /  / // /___    
 /_/   \____/_/    /_/    /_/ |_|/_/  |_|/_/  /_//_____/    
                                                            
/* ------------------------------------------------------------------------------------ */

/* Spezifische Farbe für die Unit */
#menu_bar_background {
    background-color: var(--unit_marketing) !important;
}

/* Die einzelnen Buttons im Submenü */
.topframe_menubar_sub a {
    background-color: var(--unit_marketing) !important;
    color: #ffffff !important;
}

/* Hover-Zustand Buttons */
.topframe_menubar_sub a:hover {
    background-color: #ffffff !important;
    color: var(--unit_marketing) !important;
}

/* RESPONSIVE MENÜ*/
@media screen and (max-width: 1440px) {
    
    /* 1. Das ausfahrbare Overlay bekommt die Unit-Farbe */
    .top_frame_menubar {
        background-color: var(--unit_marketing) !important;
    }

    /* 2. Die Buttons im Normalzustand (Unit-Farbe als Hintergrund) */
    .top_frame_menubar a {
        background-color: var(--unit_marketing) !important;
        color: #ffffff !important;
    }

    /* 3. Hover-Zustand (Invertiert: Weißer Hintergrund, Unit-Farbe als Text) */
    .top_frame_menubar a:hover,
    .top_frame_menubar a.active {
        background-color: #ffffff !important;
        color: var(--unit_marketing) !important;
    }
}


/* ------------------------------------------------------------------------------------ 
   ______ ____   _   __ ______ ______ _   __ ______ ______ ____   ___     __  ___ ______ 
  / ____// __ \ / | / //_  __// ____// | / //_  __// ____// __ \ /   |   /  |/  // ____/ 
 / /    / / / //  |/ /  / /  / __/  /  |/ /  / /  / __/  / /_/ // /| |  / /|_/ // __/    
/ /___ / /_/ // /|  /  / /  / /___ / /|  /  / /  / /    / _, _// ___ | / /  / // /___    
\____/ \____//_/ |_/  /_/  /_____//_/ |_/  /_/  /_/    /_/ |_|/_/  |_|/_/  |_/ /_____/    
                                                                                        
/* ------------------------------------------------------------------------------------ */

/* Spezifische Design-Anpassungen für den Content-Bereich */
#content_frame {
    background-color: var(--unit_marketing_BG) !important;
    background-image: url('../graphics/agentur-infinite-contentframe-BG-marketing.webp'); 
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: auto 1500px;
    width: 100%;
    position: relative;
    overflow: hidden;
}


/* ------------------------------------------------------------------------------------ 
   __________  _   _______________   ________
  / ____/ __ \/ | / /_  __/ ____/ | / /_  __/
 / /   / / / /  |/ / / / / __/ /  |/ / / /   
/ /___/ /_/ / /|  / / / / /___/ /|  / / /    
\____/\____/_/ |_/ /_/ /_____/_/ |_/ /_/     
   
/* ------------------------------------------------------------------------------------ */

/* Der Hover-Effekt: Hintergrund & Schimmer (Box-Shadow) */
.flex_box_2col_button:hover {
    background-color: var(--unit_marketing) !important;
    box-shadow: 0 0 30px rgba(84, 12, 205, 0.4); /* Schimmer in var(--unit_marketing) */
}

.flex_box_2col_button_headline {
    color: var(--unit_marketing);
}