/*
Theme Name: GLOBAL GRUPPE NORD
Theme URI: https://collectivebrain.de
Description: Child theme of Divi theme for the Divi theme
Author: Collective Brain GmbH
Author URI: https://collectivebrain.de
Template: Divi
Version: 4.4.2
*/

/* Generated by Orbisius Child Theme Creator (http://orbisius.com/products/wordpress-plugins/orbisius-child-theme-creator/) on Tue, 31 Mar 2020 06:40:29 +0000 */ 
/* The plugin now uses the recommended approach for loading the css files.*/

h1,
h2 {
    hyphens: auto;
    overflow-wrap: break-word;
}

.firstImage {
    float: left;
}

.firstText,
.secondText,
.onlyText {
    font-size: 16px;
    line-height: 24px;
}

.secondImage {
    float: right;
    margin-top: -10px;
}

.noTransform {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: center;
    margin-top: -40px;
}

.rightTextWithImage.noTransform {
    flex-direction: row;
    margin-top: -30px;
}

@media (max-width: 980px) {
    .firstImage {
        float: none;
        margin-top: 0 !important;
    }

    .leftTextWithImage,
    .rightTextWithImage {
        display: flex;
        flex-direction: column;
        margin-top: 0 !important;
    }

    .secondImage {
        float: none;
        margin-top: 0;
        width: 100% !important;
    }

    .et_section_regular .et_pb_blurb_6.et_pb_blurb .rightTextWithImage.noTransform {
        flex-direction: column;
        margin-top: 0px;
    }

    .et_section_regular .et_pb_blurb_7.et_pb_blurb .noTransform {
        display: flex;
        flex-direction: row;
    }
}

@media (max-width: 767px) {
    .firstImage img {
        max-height: 100%;
        width: auto;
    }

    .et_pb_blurb_1 .secondImage {
        float: left;
        margin-top: 0;
        width: 100%;
    }

    .firstText {
        width: 100%;
        float: left;
    }
}

.noTransform {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: start;
    margin-top: 0;
}

.rightTextWithImage.noTransform {
    flex-direction: column-reverse;
    margin-top: 0;
}

.et_pb_blurb_7.et_pb_blurb .leftTextWithImage.noTransform {
    display: flex;
    flex-direction: row-reverse;
}

.et_pb_blurb_9.et_pb_blurb .leftTextWithImage .firstImage {
    margin-top: 0 !important;
}

/* Tooltip Basis */
.et-tooltip {
    cursor: help;
}

.et-tooltip-box { 
    background: #282828 !important;
    color: #ffffff !important;
    border: #32952d solid 0px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    line-height: 1.8;
    left: 0;
    bottom: calc(100% + 25px);
    font-size: 1rem;
    padding: 15px;
    box-shadow: 2px 2px 10px 2px rgba(0,0,0,.5);
    -moz-box-shadow: 2px 2px 10px 2px rgba(0,0,0,.5);
    -webkit-box-shadow: 2px 2px 10px 2px rgba(0,0,0,.5);
    hyphens: auto;
}

.et-tooltip-arrow {
    display: block;
    bottom: -12px;
    left: 25px;
    width: 20px;
    height: 13px;
    background: none;
    border-top: 13px solid #282828;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
}

/* Divi-Elemente + Tooltip-Farbe */
.et-learn-more,
.et-tabs-container,
.tabs-left,
.et-simple-slider,
.author-shortcodes,
.et-tooltip-box {
    color: white !important;
    text-shadow: none !important;
}

/*** Responsive Styles Smartphone Only ***/
@media all and (max-width: 767px) {
    .floating-menu {
        width: 46px !important;
        height: 46px !important;
    }

    /*** Badge links mobile hinter Submenü ***/
    #vmarkt_rating_widget1 {
        z-index: 2 !important;
    }
}

@media all and (max-width: 400px) {
    .et_mobile_menu li a {
        padding-left: 10%;
        padding-top: 2px;
        padding-bottom: 2px;  
    }
}

/* MOBILE MENU-AUSGEKLAPPT. PM:Arno */
.et_pb_menu_0_tb_header.et_pb_menu .et_mobile_menu,
.et_pb_menu_0_tb_header.et_pb_menu .et_mobile_menu ul {
    background-color: #ffffff !important;
    width: 101vw;
    left: -83vw;
    top: 56px;
}

.mobile-menu-row .et_pb_column--with-menu {
    display: flex;
    align-items: center;
}

/*** SUBMENUE ***/
.cstm_menu .sub-menu li a {
    width: 275px !important;
}

/* GLOBAL FONTS CB:Arno 
   Select Font Weight for all Text Elements */
p {
    font-weight: 400;
}

/* Element <marked> – falls verwendet */
marked {
    font-weight: 500;
}

/* enlarge submenu width - PM:Arno 
@media only screen and (min-width: 981px) {
    .sub-menu,
    .sub-menu li a {
        width: 300px !important;
    }
}
*/

@media all and (max-width: 980px) {

    /* Extend all Rows to 90% – vorher 80% – CB:Arno */ 
    .et_pb_row {
        width: 90% !important;
    }

    p {
        font-size: 15px;
        line-height: 25px;
    }

    h1 {
        font-size: clamp(2.188rem, 1.293rem + 3.976vw, 4.688rem) !important;
        font-weight: 700;
        line-height: clamp(2.25rem, 1.154rem + 4.871vw, 5.313rem) !important;
    
    }

    h2 {
        font-size: 25px;
        line-height: 30px;
    }

    h5 {
        font-size: clamp(0.75rem, 0.661rem + 0.398vw, 1rem) !important;
        font-weight: 700;
        letter-spacing: 0.02em;
        line-height: clamp(1.25rem, 1.205rem + 0.199vw, 1.375rem);
        text-transform: uppercase;
    }

    h6 {
        color: #D70136 !important;
    }

    /* großer Text mit Überschriften in einer Zeile - PM:Arno */
    #inline-block one-row-text { 
        font-size: 25px;
        line-height: 35px;
    }
}

@media (max-width: 480px) {
    h1 {
        font-size: 1.65rem;
        line-height: 1.4em;
        hyphens: auto;
    }
}

/* Align images on Kästen unten - CB:Arno */ 
.flex-end { 
    align-self: flex-end; 
}

/* Change size of Buttonizer Icons - PM:Arno */ 
.buttonizer.buttonizer-desktop-has-1 .buttonizer-button.button-desktop-1 {
    width: 70px;
    height: 70px;
}

/* Remove gray line under main menu - PM:Arno */ 
#main-header {
    box-shadow: none !important;
}

/* Remove shadow when fixed header scrolling down - PM:Arno */ 
#main-header.et-fixed-header {
    -webkit-box-shadow: 0 1px 0 rgba(0,0,0,.0) !important;
    -moz-box-shadow: 0 1px 0 rgba(0,0,0,.0) !important;
    box-shadow: 0 1px 0 rgba(0,0,0,.0) !important;
    margin-bottom: 10px;
}

/* Fettschreibungen im Fließtext - PM:Arno */ 
.marked {
    font-weight: 600;
}

/* Adjust Menu font weight - PM:Arno */ 
#top-menu,
.et-menu,
nav#top-menu-nav,
nav.et-menu-nav {
    font-weight: 400;
}

.menu-bold a {
    font-weight: 600;
}

/* großer Text mit Überschriften in einer Zeile - PM:Arno */ 
#inline-block one-row-text { 
    display: inline-block; 
    font-size: 30px;
    font-weight: 400;
}

/* Ünber uns Grafik soll über Rand gehen mit Dropshadow (gelb)- PM:Arno */
.overflow-class {
    overflow: inherit !important;
}

/* LEISTUNGEN SEITE (page-id-103)
 * Remove left margin from first section text below h1 tag - PM:Panos */
.page-id-103 .first_section .et_pb_column_0 {
    padding-left: 0em;
}

/* images in karten section in mobile better positioning */
@media only screen and (max-width: 480px) {
    #karten_section .et_pb_column .et_pb_module {
        margin-bottom: 50px;
    }

    #karten_section .et_pb_column_3 {
        padding-bottom: 30px;
    }
}

/* change the icon in accordion section */
#akkordion_section .et_pb_toggle_title:before {
    content: "\3b" !important;
}

/* Changing the Floating Menu Button */
.floating-menu {
    -webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0) !important;
    box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.0) !important;
}

/* Kontakt Buttons gleiche Höhe (Desktop) */
.gq_r_fixed_buttons .et_pb_column {
    padding-bottom: 40px;
}

/* Tooltip ansprechbar über Shortcode
 * [tooltip text="..."]Text mit Tooltip[/tooltip]
 */

@media all and (min-width: 767px) {
    /* Carousel über Divi Supreme Mitarbeiter. */
    .dsm_blog_carousel .dsm-entry-image {
        width: 400px;
        height: 400px;
        margin: auto;
    }
}

.swiper-slide .dsm-entry-wrapper {
    opacity: 0;
}

.swiper-slide-active .dsm-entry-wrapper {
    opacity: 1;
}

/* Tooltip Supreme Image Tooltip Modul font size change. */
.dsm_image_hotspot_tooltip_wrapper {
    font-size: 16px !important;
}

/* Umbruch bei mobile */
@media all and (max-width: 767px) {
    #rev_slider_10_1_wrapper {
        hyphens: auto;
    }
}

/* GLOBAL Überschriften in BOLD, wenn <strong> verwendet */
h1 strong,
h2 strong,
h3 strong,
p strong,
li strong,
dt strong,
blockquote strong {
    font-family: 'Montserrat-600-semi-bold', Helvetica, Arial, Lucida, sans-serif !important;
}

h1,
h2,
h3 {
    /* text-transform: uppercase; */
}

/*Akkordeon Icon Farbe*/
.et_pb_accordion_item.et_pb_accordion_item_0.et_pb_toggle_close .et_pb_toggle_title:before {
    color: #D70036 !important;
}

.et_pb_button.chatOpen {
    font-size: 15px !important;
    padding-top: 8px !important;
    padding-right: 30px !important;
    padding-bottom: 8px !important;
    padding-left: 30px !important;
    box-shadow: 8px 8px 22px -9px rgba(0,0,0,0.3);
    margin: 0 auto !important;
}

/* Button-Wrapper zentriert */
.button-free {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

/* Support-Row aus Theme Options übernommen */
.support-row img {
    height: 250px;
}

.support-row .et_pb_column {
    min-height: 500px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}

.support-row .text {
    min-height: 143px;
}

@media print {
    #widgetPopupFrame,
    #widgetButtonFrame,
    #smartsupp-widget-container,
    .buttonizer-group,
    #chat-application-iframe {
        display: none !important;
    }
}

/* SUBMENU CHANGE – aus Theme Options übernommen */
.et_pb_fullwidth_menu_0_tb_header.et_pb_fullwidth_menu .et-menu-nav li ul.sub-menu {
    min-width: 350px !important;
}

.et_pb_fullwidth_menu_0_tb_header.et_pb_fullwidth_menu .et-menu-nav li ul.sub-menu a {
    margin-left: -8px;
    width: 109% !important;
}

.et_mobile_menu li a:hover,
.nav ul li a:hover {
    background-color: white;
}

/* 2025 -------------------------------------------------------------*/

/* Drop Down Menu breiter machen - Customizer Code */
.menu .et-menu-nav li ul.sub-menu {
    min-width: 350px !important;
}

.et_pb_menu .sub-menu {
    min-width: 350px !important;
}

/* COPYRIGHT hochgestellt im Markennamen */
.reg {
    font-size: .7em;
    vertical-align: super;
    line-height: 0;
}

/* Font Size global für Text */
body p,
body ul,
body ol,
body li {
    font-size: 1rem; /* Fallback */
    font-size: clamp(0.875rem, 0.741rem + 0.596vw, 1.25rem);
    line-height: 1.6;
}

/* -------------------------------------------------------------    
   Footer roter Schweif
------------------------------------------------------------- */

.gg-swoosh {
    position: relative;
    overflow: hidden; /* verhindert Scrollbalken, falls das SVG übersteht */
    z-index: 0;       /* Content kann darüber gelegt werden */
}

/* Roter Schweif unten rechts */
.gg-swoosh::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: min(20vw, 900px);
    aspect-ratio: 1 / 1;
    background-image: url("/wp-content/uploads/2025/10/download.svg");
    background-repeat: no-repeat;
    background-position: right bottom;
    background-size: contain;
    pointer-events: none;
    z-index: 0;
}

/* Content im Footer oberhalb halten */
.gg-swoosh > * {
    position: relative;
    z-index: 1;
}

/* Responsives Feintuning */
@media (max-width: 980px) {
    .gg-swoosh::after {
        width: 45vw;
    }
}

/* -------------------------------------------------------------    
   HERO IMAGE SEKTION
------------------------------------------------------------- */

/* Row-Hero mit Rundungen + Deko */
.et_pb_row.first-section {
    --corner: clamp(60px, 2.296rem + 6.46vw, 125px);
    position: relative;
    border-top-left-radius: var(--corner);
    border-bottom-right-radius: var(--corner);
    border-top-right-radius: 0;
    border-bottom-left-radius: 0;
    overflow: hidden;             
    background-clip: padding-box; 
    z-index: 5;                   
    margin-left: auto;            
    margin-right: auto;
}

/* Inhalt (Texte) sicher oberhalb des Bildes */
.et_pb_row.first-section > .et_pb_column {
    position: relative;
    z-index: 6;
}

/* Rote Viertel-Bögen */
.et_pb_row.first-section::before,
.et_pb_row.first-section::after {
    content: "";
    position: absolute;
    width: var(--corner);
    height: var(--corner);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    pointer-events: none;
    z-index: 7;
}

.et_pb_row.first-section::before {
    top: 0;
    left: 0;
    background-image: url(/wp-content/uploads/2025/08/corner-left-top-full.svg);
}

.et_pb_row.first-section::after {
    right: 0;
    bottom: 0;
    background-image: url(/wp-content/uploads/2025/08/corner-right-bottom-full.svg);
}

/* Falls die SECTION Shape-Divider hat: darunter stapeln */
.et_pb_section .et_pb_bottom_inside_divider,
.et_pb_section .et_pb_top_inside_divider {
    position: relative;
    z-index: 1;
}

/* Optional (falls weiße Ränder sichtbar sind) */
.et_pb_row.first-section {
    padding: 0;
}

/* -------------------------------------------------------------    
   BILD MIT RUNDEN ECKEN UND DEKO-ELEMENTEN
------------------------------------------------------------- */

.et_pb_image.image-rounded {
    --corner: clamp(60px, 2.296rem + 6.46vw, 125px);
    position: relative;
    margin: 0 !important;
    line-height: 0;
}

/* Wrapper clippt das Bild */
.et_pb_image.image-rounded .et_pb_image_wrap {
    position: relative;
    display: block;
    overflow: hidden;
    border-top-left-radius: var(--corner);
    border-bottom-right-radius: var(--corner);
    border-top-right-radius: 0;
    border-bottom-left-radius: 0;
}

/* Falls das Bild verlinkt ist */
.et_pb_image.image-rounded .et_pb_image_wrap > a {
    display: block;
    border-radius: inherit;
    overflow: hidden;
}

/* Bild übernimmt die Rundung */
.et_pb_image.image-rounded img,
.et_pb_image.image-rounded .et_pb_image_wrap > a > img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: inherit;
}

/* Deko am Wrapper */
.et_pb_image.image-rounded .et_pb_image_wrap::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: var(--corner);
    height: var(--corner);
    background: url(/wp-content/uploads/2025/08/corner-left-top-full.svg) no-repeat;
    background-size: 100% 100%;
    z-index: 2;
    pointer-events: none;
}

.et_pb_image.image-rounded .et_pb_image_wrap::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: var(--corner);
    height: var(--corner);
    background: url(/wp-content/uploads/2025/08/corner-right-bottom-full.svg) no-repeat;
    background-size: 100% 100%;
    z-index: 2;
    pointer-events: none;
}

/* Alternative Hero-Variante: Column-After für BR-Ecke */
.et_pb_row.first-section {
    --corner: clamp(60px, 2.296rem + 6.46vw, 125px);
    position: relative;
    overflow: hidden;
    border-top-left-radius: var(--corner);
    border-bottom-right-radius: var(--corner);
    z-index: 5;
    background-clip: padding-box;
}

/* TL an der Row */
.et_pb_row.first-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: var(--corner);
    height: var(--corner);
    background: url(/wp-content/uploads/2025/08/corner-left-top-full.svg) no-repeat 0 0 / 100% 100%;
    z-index: 7;
    pointer-events: none;
}

/* BR an der Column (vermeidet Clearfix-Konflikte) */
.et_pb_row.first-section > .et_pb_column::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: var(--corner);
    height: var(--corner);
    background: url(/wp-content/uploads/2025/08/corner-right-bottom-full.svg) no-repeat 0 0 / 100% 100%;
    z-index: 7;
    pointer-events: none;
}

/* Column positioned für ::after */
.et_pb_row.first-section > .et_pb_column {
    position: relative;
    z-index: 6; /* Text über Bild/Overlays */
}

/* Falls Section-Shape-Divider aktiv: darunter stapeln */
.et_pb_section .et_pb_bottom_inside_divider,
.et_pb_section .et_pb_top_inside_divider {
    position: relative;
    z-index: 1;
}


 /* CTA MENU --------------------------------------------- */
/* Li-Container des CTA Buttons vertikal mittig ausrichten */
.et_pb_menu__menu ul.et-menu > li.menu-phone-btn {
    padding: 0 !important;
    margin: 0 0 0 30px !important;   /* Abstand nach links zum Menü */
    display: flex !important;        /* Flex-Item */
    align-items: center !important;  /* vertikal mittig */
}

/* CTA Menübutton – Desktop, kompakter */
.et_pb_menu__menu ul.et-menu > li.menu-phone-btn > a {
    background-color: #00a7b6 !important;
    color: #ffffff !important;
    font-size: 15px;
    font-family: 'Montserrat-700', Helvetica, Arial, Lucida, sans-serif !important;
    display: inline-flex !important;
    align-items: center;             /* Icon + Text mittig */
    height: auto !important;
    line-height: 1.3 !important;
    padding: 12px 2.2em !important;   /* etwas mehr Abstand rundherum */
    margin: 0 !important;
    border-radius: 1em 0 !important;
    font-weight: 700;
    transition: all 0.2s ease-in-out;
}

/* Icon */
.et_pb_menu__menu ul.et-menu > li.menu-phone-btn > a::before {
    content: "\e090";
    font-family: "ETmodules";
    font-size: 14px;
    line-height: 1;
    color: #ffffff;
    margin-right: 0.6em;
}

/* Hover */
.et_pb_menu__menu ul.et-menu > li.menu-phone-btn > a:hover {
    background-color: #a2b1c4 !important;
    color: black !important;
    border-radius: 1em 0 !important;
}

/* Icon auf Hover schwarz */
.et_pb_menu__menu ul.et-menu > li.menu-phone-btn > a:hover::before {
    color: #000000 !important;            /* → Icon wird schwarz */
}


/* MOBILE CTA BUTTON ---------------------------------------------- */
.et_mobile_menu li.menu-phone-btn > a {
    background-color: #00a7b6 !important;
    color: #ffffff !important;        /* ← Text IMMER weiß im Normalzustand */

    font-size: 15px !important;
    font-family: 'Montserrat-700', Helvetica, Arial, Lucida, sans-serif !important;
    font-weight: 700 !important;

    display: flex !important;
    align-items: center !important;

    padding: 12px 2.2em !important;
    margin: 10px 0 !important;

    border-radius: 1em 0 !important;
    transition: all 0.2s ease-in-out;
}

/* Mobile Icon */
.et_mobile_menu li.menu-phone-btn > a::before {
    content: "\e090";
    font-family: "ETmodules";
    font-size: 16px;
    line-height: 1;
    color: #ffffff !important;      /* ← Icon ebenfalls weiß */
    margin-right: 0.6em;
}

/* MOBILE Hover */
.et_mobile_menu li.menu-phone-btn > a:hover {
    background-color: #a2b1c4 !important;
    color: #000000 !important;      /* ← Text wird schwarz auf Hover */
    border-radius: 1em 0 !important;
}

/* Mobile Icon Hover */
.et_mobile_menu li.menu-phone-btn > a:hover::before {
    color: #000000 !important;      /* ← Icon wird schwarz auf Hover */
}

/* MOBILE: Text im CTA-Button wirklich weiß erzwingen */
@media (max-width: 980px) {
  body #page-container .et_mobile_menu li.menu-phone-btn > a,
  body #page-container .et_mobile_menu li.menu-phone-btn > a:link,
  body #page-container .et_mobile_menu li.menu-phone-btn > a:visited {
    color: #ffffff !important;   /* Text weiß */
  }
}


/* MOBILE MENU------------------------------------------------
------------------------------------------------------------ */
.et_mobile_menu {border-top: transparent;}

.et_pb_fullwidth_menu_0_tb_header.et_pb_fullwidth_menu .et_mobile_menu, .et_pb_fullwidth_menu_0_tb_header.et_pb_fullwidth_menu .et_mobile_menu ul {
    top: 8vh;
}