/*
 Theme Name:     Divi Child
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Divi Child Theme
 Author:         blueMARKETING
 Author URI:     https://www.blue-marketing.de
 Template:       Divi
 Version:        1.0.0
*/

/* =Theme customization starts here
------------------------------------------------------- */

.topbar-row {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.topbar-row .et_pb_column {
    margin-bottom: 0;
}

@media (max-width: 768px) {
    .topbar-row {
        flex-wrap: wrap;
        gap: 0;
        row-gap: 0.25rem;
    }

    /* Spalte 1: 40% Breite minus einen Teil des Gaps */
    .topbar-row > .et_pb_column:nth-child(1) {
        flex: 0 0 40%;
        width: 40%;
    }

    /* Spalte 2: 60% Breite minus einen Teil des Gaps */
    .topbar-row > .et_pb_column:nth-child(2) {
        flex: 0 0 60%;
        width: 60%;
    }

    /* Spalte 3: Volle Breite & Zentriert */
    .topbar-row > .et_pb_column:last-child {
        flex: 0 0 100%;
        width: 100%;
        text-align: center;
        margin-left: 0;
    }
}
@media (max-width: 980px) {
    .et_pb_row_0_tb_header .et_pb_column_1_4 {
        margin-right: 0;
    }
    .topbar-row .et_pb_blurb_content {
        justify-content: center;
    }
}

/* Blurb-Inhalt als Flexbox */
.topbar-row .et_pb_blurb_content {
    display: flex;
    align-items: center; /* vertikale Zentrierung */
}

/* Icon-Wrapper */
.topbar-row .et_pb_main_blurb_image {
    margin-bottom: 0; /* Divi-Standard entfernen */
    margin-right: 0.5rem; /* Abstand Icon → Text */
    line-height: 0; /* verhindert vertikales "Zucken" */
}
@media (max-width: 768px) {
    .topbar-row .et_pb_main_blurb_image {
        margin-bottom: 0; /* Divi-Standard entfernen */
        margin-right: 0.25rem; /* Abstand Icon → Text */
        line-height: 0; /* verhindert vertikales "Zucken" */
    }
}
/* Text-Container */
.topbar-row .et_pb_blurb_container {
    padding: 0;
}

/* Absatzabstände entfernen */
.topbar-row .et_pb_blurb_description p {
    margin: 0;
}

span.subtext {
    color: #6a5f56;
    text-transform: uppercase;
    line-height: 1.8rem;
    font-weight: 700;
    letter-spacing: 0.25rem;
    display: block;
}

/* Blurb volle Breite */
.wide-flex-blurb {
    width: 100%;
}

/* Flex-Layout */
.wide-flex-blurb .et_pb_blurb_content {
    display: flex;
    align-items: center;
    width: 100%;
    max-width: none !important;
    gap: 1rem;
}

/* Icon-Wrapper mit fixer Fläche + Padding */
.wide-flex-blurb .et_pb_main_blurb_image {
    flex: 0 0 auto;
    padding: 1.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f2ebd9;
    width: auto;
    margin-bottom: 0;
    border-radius: 0.75rem;
}

/* Icon selbst */
.wide-flex-blurb .et_pb_main_blurb_image img {
    width: 55px;
    height: 65px;
    object-fit: contain;
    display: block;
}

/* Text nimmt Restbreite */
.wide-flex-blurb .et_pb_blurb_container {
    flex: 1 1 auto;
    max-width: none;
    padding: 0;
}

/* Absatz-Margins entfernen */
.wide-flex-blurb .et_pb_blurb_description p {
    margin: 0;
}

/* Row als Grid mit 3 Spalten */
.three-per-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8rem;
    column-gap: 10rem;
}
.section-2.three-per-row {
    gap: 2rem;
    column-gap: 2rem;
}

/* Divi-Column-Breiten neutralisieren */
.three-per-row > .et_pb_column {
    width: 100% !important;
    margin: 0;
}
@media (max-width: 1024px) {
    .three-per-row {
        gap: 2rem;
        column-gap: 2rem;
    }
}
@media (max-width: 980px) {
    .three-per-row {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
    }
}

@media (max-width: 767px) {
    .three-per-row {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}

/* Feste quadratische Icon-Box */
/* Modul: visuelle Box */
.icon-box {
    width: 100px;
    height: 100px;
    padding: 0.5rem;
    background-color: #6a5f56;
    border-radius: 100rem;
    position: relative;
    z-index: 1;
    box-sizing: border-box; /* extrem wichtig */
}

/* Wrapper: Layout-Box */
.icon-box .et_pb_image_wrap {
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

/* Bild */
.icon-box img {
    max-width: 90%;
    max-height: 90%;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
}

hr {
    height: 0.25rem;
    background: #6a5f56;
    border: none;
    width: 35%;
    margin: 1rem auto;
}

/**
 * Überschriften Korretur wenn von HR gefolgt.

 * Kombi-Paket für perfekte Abstände */
h1:has(+ hr),
h2:has(+ hr),
h3:has(+ hr) {
    margin-bottom: 0;
    padding-bottom: 0;
}

div.wpforms-container-full input[type='checkbox']:before,
div.wpforms-container-full input[type='radio']:before {
    border-width: 1px !important;
    border-color: #6a5f56 !important;
}
