/*
 Theme Name:   Carol Eksner e. K. Child
 Theme URI:    https://legendaerr.de
 Description:  Child Theme für Carol Eksner e. K. – Albstadt. Dachdeckerei, Bauklempnerei, Bad & Heizung. Erstellt von legendaerr Digital Agency.
 Author:       legendaerr Digital Agency
 Author URI:   https://legendaerr.de
 Template:     Divi
 Version:      1.0.1
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  carol-eksner-child
*/

/* ==========================================================================
   TOKEN SYSTEM – Carol Eksner e. K.
   Kürzel: eks
   ========================================================================== */

:root {
  /* ── Primärfarben ── */
  --eks-green:           #9BC01A;   /* Bad/Heizung-Bereich */
  --eks-green-hover:     #7A9A14;
  --eks-green-light:     #F2F8E5;
  --eks-orange:          #E8920A;   /* Dach/Energiedach-Bereich */
  --eks-orange-hover:    #C07808;
  --eks-orange-light:    #FFF3E0;

  /* ── Basis ── */
  --eks-dark:            #1A1A1A;
  --eks-dark-2:          #2A2A2A;
  --eks-gray:            #555555;
  --eks-gray-light:      #999999;
  --eks-gray-bg:         #F5F5F5;
  --eks-logo-gray:       #B8B8B8;
  --eks-white:           #FFFFFF;
  --eks-border:          #E0E0E0;

  /* ── Fonts ── */
  --eks-font-heading:    'Oswald', 'Arial Narrow', Arial, sans-serif;
  --eks-font-body:       'Roboto', 'Helvetica Neue', Arial, sans-serif;
  --eks-font-nav:        'Roboto', 'Helvetica Neue', Arial, sans-serif;

  /* ── Spacing ── */
  --eks-space-xs:        4px;
  --eks-space-sm:        8px;
  --eks-space-md:        16px;
  --eks-space-lg:        24px;
  --eks-space-xl:        32px;
  --eks-space-2xl:       48px;
  --eks-space-3xl:       64px;
  --eks-space-section:   80px;

  /* ── Typografie ── */
  --eks-fs-xs:           13px;
  --eks-fs-sm:           15px;
  --eks-fs-base:         17px;
  --eks-fs-md:           20px;
  --eks-fs-lg:           24px;
  --eks-fs-xl:           32px;
  --eks-fs-2xl:          40px;
  --eks-fs-3xl:          48px;
  --eks-fs-hero:         52px;

  /* ── Sonstiges ── */
  --eks-radius:          4px;
  --eks-radius-lg:       10px;
  --eks-shadow:          0 2px 8px rgba(0,0,0,0.08);
  --eks-shadow-lg:       0 8px 32px rgba(0,0,0,0.12);
  --eks-transition:      all 0.3s ease;
}

/* ── Global ── */
body {
  font-family: var(--eks-font-body) !important;
  color: var(--eks-dark);
  font-size: var(--eks-fs-base);
  line-height: 1.7;
  background-color: var(--eks-white);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.et_pb_module_header {
  font-family: var(--eks-font-heading) !important;
  color: var(--eks-dark);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.02em;
}
h1 { font-size: var(--eks-fs-hero); }
h2 { font-size: var(--eks-fs-2xl); }
h3 { font-size: var(--eks-fs-xl); }
h4 { font-size: var(--eks-fs-lg); }

p { color: var(--eks-gray); line-height: 1.8; margin-bottom: var(--eks-space-md); }
a { color: var(--eks-green); transition: var(--eks-transition); }
a:hover { color: var(--eks-green-hover); }

/* ── Navigation ── */
#et-top-navigation .et-menu a,
.et_mobile_menu a {
  font-family: var(--eks-font-nav) !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  font-size: var(--eks-fs-sm) !important;
}

/* ── Buttons – Grün (SHK/Primary) ── */
.et_pb_button[style*="9BC01A"],
.et_pb_button[style*="9bc01a"] {
  background-color: var(--eks-green) !important;
  border-color: var(--eks-green) !important;
}
.et_pb_button[style*="9BC01A"]:hover,
.et_pb_button[style*="9bc01a"]:hover {
  background-color: var(--eks-green-hover) !important;
  border-color: var(--eks-green-hover) !important;
  transform: translateY(-2px);
  box-shadow: var(--eks-shadow-lg);
}

/* ── Buttons – Orange (Dach) ── */
.et_pb_button[style*="E8920A"],
.et_pb_button[style*="e8920a"] {
  background-color: var(--eks-orange) !important;
  border-color: var(--eks-orange) !important;
}
.et_pb_button[style*="E8920A"]:hover,
.et_pb_button[style*="e8920a"]:hover {
  background-color: var(--eks-orange-hover) !important;
  border-color: var(--eks-orange-hover) !important;
  transform: translateY(-2px);
  box-shadow: var(--eks-shadow-lg);
}

/* ── Alle Buttons: Oswald Font ── */
.et_pb_button {
  font-family: var(--eks-font-heading) !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  transition: var(--eks-transition) !important;
}

/* ── Blurb Icons ── */
.et_pb_blurb .et-pb-icon[style*="9BC01A"],
.et_pb_blurb .et-pb-icon[style*="9bc01a"] { color: var(--eks-green) !important; }
.et_pb_blurb .et-pb-icon[style*="E8920A"],
.et_pb_blurb .et-pb-icon[style*="e8920a"] { color: var(--eks-orange) !important; }

/* ── Section Hintergründe ── */
.et_pb_section[style*="1A1A1A"],
.et_pb_section[style*="1a1a1a"] {
  background-color: var(--eks-dark) !important;
}
.et_pb_section[style*="F2F8E5"],
.et_pb_section[style*="f2f8e5"] {
  background-color: var(--eks-green-light) !important;
}

/* ── Kontaktformular ── */
.et_pb_contact_form .et_pb_contact_submit {
  background-color: var(--eks-green) !important;
  border-color: var(--eks-green) !important;
  color: var(--eks-white) !important;
  font-family: var(--eks-font-heading) !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}
.et_pb_contact_form .et_pb_contact_submit:hover {
  background-color: var(--eks-green-hover) !important;
}

/* ── Footer ── */
#main-footer { background-color: var(--eks-dark) !important; }
#main-footer, #main-footer p, #main-footer a { color: var(--eks-gray-light) !important; font-size: var(--eks-fs-sm); }
#main-footer a:hover { color: var(--eks-green) !important; }
#footer-bottom { background-color: #0D0D0D !important; }

/* ── Split-Bereich Homepage ── */
.eks-split-dach   { background-color: var(--eks-dark); }
.eks-split-shk    { background-color: var(--eks-green-light); }

/* ── Divider ── */
.et_pb_divider[style*="9BC01A"] { background-color: var(--eks-green) !important; }
.et_pb_divider[style*="E8920A"] { background-color: var(--eks-orange) !important; }

/* ── Responsive ── */
@media (max-width: 980px) {
  :root {
    --eks-fs-hero: 38px;
    --eks-fs-2xl: 32px;
    --eks-fs-xl:  26px;
    --eks-space-section: 60px;
  }
}
@media (max-width: 767px) {
  :root {
    --eks-fs-hero: 28px;
    --eks-fs-2xl: 24px;
    --eks-fs-xl:  22px;
    --eks-fs-lg:  20px;
    --eks-space-section: 48px;
  }
}

/* ── Smooth scroll ── */
html { scroll-behavior: smooth; }

/* ── Legacy Template-Farben überschreiben (Klon-Reste) ── */
.et_pb_button[style*="F5C800"],
.et_pb_button[style*="f5c800"] {
  background-color: var(--eks-green) !important;
  border-color: var(--eks-green) !important;
  color: var(--eks-white) !important;
}
.et_pb_button[style*="1A4A8A"],
.et_pb_button[style*="1a4a8a"] {
  background-color: var(--eks-dark) !important;
  border-color: var(--eks-dark) !important;
}
.et_pb_section[style*="1A4A8A"],
.et_pb_section[style*="1a4a8a"] {
  background-color: var(--eks-dark) !important;
}

/* ==========================================================================
   EQUAL HEIGHT BLURB CARDS
   ========================================================================== */

/* Jede Spalte als Flex-Container damit Blurbs gleich hoch werden */
.et_pb_row .et_pb_column {
  display: flex;
  flex-direction: column;
}

.et_pb_row .et_pb_column > .et_pb_blurb {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.et_pb_row .et_pb_column > .et_pb_blurb:not(.et_pb_blurb_position_left) .et_pb_blurb_content {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.et_pb_row .et_pb_column > .et_pb_blurb .et_pb_blurb_description {
  flex: 1;
}


/* ==========================================================================
   DARK SECTION TEXT FIX — alle p auf dunklem Hintergrund = weiß
   ========================================================================== */

/* Sections mit #1A1A1A Hintergrund */
.et_pb_section[style*="background-color:#1A1A1A"] p,
.et_pb_section[style*="background-color: #1A1A1A"] p,
.et_pb_section[style*="background-color:#1a1a1a"] p,
.et_pb_section[style*="background-color:#2A2A2A"] p,
.et_pb_section[style*="background-color:#2a2a2a"] p {
  color: #FFFFFF !important;
}

/* Divi dark-layout Texte */
.et_pb_bg_layout_dark .et_pb_text_inner,
.et_pb_bg_layout_dark .et_pb_text_inner p,
.et_pb_bg_layout_dark .et_pb_text_inner span,
.et_pb_bg_layout_dark .et_pb_text_inner li {
  color: #FFFFFF !important;
}

/* ==========================================================================
   PHONE CTA BLURB — zentriertes Icon + Text
   ========================================================================== */

/* Icon-oben Blurbs in dunklen Sections: Icon und Title zentrieren */
.et_pb_section[style*="background-color:#1A1A1A"] .et_pb_blurb_container,
.et_pb_section[style*="background-color:#1a1a1a"] .et_pb_blurb_container {
  text-align: center !important;
}

.et_pb_section[style*="background-color:#1A1A1A"] .et_pb_blurb .et-pb-icon,
.et_pb_section[style*="background-color:#1a1a1a"] .et_pb_blurb .et-pb-icon {
  display: block !important;
  text-align: center !important;
  margin: 0 auto 8px auto !important;
}

.et_pb_section[style*="background-color:#1A1A1A"] .et_pb_blurb_container .et_pb_module_header,
.et_pb_section[style*="background-color:#1a1a1a"] .et_pb_blurb_container .et_pb_module_header {
  text-align: center !important;
}

/* ==========================================================================
   EQUAL HEIGHT BLURB CARDS — erweitert für alle Karten-Typen
   ========================================================================== */

/* Bereits vorhanden – erweitert für Icon-Blurbs und Team-Karten */
.et_pb_row .et_pb_column .et_pb_blurb {
  box-sizing: border-box;
}

/* Team / Personen-Karten mit weißem Hintergrund gleich hoch */
.et_pb_column > .et_pb_blurb.et_pb_module {
  flex: 1 1 auto;
}

/* Karte-Inhaltsbereich bis unten strecken */
.et_pb_blurb .et_pb_blurb_content .et_pb_blurb_container {
  flex: 1;
  display: flex;
  flex-direction: column;
}


/* ==========================================================================
   FIX 09.08.2026 — Blurbs mit Icon LINKS nicht stapeln (Kontaktseite)
   ========================================================================== */
.et_pb_blurb.et_pb_blurb_position_left .et_pb_blurb_content{
  display:flex !important;
  flex-direction:row !important;
  align-items:center;
}
.et_pb_blurb.et_pb_blurb_position_left .et_pb_main_blurb_image{
  flex:0 0 auto;
  margin:0 14px 0 0 !important;
}
.et_pb_blurb.et_pb_blurb_position_left .et_pb_blurb_container{
  flex:1;
  text-align:left;
}