/*
 Theme Name:   SEO Level Up
 Theme URI:    https://seolevelup.com/
 Description:  Custom Child Theme Using Hello Elementor as Parent Theme and made for SEO Level Up Company Projects
 Author:       Md Nur Nobi
 Template:     hello-elementor
 Version:      1.0.0
 Text Domain:  hello-elementor-child
*/

/* Your custom CSS here */

/* Newsletter form layout  */

/* =========================
   WRAPPER FIX
========================= */
.cta-pill-form .elementor-form-fields-wrapper {
    position: relative;
    display: block;
}

/* =========================
   FORCE FULL WIDTH INPUT
========================= */
.cta-pill-form .elementor-field-type-email {
    width: 100% !important;
}

.cta-pill-form input[type="email"] {
    width: 100%;
    height: 64px;
    border: 2px solid #fff !important;
    border-radius: 100px;
    background: transparent;
    padding: 0 70px 0 25px; /* space for button */
    color: #fff;
    font-size: 18px;
}

/* =========================
   MOVE BUTTON INSIDE
========================= */
.cta-pill-form .elementor-field-type-submit {
    position: absolute;
    right: 6px;
    top: 6px;
    width: auto !important;
}

/* =========================
   BUTTON STYLE
========================= */
.cta-pill-form .elementor-button {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: #fff;
    color: #000;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    
}

/* =========================
   REMOVE BUTTON TEXT SPACE
========================= */
.cta-pill-form .elementor-button-content-wrapper {
    padding: 0;
}

/* =========================
   ICON SIZE
========================= */
.cta-pill-form .elementor-button i {
    font-size: 18px;
}

/* =========================
   PLACEHOLDER COLOR
========================= */
.cta-pill-form input::placeholder {
    color: #fff;
}


/* Gallery  */
/* Align all slides to bottom */
.custom-gallery .swiper-wrapper {
    align-items: flex-end !important;
}

/* Make each slide flexible */
.custom-gallery .swiper-slide {
    display: flex;
    align-items: flex-end;
    /*height: 410px;*/
    width: auto !important;
}

/* Fix Elementor container inside slide */
.custom-gallery .e-con {
    display: flex;
   
}

/* Push image to bottom */
.custom-gallery .elementor-widget-image {
    margin-top: auto;
}

/* Align slides container */
.custom-gallery .swiper-wrapper {
    align-items: flex-end !important;
}


/* Make wrapper flex */
.custom-gallery .elementor-widget-image .elementor-widget-container {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Push image to bottom */
.custom-gallery .elementor-widget-image img {
    margin-top: auto;
    width: 100%;
    display: block;
}

/* =========================
   SLIDE WIDTH (NATURAL)
========================= */
.custom-gallery .swiper-slide {
    width: auto !important;
    margin-right: 24px;
    display: flex;
    flex-direction: column;
}

/* =========================
   IMAGE (NATURAL SIZE)
========================= */
.custom-gallery img {
    width: auto;
    max-width: 100%;
    height: auto;
    display: block;
}

/* =========================
   BOTTOM ALIGN FIX
========================= */
.custom-gallery .swiper-wrapper {
    align-items: flex-end !important;
}

/* Push image to bottom inside slide */
.custom-gallery .elementor-widget-image .elementor-widget-container {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.custom-gallery .elementor-widget-image img {
    margin-top: auto;
}


.custom-gallery {
    position: relative;
}

.custom-gallery::after {
    content: "";
    position: absolute;
    bottom: -155px; /* adjust */
    left: 50%;
    transform: translateX(-50%);
    width: 200px;
    height: 48px;
    border: 2px solid #000;
    border-radius: 50px;
    background: transparent;
}

/* gallery end  */

/* testimonials button  */

/* =========================
   CREATE OUTER PILL (MAIN TRICK)
========================= */
.custom-testimonials .elementor-swiper-button-prev::after {
    content: "";
    position: absolute;
    left: -15%;
    top: 50%;
    translate: 0 -50%;
    width: 200px;
    height: 48px;
    border: 2px solid #000;
    border-radius: 50px;
    z-index: -1;
}



/* testimonials end  */

/* single post  */
.spc-769-container{
	gap:8px;
}
.spc-769-title{
	margin:0;
}
/* =========================================================================
 * Logo im Kopfbereich (Tablet und Mobil)
 *
 * Elementor baut das Bild als  div > a > img  auf. Das <a> ist inline-block und
 * schrumpft auf seinen Inhalt, waehrend das Bild width:100% vom <a> nimmt --
 * ein Zirkelbezug. Chrome loest ihn irgendwie auf (Ergebnis: 48px), Firefox gar
 * nicht. Deshalb hier feste Breiten statt Prozentangaben.
 * ========================================================================= */
.elementor-element-bb16aa4 > a,
.elementor-element-bb16aa4 > a > img {
    display: block;
    width: 260px;
    max-width: 100%;
    height: auto;
}

@media (max-width: 767px) {
    .elementor-element-bb16aa4 > a,
    .elementor-element-bb16aa4 > a > img {
        width: 212px;
    }
}

/* Logo im Burger-Menue -- gleiche Absicherung, damit es nicht dasselbe Schicksal ereilt */
.elementor-element-5f6fbc9 > a,
.elementor-element-5f6fbc9 > a > img {
    display: block;
    width: 250px;
    max-width: 100%;
    height: auto;
}

/* =========================================================================
 * Galerie: Pfeile passen nicht in den Abschnitt (Tablet und kleiner)
 *
 * Die Navigationspfeile sind absolut mit bottom:-160px positioniert, sitzen
 * also 160px unter dem Slider-Widget, und zaehlen als absolute Elemente nicht
 * zur Hoehe. Auf Tablet endete der graue Abschnitt exakt an ihrer Oberkante --
 * sie standen komplett darunter.
 *
 * Aussenabstand am Widget ist hier das richtige Mittel: Er macht den Abschnitt
 * hoeher, verschiebt aber den Bezugspunkt der Pfeile NICHT (der ist die
 * Unterkante des Widgets, und die bleibt, wo sie ist). Die Pfeile behalten
 * damit ihren Abstand zu den Bildern -- wichtig, weil das so gestaltet ist.
 * ========================================================================= */
@media (max-width: 1024px) {
    /* !important, weil Elementor fuer das Element eine eigene margin-Regel
       gleicher Spezifitaet erzeugt und diese sonst gewinnt. */
    .custom-gallery {
        margin-bottom: 40px !important;
    }
}

/* =========================================================================
 * Blog-Uebersicht: Datum nicht umbrechen
 *
 * Das Datum steht in einer eigenen Spalte von rund 89px Breite. "06.05.2026"
 * braucht bei 18px aber etwas mehr und brach deshalb mitten in der Jahreszahl
 * um ("06.05.202" / "6"). nowrap verhindert das; die Spalte darf sich dafuer
 * nehmen, was sie braucht.
 * ========================================================================= */
.e-loop-item .elementor-element-90bb55b {
    flex: 0 0 auto;
}

.e-loop-item .elementor-element-90bb55b .elementor-heading-title {
    white-space: nowrap;
}


/* ============================================================================
   Nur ab 1025 px – ab hier beginnt der Desktop-Kopf.

   Wichtig: Der Handy-Kopf mit seiner Schublade steckt in DERSELBEN
   Elementor-Kopfvorlage. Ohne diese Abgrenzung wirken die Regeln fuer
   das Desktop-Aufklappmenue auch dort hinein – etwa der Versatz der
   zweiten Spalte oder die feste Zeilenhoehe. Unter 1025 px ist der
   Desktop-Kopf ausgeblendet, deshalb ist das die richtige Grenze.
   ============================================================================ */

@media (min-width: 1025px) {

    /* ============================================================================
       KOPFBEREICH: Hauptmenü (03.09.2026)

       Der Kopf benutzt jetzt EIN WordPress-Menü ("Hauptnavigation Energas")
       mit dem Menü-Widget von Elementor. Vorher waren es ein Elementor-
       Mega-Menü plus vier JEG-Kit-Menüs. Der wesentliche Gewinn: die
       Aufklappliste hängt von selbst unter ihrem Menüpunkt – die frühere
       Ausrichtung per Messskript und CSS-Variablen entfällt ersatzlos.

       Elementor erbt hier sonst die globale Überschriften-Typografie
       (Stärke 700, Zeilenhöhe 20 px). Deshalb stehen die Werte der
       Designvorlage ausdrücklich hier:

           oberste Ebene    Poppins 20 px, Stärke 500
           Aufklappliste    Poppins 18 px, Stärke 500, Zeilenhöhe 28 px
           Farbe Schwarz, beim Überfahren schwarz unterstrichen (nie Grün,
           Kai 29.09.2026)

       Die Auswahl ist jeweils eine Klasse spezifischer als Elementors
       eigene Regeln – dadurch ist kein !important nötig.
       ============================================================================ */

    /* --- oberste Ebene ------------------------------------------------------
       Werte aus Figma (Knoten 8:379 / 8:486, Rahmen 1512 px):
       18 px, Staerke 500, Zeilenhoehe 22 px, Schwarz, 24 px Luecke zwischen
       den Punkten und KEIN Innenabstand – die Luecke macht den Abstand.
       Der aktive Punkt bekommt eine schwarze Unterstreichung, keine Farbe.
       Die Schrift ist Poppins statt der in Figma hinterlegten "Area Normal";
       das wurde nachtraeglich so entschieden.
       ------------------------------------------------------------------------ */

    /* Menuepunkte auf volle Leistenhoehe: nur dann beginnt die Aufklappliste
       genau an der Unterkante der Leiste und nicht mittendrin.

       Bewusst ueber align-self statt height:100%. Der Kopf-Container hat
       keine fest gesetzte Hoehe – eine Prozenthoehe faellt dort auf
       "automatisch" zurueck und verhindert sogar das Strecken. Weil jede
       Ebene hier ein Flex-Element ist, reicht Strecken vollkommen aus. */
    /* 75 px ist die Leistenhoehe der Vorlage (Figma 8:379) und steht auch als
       Mindesthoehe am Kopf-Container. Sie muss hier ausdruecklich stehen:
       der Container zentriert seine Kinder senkrecht, und ohne eine feste
       Hoehe an dieser Stelle laufen alle Prozentangaben darunter ins Leere. */
    .elementor-location-header .elementor-widget-nav-menu {
        height: 75px;
        /* Sonst ist das Widget 24 px breiter als seine Punkte und der Abstand
           zum Kontakt-Knopf wird doppelt so gross wie in der Vorlage. */
        width: fit-content;
        flex: 0 0 auto;
    }

    .elementor-location-header .elementor-nav-menu--main {
        display: flex;
        align-items: stretch;
        height: 100%;
    }

    .elementor-location-header .elementor-nav-menu--main > ul.elementor-nav-menu {
        gap: 24px;
        align-items: stretch;
        height: 100%;
    }

    /* Elementor haengt der Liste ein leeres Aufraeum-Element an. In einer
       Flexbox zaehlt das als eigenes Element und bekommt die 24-px-Luecke
       davor – dadurch war der Abstand zum Kontakt-Knopf doppelt so gross. */
    .elementor-location-header .elementor-nav-menu--main > ul.elementor-nav-menu::after {
        display: none;
    }

    .elementor-location-header .elementor-nav-menu--main > ul > li {
        display: flex;
        align-items: stretch;
    }

    .elementor-location-header .elementor-nav-menu--main > ul > li > a.elementor-item {
        /* Die vier Aufklapp-Punkte haben bewusst kein Linkziel (siehe
           functions.php). Ohne href zeigt der Browser sonst den normalen
           Pfeil statt der Hand. */
        cursor: pointer;
        font-family: "Poppins", sans-serif;
        font-size: 18px;
        font-weight: 500;
        line-height: 22px;
        color: #000000;
        padding: 0;
        display: flex;
        align-items: center;
        /* volle Leistenhoehe: dadurch beginnt die Aufklappliste genau an der
           Unterkante der Leiste */
        height: 100%;
        /* durchsichtig vorgehalten, damit beim Ueberfahren nichts springt */
        border-bottom: 1px solid transparent;
        /* Die sichtbare Linie ist eine Unterstreichung direkt am Text. Frueher
           war es dieser Rahmen – der sass an der Unterkante des ganzen
           Menuepunkts und damit viel zu weit unter der Schrift (Kai,
           14.09.2026). Der Rahmen bleibt trotzdem durchsichtig stehen: so
           aendert sich an keiner Hoehe etwas. */
        text-decoration-line: underline;
        text-decoration-color: transparent;
        text-decoration-thickness: 1px;
        text-underline-offset: 10px;
        text-decoration-skip-ink: none;
    }

    .elementor-location-header .elementor-nav-menu--main > ul > li > a.elementor-item:hover,
    .elementor-location-header .elementor-nav-menu--main > ul > li > a.elementor-item:focus,
    .elementor-location-header .elementor-nav-menu--main > ul > li > a.elementor-item.elementor-item-active,
    .elementor-location-header .elementor-nav-menu--main > ul > li > a.elementor-item.highlighted,
    .elementor-location-header .elementor-nav-menu--main > ul > li > a.elementor-item[aria-expanded="true"] {
        color: #000000;
        text-decoration-color: #000000;
    }

    /* --- weisse Flaeche laut Vorlage ----------------------------------------

       In Figma ist die Flaeche so breit wie der Kopf selbst (w-full), 400 px
       hoch bei fuenf Eintraegen, mit eckigen Kanten und dem Schatten
       0 4px 30px rgba(0,0,0,.1). Sie haengt deshalb am Kopf-Container und
       nicht an der Liste – dadurch braucht es keine gemessenen Pixelwerte.

       Die Hoehe folgt der Anzahl der Eintraege nach der Formel n * 40 + 72:
       vier Eintraege 232, fuenf 272, sechs 312. (Die Vorlage sieht 75 px
       je Zeile vor; auf Wunsch von Kai enger gesetzt.)
       Kommt ein siebter dazu, hier eine Zeile ergaenzen – die Liste hat
       zusaetzlich einen eigenen weissen Grund, damit es auch dann lesbar
       bleibt.
       ------------------------------------------------------------------------ */

    .elementor-location-header .elementor-element-8b44cf4 {
        position: relative;
        /* Ohne eigene Ebene liegt die weisse Flaeche auf derselben Hoehe wie
           der Hero-Bereich darunter. Da der spaeter im Dokument steht, malt
           er sich darueber – die Flaeche wirkte dann halb durchsichtig,
           waehrend die Liste (z-index 2) sichtbar blieb. Mit einer eigenen
           Ebene fuer den ganzen Kopfbereich ist das geklaert. */
        z-index: 999;
    }

    .elementor-location-header .elementor-element-8b44cf4::after {
        content: "";
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        height: 232px;
        background-color: #ffffff;
        /* Keine runden Ecken – auf Wunsch von Kai am 14.09.2026. Die
           Figma-Vorlage sah unten 24 px Radius vor. */
        border-radius: 0;
        box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
        /* Der Schatten hat 30 px Unschaerfe und strahlte damit auch nach
           OBEN in die Menueleiste – ein grauer Verlauf an deren
           Unterkante, der Leiste und Flaeche farblich absetzte. Oben
           abgeschnitten, seitlich und unten bleibt er. */
        clip-path: inset(0 -40px -40px -40px);
        z-index: 1;
        /* Die Liste selbst blendet ueber die Deckkraft aus. Wuerde die Flaeche
           stattdessen hart abgeschaltet (display), verschwaende sie sofort und
           der schmale Listenkasten bliebe waehrend des Ausblendens sichtbar.
           Deshalb hier derselbe Weg – und die Sichtbarkeit erst am Ende. */
        opacity: 0;
        visibility: hidden;
        /* Schliessen im Gleichtakt mit der Aufklappliste (Kai 29.09.2026: „geht
           schneller zu als der gesamte weisse Balken“): Das Elementor-Menue
           (SmartMenus) blendet die Liste per jQuery fadeOut in 200 ms mit der
           Kurve „swing“ aus. Hier dieselbe Dauer und dieselbe Kurve
           (easeInOutSine) – vorher 0,3 s „ease“, die Flaeche blendete dadurch
           noch 100 ms nach, als die Liste schon weg war. Oeffnen bleibt 0,3 s. */
        transition: opacity 0.2s cubic-bezier(0.37, 0, 0.63, 1), visibility 0s linear 0.2s;
    }

    /* Die Menueleiste hat unten eine 1-px-Linie (globale Farbe "border-2").
       Geschlossen trennt sie die Leiste von der Seite – offen wuerde sie
       Leiste und weisse Flaeche sichtbar voneinander absetzen. Deshalb nur
       waehrend ein Menue offen ist durchsichtig; die Farbe selbst bleibt
       im Farbschema unangetastet. */
    .elementor-location-header .elementor-element-8b44cf4:has(.elementor-nav-menu--main > ul > li > a[aria-expanded="true"]) {
        border-bottom-color: transparent;
    }

    .elementor-location-header .elementor-element-8b44cf4:has(.elementor-nav-menu--main > ul > li > a[aria-expanded="true"])::after {
        opacity: 1;
        visibility: visible;
        transition: opacity 0.3s ease, visibility 0s;
    }

    .elementor-location-header .elementor-element-8b44cf4:has(.elementor-nav-menu--main > ul > li > a[aria-expanded="true"] + ul > li:nth-child(5))::after {
        height: 272px;
    }

    .elementor-location-header .elementor-element-8b44cf4:has(.elementor-nav-menu--main > ul > li > a[aria-expanded="true"] + ul > li:nth-child(6))::after {
        height: 312px;
    }

    /* Einblenden im Gleichtakt mit der weissen Flaeche (Kai 29.09.2026: „das
       einblenden auch ??“): Das Menue-Skript schaltet die Liste ohne Uebergang
       sichtbar, die Flaeche blendet in 0,3 s „ease“ ein – die Texte standen
       dadurch rund 0,3 s vor der Flaeche da. Die Liste bekommt hier dieselbe
       Einblendung. Nur solange aria-hidden="false": beim Schliessen setzt das
       Skript "true" und fuehrt die Deckkraft selbst (fadeOut) – so gibt es
       auch beim schnellen Wechsel zwischen Menuepunkten keinen Sprung. */
    .elementor-location-header .elementor-element-8b44cf4 .elementor-nav-menu--main > ul > li > ul[aria-hidden="false"] {
        animation: energas-menue-einblenden 0.3s ease;
    }

    @keyframes energas-menue-einblenden {
        from { opacity: 0; }
        to { opacity: 1; }
    }

    /* --- Aufklappliste ------------------------------------------------------
       Je Zeile 40 px hoch, buendig unter dem Menuepunkt beginnend, ohne
       Innenabstand. Der aktive Eintrag wird unterstrichen, nicht eingefaerbt.
       ------------------------------------------------------------------------ */

    .elementor-location-header .elementor-nav-menu--dropdown {
        /* Kein eigener Grund: das Weiss kommt von der Flaeche darunter. Haette
           die Liste einen eigenen, bliebe beim Ausblenden ein schmaler weisser
           Kasten stehen. */
        background-color: transparent;
        box-shadow: none;
        border-radius: 0;
        padding: 0;
        min-width: 0;
        z-index: 2;
    }

    .elementor-location-header .elementor-nav-menu--dropdown a.elementor-item,
    .elementor-location-header .elementor-nav-menu--dropdown a.elementor-sub-item {
        font-family: "Poppins", sans-serif;
        font-size: 18px;
        font-weight: 500;
        line-height: 22px;
        color: #000000;
        background-color: transparent;
        /* Elementor legt hier sonst einen 8 px breiten linken Rahmen an, der
           den Text gegenueber dem Menuepunkt darueber verschiebt. */
        border: 0;
        border-bottom: 1px solid transparent;
        /* Die sichtbare Linie ist eine Unterstreichung direkt am Text. Frueher
           war es dieser Rahmen – der sass an der Unterkante des ganzen
           Menuepunkts und damit viel zu weit unter der Schrift (Kai,
           14.09.2026). Der Rahmen bleibt trotzdem durchsichtig stehen: so
           aendert sich an keiner Hoehe etwas. */
        text-decoration-line: underline;
        text-decoration-color: transparent;
        text-decoration-thickness: 1px;
        text-underline-offset: 10px;
        text-decoration-skip-ink: none;
        padding: 0;
        height: 40px;
        display: flex;
        align-items: center;
        /* nur so breit wie der Text – dadurch ist die Unterstreichung so
           breit wie die Beschriftung, wie in der Vorlage */
        width: fit-content;
        white-space: nowrap;
    }

    .elementor-location-header .elementor-nav-menu--dropdown a.elementor-item:hover,
    .elementor-location-header .elementor-nav-menu--dropdown a.elementor-item:focus,
    .elementor-location-header .elementor-nav-menu--dropdown a.elementor-sub-item:hover,
    .elementor-location-header .elementor-nav-menu--dropdown a.elementor-sub-item:focus,
    .elementor-location-header .elementor-nav-menu--dropdown a.elementor-item.highlighted,
    .elementor-location-header .elementor-nav-menu--dropdown a.elementor-sub-item.highlighted,
    .elementor-location-header .elementor-nav-menu--dropdown a[aria-expanded="true"] {
        color: #000000;
        background-color: transparent;
        text-decoration-color: #000000;
    }

    /* --- dritte Ebene als zweite Spalte -------------------------------------
       In der Vorlage steht Spalte 1 bei x=804 und Spalte 2 bei x=967 –
       also 163 px daneben, oben buendig. Bezugspunkt muss die Liste sein
       und nicht der einzelne Eintrag, daher position:static auf dem Eintrag.
       Die Werte ueberschreiben die, die das Menue-Skript ins Element schreibt.
       ------------------------------------------------------------------------ */

    .elementor-location-header .elementor-nav-menu--dropdown li {
        position: static;
    }

    .elementor-location-header .elementor-nav-menu--dropdown ul.elementor-nav-menu--dropdown {
        top: 0 !important;
        left: 163px !important;
        margin: 0 !important;
        padding: 0;
        background-color: transparent;
        box-shadow: none;
    }

    /* --- schmalere Fenster ---------------------------------------------------
       Menueleiste bei schmalerem Fenster: zwischen 1025 und 1440 px reicht der
       Platz zwischen Logo und Kontakt-Knopf fuer 20 px Schrift nicht mehr aus –
       die Punkte rutschen dann in eine zweite Zeile und die Seite bekommt einen
       waagrechten Ueberlauf. Deshalb hier zweistufig kleiner. Unter 1025 px
       greift ohnehin der eigene Handy-Kopf.
       ------------------------------------------------------------------------ */

    @media (min-width: 1025px) and (max-width: 1440px) {
        .elementor-location-header .elementor-nav-menu--main > ul > li > a.elementor-item {
            font-size: 17px;
        }
    }

    @media (min-width: 1025px) and (max-width: 1200px) {
        .elementor-location-header .elementor-nav-menu--main > ul > li > a.elementor-item {
            font-size: 16px;
        }
    }

}

/* =========================================================================
 * Knoepfe: einheitlich 2 px Rahmen und fette Pfeile (Vorgabe Kai, 14.09.2026)
 *
 * Gilt fuer jede Knopfart der Website, auch im Hover-Zustand: die JEG-Knoepfe
 * schalten beim Hovern sonst auf 1 px zurueck und aendern dabei ihre Groesse.
 * Gesetzt wird nur die Breite -- Knoepfe ohne Rahmen bekommen keinen, Farbe
 * und Linienart (z. B. gestrichelt) bleiben wie eingestellt.
 *
 * !important, weil Elementor und JEG die Rahmenbreite je Widget mit hoher
 * Spezifitaet ausgeben und Plugins sie teils selbst mit !important setzen.
 * In Widget-Einstellungen eingetragene Breiten werden damit bewusst
 * uebersteuert. Die Knoepfe des Stellen-Plugins stehen dort direkt auf 2 px,
 * die Zierpillen der Slider oben in dieser Datei.
 *
 * Kreisrunde Symbole (Icon-Rahmen, Plus-Zeichen, Haekchen, Kartenpunkte)
 * sind keine Knoepfe und bleiben unberuehrt.
 * ========================================================================= */

.jeg-elementor-kit.jkit-button .jkit-button-wrapper,
.elementor-button,
.wpcf7 .wpcf7-submit,
.egcf.egcf button.egcf__button,
.egcf.egcf a.egcf__button,
.energas-location-card__button,
.esf-btn-route,
.esf-hero__meta a,
.agb-note a {
    border-width: 2px !important;
}

/* Pfeile in Knoepfen fett. Die Icon-Schriften (JEG, Themify) haben nur eine
   Staerke, Chrome verstaerkt sie selbst: gemessen 0,8 -> 1,7 px Strich bei
   25 px Symbolgroesse. Damit so kraeftig wie die gezeichneten SVG-Pfeile im
   PDF-Knopf und im Kontaktfinder. */
.jeg-elementor-kit.jkit-button .jkit-button-wrapper i[class*="arrow"],
.elementor-button i[class*="arrow"] {
    font-weight: 800;
}

/* Nachkontrolle per Crawler ueber alle Seiten (14.09.2026) */

/* "weiterlesen" in der Blog-Liste (Loop-Vorlage 747) ist ein unterstrichener
   Textlink, kein Rahmenknopf: Unterstrich wie eingestellt behalten. */
.elementor-747 .elementor-element.elementor-element-2aef0e4 .jeg-elementor-kit.jkit-button .jkit-button-wrapper {
    border-width: 0 0 1px 0 !important;
}

/* Diese Knoepfe setzen ihren Rahmen selbst mit !important (Kontaktformular im
   Seiteninhalt, Standortseiten des Standortfinders) und stehen im Quelltext
   nach diesem Stylesheet -- deshalb hier jeweils ein Selektor-Glied mehr. */
body .eg-form-grid input.eg-submit,
body .eg-form-grid .eg-submit,
body a.esf-btn-route,
body .esf-btn-appt {
    border-width: 2px !important;
}

/* =========================================================================
 * Aufklapp-Elemente (JEG-Akkordeon): Fettschrift Medium 500 statt "bolder"
 * (Vorgabe Kai 14.09.2026: 600; Korrekturliste 28.09.2026, Punkt 4: Medium).
 * Das Theme setzt b/strong auf "bolder" -- bei Fliesstext mit 400 ergibt das
 * 700 und wirkt in den Listen zu schwer. Betrifft derzeit nur
 * /service/leistungen/ (Wartungs- und Instandhaltungsvertraege), gilt aber
 * fuer jedes weitere Akkordeon.
 * ========================================================================= */
.jeg-elementor-kit.jkit-accordion .card-body b,
.jeg-elementor-kit.jkit-accordion .card-body strong {
    font-weight: 500;
}

/* ============================================================
   Kontaktfinder (Gebiete): Eingabefeld ohne Seitenbalken (15.09.2026)
   Wunsch Kai: Der Balken links sah beim Fokus komisch aus. Er wuchs von
   0 auf 5 px, schob den Text nach rechts und zeigte schon im leeren Feld
   Grün. Jetzt nur noch die Unterlinie: beim Fokus in der Akzentfarbe, bei
   einem Fehler rot. Die zweite Linienstärke ist ein Schatten nach innen,
   damit das Feld nicht um 1 px wächst. "body" schlägt die Plugin-Regeln
   (bis 0-6-1) unabhängig von der Ladereihenfolge.
   ============================================================ */

body .egcf.egcf .egcf__control input.egcf__input:focus,
body .egcf.egcf .egcf__control select.egcf__select:focus,
body .egcf.egcf .egcf__control input.egcf__input:valid:focus,
body .egcf.egcf .egcf__control select.egcf__select:valid:focus,
body .egcf.egcf .egcf__control input.egcf__input:invalid:focus {
    border-left-width: 0;
    border-bottom-width: 1px;
    border-bottom-color: var(--egcf-accent);
    box-shadow: inset 0 -1px 0 var(--egcf-accent);
}

body .egcf.egcf .egcf__control input.egcf__input.has-error,
body .egcf.egcf .egcf__control input.egcf__input.has-error:focus {
    border-left-width: 0;
    border-bottom-color: var(--egcf-error);
    box-shadow: inset 0 -1px 0 var(--egcf-error);
}

/* ============================================================
   Standorte-Karte nach Figma "Standorte" (15.09.2026)
   Kai hat die Figma-Datei geschickt und entschieden: Bereich komplett
   nach Figma, Knopfrand aber 2 px wie überall auf der Website.
   Werte aus den Designdaten der .fig-Datei (Zeichenfläche 1472 px):
   Karten 434 px, 40 px Abstand, Innenabstand 73/45/90 px; Typ 20/26 400,
   Titel 40/46 500, Text 25/35 400 in 310 px hohem Feld, Porträt 240 px
   mit 1-px-Rand Schwarz 7 %, Name 25/35 600, Rolle 25/35 500, Knöpfe
   48 px mit 18/22 500 und 11 px Abstand; Kartenschalter 48 px mit 14 px
   Abstand, aktiv und Hover schwarz; Info-Kasten 434 x 329 über dem
   Marker (Leaflet-Popup, im Widget-Skript eingebaut).
   Ersetzt die drei Standorte-Blöcke vom 15.09. vormittags.
   "body" vorn, weil das Widget-CSS später im Dokument steht.
   ============================================================ */

body .energas-map-section {
    font-family: "Poppins", sans-serif;
}

@media (min-width: 768px) {
    body .energas-map-section {
        padding: 60px 0;
    }
}

body .energas-map-section .energas-map-section__inner {
    max-width: none;
}

/* ---------- Karte ---------- */

body .energas-map-section .energas-map-section__main {
    height: 760px;
    border-radius: 0;
    box-shadow: none;
}

/* ---------- Kartenschalter ---------- */

body .energas-map-section .energas-map-section__toolbar {
    top: 56px;
    left: 56px;
    gap: 14px;
}

body .energas-map-section .energas-map-section__toolbar-button {
    min-height: 48px;
    padding: 11px 18px;
    color: #000;
    background: #fff;
    border: 2px solid #000;
    border-radius: 100px;
    box-shadow: none;
    font-family: "Poppins", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 22px;
}

/* Nach dem Klick behält der Knopf den Fokus – ohne diese Regel färbt ihn der Theme-Reset pink. */
body .energas-map-section .energas-map-section__toolbar-button:focus:not(:hover):not(.is-active) {
    color: #000;
    background: #fff;
}

body .energas-map-section .energas-map-section__toolbar-button:hover,
body .energas-map-section .energas-map-section__toolbar-button.is-active,
body .energas-map-section .energas-map-section__toolbar-button.is-active:focus {
    color: #fff;
    background: #000;
    border-color: #000;
}

body .energas-map-section .energas-map-section__toolbar-button:focus-visible {
    outline: 2px solid #000;
    outline-offset: 3px;
}

/* ---------- Standortkarten ---------- */

body .energas-map-section .energas-map-section__locations {
    gap: 40px;
    margin-top: 64px;
}

body .energas-map-section .energas-location-card {
    padding: 73px 45px 90px;
    border-radius: 0;
}

body .energas-map-section .energas-location-card__type {
    margin: 0 0 6px;
    color: #000;
    font-size: 20px;
    font-weight: 400;
    line-height: 26px;
}

body .energas-map-section .energas-location-card h3 {
    margin: 0 0 55px;
    color: #000;
    font-family: "Poppins", sans-serif;
    font-size: 40px;
    font-weight: 500;
    line-height: 46px;
    letter-spacing: normal;
}

body .energas-map-section .energas-location-card__desc {
    min-height: 0;
    margin: 0 0 73px;
    color: #000;
    font-size: 25px;
    line-height: 35px;
}

body .energas-map-section .energas-location-card__person {
    margin-bottom: 56px;
}

body .energas-map-section .energas-location-card__avatar-wrap {
    width: 240px;
    height: 240px;
    margin-bottom: 50px;
    border: 1px solid rgba(0, 0, 0, 0.07);
}

/* Elementors ".elementor img { height: auto }" liess das Bild den Kreis nicht füllen. */
body .energas-map-section .energas-location-card__avatar {
    height: 100%;
}

body .energas-map-section .energas-location-card__person-info strong {
    color: #000;
    font-size: 25px;
    font-weight: 600;
    line-height: 35px;
}

body .energas-map-section .energas-location-card__person-info span {
    margin-top: 0;
    color: #000;
    font-size: 25px;
    font-weight: 500;
    line-height: 35px;
}

body .energas-map-section .energas-location-card__actions {
    gap: 11px;
}

body .energas-map-section .energas-location-card__button {
    min-height: 48px;
    padding: 11px 6px 11px 18px;
    gap: 12px;
    color: #000 !important;
    font-family: "Poppins", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 22px;
}

body .energas-map-section .energas-location-card__button:hover {
    color: #fff !important;
    background: #000;
}

/* Pfeil wie in der Figma: 36-px-Feld mit dünnem Pfeil, gleiches Icon wie im Kontaktfinder.
   Das Textzeichen im Knopf gibt es in Poppins nicht – der Browser zeichnete es mit Arial.
   Als Maske in Textfarbe, damit der Pfeil beim Hover mit weiß wird. */
body .energas-map-section .energas-location-card__button span {
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    margin: -7px 0;
    font-size: 0;
    line-height: 0;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36'%3E%3Cpath d='M9 18L27 18M20.25 24.75L27 18L20.25 11.25' fill='none' stroke='%23000' stroke-width='1' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36'%3E%3Cpath d='M9 18L27 18M20.25 24.75L27 18L20.25 11.25' fill='none' stroke='%23000' stroke-width='1' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Drei Spalten mit gemeinsamen Zeilen (Typ, Titel, Text, Person, Knöpfe auf einer Höhe) */
@media (min-width: 1200px) {
    body .energas-map-section .energas-location-card {
        display: grid;
        grid-row: span 5;
        grid-template-rows: subgrid;
        row-gap: 0;
    }

    body .energas-map-section .energas-location-card__desc {
        min-height: 310px;
    }

    body .energas-map-section .energas-location-card__actions {
        margin-top: 0;
    }
}

@media (min-width: 1200px) and (max-width: 1399px) {
    body .energas-map-section .energas-location-card {
        padding-right: 30px;
        padding-left: 30px;
    }
}

/* Darunter stehen die Karten untereinander */
@media (max-width: 1199px) {
    body .energas-map-section .energas-map-section__main {
        height: 620px;
    }

    body .energas-map-section .energas-map-section__locations {
        grid-template-columns: 1fr;
        gap: 24px;
        margin-top: 40px;
    }

    body .energas-map-section .energas-location-card {
        padding: 45px;
    }

    body .energas-map-section .energas-location-card h3 {
        margin-bottom: 24px;
    }

    body .energas-map-section .energas-location-card__desc {
        margin-bottom: 40px;
    }

    body .energas-map-section .energas-location-card__avatar-wrap {
        margin-bottom: 24px;
    }

    body .energas-map-section .energas-location-card__person {
        margin-bottom: 32px;
    }
}

@media (max-width: 1024px) {
    body .energas-map-section .energas-location-card__desc,
    body .energas-map-section .energas-location-card__person-info strong,
    body .energas-map-section .energas-location-card__person-info span {
        font-size: 23px;
        line-height: 33px;
    }
}

@media (max-width: 767px) {
    body .energas-map-section .energas-map-section__main {
        height: 480px;
    }

    body .energas-map-section .energas-map-section__toolbar {
        top: 16px;
        right: 16px;
        left: 16px;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 8px;
    }

    body .energas-map-section .energas-map-section__toolbar-button {
        min-height: 40px;
        padding: 7px 14px;
        font-size: 16px;
        line-height: 22px;
    }

    body .energas-map-section .energas-location-card {
        padding: 32px 24px;
    }

    body .energas-map-section .energas-location-card__type {
        font-size: 18px;
        line-height: 24px;
    }

    body .energas-map-section .energas-location-card h3 {
        font-size: 32px;
        line-height: 38px;
    }

    body .energas-map-section .energas-location-card__avatar-wrap {
        width: 180px;
        height: 180px;
    }

    body .energas-map-section .energas-location-card__button span {
        flex-basis: 28px;
        width: 28px;
        height: 28px;
        margin: -3px 0;
    }

    body .energas-map-section .energas-location-card__desc,
    body .energas-map-section .energas-location-card__person-info strong,
    body .energas-map-section .energas-location-card__person-info span {
        font-size: 20px;
        line-height: 30px;
    }
}

/* ---------- Info-Kasten über dem Marker (Leaflet-Popup) ---------- */

body .energas-map-section .energas-map-popup .leaflet-popup-content-wrapper {
    padding: 0;
    color: #000;
    background: #fff;
    border-radius: 0;
    box-shadow: none;
}

body .energas-map-section .energas-map-popup .leaflet-popup-content {
    margin: 0;
    padding: 56px 45px 62px;
    font-family: "Poppins", sans-serif;
    line-height: 26px;
}

body .energas-map-section .energas-map-popup .leaflet-popup-tip-container {
    display: none;
}

body .energas-map-section .energas-map-popup .energas-map-popup__type {
    margin: 0 0 8px;
    font-size: 20px;
    font-weight: 400;
    line-height: 26px;
}

body .energas-map-section .energas-map-popup .energas-map-popup__title {
    margin: 0 0 53px;
    font-size: 40px;
    font-weight: 500;
    line-height: 46px;
}

body .energas-map-section .energas-map-popup .energas-map-popup__address {
    margin: 0;
    font-size: 20px;
    font-weight: 400;
    line-height: 26px;
}

body .energas-map-section .energas-map-popup .energas-map-popup__company {
    font-weight: 500;
}

@media (max-width: 767px) {
    body .energas-map-section .energas-map-popup .leaflet-popup-content {
        padding: 24px;
    }

    body .energas-map-section .energas-map-popup .energas-map-popup__title {
        margin-bottom: 20px;
        font-size: 28px;
        line-height: 34px;
    }
}

/* ============================================================
   Kontaktfinder nach Figma "Ansprechpartner" (15.09.2026)
   Kai: Schriftstärken und Co. stimmen nicht ("600 nicht 700").
   Werte aus den Designdaten der Figma: Überschrift, Schrittnummern und
   Hotline-Titel SemiBold 40/46 ohne Laufweite; Einleitung, Schritt-Titel,
   Hotline-Nummer und Kontaktdaten Medium 30/40; Felder Regular 20/26;
   kleiner Knopf 48 px hoch.
   Stärke 600 und Platzhalterfarbe (Schwarz) stehen in den Einstellungen
   des Plugins – hier nur, was das Plugin nicht einstellen kann.
   Zeilenhöhen als Verhältnis, damit sie mit der automatischen
   Verkleinerung des Finders in schmalen Bereichen mitgehen.
   ============================================================ */

body .egcf.egcf .egcf__title,
body .egcf.egcf h3.egcf-hotline__title,
body .egcf.egcf .egcf__step-number {
    line-height: 1.15;
    letter-spacing: normal;
}

body .egcf.egcf .egcf__intro,
body .egcf.egcf label.egcf__label,
body .egcf.egcf p.egcf-hotline__line,
body .egcf.egcf .egcf-contact--plain {
    line-height: 1.3334;
}

/* Telefonnummer und Kontakt-Links Medium wie ihre Zeile – das Elementor-Kit setzt Links auf 400. */
body .egcf.egcf a.egcf-hotline__link,
body .egcf.egcf a.egcf-contact__link {
    font-weight: inherit;
}

/* Rechte Karte: 48 px Innenabstand rechts wie in der Figma (Plugin: 104 px),
   damit die Nummer in 30 px passt. Schmale Bereiche regelt das Plugin weiter selbst. */
body .egcf.egcf {
    --egcf-panel-padding: 95px 48px 95px 46px;
}

body .egcf.egcf .egcf__control input.egcf__input,
body .egcf.egcf .egcf__control select.egcf__select {
    line-height: 1.3;
}

/* Firmenname im Ergebnis SemiBold statt Bold */
body .egcf.egcf .egcf-contact--plain p.egcf-contact__company {
    font-weight: 600;
}

/* Knöpfe wie die Knöpfe der Website (Wunsch Kai, 15.09.2026; ersetzt den
   48-px-Knopf "Small" aus der Figma): 52 px hoch mit 10/20 px Innenabstand,
   Schrift wie die Kit-Typografie "button" (Poppins 500, 18/28 px, große
   Anfangsbuchstaben), Pfeil jki-arrow-right-line in 18 px mit Stärke 800 und
   5 px Abstand statt des dünnen 36-px-SVG, Hover schwarz mit weißer Schrift.
   Gilt für "Jetzt finden" und den Termin-Knopf im Ergebnis. Farben bewusst hier
   und nicht in den Plugin-Einstellungen: die Update-Routine des Plugins löscht
   gespeicherte Werte wie #ffffff als "alte Standards". */
body .egcf.egcf button.egcf__button,
body .egcf.egcf a.egcf__button {
    gap: 5px;
    padding: 10px 20px;
    font-family: var(--e-global-typography-56fd71a-font-family, "Poppins"), sans-serif;
    font-size: var(--e-global-typography-56fd71a-font-size, 18px);
    font-weight: var(--e-global-typography-56fd71a-font-weight, 500);
    line-height: var(--e-global-typography-56fd71a-line-height, 28px);
    text-transform: var(--e-global-typography-56fd71a-text-transform, capitalize);
}

body .egcf.egcf button.egcf__button:hover,
body .egcf.egcf button.egcf__button:focus-visible,
body .egcf.egcf a.egcf__button:hover,
body .egcf.egcf a.egcf__button:focus-visible {
    border-color: var(--e-global-color-text, #000000);
    background: var(--e-global-color-text, #000000);
    color: var(--e-global-color-6bc6209, #ffffff);
}

body .egcf.egcf .egcf__button .egcf__button-icon svg.egcf-icon {
    display: none;
}

body .egcf.egcf .egcf__button .egcf__button-icon::before {
    content: "\ef1b";
    display: inline-block;
    font-family: jkiticon;
    font-size: 18px;
    font-style: normal;
    font-weight: 800;
    line-height: 1;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body .egcf.egcf.is-loading .egcf__button--submit .egcf__button-icon::before {
    animation: egcf-nudge 0.9s ease-in-out infinite;
}

/* Standorte-Karte: gewaehlte Karte ohne grauen Rahmen und Schatten (Wunsch Kai, 15.09.2026).
   Das Karten-Widget gibt .is-active einen Rahmen #d0d0d0 und einen leichten Schatten;
   der weisse Kasten steht jetzt randlos. */
body .energas-map-section .energas-map-section__locations.has-selection .energas-location-card.is-active {
    border-color: transparent;
    box-shadow: none;
}

/* =========================================================================
 * Kundenportal (Seite 10460), "Einblick ins Kundenportal": alle drei Bild-Karussells
 * Screenshots immer vollstaendig sichtbar, alle Karussells gleich hoch (Kai 15.09.2026:
 * zuerst "Einpassen" fuer das mittlere Karussell, dann "die Screenshots sind abgeschnitten"
 * auch links und rechts). Per CSS, die Seite bleibt unveraendert; gilt auch fuer Bilder,
 * die spaeter in diese Karussells kommen.
 *  - jedes Bild 272 px hoch (Tablet 320, Handy 200), volle Breite, eingepasst, mittig
 *  - jede Folie ohne Innenabstand in voller Breite (einige Folien waren geboxte Container
 *    mit Standard-Innenabstand und dadurch 20 px hoeher als die anderen)
 * ========================================================================= */
body .elementor-10460 .elementor-element-117d1fae .elementor-widget-n-carousel .swiper-slide > .e-con,
body .elementor-10460 .elementor-element-117d1fae .elementor-widget-n-carousel .swiper-slide > .e-con > .e-con-inner {
    padding: 0 !important;
    max-width: none !important;
    width: 100% !important;
}

body .elementor-10460 .elementor-element-117d1fae .elementor-widget-n-carousel .swiper-slide .elementor-widget-image {
    width: 100% !important;
}

body .elementor-10460 .elementor-element-117d1fae .elementor-widget-n-carousel .swiper-slide .elementor-widget-image img {
    width: 100% !important;
    height: 272px !important;
    object-fit: contain !important;
    object-position: center center !important;
}

@media (max-width: 1024px) {
    body .elementor-10460 .elementor-element-117d1fae .elementor-widget-n-carousel .swiper-slide .elementor-widget-image img {
        height: 320px !important;
    }
}

@media (max-width: 767px) {
    body .elementor-10460 .elementor-element-117d1fae .elementor-widget-n-carousel .swiper-slide .elementor-widget-image img {
        height: 200px !important;
    }
}

/* Aufzaehlungspunkte (Icon-Liste mit kleinem Kreis: Kundenportal, Vorlage "Single Post" der
   Blog-Beitraege): mehr Abstand zwischen Punkt und Text (Kai 15.09.2026).
   Elementor-Vorgabe 5 px -> 10 px; die Haekchen-Listen der Website haben rund 10 px. */
body .elementor-widget-icon-list .elementor-icon-list-icon:has(.e-fas-circle, .fa-circle) + .elementor-icon-list-text {
    padding-inline-start: 10px;
}

/* Seitentitel (H1, globale Typografie 8d22d0f: 78/90 px, 600) auf Tablet und Handy verkleinern (15.09.2026).
   Das Kit hatte fuer diese Typografie keine kleineren Werte: lange Woerter wie "Energiemanagement",
   "Emissionsmessung" oder "Ansprechpartner" liefen auf dem Handy aus dem Bildschirm, die ganze Seite
   wurde breiter als das Geraet. Staffel wie bei den anderen grossen Typografien des Kits
   (Tablet rund 85 %, Handy 40 px), Zeilenhoehe im selben Verhaeltnis; dazu Silbentrennung und
   Umbruch als Sicherung fuer sehr lange Woerter. */
@media (max-width: 1024px) {
    body.elementor-kit-27 {
        --e-global-typography-8d22d0f-font-size: 66px;
        --e-global-typography-8d22d0f-line-height: 76px;
    }

    body .elementor-widget-heading h1.elementor-heading-title {
        -webkit-hyphens: auto;
        hyphens: auto;
        overflow-wrap: break-word;
    }
}

@media (max-width: 767px) {
    body.elementor-kit-27 {
        --e-global-typography-8d22d0f-font-size: 40px;
        --e-global-typography-8d22d0f-line-height: 46px;
    }
}

/* Lange Woerter in Ueberschriften und Listen auf dem Handy (15.09.2026):
   Titel wie "Was fuer myplant Energiemanagement spricht" oder "Einhaltung der Emissionsgrenzwerte"
   machten Seiten breiter als das Geraet. Silbentrennung (Seitensprache de) und als Sicherung ein
   Umbruch im Wort, der nur greift, wenn ein Wort sonst nicht in die Zeile passt. Trennstellen fuer
   haeufige lange Woerter setzt zusaetzlich functions.php (energas_trennstellen_ueberschriften). */
@media (max-width: 767px) {
    body .elementor-widget-heading .elementor-heading-title,
    body .jeg-elementor-kit.jkit-heading .heading-section-title,
    body .jeg-elementor-kit.jkit-heading .heading-title,
    body .elementor-widget-icon-list .elementor-icon-list-text {
        -webkit-hyphens: auto;
        hyphens: auto;
        overflow-wrap: anywhere;
    }
}

/* Weitere Textbausteine mit langen Woertern auf dem Handy (15.09.2026, Pruefung aller Seiten mit
   Seitentitel bei 390 und 360 px): Beschreibungen in JKit-Ueberschriften (30 px), Akkordeon-Titel
   und grosse Texte im Texteditor liefen ueber den Rand. Gleiche Regel wie im Block davor; beide
   Eigenschaften erben, deshalb am Baustein selbst gesetzt. */
@media (max-width: 767px) {
    body .jeg-elementor-kit.jkit-heading,
    body .jeg-elementor-kit.jkit-accordion .card-header-button,
    body .elementor-widget-text-editor {
        -webkit-hyphens: auto;
        hyphens: auto;
        overflow-wrap: anywhere;
    }
}

/* Handy: letzte Ueberstaende und Aufzaehlungspunkte (15.09.2026, Kai: "ja bitte")
   1. Glossar (Code-Snippet energas_glossar_az): lange Begriffe wie "Einspeisung/Einspeisevergütung"
      machten die Spalte breiter als das Geraet -> Spalte darf schmaler werden, Woerter trennen.
   2. JKit-Akkordeon: Text in aufgeklappten Karten (Service > Leistungen) lief ueber den Rand.
   3. "Weitere Beitraege" unter Blog-Beitraegen (Loop-Grid 405c792 der Vorlage 760): im Widget sind
      fuer das Handy 3 Spalten eingestellt, die Karten wurden 157 px schmal -> eine Spalte.
   4. Aufzaehlungspunkte mit Kreis-Symbol: bei mehrzeiligen Punkten sitzt der Punkt an der ersten
      Zeile wie bei den Haekchen-Listen (Elementor-Variablen fuer die senkrechte Ausrichtung;
      Versatz = halbe Differenz aus Zeilenhoehe des Listentexts und Punktgroesse). */
@media (max-width: 767px) {
    body .energas-glossar__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    body .energas-glossar__item,
    body .jeg-elementor-kit.jkit-accordion .card-body {
        min-width: 0;
        -webkit-hyphens: auto;
        hyphens: auto;
        overflow-wrap: anywhere;
    }

    body .elementor-760 .elementor-element-405c792 .elementor-loop-container {
        grid-template-columns: minmax(0, 1fr);
    }
}

body .elementor-widget-icon-list .elementor-icon-list-item:has(.elementor-icon-list-icon .e-fas-circle),
body .elementor-widget-icon-list .elementor-icon-list-item:has(.elementor-icon-list-icon .fa-circle) {
    --icon-vertical-align: flex-start;
    --icon-vertical-offset: calc((var(--e-global-typography-1239bd0-line-height, 26px) - var(--e-icon-list-icon-size, 6px)) / 2);
}

/* "Weitere Beitraege" unter Blog-Beitraegen auf dem Handy: das Widget stellt gleich hohe Karten ein
   (grid-auto-rows 1fr im Seiten-CSS mit .elementor-element.elementor-element-405c792). In einer
   Spalte wurde dadurch die Karte ohne Bild so hoch wie die mit Bild (810 px mit viel Leerraum)
   -> jede Karte so hoch wie ihr Inhalt (15.09.2026). */
@media (max-width: 767px) {
    body .elementor-760 .elementor-element.elementor-element-405c792 .elementor-loop-container {
        grid-auto-rows: auto;
    }
}

/* Ansprechpartner-Finder: nur noch das PLZ-Feld (Kai 15.09.2026). Die Schrittnummer "01" ist
   ausgeblendet, das Feld beginnt buendig mit Ueberschrift und Einleitung. Technologie und
   Leistungsklasse sind in den Plugin-Einstellungen abgeschaltet. */
body .egcf.egcf .egcf__step-number {
    display: none;
}

/* Ansprechpartner-Finder (15.09.2026):
   - Namen auf den Karten SemiBold wie alle Ueberschriften (Kai: "600 nicht 700"). Das Plugin setzt fuer
     die Kartenart "icons" fest 700 -> hier die Ueberschriften-Staerke aus den Plugin-Einstellungen (600).
   - Nach der Suche setzt das Plugin den Fokus auf den ersten Namen (fuer Screenreader). Chrome zeichnete
     dafuer einen schwarzen Rahmen (Meldung Kai) -> ohne Rahmen; per Tab-Taste ist der Name nicht
     erreichbar, der Rahmen hat dort keine Funktion. */
body .egcf.egcf .egcf-contact h3.egcf-contact__name {
    font-weight: var(--egcf-heading-weight, 600);
}

body .egcf.egcf [tabindex="-1"]:focus {
    outline: none;
}

/* ============================================================
   Rechtstexte: Impressum, AGB, Datenschutz (15.09.2026)
   Wunsch Kai: Inhalte der alten Website übernehmen, in Elementor nur das
   HTML-Widget neu füllen (Kopf und Bilder unverändert), Gestaltung nach
   dem Corporate Design der Website. Aufbau wie die Blog-Beiträge
   (Vorlage 760): weiße Fläche mit 48 px Innenabstand, links 30 %
   Randspalte, rechts 70 % Text, 40 px Abstand, ab Tablet untereinander.
   Text in der Typografie des Blog-Inhalts (20 px/1,65; h2 30 px, h3 25 px,
   h4 20 px, jeweils 600). Randspalte: Überschrift wie „Kategorie“ im Blog
   (18/28 500, Grau label-2), Knöpfe wie die Website-Knöpfe.
   Markup im HTML-Widget: .energas-rechtstext-karte >
   .energas-rechtstext-spalten > .energas-rechtstext--rand und
   .energas-rechtstext--haupt (beide mit .energas-rechtstext).
   ============================================================ */

body .energas-rechtstext-karte {
    margin: 0 0 100px;
    padding: 48px;
    background: var(--e-global-color-6bc6209, #ffffff);
}

body .energas-rechtstext-spalten {
    display: flex;
    align-items: flex-start;
    gap: 40px;
}

body .energas-rechtstext--rand {
    flex: 0 1 30%;
    min-width: 0;
}

body .energas-rechtstext--haupt {
    flex: 0 1 70%;
    min-width: 0;
}

body .energas-rechtstext {
    color: var(--e-global-color-text, #000000);
    font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.65;
}

body .energas-rechtstext p,
body .energas-rechtstext ul,
body .energas-rechtstext ol {
    margin: 0 0 1.4em;
    font-size: 20px;
    line-height: 1.65;
}

body .energas-rechtstext ul,
body .energas-rechtstext ol {
    padding-left: 1.3em;
}

body .energas-rechtstext li {
    margin: 0 0 .4em;
}

body .energas-rechtstext li:last-child {
    margin-bottom: 0;
}

body .energas-rechtstext h2,
body .energas-rechtstext h3,
body .energas-rechtstext h4 {
    color: inherit;
    font-family: inherit;
    font-weight: 600;
    letter-spacing: normal;
    text-transform: none;
    scroll-margin-top: 24px;
}

body .energas-rechtstext h2 {
    margin: 2em 0 .6em;
    font-size: 30px;
    line-height: 1.3;
}

body .energas-rechtstext h3 {
    margin: 1.7em 0 .5em;
    font-size: 25px;
    line-height: 1.35;
}

body .energas-rechtstext h4 {
    margin: 1.5em 0 .5em;
    font-size: 20px;
    line-height: 1.4;
}

/* Unterüberschrift direkt nach der Überschrift: nur deren Abstand nach unten */
body .energas-rechtstext h2 + h3,
body .energas-rechtstext h3 + h4 {
    margin-top: 0;
}

/* Medium statt Semibold (Korrekturliste 28.09.2026, Punkt 4) */
body .energas-rechtstext strong,
body .energas-rechtstext b {
    font-weight: 500;
}

body .energas-rechtstext a {
    color: inherit;
    text-decoration: underline;
    overflow-wrap: anywhere;
}

/* Beim Zeigen nicht mehr gruen: die Farbe bleibt, die Linie bleibt und
   wird dicker (Kai 29.09.2026, Block "Schon unterstrichene Links" am Ende).
   Das Inhaltsverzeichnis hat seine eigene feine Linie, siehe dort. */
body .energas-rechtstext a:hover,
body .energas-rechtstext a:focus-visible {
    color: inherit;
}

body .energas-rechtstext > :first-child {
    margin-top: 0;
}

body .energas-rechtstext > :last-child {
    margin-bottom: 0;
}

/* Randspalte */
body .energas-rechtstext--rand p {
    margin-bottom: 1em;
}

body .energas-rechtstext p.energas-rechtstext__label {
    margin: 0 0 8px;
    color: var(--e-global-color-4c3c520, rgba(60, 60, 67, .7));
    font-size: 18px;
    font-weight: 500;
    line-height: 28px;
}

body .energas-rechtstext p.energas-rechtstext__label:not(:first-child) {
    margin-top: 48px;
}

body .energas-rechtstext p.energas-rechtstext__dokument {
    margin: 0 0 16px;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.4;
}

body .energas-rechtstext p.energas-rechtstext__aktion {
    margin: 0 0 32px;
}

body .energas-rechtstext ul.energas-rechtstext__inhalt {
    margin: 0;
    padding: 0;
    list-style: none;
}

body .energas-rechtstext ul.energas-rechtstext__inhalt li {
    margin: 0;
    padding: 5px 0;
    line-height: 1.3;
}

/* Inhaltsverzeichnis unterstrichen (Kai 29.09.2026: "AGB Inhaltsangabe
   Underline"), beim Zeigen wird die Linie dicker wie bei den anderen
   unterstrichenen Links */
body .energas-rechtstext ul.energas-rechtstext__inhalt a {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.3;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
}

body .energas-rechtstext ul.energas-rechtstext__inhalt a:hover,
body .energas-rechtstext ul.energas-rechtstext__inhalt a:focus-visible {
    text-decoration-thickness: 2px;
}

/* Knopf in der Randspalte wie die Website-Knöpfe */
body .energas-rechtstext a.energas-rechtstext__knopf {
    display: inline-block;
    padding: 10px 20px;
    border: 2px solid var(--e-global-color-text, #000000);
    border-radius: 100px;
    background: transparent;
    color: var(--e-global-color-text, #000000);
    font-family: var(--e-global-typography-56fd71a-font-family, "Poppins"), sans-serif;
    font-size: var(--e-global-typography-56fd71a-font-size, 18px);
    font-weight: var(--e-global-typography-56fd71a-font-weight, 500);
    line-height: var(--e-global-typography-56fd71a-line-height, 28px);
    text-decoration: none;
    text-transform: var(--e-global-typography-56fd71a-text-transform, capitalize);
    overflow-wrap: normal;
    transition: all .3s ease;
}

body .energas-rechtstext a.energas-rechtstext__knopf::after {
    content: "\ef1b";
    display: inline-block;
    margin-left: 5px;
    font-family: jkiticon;
    font-size: 18px;
    font-style: normal;
    font-weight: 800;
    line-height: 1;
    text-transform: none;
    vertical-align: middle;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body .energas-rechtstext a.energas-rechtstext__knopf:hover,
body .energas-rechtstext a.energas-rechtstext__knopf:focus-visible {
    background: var(--e-global-color-text, #000000);
    color: var(--e-global-color-6bc6209, #ffffff);
}

/* Telefon und E-Mail im Impressum als Knoepfe (Kai 29.09.2026: "kontaktdaten
   tel. etc als button"). Nummer und Adresse sind die Beschriftung, deshalb
   ohne Grossbuchstaben am Wortanfang. Passen beide nicht nebeneinander,
   stehen sie untereinander. */
body .energas-rechtstext p.energas-rechtstext__kontakt {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 12px;
    margin: 0 0 32px;
}

body .energas-rechtstext p.energas-rechtstext__kontakt a.energas-rechtstext__knopf {
    text-transform: none;
}

/* Inhaltsverzeichnis (AGB, Datenschutz) läuft beim Lesen mit (Wunsch Kai, nur Desktop).
   Die Randspalte reicht dafür über die ganze Texthöhe; ist der Bildschirm niedriger als
   das Verzeichnis, lässt es sich in sich scrollen. */
body .energas-rechtstext__navigation:not(:first-child) {
    margin-top: 48px;
}

@media (min-width: 1025px) {
    body .energas-rechtstext-spalten {
        align-items: stretch;
    }

    body .energas-rechtstext__navigation {
        position: sticky;
        top: 40px;
        max-height: calc(100vh - 80px);
        overflow-y: auto;
        padding-right: 8px;
        scrollbar-width: thin;
        scrollbar-color: #d4d4d4 transparent;
    }

    body .energas-rechtstext__navigation::-webkit-scrollbar {
        width: 6px;
    }

    body .energas-rechtstext__navigation::-webkit-scrollbar-track {
        background: transparent;
    }

    body .energas-rechtstext__navigation::-webkit-scrollbar-thumb {
        border-radius: 3px;
        background: #d4d4d4;
    }
}

@media (max-width: 1024px) {
    body .energas-rechtstext-karte {
        margin-bottom: 50px;
        padding: 40px;
    }

    body .energas-rechtstext-spalten {
        flex-direction: column;
        align-items: stretch;
        gap: 48px;
    }

    body .energas-rechtstext--rand,
    body .energas-rechtstext--haupt {
        flex: 0 0 auto;
    }

    body .energas-rechtstext,
    body .energas-rechtstext p,
    body .energas-rechtstext ul,
    body .energas-rechtstext ol {
        font-size: 19px;
    }

    body .energas-rechtstext h2 {
        font-size: 28px;
    }

    body .energas-rechtstext h3 {
        font-size: 23px;
    }

    body .energas-rechtstext ul.energas-rechtstext__inhalt a {
        font-size: 19px;
    }
}

@media (max-width: 767px) {
    body .energas-rechtstext-karte {
        padding: 24px 20px 32px;
    }

    body .energas-rechtstext {
        hyphens: auto;
        overflow-wrap: break-word;
    }

    body .energas-rechtstext,
    body .energas-rechtstext p,
    body .energas-rechtstext ul,
    body .energas-rechtstext ol {
        font-size: 18px;
    }

    body .energas-rechtstext h2 {
        font-size: 24px;
    }

    body .energas-rechtstext h3 {
        font-size: 20px;
    }

    body .energas-rechtstext h4,
    body .energas-rechtstext p.energas-rechtstext__dokument,
    body .energas-rechtstext ul.energas-rechtstext__inhalt a {
        font-size: 18px;
    }
}

/* =========================================================================
 * Kundenstimme (rundes Foto + Zitat): Foto auf der Textkante der Kaesten
 * (Kai 22.09.2026: "das Bild bitte so einruecken, dass die Linie Sinn macht",
 * der Block steht auf mehreren Seiten).
 *
 * Vorher lag das Foto auf keiner Linie der Seite: bei breiten Fenstern 15 px
 * hinter der Hauptkante, von 1025 bis 1405 px je nach Seite 0 oder 10 px, auf
 * dem Tablet rund 80 px (der Bereich war dort nur 85 % breit). Zwischen 1025
 * und 1400 px und auf dem Tablet wurde es ausserdem zu einem Oval gestaucht.
 *
 * Jetzt ab 768 px (auf dem Handy bleibt das Foto mittig ueber dem Zitat):
 *  - Der aeussere Container bekommt wie alle anderen Bereiche 15 px Seitenrand
 *    und auf dem Tablet die volle Breite, der innere ("testimonials") keinen
 *    eigenen Seitenrand mehr. Damit beginnt der Block auf der Hauptkante.
 *  - Das Foto sitzt auf der Textkante der Kaesten: 48 px hinter der Hauptkante,
 *    Tablet 24 px. Auf der Leistungen-Seite 51/27 px, weil die Karten dort
 *    zusaetzlich einen 3-px-Rahmen haben.
 *  - Die Fotospalte ist Einzug + 240 px breit und schrumpft nicht, das Foto
 *    bleibt rund. Das Zitat fuellt den Rest der Zeile, Abstand zum Foto wie
 *    eingestellt 100 px (Tablet 20 px).
 *
 * Die Seiten selbst bleiben unveraendert. Beim Kopieren des Blocks auf eine
 * weitere Seite vergibt Elementor neue IDs, die hier ergaenzt werden muessen.
 * Seiten: 10424 Leistungen, 10501 Team, 10517 Arbeitswelt, 10528 Kaufmaennische
 * Stellen, 10533 Technische Stellen, 10538 Initiativbewerbung, 11357 Ausbildung
 * und Studium.
 * ========================================================================= */
@media (min-width: 768px) {
    /* aeusserer Container: Seitenrand wie die uebrigen Bereiche */
    body .elementor-10424 .elementor-element.elementor-element-69f898f,
    body .elementor-10501 .elementor-element.elementor-element-7b3f094,
    body .elementor-10517 .elementor-element.elementor-element-5e8d8a7,
    body .elementor-10528 .elementor-element.elementor-element-5986b5d,
    body .elementor-10533 .elementor-element.elementor-element-13143bf9,
    body .elementor-10538 .elementor-element.elementor-element-7bb99ac1,
    body .elementor-11357 .elementor-element.elementor-element-40d1c4f9 {
        --padding-left: 15px;
        --padding-right: 15px;
    }

    /* innerer Container "testimonials": kein zweiter Seitenrand */
    body .elementor-10424 .elementor-element.elementor-element-c6299c4,
    body .elementor-10501 .elementor-element.elementor-element-23dd32e,
    body .elementor-10517 .elementor-element.elementor-element-4d47302,
    body .elementor-10528 .elementor-element.elementor-element-09f4d62,
    body .elementor-10533 .elementor-element.elementor-element-fb98b21,
    body .elementor-10538 .elementor-element.elementor-element-c2d2a18,
    body .elementor-11357 .elementor-element.elementor-element-bbb38e1 {
        --padding-left: 0px;
        --padding-right: 0px;
    }

    /* Fotospalte: Einzug + Foto, schrumpft nicht */
    body .elementor-10424 .elementor-element.elementor-element-7533dca,
    body .elementor-10501 .elementor-element.elementor-element-be20555,
    body .elementor-10517 .elementor-element.elementor-element-a51c5f8,
    body .elementor-10528 .elementor-element.elementor-element-14a41cc,
    body .elementor-10533 .elementor-element.elementor-element-b73e602,
    body .elementor-10538 .elementor-element.elementor-element-bcd1db4,
    body .elementor-11357 .elementor-element.elementor-element-88ea622 {
        --energas-foto-einzug: 48px;
        --width: calc(var(--energas-foto-einzug) + 240px);
        --flex-grow: 0;
        --flex-shrink: 0;
        --padding-left: var(--energas-foto-einzug);
    }

    /* Zitatspalte: der Rest der Zeile */
    body .elementor-10424 .elementor-element.elementor-element-5f6bb74,
    body .elementor-10501 .elementor-element.elementor-element-2c4df55,
    body .elementor-10517 .elementor-element.elementor-element-a5490fc,
    body .elementor-10528 .elementor-element.elementor-element-a997ecc,
    body .elementor-10533 .elementor-element.elementor-element-5014e67,
    body .elementor-10538 .elementor-element.elementor-element-a2ce4f4,
    body .elementor-11357 .elementor-element.elementor-element-157f8c9 {
        --flex-grow: 1;
        --flex-shrink: 1;
        --flex-basis: 0%;
    }

    /* Leistungen: Karten mit 3-px-Rahmen, Textkante 51 px */
    body .elementor-10424 .elementor-element.elementor-element-7533dca {
        --energas-foto-einzug: 51px;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    /* Tablet: Bereich in voller Breite wie die uebrigen Bereiche */
    body .elementor-10424 .elementor-element.elementor-element-69f898f,
    body .elementor-10501 .elementor-element.elementor-element-7b3f094,
    body .elementor-10517 .elementor-element.elementor-element-5e8d8a7,
    body .elementor-10528 .elementor-element.elementor-element-5986b5d,
    body .elementor-10533 .elementor-element.elementor-element-13143bf9,
    body .elementor-10538 .elementor-element.elementor-element-7bb99ac1,
    body .elementor-11357 .elementor-element.elementor-element-40d1c4f9 {
        --content-width: 100%;
    }

    body .elementor-10424 .elementor-element.elementor-element-7533dca,
    body .elementor-10501 .elementor-element.elementor-element-be20555,
    body .elementor-10517 .elementor-element.elementor-element-a51c5f8,
    body .elementor-10528 .elementor-element.elementor-element-14a41cc,
    body .elementor-10533 .elementor-element.elementor-element-b73e602,
    body .elementor-10538 .elementor-element.elementor-element-bcd1db4,
    body .elementor-11357 .elementor-element.elementor-element-88ea622 {
        --energas-foto-einzug: 24px;
    }

    body .elementor-10424 .elementor-element.elementor-element-7533dca {
        --energas-foto-einzug: 27px;
    }
}

/* =========================================================================
 * Standorte-Karte: Knoepfe in der Farbe ihrer Karte (Kai 22.09.2026: Hintergrund
 * der Knoepfe grau, wenn die Karte nicht aktiv ist).
 * Ist ein Standort gewaehlt, werden die uebrigen Karten grau (#eeeeee), ihre Knoepfe
 * waren aber weiss. Jetzt sind die Knoepfe durchsichtig: in der weissen Karte weiss,
 * in der grauen grau. Beim Ueberfahren bleiben sie schwarz mit weisser Schrift.
 * ========================================================================= */
body .energas-map-section .energas-location-card__button {
    background: transparent;
}

/* =========================================================================
 * Links im Text der Icon-Kaesten: gleiche Schrift wie der Text drumherum
 * (Kundenwunsch 22.09.2026: "Tel. selbe Schriftschnitt wie der Text darunter",
 * Kasten "24/7-Hotline" auf Service > Leistungen).
 * Die globale Link-Einstellung (Website-Einstellungen > Typografie > Link) setzt
 * jeden Link auf Schriftart und Staerke des Stils "Text" (400). In den Kaesten
 * steht die Beschreibung aber z. B. in 500, dadurch war die Telefonnummer duenner
 * als der Satz darunter. Links in der Beschreibung eines Icon-Kastens uebernehmen
 * jetzt Schriftart und -staerke vom Text; Farbe und Unterstreichung bleiben.
 * Stand 22.09.2026 betrifft das nur die Telefonnummer auf Service > Leistungen
 * (alle Seiten geprueft).
 * ========================================================================= */
body.elementor-kit-27 .elementor-widget-jkit_icon_box .icon-box-description a {
    font-family: inherit;
    font-weight: inherit;
}

/* =========================================================================
 * Blog-Karten gleich aufgebaut (Loop-Vorlage 747: Blog, Kategorieseiten und
 * "Weitere Beitraege" unter jedem Beitrag). Kundenwunsch 22.09.2026: auf /blog/
 * "huepfen" die Beitraege (Bild ja/nein, Titel 1-6 Zeilen, Einleitung
 * ja/nein/lang). Kai: "gerne ja !"
 * - Ersatzbild und automatische Einleitung kommen aus der Vorlage 747
 *   (Fallback im Beitragsbild, Auszug "Auf Beitragsinhalt anwenden").
 * - Einleitung hoechstens 3 Zeilen, danach "...".
 * - Wo Karten nebeneinander stehen, sind sie zeilenweise ausgerichtet
 *   (CSS-Subgrid): Bild, Kategorie/Datum, Titel, Einleitung und "Weiterlesen"
 *   auf gleicher Hoehe, Titel vollstaendig, "Weiterlesen" unten. Desktop: alle
 *   Raster; Tablet: nur "Weitere Beitraege" (Blog und Kategorien einspaltig).
 *   In einspaltigen Rastern bleibt der Aufbau wie bisher (die Rasterluecken
 *   wuerden dort bei fehlender Einleitung zusaetzlichen Abstand erzeugen).
 *   Browser ohne Subgrid zeigen die Karten wie bisher.
 * ========================================================================= */
body .elementor-747 .elementor-element.elementor-element-4f97cc0 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

body .elementor-747 .elementor-element.elementor-element-4f97cc0 p {
    margin: 0;
}

@supports (grid-template-rows: subgrid) {
    @media (min-width: 1025px) {
        body .elementor-loop-container > .e-loop-item.elementor-747,
        body .e-loop-item.elementor-747 > .elementor-element-2333b0f {
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            grid-template-rows: subgrid;
            grid-row: span 5;
            row-gap: 0;
        }

        body .e-loop-item.elementor-747 .elementor-element-6e9ac44,
        body .e-loop-item.elementor-747 .elementor-element-3711db8 {
            display: contents;
        }

        body .e-loop-item.elementor-747 .elementor-element-a2f7c33 { grid-row: 1; }
        body .e-loop-item.elementor-747 .elementor-element-e1973e7 { grid-row: 2; align-self: start; }
        body .e-loop-item.elementor-747 .elementor-element-80cb670 { grid-row: 3; align-self: start; }
        body .e-loop-item.elementor-747 .elementor-element-4f97cc0 { grid-row: 4; align-self: start; }

        /* 48 px Abstand wie bisher (vorher Aussenabstand unten am Titel-Container 3711db8) */
        body .e-loop-item.elementor-747 .elementor-element-6f18c08 { grid-row: 5; align-self: end; margin-top: 48px; }

        /* "Weitere Beitraege" stellt im Widget gleich hohe Reihen ein (grid-auto-rows 1fr).
           Mit den Kartenzeilen wuerde sonst jede Zeile so hoch wie die hoechste. */
        body .elementor-760 .elementor-element.elementor-element-405c792 .elementor-loop-container {
            grid-auto-rows: auto;
        }
    }

    @media (min-width: 768px) and (max-width: 1024px) {
        body .elementor-element-405c792 .elementor-loop-container > .e-loop-item.elementor-747,
        body .elementor-element-405c792 .e-loop-item.elementor-747 > .elementor-element-2333b0f {
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            grid-template-rows: subgrid;
            grid-row: span 5;
            row-gap: 0;
        }

        body .elementor-element-405c792 .e-loop-item.elementor-747 .elementor-element-6e9ac44,
        body .elementor-element-405c792 .e-loop-item.elementor-747 .elementor-element-3711db8 {
            display: contents;
        }

        body .elementor-element-405c792 .e-loop-item.elementor-747 .elementor-element-a2f7c33 { grid-row: 1; }
        body .elementor-element-405c792 .e-loop-item.elementor-747 .elementor-element-e1973e7 { grid-row: 2; align-self: start; }
        body .elementor-element-405c792 .e-loop-item.elementor-747 .elementor-element-80cb670 { grid-row: 3; align-self: start; }
        body .elementor-element-405c792 .e-loop-item.elementor-747 .elementor-element-4f97cc0 { grid-row: 4; align-self: start; }
        body .elementor-element-405c792 .e-loop-item.elementor-747 .elementor-element-6f18c08 { grid-row: 5; align-self: end; margin-top: 48px; }

        body .elementor-760 .elementor-element.elementor-element-405c792 .elementor-loop-container {
            grid-auto-rows: auto;
        }
    }
}

/* Blaetter-Pfeile der Loop-Karussells (Pille): Kundenkorrektur 15.09.2026,
   Punkt 9 "Pfeile vereinheitlichen", Freigabe Kai 23.09.2026. Statt der
   duennen Linearicons-Pfeile der Knopf-Pfeil jki-arrow-left-line bzw.
   jki-arrow-right-line mit Staerke 800 wie in den Knoepfen. Die Groesse bleibt
   wie im Widget eingestellt (20 px). Startseite, Ersatzteillager, Referenzen,
   BHKW-Leistungen. */
.elementor-swiper-button i.lnr-arrow-left,
.elementor-swiper-button i.lnr-arrow-right {
    font-family: jkiticon !important;
    font-weight: 800;
}
.elementor-swiper-button i.lnr-arrow-left::before {
    content: "\ef19";
}
.elementor-swiper-button i.lnr-arrow-right::before {
    content: "\ef1b";
}

/* Blog-Kategorien (Elementor-Taxonomiefilter auf /blog/ und in der Vorlage
   "Blog Layout"): Nach einem Klick und einem Tastendruck (z. B. Pfeiltaste zum
   Scrollen) zeichnete Chrome seinen Fokus-Kasten um die Kategorie. Stattdessen
   zeigt der Tastaturfokus dieselbe feine Unterlinie wie beim Zeigen
   (Kai, 23.09.2026). */
.elementor-widget-taxonomy-filter .e-filter-item:focus-visible {
    outline: none;
    border-style: solid;
    border-width: 0 0 1px 0;
    border-color: var(--e-global-color-text, #000);
}

/* =========================================================================
 * Korrekturliste 28.09.2026 ("Korrekturen-Energas-24-7.pdf")
 * ========================================================================= */

/* Punkt 4 "Schrift": Fettschrift im Fliesstext im Schnitt Medium (500) statt
   Semibold/Bold -- hervorgehobene Woerter in Absaetzen, Listen und Tabellen:
   Blog, Glossar, Rechtstexte, Aufklapp-Elemente, Symbol-Listen, Textbausteine.
   Ueberschriften bleiben, wie sie sind: Ein <strong> in einer Ueberschrift
   steht nicht in p/li/td und behaelt deren Gewicht. Ebenso eigene Titel wie
   der Name in den Standortkarten (eigene Regel weiter oben). Die Regeln fuer
   Aufklapp-Elemente und Rechtstexte weiter oben stehen deshalb ebenfalls auf
   500. */
body :is(p, li, td) :is(strong, b) {
    font-weight: 500;
}

/* Blogbeitraege: Die Beitragsvorlage (Elementor, Vorlage 760) setzt <strong>
   im Beitragstext selbst auf 600 -- hier fuer Absaetze, Listen und Tabellen
   auf 500. <strong> in Zwischenueberschriften behaelt 600. */
body .elementor-760 .elementor-element.elementor-element-5351a00 :is(p, li, td) :is(strong, b) {
    font-weight: 500;
}

/* Glossar: Die Glossar-Vorlage setzt fett geschriebene Absaetze (importierte
   Zwischenueberschriften, "p > strong:only-child") und den Titel der
   Seitenbox ("Weitere Fachbegriffe entdecken") auf Bold 700 -- ebenfalls
   Medium. */
html body.energas-glossar-single .energas-glossar-content p > strong:only-child,
html body.energas-glossar-single .energas-glossar-sidebar-box strong {
    font-weight: 500;
}

/* Punkt 3 "Trainingscenter": Die Liste "Fuer wen ist unser Trainingscenter?"
   beginnt auf derselben Linie wie der Text der Karte "Fuer Sie vor Ort"
   darueber: Foto 20 % + Luecke 72 px (Karte 6fc19022/5e39b88). Vorher stand
   die Liste mit 70 % Breite rechtsbuendig und damit 56 px weiter rechts
   (bei 1440 px). Unter 1025 px steht die Karte untereinander -- dort bleibt
   die Liste wie bisher ueber die volle Breite. */
@media (min-width: 1025px) {
    body .elementor-10507 .elementor-element.elementor-element-6b8d9017 {
        width: auto;
        max-width: none;
        align-self: stretch;
        margin-left: calc(20% + 72px);
    }
}

/* Punkt 5 "Button": "Mehr laden" unter Blog- und Kategorie-Listen wie die
   uebrigen Knoepfe -- Pille, 2 px schwarzer Rahmen, Schrift 18/500/28,
   beim Zeigen schwarz mit weisser Schrift (wie jkit-button). Vorher gruene
   Flaeche mit 3 px Rundung und 15 px Schrift. Der Lade-Kreisel (SVG) nimmt die
   Schriftfarbe an. */
body .elementor-widget-loop-grid .e-loop__load-more .elementor-button {
    background-color: transparent;
    color: #000;
    fill: currentColor;
    border: 2px solid #000;
    border-radius: 100px;
    padding: 10px 20px;
    font-family: "Poppins", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 28px;
    transition: all .3s;
}
body .elementor-widget-loop-grid .e-loop__load-more .elementor-button:hover,
body .elementor-widget-loop-grid .e-loop__load-more .elementor-button:focus-visible {
    background-color: #000;
    color: #fff;
}

/* Punkt 6 "Footer": Im Fussmenue ist nichts mehr gruen. Wie im Kopf sind
   der aktive Punkt und der Punkt unter der Maus weiss und unterstrichen --
   1 px, 10 px Abstand (Korrekturliste 28.09.2026: "statt Gruen auch
   unterstreichen", Kai 29.09.2026: "hover auch"). Die Linie steht immer
   bereit, nur durchsichtig -- so springt beim Zeigen nichts. */
body .elementor-location-footer .elementor-widget-nav-menu .elementor-nav-menu--dropdown .menu-item > a.elementor-item {
    text-decoration-line: underline;
    text-decoration-color: transparent;
    text-decoration-thickness: 1px;
    text-underline-offset: 10px;
    text-decoration-skip-ink: none;
}
body .elementor-location-footer .elementor-widget-nav-menu .elementor-nav-menu--dropdown .menu-item > a.elementor-item.elementor-item-active,
body .elementor-location-footer .elementor-widget-nav-menu .elementor-nav-menu--dropdown .menu-item > a.elementor-item:hover,
body .elementor-location-footer .elementor-widget-nav-menu .elementor-nav-menu--dropdown .menu-item > a.elementor-item:focus {
    color: var(--e-global-color-6bc6209);
    text-decoration-color: var(--e-global-color-6bc6209);
}

/* Social-Links (Liste 5dc849c) sowie E-Mail und Telefon (Liste e9e3326) im
   Fuss im selben Stil (Kai 29.09.2026): beim Zeigen unterstrichen, 1 px,
   10 px Abstand, Linie in der Schriftfarbe; die Schrift bleibt hell, kein
   Gruen. Die Schrift steckt in einem eigenen span mit eigener Farbe --
   deshalb sitzt die Linie dort und nicht am Link. */
body .elementor-location-footer .elementor-element-5dc849c .elementor-icon-list-item > a .elementor-icon-list-text,
body .elementor-location-footer .elementor-element-e9e3326 .elementor-icon-list-item > a .elementor-icon-list-text {
    text-decoration-line: underline;
    text-decoration-color: transparent;
    text-decoration-thickness: 1px;
    text-underline-offset: 10px;
    text-decoration-skip-ink: none;
}
body .elementor-location-footer .elementor-element-5dc849c .elementor-icon-list-item > a:hover .elementor-icon-list-text,
body .elementor-location-footer .elementor-element-5dc849c .elementor-icon-list-item > a:focus .elementor-icon-list-text,
body .elementor-location-footer .elementor-element-e9e3326 .elementor-icon-list-item > a:hover .elementor-icon-list-text,
body .elementor-location-footer .elementor-element-e9e3326 .elementor-icon-list-item > a:focus .elementor-icon-list-text {
    color: var(--e-global-color-secondary);
    text-decoration-color: var(--e-global-color-secondary);
}

/* E-Mail und Telefon im Fuss ohne Symbol (Kai 29.09.2026: "footer icons
   raus bei tel und email"). Der Text steht buendig unter den Zeilen
   darueber. */
body .elementor-location-footer .elementor-element-e9e3326 .elementor-icon-list-icon {
    display: none;
}

body .elementor-location-footer .elementor-element-e9e3326 .elementor-icon-list-icon + .elementor-icon-list-text {
    padding-inline-start: 0;
}

/* Grossansicht fuer Slider-Bilder (28.09.2026) -- Skript assets/js/grossansicht.js */
.energas-grossansicht {
    cursor: zoom-in;
}

.energas-grossansicht:focus-visible {
    outline: 2px solid #3DD140;
    outline-offset: -2px;
}

/* =========================================================================
 * Links ohne Gruen (Kai 29.09.2026: "ueberall underline machen, nicht gruen
 * hover"). Beim Zeigen wird auf der ganzen Website nichts mehr gruen:
 *
 *   Textlinks  behalten ihre Farbe und werden unterstrichen, die Linie hat
 *              die Schriftfarbe. Einzeilige Links (Brotkrumen, "Zurueck",
 *              Kategorie, mobiles Menue) wie Kopf und Fuss mit 1 px und
 *              10 px Abstand, Titel mit 1 px und 4 px. Schon unterstrichene
 *              Links bleiben, wie sie sind.
 *   Knoepfe    und Symbole mit Rahmen werden schwarz mit weisser Schrift, wie
 *              die uebrigen Knoepfe der Website.
 *   Pfeile     der Karussells und Symbole ohne Rahmen behalten ihre Farbe.
 *
 * Das Gruen kam aus dem Elementor-Kit (alle Links) und aus einzelnen
 * Widget-Einstellungen. Jede Auswahl ist um ein Glied genauer als die
 * Elementor-Regel, die sie ersetzt -- daher ohne !important. Kopf- und
 * Fussmenue sind weiter oben geregelt, die Plugins Referenzen und Stellen
 * regeln ihre Links selbst.
 * ========================================================================= */

/* Kit: jeder Link wurde beim Zeigen gruen. Gleiche Auswahl wie im Kit, diese
   Datei laedt danach. Genauere Regeln einzelner Widgets bleiben unberuehrt. */
.elementor-kit-27 a:hover {
    color: var(--e-global-color-text);
}

/* Quellenhinweis der Standortkarte (Leaflet) behaelt sein Blau */
body .leaflet-control-attribution a:hover {
    color: #0078a8;
}

/* Links im Fliesstext: beim Zeigen und bei Tastaturfokus unterstrichen
   (Knoepfe im Beitragstext ausgenommen) */
body .elementor-widget-text-editor a:not(.wp-block-button__link):hover,
body .elementor-widget-text-editor a:not(.wp-block-button__link):focus-visible,
body .elementor-widget-theme-post-content a:not(.wp-block-button__link):hover,
body .elementor-widget-theme-post-content a:not(.wp-block-button__link):focus-visible,
body .elementor-widget-jkit_icon_box .icon-box-body p a:hover,
body .elementor-widget-jkit_icon_box .icon-box-body p a:focus-visible,
body .elementor-widget-jkit_accordion .card-expand a:hover,
body .elementor-widget-jkit_accordion .card-expand a:focus-visible,
body .wpcf7 a:hover,
body .wpcf7 a:focus-visible,
body .energas-glossar__more:hover,
body .energas-glossar__more:focus-visible {
    text-decoration-line: underline;
}

/* Brotkrumen (Yoast-Pfad) und Links in Symbollisten: wie Kopf und Fuss.
   In den Symbollisten sitzt die Linie am Text, nicht am Symbol. */
body .elementor-widget-breadcrumbs a:hover,
body .elementor-widget-breadcrumbs a:focus-visible,
body .elementor-widget-icon-list .elementor-icon-list-item > a:hover .elementor-icon-list-text,
body .elementor-widget-icon-list .elementor-icon-list-item > a:focus-visible .elementor-icon-list-text {
    text-decoration-line: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 10px;
    text-decoration-skip-ink: none;
}

/* Brotkrumen aus Symbollisten (Blog-, Referenz-, Branchen- und
   Archivseiten): Elementor faerbte beim Zeigen gruen, auch den Titel der
   aktuellen Seite, der kein Link ist. Die Farbe bleibt wie ohne Zeigen: die
   Links grau, der Titel schwarz. */
body .elementor-element.elementor-widget-icon-list:is(.elementor-element-5c605a51, .elementor-element-75628c22, .elementor-element-2ebbf408, .elementor-element-f3bf4b3, .elementor-element-49748ca, .elementor-element-9b4504a, .elementor-element-c134f56, .elementor-element-0b4584b, .elementor-element-8fd2da0, .elementor-element-8c2e051, .elementor-element-b34d788) .elementor-icon-list-item:hover .elementor-icon-list-text {
    color: var(--e-global-color-4c3c520);
}

body .elementor-element.elementor-widget-icon-list:is(.elementor-element-5286ce0e, .elementor-element-7b219f0, .elementor-element-9cc7199, .elementor-element-bac5fb9, .elementor-element-815288c) .elementor-icon-list-item:hover .elementor-icon-list-text {
    color: var(--e-global-color-text);
}

/* Kategorie im Blogbeitrag: bisher ohne Wirkung beim Zeigen, jetzt wie die
   anderen einzeiligen Links */
body .elementor-element.elementor-widget-single_post_categories_769 .spc-769-list a:hover,
body .elementor-element.elementor-widget-single_post_categories_769 .spc-769-list a:focus-visible {
    text-decoration-line: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 10px;
    text-decoration-skip-ink: none;
}

/* "Zurueck" im Blog- und im Referenzbeitrag (Textknopf mit Pfeil): Farbe
   bleibt, Linie unter dem Wort. Der Pfeil ist ein eigener Inline-Block und
   bleibt ohne Linie. */
body .elementor-760 .elementor-element.elementor-element-06abad5 .jeg-elementor-kit.jkit-button .jkit-button-wrapper:hover,
body .elementor-760 .elementor-element.elementor-element-06abad5 .jeg-elementor-kit.jkit-button .jkit-button-wrapper:focus-visible,
body .elementor-13157 .elementor-element.elementor-element-06abad5 .jeg-elementor-kit.jkit-button .jkit-button-wrapper:hover,
body .elementor-13157 .elementor-element.elementor-element-06abad5 .jeg-elementor-kit.jkit-button .jkit-button-wrapper:focus-visible {
    color: var(--e-global-color-text);
    text-decoration-line: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 10px;
    text-decoration-skip-ink: none;
}

body .elementor-760 .elementor-element.elementor-element-06abad5 .jeg-elementor-kit.jkit-button .jkit-button-wrapper:hover svg,
body .elementor-13157 .elementor-element.elementor-element-06abad5 .jeg-elementor-kit.jkit-button .jkit-button-wrapper:hover svg {
    fill: var(--e-global-color-text);
}

/* "weiterlesen" in der Blog-Liste (Loop-Vorlage 747): die Unterlinie wurde
   beim Zeigen gruen und bleibt jetzt schwarz */
body .elementor-747 .elementor-element.elementor-element-2aef0e4 .jeg-elementor-kit.jkit-button .jkit-button-wrapper:hover {
    border-color: var(--e-global-color-text);
}

/* Startseite, Knopf "Beratung anfragen": beim Zeigen schwarz statt gruen
   gefuellt, Schrift weiss wie bisher */
body .elementor-152 .elementor-element.elementor-element-a31abbc .jeg-elementor-kit.jkit-button .jkit-button-wrapper:hover {
    border-color: var(--e-global-color-text);
}

body .elementor-152 .elementor-element.elementor-element-a31abbc .jeg-elementor-kit.jkit-button .jkit-button-wrapper:not(.hover-gradient):hover {
    background-color: var(--e-global-color-text);
}

/* Newsletter im Fuss: Pfeil-Knopf beim Zeigen schwarz statt gruen */
body .elementor-205 .elementor-element.elementor-element-491f716 .elementor-button[type="submit"]:hover {
    background-color: var(--e-global-color-text);
    border-color: var(--e-global-color-text);
    color: #ffffff;
}

/* Mobiles Menue: der Knopf zum Oeffnen bleibt beim Zeigen schwarz */
body .elementor-154 .elementor-element.elementor-element-a69ed8a .jeg-elementor-kit.jkit-off-canvas .offcanvas-sidebar-button:hover {
    border-color: var(--e-global-color-text);
}

body .elementor-154 .elementor-element.elementor-element-a69ed8a .jeg-elementor-kit.jkit-off-canvas .offcanvas-sidebar-button:not(.hover-gradient):hover {
    background-color: var(--e-global-color-text);
}

/* Mobiles Menue (Vorlage 531 im Off-Canvas des Kopfes): Punkt unter Finger
   oder Maus, aufgeklappter und aktiver Punkt schwarz und unterstrichen wie
   im Kopf, statt gruen */
body .elementor-531 .elementor-element.elementor-element-c078e36 .elementor-nav-menu--dropdown a:hover,
body .elementor-531 .elementor-element.elementor-element-c078e36 .elementor-nav-menu--dropdown a:focus,
body .elementor-531 .elementor-element.elementor-element-c078e36 .elementor-nav-menu--dropdown a.elementor-item-active,
body .elementor-531 .elementor-element.elementor-element-c078e36 .elementor-nav-menu--dropdown a.highlighted {
    color: var(--e-global-color-text);
    text-decoration-line: underline;
    text-decoration-color: currentColor;
    text-decoration-thickness: 1px;
    text-underline-offset: 10px;
    text-decoration-skip-ink: none;
}

/* Blaetterpfeile der Karussells: behalten beim Zeigen ihre Farbe */
body .elementor-152 .elementor-element.elementor-element-5d134af,
body .elementor-10424 .elementor-element.elementor-element-283e9e2b,
body .elementor-10440 .elementor-element.elementor-element-68ca5643,
body .elementor-10476 .elementor-element.elementor-element-31592b95 {
    --arrow-hover-color: var(--arrow-normal-color, var(--e-global-color-text));
}

body .elementor-760 .elementor-element.elementor-element-e12d4e9,
body .elementor-760 .elementor-element.elementor-element-00a28b6,
body .elementor-760 .elementor-element.elementor-element-2c64aeb,
body .elementor-10460 .elementor-element.elementor-element-de1528e,
body .elementor-10460 .elementor-element.elementor-element-e08b3b3,
body .elementor-10460 .elementor-element.elementor-element-49d6135c {
    --e-n-carousel-arrow-hover-color: var(--e-n-carousel-arrow-normal-color, var(--e-global-color-text));
}

/* Symbole mit Rahmen (Seite "Components"): wurden beim Zeigen schwarz mit
   gruenem Symbol und Rahmen -- jetzt schwarz mit weissem Symbol wie die
   Knoepfe. Symbole ohne Rahmen behalten ihre Farbe. Die Pfeile der
   Referenzen-Kacheln gibt es nicht mehr, siehe "Referenzen: Branchen-Kacheln". */
body .elementor-547 .elementor-element.elementor-widget-icon.elementor-view-framed .elementor-icon:hover {
    background-color: var(--e-global-color-text);
    border-color: var(--e-global-color-text);
    color: #ffffff;
}

body .elementor-547 .elementor-element.elementor-widget-icon.elementor-view-framed .elementor-icon:hover svg {
    fill: #ffffff;
}

body .elementor-547 .elementor-element.elementor-widget-icon.elementor-view-default .elementor-icon:hover {
    color: var(--e-global-color-text);
    border-color: var(--e-global-color-text);
}

body .elementor-547 .elementor-element.elementor-widget-icon.elementor-view-default .elementor-icon:hover svg {
    fill: var(--e-global-color-text);
}

/* Glossar (Snippets "Glossar A-Z" und "Glossar Einzelansicht"). Deren Stile
   stehen im Quelltext nach dieser Datei, daher je ein Glied mehr. */
body .energas-glossar__item h3 a:hover,
body .energas-glossar__item h3 a:focus-visible {
    color: #10255c;
    text-decoration-line: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
}

html body.energas-glossar-single .energas-glossar-content a:hover {
    color: #15305e;
}

html body.energas-glossar-single .energas-glossar-sidebar-button:hover {
    background-color: var(--e-global-color-text);
    color: #ffffff;
}

/* =========================================================================
 * Schon unterstrichene Links: beim Zeigen dicker (Kai 29.09.2026: "ja
 * dicker werden")
 *
 * Links, die schon ohne Maus eine Linie tragen, zeigten beim Zeigen keine
 * Aenderung mehr. Das sind Fliesstext im Blog, Rechtstexte, "weiterlesen"
 * sowie aktive Menue- und Filterpunkte. Jetzt wird ihre Linie beim Zeigen
 * und bei Tastaturfokus 2 px dick, im Glossar 3 px statt 2 px. Farbe und
 * Abstand bleiben.
 *
 * Links ohne Linie bekommen beim Zeigen weiter die feine 1-px-Linie aus dem
 * Block davor.
 *
 *   Textlinien  text-decoration-thickness.
 *   Randlinien  (Rahmen unten, 1 px) bekommen innen direkt ueber dem Rahmen
 *               einen Schatten von 1 px. So ist die Linie 2 px dick, und
 *               keine Hoehe aendert sich.
 * ========================================================================= */

/* Beitragstext im Blog (Vorlage 760 unterstreicht dort alle Links), auch die
   Gutenberg-Knoepfe darin */
body .elementor-element.elementor-widget-theme-post-content a:hover,
body .elementor-element.elementor-widget-theme-post-content a:focus-visible {
    text-decoration-thickness: 2px;
}

/* Rechtstexte (Impressum, Datenschutz, AGB). Das Inhaltsverzeichnis hat
   eine eigene, genauere Regel (1 px, beim Zeigen 2 px). */
body .energas-rechtstext a:hover,
body .energas-rechtstext a:focus-visible {
    text-decoration-thickness: 2px;
}

/* Links mit Unterstreichung im Inline-Stil (myplant, Telefon auf
   "Leistungen", Kundenportal). Die Inline-Kurzform setzt die Dicke auf
   "auto", dagegen hilft nur !important. */
body a[style*="underline"]:hover,
body a[style*="underline"]:focus-visible {
    text-decoration-thickness: 2px !important;
}

/* Glossar-Text: Oliv-Linie 3 px statt 2 px */
html body.energas-glossar-single .energas-glossar-content a:hover,
html body.energas-glossar-single .energas-glossar-content a:focus-visible {
    text-decoration-thickness: 3px;
}

/* Aktiver Punkt in Kopf-, Fuss- und Mobilmenue, im Mobilmenue auch der
   aufgeklappte Punkt */
body .elementor-location-header .elementor-nav-menu--main > ul > li > a.elementor-item.elementor-item-active:hover,
body .elementor-location-header .elementor-nav-menu--main > ul > li > a.elementor-item.elementor-item-active:focus-visible,
body .elementor-location-footer .elementor-widget-nav-menu .elementor-nav-menu--dropdown .menu-item > a.elementor-item.elementor-item-active:hover,
body .elementor-location-footer .elementor-widget-nav-menu .elementor-nav-menu--dropdown .menu-item > a.elementor-item.elementor-item-active:focus-visible,
body .elementor-531 .elementor-element.elementor-element-c078e36 .elementor-nav-menu--dropdown a.elementor-item-active:hover,
body .elementor-531 .elementor-element.elementor-element-c078e36 .elementor-nav-menu--dropdown a.elementor-item-active:focus-visible,
body .elementor-531 .elementor-element.elementor-element-c078e36 .elementor-nav-menu--dropdown a.highlighted:hover,
body .elementor-531 .elementor-element.elementor-element-c078e36 .elementor-nav-menu--dropdown a.highlighted:focus-visible {
    text-decoration-thickness: 2px;
}

/* Aktive Kategorie im Blogbeitrag (Rahmen unten). Die feine Linie am Text
   aus dem Block davor entfaellt hier, sonst stuenden zwei Linien
   untereinander. Im Kategorie-Archiv (99d4aef) ist der Rahmen weiss und
   unsichtbar: dort bleibt es bei der feinen Linie. */
body .elementor-element.elementor-widget-single_post_categories_769:not(.elementor-element-99d4aef) .spc-769-list a.active:hover,
body .elementor-element.elementor-widget-single_post_categories_769:not(.elementor-element-99d4aef) .spc-769-list a.active:focus-visible {
    text-decoration-line: none;
    box-shadow: inset 0 -1px 0 var(--e-global-color-text);
}

/* "weiterlesen" in der Blog-Liste (Loop-Vorlage 747, Rahmen unten) */
body .elementor-747 .elementor-element.elementor-element-2aef0e4 .jeg-elementor-kit.jkit-button .jkit-button-wrapper:hover,
body .elementor-747 .elementor-element.elementor-element-2aef0e4 .jeg-elementor-kit.jkit-button .jkit-button-wrapper:focus-visible {
    box-shadow: inset 0 -1px 0 var(--e-global-color-text);
}

/* Gewaehlte Kategorie im Blog-Filter (/blog/, Rahmen unten) */
body .elementor-element.elementor-widget-taxonomy-filter .e-filter-item[aria-pressed="true"]:hover,
body .elementor-element.elementor-widget-taxonomy-filter .e-filter-item[aria-pressed="true"]:focus-visible {
    box-shadow: inset 0 -1px 0 var(--e-global-color-text);
}

/* =========================================================================
 * Referenzen: Branchen-Kacheln ganz klickbar (Kai 29.09.2026: "grüne
 * kästchen komplett klickbar, pfeil entfernen, hover: weiss sonst grün")
 *
 * Seite 10476, Gitter 7061891, alle 8 Kacheln. Live sind nur die Branchen
 * mit Referenz zu sehen, die anderen blendet das Plugin Energas Referenzen
 * aus. Das Plugin erkennt eine Kachel am Link im Pfeil. Deshalb bleibt der
 * Pfeil-Link in Elementor stehen: Er wird unsichtbar und liegt ueber der
 * ganzen Kachel. Beim Zeigen und bei Tastaturfokus wird die Kachel weiss.
 * Im Elementor-Editor bleibt alles wie bisher, damit sich die Inhalte
 * anklicken lassen.
 * ========================================================================= */
body:not(.elementor-editor-active) .elementor-10476 .elementor-element:is(.elementor-element-38fdfed0, .elementor-element-4f9a9af0, .elementor-element-4e83e40d, .elementor-element-4cfb4594, .elementor-element-731bc3cd, .elementor-element-2eaef895, .elementor-element-21c7d271, .elementor-element-3b10dee0) {
    position: relative;
}

/* Die Behaelter dazwischen duerfen den Link nicht einfangen */
body:not(.elementor-editor-active) .elementor-10476 .elementor-element:is(.elementor-element-38fdfed0, .elementor-element-4f9a9af0, .elementor-element-4e83e40d, .elementor-element-4cfb4594, .elementor-element-731bc3cd, .elementor-element-2eaef895, .elementor-element-21c7d271, .elementor-element-3b10dee0) .e-con,
body:not(.elementor-editor-active) .elementor-10476 .elementor-element:is(.elementor-element-38fdfed0, .elementor-element-4f9a9af0, .elementor-element-4e83e40d, .elementor-element-4cfb4594, .elementor-element-731bc3cd, .elementor-element-2eaef895, .elementor-element-21c7d271, .elementor-element-3b10dee0) .elementor-element.elementor-widget-icon.elementor-view-framed {
    position: static;
}

body:not(.elementor-editor-active) .elementor-10476 .elementor-element:is(.elementor-element-38fdfed0, .elementor-element-4f9a9af0, .elementor-element-4e83e40d, .elementor-element-4cfb4594, .elementor-element-731bc3cd, .elementor-element-2eaef895, .elementor-element-21c7d271, .elementor-element-3b10dee0) .elementor-element.elementor-widget-icon.elementor-view-framed .elementor-icon {
    position: absolute;
    inset: 0;
    z-index: 1;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    font-size: 0;
}

body:not(.elementor-editor-active) .elementor-10476 .elementor-element:is(.elementor-element-38fdfed0, .elementor-element-4f9a9af0, .elementor-element-4e83e40d, .elementor-element-4cfb4594, .elementor-element-731bc3cd, .elementor-element-2eaef895, .elementor-element-21c7d271, .elementor-element-3b10dee0) .elementor-element.elementor-widget-icon.elementor-view-framed .elementor-icon > * {
    display: none;
}

body:not(.elementor-editor-active) .elementor-10476 .elementor-element:is(.elementor-element-38fdfed0, .elementor-element-4f9a9af0, .elementor-element-4e83e40d, .elementor-element-4cfb4594, .elementor-element-731bc3cd, .elementor-element-2eaef895, .elementor-element-21c7d271, .elementor-element-3b10dee0):hover,
body:not(.elementor-editor-active) .elementor-10476 .elementor-element:is(.elementor-element-38fdfed0, .elementor-element-4f9a9af0, .elementor-element-4e83e40d, .elementor-element-4cfb4594, .elementor-element-731bc3cd, .elementor-element-2eaef895, .elementor-element-21c7d271, .elementor-element-3b10dee0):has(.elementor-icon:focus-visible) {
    background-color: var(--e-global-color-6bc6209, #ffffff);
}

/* =========================================================================
 * Ansprechpartner-Finder: Ergebnis unter dem Kasten (29.09.2026, Figma
 * "Ansprechpartner", Wunsch Kai: "nur noch 3 kontakte ... unter der box",
 * "das logo ist ein anderes ... nicht zentriert").
 * - Hoechstens 3 Treffer (Plugin-Einstellung "Maximale Anzahl Ergebnisse").
 * - Die Kind-Theme-Vorlage energas-contact-finder/finder.php setzt das
 *   Ergebnis unter den Kasten (Klasse egcf--ergebnis-unten); hier: 3 weisse
 *   Karten nebeneinander, Abstaende wie zwischen den Karten des Kastens (24 px).
 * - Karten wie in der Figma: Name 600 und Funktion 500 in 25/35 px, Innen-
 *   abstand 75/45/71 px, 76 px bis zu den Knoepfen, Knoepfe 11 px auseinander.
 *   Kontaktwege als Knoepfe (Vorlage contact-card.php) im Stil der Website-
 *   Knoepfe (wie "Jetzt finden").
 * - Hotline-Grafik: Uhr mit Pfeil aus der Figma (199 px, Datei
 *   assets/hotline-24h-uhr.svg, Plugin-Einstellung "Eigene Grafik"), mittig
 *   unter Titel und Nummer, 64 px unter der Nummer wie in der Figma.
 * ========================================================================= */
body .egcf.egcf--finder .egcf-hotline {
    width: fit-content;
    max-width: 100%;
}

body .egcf.egcf--finder .egcf-hotline__visual {
    justify-content: center;
    margin: calc(64px * var(--egcf-space-scale)) 0 0;
}

/* Hotline-Titel und Nummer gruen wie in der Figma (#18dc22, Kai 29.09.: „Wie Figma“);
   Titel „24-h Hotline“ steht in den Plugin-Einstellungen. */
body .egcf.egcf--finder .egcf__col--panel h3.egcf-hotline__title,
body .egcf.egcf--finder .egcf__col--panel p.egcf-hotline__line--phone,
body .egcf.egcf--finder .egcf__col--panel a.egcf-hotline__link,
body .egcf.egcf--finder .egcf__col--panel a.egcf-hotline__link:hover,
body .egcf.egcf--finder .egcf__col--panel a.egcf-hotline__link:focus-visible {
    color: #18dc22;
}

/* Oben EIN weisser Kasten wie in der Figma (Kai 29.09.: „das obere soll laut figma ein
   kasten sein“): Formular und Hotline ohne grauen Spalt auf gemeinsamem Grund. Die Hotline
   steht wie in der Figma bei 68 % der Kastenbreite (Innenabstand links 22 statt 46 px). */
body .egcf.egcf--ergebnis-unten {
    --egcf-panel-padding: 95px 48px 95px 22px;
    /* Plugin-Flaeche #f5f5f5 zeigte sich als hellerer Streifen zwischen Kasten und Karten */
    background: transparent;
}

body .egcf.egcf--ergebnis-unten .egcf__grid {
    gap: 0;
    border: 1px solid var(--egcf-panel-border);
    border-radius: var(--egcf-panel-radius);
    background: var(--egcf-panel-bg);
}

body .egcf.egcf--ergebnis-unten .egcf__grid > .egcf__col {
    border: 0;
    border-radius: 0;
    background: transparent;
}

/* Karten wie in der Figma: 57 px unter dem Kasten, 40 px auseinander, zusammen so breit wie der Kasten. */
body .egcf.egcf--ergebnis-unten .egcf__contacts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 40px;
    margin-top: 57px;
}

body .egcf.egcf--ergebnis-unten .egcf__contacts > .egcf-contact,
body .egcf.egcf--ergebnis-unten .egcf__contacts > .egcf-noresults {
    min-width: 0;
    margin: 0;
    padding: 75px 45px 71px;
    border: 1px solid var(--egcf-panel-border);
    border-radius: var(--egcf-panel-radius);
    background: var(--egcf-panel-bg);
}

body .egcf.egcf--ergebnis-unten .egcf__contacts > .egcf-noresults {
    grid-column: 1 / -1;
}

/* Plugin: 57 px Abstand zwischen untereinander stehenden Karten - im Raster nicht. */
body .egcf.egcf--ergebnis-unten .egcf__contacts > .egcf-contact + .egcf-contact {
    margin-top: 0;
}

body .egcf.egcf--ergebnis-unten .egcf-contact--knoepfe h3.egcf-contact__name {
    margin: 0;
    font-size: 25px;
    line-height: 35px;
    letter-spacing: normal;
}

body .egcf.egcf--ergebnis-unten .egcf-contact--knoepfe p.egcf-contact__position {
    margin: 0;
    color: var(--egcf-text);
    font-size: 25px;
    font-weight: 500;
    line-height: 35px;
}

body .egcf.egcf--ergebnis-unten .egcf-contact--knoepfe ul.egcf-contact__list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 11px;
    margin: 76px 0 0;
}

body .egcf.egcf--ergebnis-unten .egcf-contact--knoepfe li.egcf-contact__row {
    display: block;
    max-width: 100%;
    margin: 0;
    padding: 0;
}

/* Lange Nummern duerfen in schmalen Karten umbrechen statt aus dem Knopf zu laufen. */
body .egcf.egcf--ergebnis-unten .egcf-contact--knoepfe a.egcf-contact__button {
    white-space: normal;
    overflow-wrap: anywhere;
}

@container egcf (max-width: 1180px) {
    body .egcf.egcf--ergebnis-unten .egcf__contacts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body .egcf.egcf--ergebnis-unten .egcf__contacts > .egcf-contact,
    body .egcf.egcf--ergebnis-unten .egcf__contacts > .egcf-noresults {
        padding: 56px 40px;
    }

    body .egcf.egcf--ergebnis-unten .egcf-contact--knoepfe ul.egcf-contact__list {
        margin-top: 48px;
    }
}

@container egcf (max-width: 1000px) {
    body .egcf.egcf--ergebnis-unten .egcf__contacts {
        gap: var(--egcf-gap);
        margin-top: var(--egcf-gap);
    }
}

@container egcf (max-width: 760px) {
    body .egcf.egcf--ergebnis-unten .egcf__contacts {
        grid-template-columns: minmax(0, 1fr);
    }
}

@container egcf (max-width: 560px) {
    body .egcf.egcf--ergebnis-unten .egcf__contacts > .egcf-contact,
    body .egcf.egcf--ergebnis-unten .egcf__contacts > .egcf-noresults {
        padding: 36px 20px;
    }

    body .egcf.egcf--ergebnis-unten .egcf-contact--knoepfe h3.egcf-contact__name,
    body .egcf.egcf--ergebnis-unten .egcf-contact--knoepfe p.egcf-contact__position {
        font-size: 22px;
        line-height: 30px;
    }

    body .egcf.egcf--ergebnis-unten .egcf-contact--knoepfe ul.egcf-contact__list {
        margin-top: 32px;
    }
}

/* ==========================================================================
   Grossschreibung wie gespeichert (29.09.2026, Kai: „über uns das U klein“)
   Die globalen Elementor-Schriftstile 19d8f8d und 1010953 schreiben per
   text-transform: capitalize jedes Wort gross – aus „Über uns“ wurde „Über Uns“
   (Fusszeile und Menue), aus „Folgen Sie uns“ „Folgen Sie Uns“, aus „Ausbildung
   und Studium“ „Ausbildung Und Studium“, dazu die Beitragstitel in der Blog-Vorlage.
   Scan aller 49 Sitemap-Seiten: das waren die einzigen Stellen, an denen sich die
   Anzeige aendert. Texte stehen jetzt so da, wie sie gespeichert sind.
   ========================================================================== */
body.elementor-kit-27 {
    --e-global-typography-19d8f8d-text-transform: none;
    --e-global-typography-1010953-text-transform: none;
}

/* ==========================================================================
   Blog: Größenverhältnisse der Überschriften (29.09.2026, Wunsch Kai:
   „die größenverhältnisse passen teilweise nicht heading usw“)
   ========================================================================== */

/* Beitragsseiten (Vorlage 760, Inhalt-Widget 5351a00): Die Vorlage legt eigene Größen
   nur für h2–h4 fest. Eine h1 im Beitragstext fiel deshalb auf die Startseiten-Größe
   des Kits zurück (110 px, Titel nur 40 px). h1 im Text jetzt wie h2. */
body .elementor-760 .elementor-element.elementor-element-5351a00 h1 {
    font-size: 30px;
    line-height: 1.3;
    font-weight: 600;
    margin: 2em 0 .6em;
}

@media (max-width: 1024px) {
    body .elementor-760 .elementor-element.elementor-element-5351a00 h1 {
        font-size: 28px;
    }
}

@media (max-width: 767px) {
    body .elementor-760 .elementor-element.elementor-element-5351a00 h1 {
        font-size: 24px;
    }
}

/* Kategorie-Seiten (Archiv-Vorlage 10300, Überschrift 2a64c195): gleiche Größe wie „Blog“
   und alle anderen Unterseiten (globaler Stil 8d22d0f: 78/66/40 px) statt 85/72/40 px. */
body .elementor-10300 .elementor-element.elementor-element-2a64c195 .elementor-heading-title {
    font-size: var(--e-global-typography-8d22d0f-font-size);
    line-height: var(--e-global-typography-8d22d0f-line-height);
    font-weight: var(--e-global-typography-8d22d0f-font-weight);
}

/* Blog-Übersicht (Seite 549, Überschrift 6439f0de „Referenzen und aktuelle Neuigkeiten“):
   gleiche Größen wie auf den Kategorie-Seiten (globaler Stil 78481e7: 30/28/24 px)
   statt auf allen Bildschirmen 30 px. */
body .elementor-549 .elementor-element.elementor-element-6439f0de .jeg-elementor-kit.jkit-heading .heading-title {
    font-size: var(--e-global-typography-78481e7-font-size);
    line-height: var(--e-global-typography-78481e7-line-height);
    font-weight: var(--e-global-typography-78481e7-font-weight);
}

/* Startseite, Titelbild (Container 58dcd25): 24-h-Hotline-Stempel nach Kaleidos Entwurf (Trello 29.09.2026, „Würde das so passen?“).
   Reine Grafik über ::after, nicht klickbar und ohne Einfluss auf den Aufbau. Der linke Rand ist bündig mit dem „E“ von
   „Energielösungen“, der Stempel steht oberhalb der Überschriften. Größe wie im Entwurf: Desktop 230 px (Titelbild 900 px,
   Überschrift 110 px); Tablet und Handy kleiner und oberhalb von „Planung, Bau und Service“.
   Linker Rand = Inhaltskante (Desktop max(15 px, (Breite − 1376 px) / 2), Tablet 15 px, Handy 15 px + 5 % von (Breite − 30 px))
   plus Vorbreite des Buchstabens (8 / 7 / 3 px). Grafik: assets/hotline-24h-stempel-v2.svg (Schrift als Pfade, braucht keinen Webfont). */
body .elementor-152 .elementor-element.elementor-element-58dcd25::after {
    content: "";
    position: absolute;
    z-index: 1;
    top: 206px;
    left: max(23px, calc((100% - 1376px) / 2 + 8px));
    width: 230px;
    height: 230px;
    background: url("assets/hotline-24h-stempel-v2.svg") center / contain no-repeat;
    pointer-events: none;
}

@media (max-width: 1024px) {
    body .elementor-152 .elementor-element.elementor-element-58dcd25::after {
        top: 56px;
        left: 22px;
        width: clamp(150px, 19vw, 190px);
        height: clamp(150px, 19vw, 190px);
    }
}

@media (max-width: 767px) {
    body .elementor-152 .elementor-element.elementor-element-58dcd25::after {
        top: 48px;
        left: calc(16.5px + 5%);
        width: 112px;
        height: 112px;
    }
}

/* Startseite: Klickfläche über dem 24-h-Hotline-Stempel (Kai 06.10.2026: „den svg button bitte als tel: verlinkung setzten“).
   Der Stempel oben bleibt reine Grafik (::after). Den Link (tel:+49751888333333, aria-label „24-h Hotline anrufen …“) setzt
   assets/js/hotline-stempel-link.js als erstes Kind in Container 58dcd25. Er ist leer und rund und liegt genau über dem
   Stempel: Lage und Größe je Breite wie oben. Wer dort etwas ändert, muss es hier genauso ändern. */
body .elementor-152 .elementor-element.elementor-element-58dcd25 > .energas-stempel-link {
    position: absolute;
    z-index: 2;
    top: 206px;
    left: max(23px, calc((100% - 1376px) / 2 + 8px));
    width: 230px;
    height: 230px;
    border-radius: 50%;
}

body .elementor-152 .elementor-element.elementor-element-58dcd25 > .energas-stempel-link:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 4px;
}

@media (max-width: 1024px) {
    body .elementor-152 .elementor-element.elementor-element-58dcd25 > .energas-stempel-link {
        top: 56px;
        left: 22px;
        width: clamp(150px, 19vw, 190px);
        height: clamp(150px, 19vw, 190px);
    }
}

@media (max-width: 767px) {
    body .elementor-152 .elementor-element.elementor-element-58dcd25 > .energas-stempel-link {
        top: 48px;
        left: calc(16.5px + 5%);
        width: 112px;
        height: 112px;
    }
}

/* ==========================================================================
   Startseite: Titel-Galerie (Trello „Galerie Startseite“, 06.10.2026)
   Der Titelbereich 58dcd25 hat als Hintergrund die Elementor-Diashow (Rixdorf, Papenburg, Ulm;
   Ueberblendung, Endlosschleife, ohne Bedienelemente) mit dunklem Verlauf unten als Ueberlagerung.
   1) Bis Elementor die Diashow per Skript aufgebaut hat, steht das erste Bild als Hintergrund da.
   2) Die Diashow samt Folien nimmt keine Maus- und Wischgesten an, sonst haelt Swiper den Wechsel
      danach an (Swiper schaltet sie an der aktiven Folie wieder ein, deshalb auch fuer alle Kinder).
   ========================================================================== */
body .elementor-152 .elementor-element.elementor-element-58dcd25:not(:has(> .elementor-background-slideshow)) {
  background: url("/wp-content/uploads/2026/11/Energas_Rixdorf_Drohne_04_2560.webp") center / cover no-repeat;
}
@media (max-width: 767px) {
  /* Handy: kleinere Fassung des ersten Startbilds (03.11.2026) */
  body .elementor-152 .elementor-element.elementor-element-58dcd25:not(:has(> .elementor-background-slideshow)) {
    background-image: url("/wp-content/uploads/2026/11/Energas_Rixdorf_Drohne_04_1920.webp");
  }
}
body .elementor-152 .elementor-element.elementor-element-58dcd25 > .elementor-background-slideshow,
body .elementor-152 .elementor-element.elementor-element-58dcd25 > .elementor-background-slideshow * {
  pointer-events: none;
}

/* Feinschliff 14.10.2026 (ersetzt den PNG-Block „AI-Banner“ vom 13.10.): Kennzeichnung von KI-Bildern mit dem Banner
   „AI generated“ von Kaleido als SVG („custom_Button(WIP).svg“, byte-gleich als data-URI eingebettet, md5
   e75caea3e7a1e12a7c564a0f16bda9b4). Die Datei enthaelt beide Banner untereinander; per Hintergrund-Lage wird nur der
   passende Ausschnitt (117x32) gezeigt, der Rahmen der Figma-Vorlage liegt ausserhalb. Bild-Widget mit der Klasse
   sg-ki-bild (Über uns 265ebc04) = weisser Banner fuer dunkle Bildstellen; zusaetzlich sg-ki-bild-dunkel = schwarzer
   Banner fuer helle Bildstellen. Der Banner liegt unten rechts auf dem Bild. Die Bildunterschrift des Widgets bleibt als
   Text fuer Vorleseprogramme und Suchmaschinen, ist aber nicht sichtbar. Das Bild behaelt Groesse und Abstaende. */
.elementor-widget-image.sg-ki-bild figure.wp-caption {
  position: relative;
  margin: 0;
}
.elementor-widget-image.sg-ki-bild figure.wp-caption img {
  display: block;
}
.elementor-widget-image.sg-ki-bild .widget-image-caption {
  position: absolute;
  right: 12px;
  bottom: 12px;
  width: 117px;
  height: 32px;
  margin: 0;
  padding: 0;
  background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTU3IiBoZWlnaHQ9IjEyNCIgdmlld0JveD0iMCAwIDE1NyAxMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxyZWN0IHg9IjAuNSIgeT0iMC41IiB3aWR0aD0iMTU2IiBoZWlnaHQ9IjEyMyIgcng9IjQuNSIgc3Ryb2tlPSIjOTc0N0ZGIiBzdHJva2UtZGFzaGFycmF5PSIxMCA1Ii8+CjxyZWN0IHg9IjIwLjUiIHk9IjIwLjUiIHdpZHRoPSIxMTYiIGhlaWdodD0iMzEiIHJ4PSIxNS41IiBzdHJva2U9ImJsYWNrIi8+CjxwYXRoIGQ9Ik00MC42MyA0MUwzOS44NDYgMzguODNIMzUuNTlMMzQuODA2IDQxSDMzLjQ2MkwzNi45OSAzMS4yOThIMzguNDZMNDEuOTc0IDQxSDQwLjYzWk0zOS40ODIgMzcuNzk0TDM3LjcxOCAzMi44NjZMMzUuOTU0IDM3Ljc5NEgzOS40ODJaTTQzLjUxMTYgNDFWMzEuMjQySDQ0Ljc4NTZWNDFINDMuNTExNlpNNTAuMjEzMyAzNy4xMzZDNTAuMjEzMyAzNC43NDIgNTEuNzk1MyAzMy4yMDIgNTMuODUzMyAzMy4yMDJDNTUuMjUzMyAzMy4yMDIgNTYuMjYxMyAzMy45MDIgNTYuNzA5MyAzNC43MjhWMzMuMzI4SDU3Ljk5NzNWNDEuMTY4QzU3Ljk5NzMgNDMuMjgyIDU2LjU4MzMgNDQuNzggNTQuMzI5MyA0NC43OEM1Mi4zMTMzIDQ0Ljc4IDUwLjg3MTMgNDMuNzU4IDUwLjYxOTMgNDIuMTJINTEuODc5M0M1Mi4xNTkzIDQzLjA0NCA1My4wNjkzIDQzLjY3NCA1NC4zMjkzIDQzLjY3NEM1NS42ODczIDQzLjY3NCA1Ni43MDkzIDQyLjgwNiA1Ni43MDkzIDQxLjE2OFYzOS41NThDNTYuMjQ3MyA0MC4zODQgNTUuMjUzMyA0MS4xMjYgNTMuODUzMyA0MS4xMjZDNTEuNzk1MyA0MS4xMjYgNTAuMjEzMyAzOS41MTYgNTAuMjEzMyAzNy4xMzZaTTU2LjcwOTMgMzcuMTVDNTYuNzA5MyAzNS4zNzIgNTUuNTA1MyAzNC4zMDggNTQuMTA1MyAzNC4zMDhDNTIuNzA1MyAzNC4zMDggNTEuNTE1MyAzNS4zMyA1MS41MTUzIDM3LjEzNkM1MS41MTUzIDM4Ljk0MiA1Mi43MDUzIDQwLjAwNiA1NC4xMDUzIDQwLjAwNkM1NS41MDUzIDQwLjAwNiA1Ni43MDkzIDM4Ljk1NiA1Ni43MDkzIDM3LjE1Wk02My40MTIzIDM0LjI4QzYyLjE2NjMgMzQuMjggNjEuMTMwMyAzNS4xMDYgNjAuOTkwMyAzNi42MDRINjUuODM0M0M2NS44NDgzIDM1LjEwNiA2NC43MjgzIDM0LjI4IDYzLjQxMjMgMzQuMjhaTTY2Ljk5NjMgMzguNjM0QzY2LjYwNDMgNDAuMDM0IDY1LjM3MjMgNDEuMTI2IDYzLjQ2ODMgNDEuMTI2QzYxLjI4NDMgNDEuMTI2IDU5LjY3NDMgMzkuNTg2IDU5LjY3NDMgMzcuMTVDNTkuNjc0MyAzNC43MjggNjEuMjI4MyAzMy4yMDIgNjMuNDY4MyAzMy4yMDJDNjUuNjk0MyAzMy4yMDIgNjcuMTUwMyAzNC43NyA2Ny4xNTAzIDM2Ljg3QzY3LjE1MDMgMzcuMTUgNjcuMTM2MyAzNy4zNzQgNjcuMTA4MyAzNy42NEg2MC45NzYzQzYxLjA3NDMgMzkuMTk0IDYyLjE2NjMgNDAuMDQ4IDYzLjQ2ODMgNDAuMDQ4QzY0LjYxNjMgNDAuMDQ4IDY1LjM0NDMgMzkuNDYgNjUuNjI0MyAzOC42MzRINjYuOTk2M1pNNzQuNDQ1OSA0MVYzNi42NkM3NC40NDU5IDM1LjA5MiA3My41OTE5IDM0LjI5NCA3Mi4zMDM5IDM0LjI5NEM3MS4wMDE5IDM0LjI5NCA3MC4xMDU5IDM1LjEwNiA3MC4xMDU5IDM2Ljc1OFY0MUg2OC44MzE5VjMzLjMyOEg3MC4xMDU5VjM0LjQyQzcwLjYwOTkgMzMuNjIyIDcxLjUzMzkgMzMuMTg4IDcyLjU2OTkgMzMuMTg4Qzc0LjM0NzkgMzMuMTg4IDc1LjcwNTkgMzQuMjggNzUuNzA1OSAzNi40NzhWNDFINzQuNDQ1OVpNODEuMDQ5IDM0LjI4Qzc5LjgwMyAzNC4yOCA3OC43NjcgMzUuMTA2IDc4LjYyNyAzNi42MDRIODMuNDcxQzgzLjQ4NSAzNS4xMDYgODIuMzY1IDM0LjI4IDgxLjA0OSAzNC4yOFpNODQuNjMzIDM4LjYzNEM4NC4yNDEgNDAuMDM0IDgzLjAwOSA0MS4xMjYgODEuMTA1IDQxLjEyNkM3OC45MjEgNDEuMTI2IDc3LjMxMSAzOS41ODYgNzcuMzExIDM3LjE1Qzc3LjMxMSAzNC43MjggNzguODY1IDMzLjIwMiA4MS4xMDUgMzMuMjAyQzgzLjMzMSAzMy4yMDIgODQuNzg3IDM0Ljc3IDg0Ljc4NyAzNi44N0M4NC43ODcgMzcuMTUgODQuNzczIDM3LjM3NCA4NC43NDUgMzcuNjRINzguNjEzQzc4LjcxMSAzOS4xOTQgNzkuODAzIDQwLjA0OCA4MS4xMDUgNDAuMDQ4QzgyLjI1MyA0MC4wNDggODIuOTgxIDM5LjQ2IDgzLjI2MSAzOC42MzRIODQuNjMzWk04Ny43NDI2IDM2LjgyOFY0MUg4Ni40Njg2VjMzLjMyOEg4Ny43NDI2VjM0LjU3NEM4OC4xNzY2IDMzLjcyIDg5LjAwMjYgMzMuMTg4IDkwLjIyMDYgMzMuMTg4VjM0LjUwNEg4OS44ODQ2Qzg4LjY2NjYgMzQuNTA0IDg3Ljc0MjYgMzUuMDUgODcuNzQyNiAzNi44MjhaTTkxLjIxNTMgMzcuMTM2QzkxLjIxNTMgMzQuNzQyIDkyLjc5NzMgMzMuMjAyIDk0Ljg1NTMgMzMuMjAyQzk2LjI4MzMgMzMuMjAyIDk3LjI2MzMgMzMuOTMgOTcuNzExMyAzNC43MjhWMzMuMzI4SDk4Ljk5OTNWNDFIOTcuNzExM1YzOS41NzJDOTcuMjQ5MyA0MC4zOTggOTYuMjU1MyA0MS4xMjYgOTQuODQxMyA0MS4xMjZDOTIuNzk3MyA0MS4xMjYgOTEuMjE1MyAzOS41MTYgOTEuMjE1MyAzNy4xMzZaTTk3LjcxMTMgMzcuMTVDOTcuNzExMyAzNS4zNzIgOTYuNTA3MyAzNC4zMDggOTUuMTA3MyAzNC4zMDhDOTMuNzA3MyAzNC4zMDggOTIuNTE3MyAzNS4zMyA5Mi41MTczIDM3LjEzNkM5Mi41MTczIDM4Ljk0MiA5My43MDczIDQwLjAwNiA5NS4xMDczIDQwLjAwNkM5Ni41MDczIDQwLjAwNiA5Ny43MTEzIDM4Ljk1NiA5Ny43MTEzIDM3LjE1Wk0xMDEuNDMyIDM4LjlWMzQuMzc4SDEwMC40MzhWMzMuMzI4SDEwMS40MzJWMzEuMzk2SDEwMi43MDZWMzMuMzI4SDEwNC43MDhWMzQuMzc4SDEwMi43MDZWMzguOUMxMDIuNzA2IDM5LjY1NiAxMDIuOTg2IDM5LjkyMiAxMDMuNzcgMzkuOTIySDEwNC43MDhWNDFIMTAzLjU2QzEwMi4yMDIgNDEgMTAxLjQzMiA0MC40NCAxMDEuNDMyIDM4LjlaTTEwOS41MTQgMzQuMjhDMTA4LjI2OCAzNC4yOCAxMDcuMjMyIDM1LjEwNiAxMDcuMDkyIDM2LjYwNEgxMTEuOTM2QzExMS45NSAzNS4xMDYgMTEwLjgzIDM0LjI4IDEwOS41MTQgMzQuMjhaTTExMy4wOTggMzguNjM0QzExMi43MDYgNDAuMDM0IDExMS40NzQgNDEuMTI2IDEwOS41NyA0MS4xMjZDMTA3LjM4NiA0MS4xMjYgMTA1Ljc3NiAzOS41ODYgMTA1Ljc3NiAzNy4xNUMxMDUuNzc2IDM0LjcyOCAxMDcuMzMgMzMuMjAyIDEwOS41NyAzMy4yMDJDMTExLjc5NiAzMy4yMDIgMTEzLjI1MiAzNC43NyAxMTMuMjUyIDM2Ljg3QzExMy4yNTIgMzcuMTUgMTEzLjIzOCAzNy4zNzQgMTEzLjIxIDM3LjY0SDEwNy4wNzhDMTA3LjE3NiAzOS4xOTQgMTA4LjI2OCA0MC4wNDggMTA5LjU3IDQwLjA0OEMxMTAuNzE4IDQwLjA0OCAxMTEuNDQ2IDM5LjQ2IDExMS43MjYgMzguNjM0SDExMy4wOThaTTExNC40NTcgMzcuMTM2QzExNC40NTcgMzQuNzQyIDExNi4wMzkgMzMuMjAyIDExOC4xMTEgMzMuMjAyQzExOS4zMTUgMzMuMjAyIDEyMC40MjEgMzMuODE4IDEyMC45NTMgMzQuN1YzMC42NEgxMjIuMjQxVjQxSDEyMC45NTNWMzkuNTU4QzEyMC40OTEgNDAuNDEyIDExOS40OTcgNDEuMTI2IDExOC4wOTcgNDEuMTI2QzExNi4wMzkgNDEuMTI2IDExNC40NTcgMzkuNTE2IDExNC40NTcgMzcuMTM2Wk0xMjAuOTUzIDM3LjE1QzEyMC45NTMgMzUuMzcyIDExOS43NDkgMzQuMzA4IDExOC4zNDkgMzQuMzA4QzExNi45NDkgMzQuMzA4IDExNS43NTkgMzUuMzMgMTE1Ljc1OSAzNy4xMzZDMTE1Ljc1OSAzOC45NDIgMTE2Ljk0OSA0MC4wMDYgMTE4LjM0OSA0MC4wMDZDMTE5Ljc0OSA0MC4wMDYgMTIwLjk1MyAzOC45NTYgMTIwLjk1MyAzNy4xNVoiIGZpbGw9ImJsYWNrIi8+CjxyZWN0IHg9IjIwLjUiIHk9IjcyLjUiIHdpZHRoPSIxMTYiIGhlaWdodD0iMzEiIHJ4PSIxNS41IiBzdHJva2U9IiNGRkZDRkMiLz4KPHBhdGggZD0iTTQwLjYzIDkzTDM5Ljg0NiA5MC44M0gzNS41OUwzNC44MDYgOTNIMzMuNDYyTDM2Ljk5IDgzLjI5OEgzOC40Nkw0MS45NzQgOTNINDAuNjNaTTM5LjQ4MiA4OS43OTRMMzcuNzE4IDg0Ljg2NkwzNS45NTQgODkuNzk0SDM5LjQ4MlpNNDMuNTExNiA5M1Y4My4yNDJINDQuNzg1NlY5M0g0My41MTE2Wk01MC4yMTMzIDg5LjEzNkM1MC4yMTMzIDg2Ljc0MiA1MS43OTUzIDg1LjIwMiA1My44NTMzIDg1LjIwMkM1NS4yNTMzIDg1LjIwMiA1Ni4yNjEzIDg1LjkwMiA1Ni43MDkzIDg2LjcyOFY4NS4zMjhINTcuOTk3M1Y5My4xNjhDNTcuOTk3MyA5NS4yODIgNTYuNTgzMyA5Ni43OCA1NC4zMjkzIDk2Ljc4QzUyLjMxMzMgOTYuNzggNTAuODcxMyA5NS43NTggNTAuNjE5MyA5NC4xMkg1MS44NzkzQzUyLjE1OTMgOTUuMDQ0IDUzLjA2OTMgOTUuNjc0IDU0LjMyOTMgOTUuNjc0QzU1LjY4NzMgOTUuNjc0IDU2LjcwOTMgOTQuODA2IDU2LjcwOTMgOTMuMTY4VjkxLjU1OEM1Ni4yNDczIDkyLjM4NCA1NS4yNTMzIDkzLjEyNiA1My44NTMzIDkzLjEyNkM1MS43OTUzIDkzLjEyNiA1MC4yMTMzIDkxLjUxNiA1MC4yMTMzIDg5LjEzNlpNNTYuNzA5MyA4OS4xNUM1Ni43MDkzIDg3LjM3MiA1NS41MDUzIDg2LjMwOCA1NC4xMDUzIDg2LjMwOEM1Mi43MDUzIDg2LjMwOCA1MS41MTUzIDg3LjMzIDUxLjUxNTMgODkuMTM2QzUxLjUxNTMgOTAuOTQyIDUyLjcwNTMgOTIuMDA2IDU0LjEwNTMgOTIuMDA2QzU1LjUwNTMgOTIuMDA2IDU2LjcwOTMgOTAuOTU2IDU2LjcwOTMgODkuMTVaTTYzLjQxMjMgODYuMjhDNjIuMTY2MyA4Ni4yOCA2MS4xMzAzIDg3LjEwNiA2MC45OTAzIDg4LjYwNEg2NS44MzQzQzY1Ljg0ODMgODcuMTA2IDY0LjcyODMgODYuMjggNjMuNDEyMyA4Ni4yOFpNNjYuOTk2MyA5MC42MzRDNjYuNjA0MyA5Mi4wMzQgNjUuMzcyMyA5My4xMjYgNjMuNDY4MyA5My4xMjZDNjEuMjg0MyA5My4xMjYgNTkuNjc0MyA5MS41ODYgNTkuNjc0MyA4OS4xNUM1OS42NzQzIDg2LjcyOCA2MS4yMjgzIDg1LjIwMiA2My40NjgzIDg1LjIwMkM2NS42OTQzIDg1LjIwMiA2Ny4xNTAzIDg2Ljc3IDY3LjE1MDMgODguODdDNjcuMTUwMyA4OS4xNSA2Ny4xMzYzIDg5LjM3NCA2Ny4xMDgzIDg5LjY0SDYwLjk3NjNDNjEuMDc0MyA5MS4xOTQgNjIuMTY2MyA5Mi4wNDggNjMuNDY4MyA5Mi4wNDhDNjQuNjE2MyA5Mi4wNDggNjUuMzQ0MyA5MS40NiA2NS42MjQzIDkwLjYzNEg2Ni45OTYzWk03NC40NDU5IDkzVjg4LjY2Qzc0LjQ0NTkgODcuMDkyIDczLjU5MTkgODYuMjk0IDcyLjMwMzkgODYuMjk0QzcxLjAwMTkgODYuMjk0IDcwLjEwNTkgODcuMTA2IDcwLjEwNTkgODguNzU4VjkzSDY4LjgzMTlWODUuMzI4SDcwLjEwNTlWODYuNDJDNzAuNjA5OSA4NS42MjIgNzEuNTMzOSA4NS4xODggNzIuNTY5OSA4NS4xODhDNzQuMzQ3OSA4NS4xODggNzUuNzA1OSA4Ni4yOCA3NS43MDU5IDg4LjQ3OFY5M0g3NC40NDU5Wk04MS4wNDkgODYuMjhDNzkuODAzIDg2LjI4IDc4Ljc2NyA4Ny4xMDYgNzguNjI3IDg4LjYwNEg4My40NzFDODMuNDg1IDg3LjEwNiA4Mi4zNjUgODYuMjggODEuMDQ5IDg2LjI4Wk04NC42MzMgOTAuNjM0Qzg0LjI0MSA5Mi4wMzQgODMuMDA5IDkzLjEyNiA4MS4xMDUgOTMuMTI2Qzc4LjkyMSA5My4xMjYgNzcuMzExIDkxLjU4NiA3Ny4zMTEgODkuMTVDNzcuMzExIDg2LjcyOCA3OC44NjUgODUuMjAyIDgxLjEwNSA4NS4yMDJDODMuMzMxIDg1LjIwMiA4NC43ODcgODYuNzcgODQuNzg3IDg4Ljg3Qzg0Ljc4NyA4OS4xNSA4NC43NzMgODkuMzc0IDg0Ljc0NSA4OS42NEg3OC42MTNDNzguNzExIDkxLjE5NCA3OS44MDMgOTIuMDQ4IDgxLjEwNSA5Mi4wNDhDODIuMjUzIDkyLjA0OCA4Mi45ODEgOTEuNDYgODMuMjYxIDkwLjYzNEg4NC42MzNaTTg3Ljc0MjYgODguODI4VjkzSDg2LjQ2ODZWODUuMzI4SDg3Ljc0MjZWODYuNTc0Qzg4LjE3NjYgODUuNzIgODkuMDAyNiA4NS4xODggOTAuMjIwNiA4NS4xODhWODYuNTA0SDg5Ljg4NDZDODguNjY2NiA4Ni41MDQgODcuNzQyNiA4Ny4wNSA4Ny43NDI2IDg4LjgyOFpNOTEuMjE1MyA4OS4xMzZDOTEuMjE1MyA4Ni43NDIgOTIuNzk3MyA4NS4yMDIgOTQuODU1MyA4NS4yMDJDOTYuMjgzMyA4NS4yMDIgOTcuMjYzMyA4NS45MyA5Ny43MTEzIDg2LjcyOFY4NS4zMjhIOTguOTk5M1Y5M0g5Ny43MTEzVjkxLjU3MkM5Ny4yNDkzIDkyLjM5OCA5Ni4yNTUzIDkzLjEyNiA5NC44NDEzIDkzLjEyNkM5Mi43OTczIDkzLjEyNiA5MS4yMTUzIDkxLjUxNiA5MS4yMTUzIDg5LjEzNlpNOTcuNzExMyA4OS4xNUM5Ny43MTEzIDg3LjM3MiA5Ni41MDczIDg2LjMwOCA5NS4xMDczIDg2LjMwOEM5My43MDczIDg2LjMwOCA5Mi41MTczIDg3LjMzIDkyLjUxNzMgODkuMTM2QzkyLjUxNzMgOTAuOTQyIDkzLjcwNzMgOTIuMDA2IDk1LjEwNzMgOTIuMDA2Qzk2LjUwNzMgOTIuMDA2IDk3LjcxMTMgOTAuOTU2IDk3LjcxMTMgODkuMTVaTTEwMS40MzIgOTAuOVY4Ni4zNzhIMTAwLjQzOFY4NS4zMjhIMTAxLjQzMlY4My4zOTZIMTAyLjcwNlY4NS4zMjhIMTA0LjcwOFY4Ni4zNzhIMTAyLjcwNlY5MC45QzEwMi43MDYgOTEuNjU2IDEwMi45ODYgOTEuOTIyIDEwMy43NyA5MS45MjJIMTA0LjcwOFY5M0gxMDMuNTZDMTAyLjIwMiA5MyAxMDEuNDMyIDkyLjQ0IDEwMS40MzIgOTAuOVpNMTA5LjUxNCA4Ni4yOEMxMDguMjY4IDg2LjI4IDEwNy4yMzIgODcuMTA2IDEwNy4wOTIgODguNjA0SDExMS45MzZDMTExLjk1IDg3LjEwNiAxMTAuODMgODYuMjggMTA5LjUxNCA4Ni4yOFpNMTEzLjA5OCA5MC42MzRDMTEyLjcwNiA5Mi4wMzQgMTExLjQ3NCA5My4xMjYgMTA5LjU3IDkzLjEyNkMxMDcuMzg2IDkzLjEyNiAxMDUuNzc2IDkxLjU4NiAxMDUuNzc2IDg5LjE1QzEwNS43NzYgODYuNzI4IDEwNy4zMyA4NS4yMDIgMTA5LjU3IDg1LjIwMkMxMTEuNzk2IDg1LjIwMiAxMTMuMjUyIDg2Ljc3IDExMy4yNTIgODguODdDMTEzLjI1MiA4OS4xNSAxMTMuMjM4IDg5LjM3NCAxMTMuMjEgODkuNjRIMTA3LjA3OEMxMDcuMTc2IDkxLjE5NCAxMDguMjY4IDkyLjA0OCAxMDkuNTcgOTIuMDQ4QzExMC43MTggOTIuMDQ4IDExMS40NDYgOTEuNDYgMTExLjcyNiA5MC42MzRIMTEzLjA5OFpNMTE0LjQ1NyA4OS4xMzZDMTE0LjQ1NyA4Ni43NDIgMTE2LjAzOSA4NS4yMDIgMTE4LjExMSA4NS4yMDJDMTE5LjMxNSA4NS4yMDIgMTIwLjQyMSA4NS44MTggMTIwLjk1MyA4Ni43VjgyLjY0SDEyMi4yNDFWOTNIMTIwLjk1M1Y5MS41NThDMTIwLjQ5MSA5Mi40MTIgMTE5LjQ5NyA5My4xMjYgMTE4LjA5NyA5My4xMjZDMTE2LjAzOSA5My4xMjYgMTE0LjQ1NyA5MS41MTYgMTE0LjQ1NyA4OS4xMzZaTTEyMC45NTMgODkuMTVDMTIwLjk1MyA4Ny4zNzIgMTE5Ljc0OSA4Ni4zMDggMTE4LjM0OSA4Ni4zMDhDMTE2Ljk0OSA4Ni4zMDggMTE1Ljc1OSA4Ny4zMyAxMTUuNzU5IDg5LjEzNkMxMTUuNzU5IDkwLjk0MiAxMTYuOTQ5IDkyLjAwNiAxMTguMzQ5IDkyLjAwNkMxMTkuNzQ5IDkyLjAwNiAxMjAuOTUzIDkwLjk1NiAxMjAuOTUzIDg5LjE1WiIgZmlsbD0iI0ZGRkNGQyIvPgo8L3N2Zz4K") -20px -72px / 157px 124px no-repeat;
  overflow: hidden;
  white-space: nowrap;
  text-indent: -9999px;
  color: transparent;
  pointer-events: none;
}
.elementor-widget-image.sg-ki-bild.sg-ki-bild-dunkel .widget-image-caption {
  background-position: -20px -20px;
}
@media (max-width: 767px) {
  .elementor-widget-image.sg-ki-bild .widget-image-caption {
    right: 8px;
    bottom: 8px;
    width: 88px;
    height: 24px;
    background-size: 118.085px 93.265px;
    background-position: -15.043px -54.154px;
  }
  .elementor-widget-image.sg-ki-bild.sg-ki-bild-dunkel .widget-image-caption {
    background-position: -15.043px -15.043px;
  }
}

/* Feinschliff 19.10.2026: JKit-Akkordeon auf Handy und Tablet – lange Titel liefen unter das +/−-Symbol
   (z. B. „Schnittstellen verbinden“ auf Trainingscenter, „Fokus auf eine bessere Zukunft“ auf Servicetechniker werden).
   Das Symbol sitzt absolut rechts im Kopf; Elementor setzt je Akkordeon einen eigenen Innenabstand (teils rechts 0),
   deshalb hier fuer alle Akkordeons rechts 64 px Platz fuer das Symbol (mit !important gegen die Widget-Regel).
   Desktop (ab 1025 px) bleibt unveraendert. */
@media (max-width: 1024px) {
    body .jeg-elementor-kit.jkit-accordion .card-header .card-header-button {
        padding-right: 64px !important;
    }
}

/* P14 Hotline-Nummer -- IT-Pruefbericht U-02 (19.10.2026, Paket IT-5): Hotline-Nummer im Zaehler "24-h Hotline" der Startseite
   (jkit_fun_fact af1317c). Die Zeile kommt serverseitig aus energas_zaehler_hotline_nummer() in der functions.php
   und traegt zusaetzlich die Klasse "title" -> Schriftart, Gewicht, Zeilenhoehe und Farbe je Bildschirmbreite wie
   der Titeltext darueber (Elementor-Einstellungen des Widgets). Die Nummer ist etwas kleiner (hoechstens 80 % der
   Titelgroesse) und passt sich der Breite der Kachel an (cqi = 1 % der Zeilenbreite), damit sie in einer Zeile
   bleibt. Nur in sehr schmalen Kacheln (Tablet hochkant) bricht sie, und zwar nur zwischen "+49 751 888" und
   "33 33 33", nie unter 14 px (inline-block mit eigener Zeilenhoehe, damit die zwei Zeilen eng beieinander stehen).
   Abstand zum Titel per padding-top, weil die Widget-Regel fuer .title den Aussenabstand auf 0 setzt.
   Styleguide: Textlink unterstrichen, beim Zeigen/Fokus dicker (2 px), Farbe bleibt Schwarz (nie Gruen). */
body .jkit-fun-fact .energas-hotline-zeile {
    padding-top: 0.3em;
}

body .jkit-fun-fact .energas-hotline-zeile a.energas-hotline-nummer,
body .jkit-fun-fact .energas-hotline-zeile a.energas-hotline-nummer:hover,
body .jkit-fun-fact .energas-hotline-zeile a.energas-hotline-nummer:focus,
body .jkit-fun-fact .energas-hotline-zeile a.energas-hotline-nummer:visited {
    display: inline-block;
    line-height: 1.6;
    color: inherit;
    font-size: 0.8em;
    font-weight: inherit;
    text-decoration-line: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
    text-decoration-skip-ink: none;
}

body .jkit-fun-fact .energas-hotline-zeile a.energas-hotline-nummer:hover,
body .jkit-fun-fact .energas-hotline-zeile a.energas-hotline-nummer:focus-visible {
    text-decoration-thickness: 2px;
}

body .jkit-fun-fact .energas-hotline-zeile .energas-hotline-gruppe {
    white-space: nowrap;
}

@supports (font-size: 1cqi) {
    body .jkit-fun-fact .energas-hotline-zeile {
        container-type: inline-size;
    }

    body .jkit-fun-fact .energas-hotline-zeile a.energas-hotline-nummer,
    body .jkit-fun-fact .energas-hotline-zeile a.energas-hotline-nummer:hover,
    body .jkit-fun-fact .energas-hotline-zeile a.energas-hotline-nummer:focus,
    body .jkit-fun-fact .energas-hotline-zeile a.energas-hotline-nummer:visited {
        font-size: clamp(14px, 9cqi, 0.8em);
    }
}

/* ==========================================================================
   IT-Pruefbericht A-007 / A-015 (20.10.2026, Paket IT-12): Seiten liessen sich
   seitlich schieben, Kopf und zwei Abschnitte der Startseite ohne Seitenrand,
   Titel liefen aus ihrem Kasten
   ========================================================================== */

/* A-015 a) Kopfzeile (Vorlage 154, Container 8b44cf4), Desktop ab 1025 px.
   Bisher ohne Seitenrand bis ca. 1400 px: Logo und Kontakt-Knopf klebten am Bildschirmrand.
   Von 1025 bis 1059 px passten Logo, Menue und Knopf nicht nebeneinander – der Knopf wurde
   gestaucht, ragte rechts heraus und ALLE Seiten liessen sich seitlich schieben; bis ca. 1090 px
   stand das Logo fast am Menue.
   Jetzt: 15 px Seitenrand wie die Abschnitte darunter (ab 1406 px gilt wie bisher die
   Inhaltsbreite 1376 px, dort aendert sich nichts). Die Menue-Spalte d9d962f ist nie schmaler
   als Menue und Knopf; wird es eng, gibt die Logo-Spalte nach (das Logo wird kleiner, bei
   1025 px 213 statt 256 px breit), mindestens 32 px bleiben zwischen Logo und Menue.
   (Die engere Menü-Lücke 16 statt 24 px bis 1126 px war seit IT-14 aufgehoben; die Regel wurde am
   22.10.2026 mit IT-22 entfernt.) */
@media (min-width: 1025px) {
    body .elementor-154 .elementor-element.elementor-element-8b44cf4 {
        --padding-left: 15px;
        --padding-right: 15px;
    }

    body .elementor-154 .elementor-element.elementor-element-8b44cf4 > .e-con-inner {
        column-gap: 32px;
    }

    body .elementor-154 .elementor-element.elementor-element-e6e7283 {
        min-width: 0;
    }

    body .elementor-154 .elementor-element.elementor-element-d9d962f {
        --width: auto;
        flex: 1 0 auto;
    }

    body .elementor-154 .elementor-element.elementor-element-ea06728 {
        flex-shrink: 0;
    }
}

/* A-015 c) Startseite: Zaehlerleiste aa9907d und Karten-Karussell f20edcf (Leistungen,
   Trainingscenter, Team) hatten am Desktop keinen Seitenrand (Innenabstand 0) – von 1025 bis
   ca. 1400 px standen Kacheln und Karten buendig am Bildschirmrand, alle anderen Abschnitte
   haben 15 px. Jetzt 15 px wie die anderen; ab 1406 px aendert sich nichts. */
@media (min-width: 1025px) {
    body .elementor-152 .elementor-element.elementor-element-aa9907d,
    body .elementor-152 .elementor-element.elementor-element-f20edcf {
        --padding-left: 15px;
        --padding-right: 15px;
    }
}

/* A-015 b) Startseite, Zaehler-Kacheln (35c6436 Firmengruendung, af1317c 24-h Hotline,
   a8907b0 MWel): Die Titel liefen von 768 bis ca. 1130 px aus der Kachel – "Firmengruendung"
   ist bei 30 px 255 px breit, in der Kachel sind bei 1025 px nur rund 210 px frei; auf dem
   Tablet hochkant bleiben bei 48 px Innenabstand nur 108 px ("erreichbar" braucht 147 px).
   - Woerter ab 12 Buchstaben duerfen getrennt werden, mit mindestens 6 Buchstaben vor und nach
     dem Strich: "Firmen-gruendung". Kuerzere Woerter bleiben ganz.
   - Tablet (768–1024 px): 24 statt 48 px Innenabstand in den Kacheln. */
@media (min-width: 768px) {
    body .elementor-152 .elementor-element-aa9907d .jkit-fun-fact .fun-fact-inner .content .title {
        -webkit-hyphens: auto;
        hyphens: auto;
        -webkit-hyphenate-limit-before: 6;
        -webkit-hyphenate-limit-after: 6;
        hyphenate-limit-chars: 12 6 6;
        overflow-wrap: break-word;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    body .elementor-152 .elementor-element.elementor-element-35c6436 .jeg-elementor-kit.jkit-fun-fact,
    body .elementor-152 .elementor-element.elementor-element-af1317c .jeg-elementor-kit.jkit-fun-fact,
    body .elementor-152 .elementor-element.elementor-element-a8907b0 .jeg-elementor-kit.jkit-fun-fact {
        padding: 24px;
    }
}

/* A-007 Branchenseiten der Referenzen (Seitentitel H2 38d05f1d, gleiche ID auf allen 8 Seiten):
   Auf dem Tablet (72 px) ist "Lebensmittelindustrie" 798 px breit, der Kasten bei 768 px nur
   738 px – die Seite liess sich von 768 bis ca. 812 px seitlich schieben. Silbentrennung wie
   beim H1 (15.09.2026), getrennt wird erst ab 9 Buchstaben nach dem Strich: "Lebensmittel-
   industrie" statt "Lebensmittelindus-trie". Titel, die passen, bleiben unveraendert. */
@media (min-width: 768px) and (max-width: 1024px) {
    body .elementor-widget-heading.elementor-element-38d05f1d .elementor-heading-title {
        -webkit-hyphens: auto;
        hyphens: auto;
        -webkit-hyphenate-limit-before: 3;
        -webkit-hyphenate-limit-after: 9;
        hyphenate-limit-chars: auto 3 9;
        overflow-wrap: break-word;
    }
}

/* ==========================================================================
   IT-Pruefbericht A-027 (20.10.2026, Paket IT-14): Feinschliff Kopf und Fuss –
   ungleiche Abstaende im Hauptmenue, Titel "Newsletter Anmeldung" ragte auf
   dem Tablet aus seinem Kasten
   Teil b) (Fuss-Titel "Newsletter Anmeldung" 22 px bei 768-939 px) am 21.10.2026
   mit IT-18 entfernt: Der Fuss steht auf dem Tablet jetzt 2 x 2, der Titel passt
   dort in seiner normalen Groesse (28 px).
   ========================================================================== */

/* A-027 a) Kopfzeile (Vorlage 154), Hauptmenue (Widget 66e3df8), Desktop ab 1025 px.
   Das Menue-Skript haengt jedem Punkt mit Aufklappliste (BHKW-Loesungen, Unternehmen,
   Service, Karriere) ein Pfeil-Feld an (span.sub-arrow). Das Symbol ist im Widget
   abgeschaltet (leeres <i>), Elementor gibt dem Feld aber trotzdem 10 px Innenabstand
   (widget-nav-menu.min.css): ein unsichtbares 10-px-Feld rechts neben dem Text. Nach
   diesen Punkten waren es deshalb 34 statt 24 px bis zum naechsten Punkt (1025–1126 px:
   26 statt 16 px), nach "Referenzen" (ohne Liste) 24 bzw. 16 px.
   Jetzt: Das leere Feld entfaellt, alle Abstaende 24 px wie in der Vorlage (Figma).
   Die 16-px-Luecke fuer 1025–1126 px aus IT-12 (Block davor) ist damit aufgehoben: Ohne
   die vier Felder (4 x 10 px) ist das Menue mit 24 px genau so breit wie bisher mit
   16 px – Logo, Abstand Logo–Menue und Kontakt-Knopf bleiben dort unveraendert. Ab
   1127 px wird das Menue 40 px schmaler, der Abstand zum Logo um 40 px groesser.
   (Die IT-12-Regel mit 16 px wurde am 22.10.2026 mit IT-22 entfernt. Seitdem ergibt die Grundregel
   ab 1025 px allein 24 px; die 24-px-Regel unten ist nur noch eine Doppelung.)
   Aufklappen per Klick und per Tastatur (Fokus, Enter, Tab, Escape) bleibt wie bisher;
   der Fokusrahmen sitzt jetzt eng um den Text wie bei "Referenzen". */
@media (min-width: 1025px) {
    body .elementor-154 .elementor-element-66e3df8 .elementor-nav-menu--main > ul > li > a > .sub-arrow {
        display: none;
    }
}

@media (min-width: 1025px) and (max-width: 1126px) {
    body .elementor-154 .elementor-element-66e3df8 .elementor-nav-menu--main > ul.elementor-nav-menu {
        gap: 24px;
    }
}

/* ==========================================================================
   IT-Pruefbericht A-028 (20.10.2026, Paket IT-16): Fuss auf dem Tablet und
   Fokusrahmen im Kopf-Menue. Urspruenglich drei Teile:
   a) Newsletter-Hinweis: Silbentrennung 768-879 px
   b) Newsletter-Formular: Tablet 768-1024 px Knopf unter dem Feld
   c) Kopf-Menue: Fokusrahmen der Hauptpunkte ganz sichtbar (ab 1025 px)
   a) und b) am 21.10.2026 mit IT-18 entfernt: Der Fuss steht auf dem Tablet jetzt
   2 x 2 (Block IT-18), Hinweis und Platzhalter passen dort ohne Sonderregel, der
   Knopf sitzt wieder im Feld wie am Desktop. Es bleibt c).
   Enter in den Aufklapplisten: assets/js/menue-barrierefrei.js (Abschnitt Kopf-Menue).
   ========================================================================== */

/* A-028 c) Kopfzeile (Vorlage 154), Hauptmenue (66e3df8), Desktop ab 1025 px: Fokusrahmen
   der Hauptpunkte. Er kommt aus dem Grundtheme (Hello reset.css, a:focus-visible: 2 px
   schwarz, 2 px Abstand) und liegt damit 4 px ausserhalb des Links. Die Links reichen ueber
   die volle Leistenhoehe (0-75 px, nur so beginnt die Aufklappliste an der Unterkante) und
   die Leiste beginnt am Seitenanfang: Die obere Rahmenlinie lag bei -4 bis -2 px ueber dem
   Seitenrand und fehlte ganz (kein overflow beteiligt; Elementor blendet den Rahmen in
   0,4 s ein, daher wirkte es anfangs wie 3 px).
   Jetzt liegt der Rahmen innen (Abstand -3 px): oben 1 px unter der Seitenkante, unten 1 px
   ueber der Leistenkante. Damit er seitlich nicht auf der Schrift liegt, bekommt der Link
   links und rechts 5 px unsichtbaren Innenabstand, den ein gleich grosser negativer
   Aussenabstand aufhebt: Schrift, Abstaende (24 px), Unterstreichung und Aufklappliste
   bleiben auf den Pixel gleich, seitlich sitzt der Rahmen wie bisher 2-4 px neben der
   Schrift. */
@media (min-width: 1025px) {
    body .elementor-location-header .elementor-nav-menu--main > ul > li > a.elementor-item {
        padding-left: 5px;
        padding-right: 5px;
        margin-left: -5px;
        margin-right: -5px;
        outline-offset: -3px;
    }
}

/* ==========================================================================
   IT-Pruefbericht (20.10.2026, Paket IT-17): /referenzen/ liess sich am
   schmalen Desktop (1025 bis ca. 1206 px) seitlich schieben
   (21.10.2026, IT-18: Regel gilt jetzt ab 768 px, also auch auf dem Tablet)
   Handy-/Tablet-Menue per Tastatur: assets/js/menue-barrierefrei.js
   ========================================================================== */

/* Referenzen (Seite 10476), Branchen-Kacheln im Gitter 7061891: Titel in der globalen
   Typografie 73d0e2b (Desktop 40/46 px). Am Desktop stehen drei Kacheln nebeneinander, der
   Titelkasten ist unter ca. 1354 px schmaler als "Objektversorgung" (368,6 px, ein Wort ohne
   Trennstelle). Das Wort ragte in den Innenabstand, ab ca. 1255 px ueber die gruene Kachel und
   ab ca. 1206 px ueber den Seitenrand: Die Seite liess sich seitlich schieben (1025 px: 62 px).
   "Biogasanlagen" ragte unter ca. 1147 px aus seinem Kasten (1025 px: 17 px ueber die Kachel).
   Silbentrennung scheidet aus: Chrome trennt "Objektversor-gung" bzw. "Biogasanla-gen", und
   keine Trenngrenze passt fuer alle acht Kacheltitel.
   Jetzt wird die Titelschrift nur so weit kleiner, dass das laengste Wort in den Kasten passt
   (10,6 % der Kastenbreite, Einheit cqi): 1280 px 37 px, 1126 px 32 px, 1025 px 28 px; ab ca.
   1354 px wie bisher 40 px. Die Zeilenhoehe schrumpft im gleichen Verhaeltnis (46 zu 40). Alle
   Kacheltitel bleiben gleich gross. Handy (bis 767 px) unveraendert.
   Seit 21.10.2026 (IT-18) auch auf dem Tablet (bisher erst ab 1025 px): Dort ragte
   "Objektversorgung" (38 px) bei 768 bis ca. 850 px aus seinem Kasten, unter ca. 800 px auch
   ueber die Kachel (768 px: 17 px). Jetzt 768 px 32,8 px, 834 px 36,3 px, ab ca. 870 px wie
   bisher 38 px; Zeilenhoehe mit demselben Faktor (768 px: 42 statt 48 px). */
@supports (font-size: 1cqi) {
    @media (min-width: 768px) {
        body .elementor-10476 .elementor-element.elementor-element-7061891 .elementor-widget-heading {
            container-type: inline-size;
        }

        body .elementor-10476 .elementor-element.elementor-element-7061891 .elementor-widget-heading .elementor-heading-title {
            font-size: min(var(--e-global-typography-73d0e2b-font-size, 40px), 10.6cqi);
            line-height: calc(var(--e-global-typography-73d0e2b-line-height, 46px) - (var(--e-global-typography-73d0e2b-font-size, 40px) - 1em) * 1.15);
        }
    }
}

/* ==========================================================================
   IT-Pruefbericht (21.10.2026, Paket IT-18): Fuss auf dem Tablet 2 x 2,
   /referenzen/: Zaehlertitel wurden abgeschnitten
   (Kacheltitel /referenzen/ auf dem Tablet: Regel im IT-17-Block gilt jetzt ab
   768 px; IT-14 b und IT-16 a/b sind dafuer entfernt, siehe deren Kopf)
   ========================================================================== */

/* Fusszeile (Vorlage 205), Zeile 7cada1b, Tablet 768-1024 px: zwei statt vier Spalten (Kai 21.10.2026).
   Bisher vier schmale Spalten (768 px: je 139 px): Der Newsletter-Knopf musste unter das Feld, Titel und
   Hinweis brauchten Sonderregeln (IT-14 b, IT-16 a/b - mit diesem Paket entfernt). Jetzt je ca. 300-410 px:
     Kontakt      | Folgen Sie uns
     Unternehmen  | Newsletter
   Reihenfolge wie im Quelltext, auch beim Tabben. Der runde Knopf sitzt wieder im Feld wie am Desktop
   (Grundregeln .cta-pill-form am Dateianfang). Das E-Mail-Feld behaelt auf dem Tablet 16 px Schrift wie
   bisher (Desktop 18 px). Handy (bis 767 px) und Desktop (ab 1025 px) unveraendert. */
@media (min-width: 768px) and (max-width: 1024px) {
    body .elementor-205 .elementor-element.elementor-element-7cada1b {
        --e-con-grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body .elementor-205 .elementor-element.elementor-element-491f716 input[type="email"] {
        font-size: 16px;
    }
}

/* Referenzen (Seite 10476), Zaehler-Kacheln in der Leiste 16133f60: 6dbae51f "Firmengruendung",
   5330fc46 "Unternehmen, die erfolgreich mit uns zusammenarbeiten", 5bbf8df3 "in Betrieb gesetzte
   Leistung". Die Titel liefen aus der Kachel und wurden an ihrer Kante abgeschnitten (768 px:
   "Firmengruen...", "zusammen..."; 1025 px: "zusammenarbeite..."), bei 1126 px ragten sie in den
   Innenabstand. Loesung wie auf der Startseite (IT-12, A-015 b):
   - ab 768 px Silbentrennung nur fuer Woerter ab 12 Buchstaben, mindestens 6 vor und 8 nach dem
     Strich: "Firmen-gruendung", "zusammen-arbeiten" (nie "zusammenar-beiten"); kuerzere Woerter
     bleiben ganz; overflow-wrap nur als Sicherung (Browser ohne Trennwoerterbuch);
   - Tablet (768-1024 px) 24 statt 48 px Innenabstand in den Kacheln;
   - zusaetzlich (der mittlere Titel ist laenger als auf der Startseite): "Unternehmen," (11 Buchstaben)
     laesst sich nicht sauber trennen - jede Grenze, die "Unter-nehmen" erlaubt, erlaubt auch
     "zusammenar-beiten" bzw. "zusam-menarbeiten" (gemessen). Deshalb wird die Titelschrift nur so weit
     kleiner, dass dieses Wort in den Kasten passt (13,65 % der Kastenbreite, Einheit cqi, wie bei den
     Kacheltiteln im IT-17-Block): 768 px 21,3 px, 834 px 23,9 px, 905 px 26,6 px, ab ca. 940 px wie
     bisher 28 px; am Desktop nur bei 1025-1027 px (mit Bildlaufleiste bis ca. 1042 px) knapp unter
     30 px. Zeilenhoehe im gleichen Verhaeltnis (38 zu 28). Alle drei Titel bleiben gleich gross.
   Handy (bis 767 px) unveraendert. */
@media (min-width: 768px) {
    body .elementor-10476 .elementor-element-16133f60 .jkit-fun-fact .fun-fact-inner .content .title {
        -webkit-hyphens: auto;
        hyphens: auto;
        -webkit-hyphenate-limit-before: 6;
        -webkit-hyphenate-limit-after: 8;
        hyphenate-limit-chars: 12 6 8;
        overflow-wrap: break-word;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    body .elementor-10476 .elementor-element.elementor-element-6dbae51f .jeg-elementor-kit.jkit-fun-fact,
    body .elementor-10476 .elementor-element.elementor-element-5330fc46 .jeg-elementor-kit.jkit-fun-fact,
    body .elementor-10476 .elementor-element.elementor-element-5bbf8df3 .jeg-elementor-kit.jkit-fun-fact {
        padding: 24px;
    }
}

@supports (font-size: 1cqi) {
    @media (min-width: 768px) {
        body .elementor-10476 .elementor-element-16133f60 .jeg-elementor-kit.jkit-fun-fact {
            container-type: inline-size;
        }

        body .elementor-10476 .elementor-element.elementor-element-6dbae51f .jeg-elementor-kit.jkit-fun-fact .fun-fact-inner .content .title,
        body .elementor-10476 .elementor-element.elementor-element-5330fc46 .jeg-elementor-kit.jkit-fun-fact .fun-fact-inner .content .title,
        body .elementor-10476 .elementor-element.elementor-element-5bbf8df3 .jeg-elementor-kit.jkit-fun-fact .fun-fact-inner .content .title {
            font-size: min(var(--e-global-typography-711c304-font-size, 28px), 13.65cqi);
            line-height: calc(var(--e-global-typography-711c304-line-height, 38px) - (var(--e-global-typography-711c304-font-size, 28px) - 1em) * 1.3571);
        }
    }
}

/* ==========================================================================
   IT-Pruefbericht (21.10.2026, Paket IT-21): Landingpage „Servicetechniker
   werden“ (Seite 13564) - KI-Hinweis mittig unten, Video-Vorschau Tablet
   ========================================================================== */

/* a) KI-Banner mittig unten (Moritz 21.10.2026 zum neuen Porträt neben dem Zitat: „Bitte hinweis zu KI setzen,
   mittig unten.“): Zusatzklasse sg-ki-bild-mitte zum Block „AI-Banner“ vom 14.10.2026 (Kaleido-SVG unveraendert,
   nur andere Lage). Fuer runde Bilder, bei denen das Bild-Widget genau der Kreis ist (240 px): Banner waagrecht
   mittig, Abstand unten so, dass er ganz im Kreis liegt (117x32 braucht unten mind. 16 px, 88x24 auf dem Handy
   mind. 9 px). Zuerst genutzt fuer Bild-Widget b14a0ade auf Seite 13564 (mit sg-ki-bild-dunkel = schwarzer Banner,
   weil unten in der Mitte die weisse Bluse liegt). */
.elementor-widget-image.sg-ki-bild.sg-ki-bild-mitte .widget-image-caption {
  right: auto;
  left: 50%;
  bottom: 20px;
  transform: translateX(-50%);
}
@media (max-width: 767px) {
  .elementor-widget-image.sg-ki-bild.sg-ki-bild-mitte .widget-image-caption {
    right: auto;
    bottom: 15px;
  }
}

/* b) Video-Zitat-Boxen (Pascal Kluge, Marcel Menninger; Container cd5c20fa/ed86fa5a und b85bdeff/a307b078):
   Auf dem Tablet (768-1024 px) stehen Vorschau und Zitat untereinander; die 3:2-Vorschau lief ueber die volle
   Breite und war sehr hoch (1024 px: 946x631). Jetzt Vorschau samt Hinweis und Zitat in einer Spalte von
   hoechstens 640 px, mittig im Kasten (Vorschau 640x427). Desktop (ab 1025 px) und Handy (bis 767 px) unveraendert. */
@media (min-width: 768px) and (max-width: 1024px) {
  body .elementor-13564 .elementor-element.elementor-element-cd5c20fa,
  body .elementor-13564 .elementor-element.elementor-element-ed86fa5a,
  body .elementor-13564 .elementor-element.elementor-element-b85bdeff,
  body .elementor-13564 .elementor-element.elementor-element-a307b078 {
    max-width: 640px;
  }
}

/* Feinschliff 21.10.2026 (Kai: „passt beides nicht, mach ein overlay“): KI-Banner mittig unten (sg-ki-bild-mitte)
   bekommt eine halbtransparente dunkle Unterlage in Pillenform hinter dem weissen Banner, damit er auf unruhigem
   Grund voll lesbar ist (Porträt b14a0ade auf 13564: weisse Bluse zwischen dunkler Weste – weder der schwarze noch
   der weisse Banner allein war ganz lesbar). Kaleido-SVG unveraendert; nur Unterlage (Hintergrundfarbe unter dem
   SVG-Bild, Rundung wie der Banner) und immer die weisse Variante, auch wenn sg-ki-bild-dunkel gesetzt ist. */
.elementor-widget-image.sg-ki-bild.sg-ki-bild-mitte .widget-image-caption,
.elementor-widget-image.sg-ki-bild.sg-ki-bild-mitte.sg-ki-bild-dunkel .widget-image-caption {
  background-color: rgba(0, 0, 0, 0.5);
  background-position: -20px -72px;
  border-radius: 16px;
}
@media (max-width: 767px) {
  .elementor-widget-image.sg-ki-bild.sg-ki-bild-mitte .widget-image-caption,
  .elementor-widget-image.sg-ki-bild.sg-ki-bild-mitte.sg-ki-bild-dunkel .widget-image-caption {
    background-position: -15.043px -54.154px;
    border-radius: 12px;
  }
}

/* ==========================================================================
   IT-Prüfbericht (21./22.10.2026, Paket IT-22): Feinschliff. Zählertitel auf
   dem Handy, Seitenrand der /referenzen/-Zählerleiste, Cookie-Banner auf dem
   Handy, Turnstile-Kästchen ab Tablet kompakt.
   Dazu entfernt: IT-12-Regel "gap: 16px" für 1025 bis 1126 px im Kopf-Menü (seit
   IT-14 überstimmt und wirkungslos, siehe Kommentare im IT-12- und IT-14-Block).
   ========================================================================== */

/* a) Zähler-Kacheln auf dem Handy (bis 767 px), Startseite (Leiste aa9907d) und /referenzen/ (Leiste
   16133f60): Titel 24 px, bisher ohne Silbentrennung. Auf /referenzen/ ragte "zusammenarbeiten" (24 px:
   238 px breit) unter ca. 372 px Bildschirmbreite in den Innenabstand der Kachel (360 px: 10,5 px,
   320 px: 46,5 px), "Firmengründung" (204 px) auf beiden Seiten unter ca. 334 px (320 px: 11,6 px).
   Jetzt wie ab 768 px (IT-12, IT-18): Silbentrennung nur für Wörter ab 12 Buchstaben, mindestens 6 vor
   und 8 nach dem Strich, also "zusammen-arbeiten" und "Firmen-gründung". Getrennt wird nur, wenn das
   Wort nicht in die Zeile passt (hier nur unter ca. 372 bzw. 334 px). Schrift bleibt 24 px.
   overflow-wrap nur als Sicherung für Browser ohne Trennwörterbuch. */
@media (max-width: 767px) {
    body .elementor-152 .elementor-element-aa9907d .jkit-fun-fact .fun-fact-inner .content .title,
    body .elementor-10476 .elementor-element-16133f60 .jkit-fun-fact .fun-fact-inner .content .title {
        -webkit-hyphens: auto;
        hyphens: auto;
        -webkit-hyphenate-limit-before: 6;
        -webkit-hyphenate-limit-after: 8;
        hyphenate-limit-chars: 12 6 8;
        overflow-wrap: break-word;
    }
}

/* b) /referenzen/ (Seite 10476), Zählerleiste 16133f60: am Desktop ohne Seitenrand (Innenabstand 0), von
   1025 bis ca. 1400 px standen die Kacheln bündig am Bildschirmrand (x = 0). Jetzt 15 px wie auf der
   Startseite (IT-12, A-015 c) und in den anderen Abschnitten; ab 1406 px ändert sich nichts. Die Kacheln
   werden dadurch je 10 px schmaler: Der mittlere Titel trennt "zusammen-arbeiten" jetzt unter ca. 1292 px
   (bisher unter ca. 1262 px), und die Zählertitel (13,65 cqi, IT-18) sind bei 1025 bis ca. 1057 px etwas
   kleiner (1025 px: 28,5 statt 29,9 px). */
@media (min-width: 1025px) {
    body .elementor-10476 .elementor-element.elementor-element-16133f60 {
        --padding-left: 15px;
        --padding-right: 15px;
    }
}

/* c) Cookie-Banner (Real Cookie Banner 5.4.0), Handy bis 767 px: In den Einstellungen ragte der Inhalt über
   den Rand (390 px: 417 px breit und seitlich verschiebbar, 320 px: 97 px zu breit), sobald bei einem Dienst
   "Weitere Details anzeigen" offen war. Ursache: Die Dienst-Gruppen stehen in einem fieldset, das so breit
   wird wie sein längstes unteilbares Wort, hier "Angemessenheitsbeschluss" mit Fußnote (Drittland-Angabe
   bei Turnstile, YouTube, OpenStreetMap). Außerdem trennte der Banner Linktexte an beliebiger Stelle und
   ohne Strich ("Dri|ttländern", "Datenü|bermittlung"; word-break: break-all des Banners).
   Jetzt: Wörter ab 12 Buchstaben werden mit Strich getrennt ("Angemessenheits-beschluss"), kürzere bleiben
   ganz; nur was auch allein nicht in eine Zeile passt (Adressen, Cookie-Namen), bricht am Rand um. Die
   Klassennamen und IDs des Banners werden bei jedem Aufruf neu erzeugt (z. B. a7b63-..., acba6-...), deshalb
   nur über den Dialog mit data-nosnippet. Der Banner setzt break-all über eine solche ID (#a4a77-250 ...
   > span > a), daher hier !important. Tablet und Desktop unverändert. */
@media (max-width: 767px) {
    dialog[data-nosnippet] {
        -webkit-hyphens: auto;
        hyphens: auto;
        -webkit-hyphenate-limit-before: 6;
        -webkit-hyphenate-limit-after: 6;
        hyphenate-limit-chars: 12 6 6;
        overflow-wrap: anywhere;
    }

    dialog[data-nosnippet] a {
        word-break: normal !important;
    }
}

/* d) Cloudflare Turnstile (Formulare Kontakt, Stellen, Initiativbewerbung, Newsletter im Fuß): Das Kästchen
   "Bestätigen Sie, dass Sie ein Mensch sind" erscheint nur, wenn Cloudflare eine Bestätigung verlangt. Mit
   size:flexible (CF7-Vorlagen und energas-spamschutz) spannte es sich über die ganze Formularbreite (Kontakt
   am Desktop 1376 px). Ab Tablet (768 px) jetzt höchstens 300 px breit (Standardgröße von Turnstile),
   linksbündig wie die Felder. Handy unverändert (volle Breite). */
@media (min-width: 768px) {
    body form .cf-turnstile {
        max-width: 300px;
    }
}

/* ==========================================================================
   IT-Prüfbericht (22.10.2026, Paket IT-27): Cookie-Banner auf allen Breiten.
   ========================================================================== */

/* Cookie-Banner (Real Cookie Banner 5.4.0): Regel c aus dem IT-22-Block gilt jetzt für alle Breiten, nicht nur bis
   767 px. Ab 768 px brachen Linktexte mitten im Wort und ohne Strich ("Dri|ttländern" bei 768 px, "f|ür" bei 1024 px,
   "Tec|hnische" bei 1440 px), weil der Banner für Links word-break: break-all setzt (über eine bei jedem Aufruf neu
   erzeugte ID, daher !important und nur über den Dialog mit data-nosnippet). Jetzt wie auf dem Handy: Links mit
   word-break: normal, Wörter ab 12 Buchstaben mit Strich getrennt, nur was auch allein nicht in eine Zeile passt
   (Adressen, Cookie-Namen), bricht am Rand um. Ohne Medienabfrage, damit keine Breite dazwischen fällt (etwa 767,5 px
   beim Zoomen); bis 767 px gleich wie IT-22 c. */
dialog[data-nosnippet] {
    -webkit-hyphens: auto;
    hyphens: auto;
    -webkit-hyphenate-limit-before: 6;
    -webkit-hyphenate-limit-after: 6;
    hyphenate-limit-chars: 12 6 6;
    overflow-wrap: anywhere;
}

dialog[data-nosnippet] a {
    word-break: normal !important;
}

/* Glossar-Titel (Code-Snippet #7, h1.energas-glossar-title), 24.10.2026, P-D: Lange Wörter brachen mitten im Wort ohne
   Trennstrich um (overflow-wrap aus dem Snippet), am Handy in rund der Hälfte der 185 Titel („Mietcontain|er“), ab 768 px
   in 8 bis 26 Titeln („Förderbeitragsdeckelun|g“). Jetzt Silbentrennung nach Seitensprache de. Ab 768 px nur Wörter ab
   16 Buchstaben und je Teil mindestens 5, damit kürzere Wörter am Desktop nicht unnötig getrennt werden. Die Umbruchstelle
   nach „/“ setzt das Snippet (<wbr>). */
body.energas-glossar-single .energas-glossar-title {
    -webkit-hyphens: auto;
    hyphens: auto;
}

@media (min-width: 768px) {
    body.energas-glossar-single .energas-glossar-title {
        -webkit-hyphenate-limit-before: 5;
        -webkit-hyphenate-limit-after: 5;
        hyphenate-limit-chars: 16 5 5;
    }
}

/* NH Nachtrag von Hand (26.10.2026, Phase 2a), Lektorat Befund 515: Zähler-Nachsilbe ohne Leerzeichen an der Zahl
   („1.000+ MWel“, „700+“), Startseite (Zählerleiste aa9907d) und /referenzen/ (Zählerleiste 16133f60).
   Der Zähler-Baustein (JKit, jkit_fun_fact) setzt zwischen Zahl und Nachsilbe einen Zeilenumbruch ins Markup,
   der als Leerzeichen erscheint und dort auch umbrechen darf („1.000“ / „+ MWel“). Hier bleibt die Zeile normaler
   Fließtext: Der Leerraum zwischen den Teilen hat Schriftgröße und Zeilenhöhe 0 und ist keine Umbruchstelle; Zahl
   und Nachsilbe bekommen Schriftgröße und Zeilenhöhe der Elementor-Vorlage zurück (globale Typografie 73d0e2b:
   40/46, 38/48, 32/42 px) und dürfen in sich umbrechen. Passt „1.000+ MWel“ nicht in eine Zeile, bricht es nach
   dem „+“ um („1.000+“ / „MWel“). */
body .elementor-152 .elementor-element-aa9907d .jkit-fun-fact .fun-fact-inner .content .number-wrapper,
body .elementor-10476 .elementor-element-16133f60 .jkit-fun-fact .fun-fact-inner .content .number-wrapper {
    font-size: 0 !important;
    line-height: 0 !important;
    white-space: nowrap;
}
body .elementor-152 .elementor-element-aa9907d .jkit-fun-fact .fun-fact-inner .content .number-wrapper > span,
body .elementor-10476 .elementor-element-16133f60 .jkit-fun-fact .fun-fact-inner .content .number-wrapper > span {
    font-size: var(--e-global-typography-73d0e2b-font-size, 40px);
    line-height: var(--e-global-typography-73d0e2b-line-height, 46px);
    white-space: normal;
}

/* V-S 28.10.2026 (Lektorat #438): Stellenseite ohne weitere offene Stellen im selben Bereich (zurzeit nur
   „Duales Studium Data Science & KI“): Abschnitt „Weitere offene Stellen“ der Vorlage 12033 (Container eccd7c0)
   samt Überschrift ausblenden. Der Kurzcode [energas_stellen] gibt dort sonst „Zurzeit sind keine Stellen
   ausgeschrieben.“ aus, was der Anzeige auf derselben Seite widersprach. Sobald im Bereich eine weitere Stelle
   veröffentlicht ist, fehlt .estl-leer und der Abschnitt erscheint wieder. Im Elementor-Editor bleibt er sichtbar. */
body.single-stelle:not(.elementor-editor-active) .elementor-12033 .elementor-element-eccd7c0:has(.estl-leer) {
    display: none;
}





/* BEGIN Kopfbereich mitlaufend (A-066, nur Handy bis 767 px) */
@media (max-width: 767px) {
    .kopf-mitlaufend header.elementor-location-header {
        position: sticky;
        top: 0;
        z-index: 999;
        transition: transform 0.25s ease;
    }
    .kopf-mitlaufend header.elementor-location-header.kopf-weg {
        transform: translateY(-100%);
    }
}
@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
    .kopf-mitlaufend header.elementor-location-header {
        transition: none;
    }
}
/* END Kopfbereich mitlaufend */



/* BEGIN Handy-Optimierung (03.11.2026, A-063) - gilt nur bis 767 px Breite */
@media (max-width: 767px) {

    /* 1. Schriftgroessen: Groessenstaffel Handy (Kai 03.11., A-068): 7 Stufen statt 21 verschiedener Groessen
       32 Seitentitel und grosse Zahlen | 26 Abschnittstitel | 22 Unterabschnitt | 20 Kartentitel, Fragen
       18 Einleitung | 17 Text | 16 Knopf (Desktop unveraendert) */
    body.elementor-kit-27 {
        --e-global-typography-8d22d0f-font-size: 32px;  --e-global-typography-8d22d0f-line-height: 40px;
        --e-global-typography-03503c1-font-size: 32px;  --e-global-typography-03503c1-line-height: 40px;
        --e-global-typography-eb47668-font-size: 32px;  --e-global-typography-eb47668-line-height: 38px;
        --e-global-typography-73d0e2b-font-size: 26px;  --e-global-typography-73d0e2b-line-height: 34px;
        --e-global-typography-d378f39-font-size: 26px;  --e-global-typography-d378f39-line-height: 34px;
        --e-global-typography-17efad3-font-size: 26px;  --e-global-typography-17efad3-line-height: 34px;
        --e-global-typography-4502117-font-size: 22px;  --e-global-typography-4502117-line-height: 30px;
        --e-global-typography-afe092c-font-size: 22px;  --e-global-typography-afe092c-line-height: 30px;
        --e-global-typography-0d129c7-font-size: 22px;  --e-global-typography-0d129c7-line-height: 30px;
        --e-global-typography-bd58e6a-font-size: 22px;  --e-global-typography-bd58e6a-line-height: 30px;
        --e-global-typography-711c304-font-size: 20px;  --e-global-typography-711c304-line-height: 28px;
        --e-global-typography-78481e7-font-size: 20px;  --e-global-typography-78481e7-line-height: 28px;
        --e-global-typography-280154d-font-size: 18px;  --e-global-typography-280154d-line-height: 28px;
        --e-global-typography-8ea8b08-font-size: 18px;  --e-global-typography-8ea8b08-line-height: 28px;
        --e-global-typography-65ad13d-font-size: 18px;  --e-global-typography-65ad13d-line-height: 28px;
        --e-global-typography-1239bd0-font-size: 17px;  --e-global-typography-1239bd0-line-height: 27px;
        --e-global-typography-19d8f8d-font-size: 17px;  --e-global-typography-19d8f8d-line-height: 27px;
        --e-global-typography-56fd71a-font-size: 16px;  --e-global-typography-56fd71a-line-height: 24px;
    }
    /* Einleitung der Startseite (fester Wert 32 px am Handy) */
    body.elementor-kit-27 .elementor-element.elementor-element-c67d023 .elementor-heading-title {
        font-size: 22px;
        line-height: 32px;
    }

    /* 2. Lange deutsche Woerter mit Strich trennen, nichts ueber den Rand */
    body .elementor-heading-title,
    body h1, body h2, body h3, body h4, body h5,
    body .jkit-icon-box .title,
    body .jkit-icon-box .icon-box-description,
    body .elementor-widget-theme-post-content {
        -webkit-hyphens: auto;
        hyphens: auto;
        overflow-wrap: break-word;
    }
    body .elementor-widget-theme-post-content figcaption,
    body .elementor-widget-theme-post-content a {
        overflow-wrap: anywhere;
    }

    /* 3. Einleitungstext im Seitenkopf in voller Breite statt 80 % */
    body .jkit-heading .heading-section-description {
        max-width: 100% !important;
    }

    /* 4. Abstaende: grosse Desktop-Abstaende am Handy begrenzen (Innenabstand oben/unten hoechstens 48 px,
       Aussenabstand oben/unten hoechstens 40 px) */
    body.elementor-kit-27 .e-con {
        --padding-block-start: min(var(--padding-top, 0px), 48px);
        --padding-block-end: min(var(--padding-bottom, 0px), 48px);
        --margin-block-start: min(var(--margin-top, 0px), 40px);
        --margin-block-end: min(var(--margin-bottom, 0px), 40px);
    }

    /* 5. Karussells ohne Pfeile: Karten untereinander statt versteckt (Startseite, Leistungen, Service, Karriere) */
    body .elementor-widget-n-carousel:not(:has(.elementor-swiper-button)) .swiper-wrapper {
        display: flex;
        flex-direction: column;
        gap: 16px;
        transform: none !important;
        height: auto !important;
    }
    body .elementor-widget-n-carousel:not(:has(.elementor-swiper-button)) .swiper-slide {
        width: 100% !important;
        margin-right: 0 !important;
        height: auto !important;
    }
    body .elementor-widget-n-carousel:not(:has(.elementor-swiper-button)) .swiper-slide-duplicate {
        display: none !important;
    }

    /* 6. Kopfbild der Unterseiten in voller Textbreite statt doppelt eingerueckt */
    body.elementor-kit-27 .e-con-boxed.e-child:has(> .e-con-inner > .elementor-widget-image:only-child) {
        --container-max-width: 100%;
    }

    /* 7. Weisse Karte in Blogbeitraegen und Referenzprojekten: 20 px Innenabstand statt 10 px */
    body.elementor-kit-27 .elementor-element.elementor-element-eb11536 {
        --padding-top: 24px;
        --padding-bottom: 24px;
        --padding-left: 20px;
        --padding-right: 20px;
    }
    /* Beitragskopf: Titel und "Zurueck" mit kleineren Abstaenden */
    body.elementor-kit-27 .elementor-element.elementor-element-866b86e {
        padding: 20px 0 16px 0;
    }
    body.elementor-kit-27 .elementor-element.elementor-element-06abad5 {
        margin-bottom: 20px;
    }
    /* Referenzprojekt: Branchenliste ans Ende, damit Titel und Foto oben stehen */
    body.elementor-kit-27 .elementor-element.elementor-element-8f6f133 {
        order: 99;
    }
    body.elementor-kit-27 .elementor-element.elementor-element-7ef39fc {
        --padding-bottom: 20px;
    }
    body.elementor-kit-27 .elementor-element.elementor-element-714d630 {
        --padding-top: 0px;
    }
    /* Blogbeitraege: breite Bilder und Tabellen nicht ueber den Rand */
    body .elementor-widget-theme-post-content :is(.alignwide, .alignfull) {
        margin-left: 0;
        margin-right: 0;
        max-width: 100%;
    }
    body .elementor-widget-theme-post-content table {
        display: block;
        max-width: 100%;
        overflow-x: auto;
        font-size: 14px;
        line-height: 20px;
    }
    body .elementor-widget-theme-post-content :is(th, td) {
        padding: 6px 8px;
    }
    /* BEHG-Beitrag: Preistabelle (6 Spalten) am Handy als Karte je Jahr, Werte mit Spaltennamen aus der Kopfzeile
       (Kai 03.11.: "kann man die tabelllen nicht besser darstellen?"). Die Namen stehen hier, weil die Tabelle
       keine Beschriftung je Zelle hat; aendert sich die Kopfzeile im Beitrag, hier mit aendern. */
    body.postid-10260 .elementor-widget-theme-post-content table {
        display: block;
        overflow: visible;
        border: 0;
        font-size: 16px;
        line-height: 24px;
    }
    body.postid-10260 .elementor-widget-theme-post-content tbody {
        display: block;
    }
    body.postid-10260 .elementor-widget-theme-post-content tr:first-child {
        display: none;
    }
    body.postid-10260 .elementor-widget-theme-post-content tr {
        display: block;
        margin: 0 0 12px 0;
        padding: 12px 16px;
        border: 1px solid #00000020;
        border-radius: 8px;
        background: transparent;
    }
    body.postid-10260 .elementor-widget-theme-post-content td {
        display: flex;
        justify-content: space-between;
        gap: 12px;
        padding: 3px 0;
        border: 0;
        background: transparent;
        text-align: right;
    }
    body.postid-10260 .elementor-widget-theme-post-content td:first-child {
        display: block;
        padding-bottom: 6px;
        font-weight: 600;
        font-size: 18px;
        text-align: left;
    }
    body.postid-10260 .elementor-widget-theme-post-content td::before {
        text-align: left;
        font-weight: 400;
    }
    body.postid-10260 .elementor-widget-theme-post-content td:nth-child(2)::before { content: "CO\2082-Preis Euro/Tonne"; }
    body.postid-10260 .elementor-widget-theme-post-content td:nth-child(3)::before { content: "Benzin (ct/l) netto"; }
    body.postid-10260 .elementor-widget-theme-post-content td:nth-child(4)::before { content: "Diesel (ct/l) netto"; }
    body.postid-10260 .elementor-widget-theme-post-content td:nth-child(5)::before { content: "Heiz\00F6l (ct/l) netto"; }
    body.postid-10260 .elementor-widget-theme-post-content td:nth-child(6)::before { content: "Erdgas (ct/kWh) netto"; }

    /* 8. Referenzen: Branchenkacheln 200 px statt 400 px hoch */
    body.elementor-kit-27 .elementor-element:is(.elementor-element-38fdfed0, .elementor-element-4f9a9af0, .elementor-element-4e83e40d, .elementor-element-4cfb4594, .elementor-element-731bc3cd, .elementor-element-2eaef895, .elementor-element-21c7d271, .elementor-element-3b10dee0) {
        --min-height: 200px;
    }
    /* Branchenseiten: festen Zeilenumbruch im Untertitel am Handy weglassen */
    body .elementor-element-2e7fcfa1 br {
        display: none;
    }

    /* 9. BHKW-Module: Motorbilder 220 px statt 350 px hoch */
    body.elementor-kit-27 .elementor-element:is(.elementor-element-22dd3f82, .elementor-element-3c826d51, .elementor-element-4dc69288, .elementor-element-4ef80a3b, .elementor-element-6b30577) img {
        height: 220px;
    }

    /* 10. Startseite: Partnerbild in voller Breite statt 73 % */
    body.elementor-kit-27 .elementor-element.elementor-element-b4e9c55 img {
        width: 100%;
    }

    /* 11. Zitate: Name unter dem Zitat ebenfalls mittig */
    body .elementor-element:is(.elementor-element-9a92d59, .elementor-element-1fb9496, .elementor-element-d799123) {
        align-self: stretch;
        width: 100%;
    }
    body .elementor-element:is(.elementor-element-9a92d59, .elementor-element-1fb9496, .elementor-element-d799123) .elementor-heading-title {
        text-align: center;
    }

    /* 11b. Karten mit Knopf (Startseite, "Warum Energas", Service/Leistungen): Desktop-Mindesthoehe 540 px
       am Handy aus, Abstand vor dem Knopf ueberall gleich */
    body.elementor-kit-27 .elementor-element:is(.elementor-element-d0d1767, .elementor-element-67266b7, .elementor-element-c755e23, .elementor-element-fc44be9, .elementor-element-b5b7555, .elementor-element-33eda50, .elementor-element-3c730f33, .elementor-element-2f66831, .elementor-element-322a215, .elementor-element-20d4d803, .elementor-element-3306c167, .elementor-element-1efc862) {
        --min-height: 0px;
        --gap: 0px 0px;
        --row-gap: 0px;
    }
    body.elementor-kit-27 .elementor-element:is(.elementor-element-d0d1767, .elementor-element-67266b7, .elementor-element-c755e23, .elementor-element-fc44be9, .elementor-element-b5b7555, .elementor-element-33eda50, .elementor-element-3c730f33, .elementor-element-2f66831, .elementor-element-322a215, .elementor-element-20d4d803, .elementor-element-3306c167, .elementor-element-1efc862) .elementor-element.elementor-widget.elementor-widget-jkit_button {
        margin-top: 28px !important;
    }

    /* 11c. BHKW-Module: Baureihen-Titel etwas kleiner, damit "Jenbacher Baureihe N:" in eine Zeile passt */
    body.elementor-kit-27 .elementor-element:is(.elementor-element-2e56b19e, .elementor-element-3aec5b4c, .elementor-element-3c734516, .elementor-element-40c65caf, .elementor-element-9433246) .elementor-heading-title {
        font-size: 21px;
        line-height: 29px;
    }

    /* 12. Galerien: Abstaende rund um die Galerie wie bisher, sonst rutschen die Pfeile in den Fussbereich */
    body.elementor-kit-27 .e-con:has(.custom-gallery) {
        --padding-block-start: var(--padding-top);
        --padding-block-end: var(--padding-bottom);
        --margin-block-start: var(--margin-top);
        --margin-block-end: var(--margin-bottom);
    }

    /* 12b. Bilder-Slider ("Einblicke"): alle Bilder gleich hoch statt leerer Flaeche ueber Querformaten (Kai 03.11. Punkt 5),
       Pfeile mit Rahmen naeher an den Bildern, darunter Platz bis zum Sektionsende */
    /* ein Bild je Ansicht, buendig mit dem Raster (33 px je Seite). Feste Breite, weil der Slider die Breiten misst,
       bevor die Bilder geladen sind. margin-right 0: Elementor setzt 24 px, die der Slider beim Messen mitzaehlt
       (jeder Schritt war 24 px zu weit, Bilder links angeschnitten); den Abstand von 10 px setzt der Slider selbst */
    body.elementor-kit-27 .elementor-widget-loop-carousel.custom-gallery .swiper-slide.e-loop-item {
        width: calc(100vw - 66px) !important;
        margin-right: 0;
    }
    body .custom-gallery img {
        height: 240px;
        width: 100%;
        max-width: none;
        object-fit: cover;
    }
    body.elementor-kit-27 .e-con .elementor-element.elementor-widget.elementor-widget-loop-carousel.custom-gallery {
        --arrow-prev-top-position: 72px;
        --arrow-next-top-position: 72px;
        margin-bottom: 72px !important;
    }
    body .custom-gallery::after {
        bottom: -72px;
    }

    /* 13. Stellenanzeigen: Zwischenueberschriften im Text groesser als der Fliesstext */
    body .elementor-element-91cdc10 h2 {
        font-size: 21px;
        line-height: 29px;
        margin-top: 24px;
    }

    /* 14. Links im Text immer unterstrichen (am Handy gibt es kein Ueberfahren mit der Maus) */
    body .sg-privacy-text a,
    body .wpcf7 a,
    body .elementor-widget-text-editor p a,
    body .elementor-widget-theme-post-content p a {
        text-decoration: underline;
        text-underline-offset: 2px;
    }

    /* 16. Einheitliches Abstandsraster (Kai 03.11.: "auf allen seiten alle sektionen! innen und aussen abstand! muss gleich sein")
       16a. Hauptsektionen: innen oben und unten 48 px, kein Aussenabstand, keine Mindesthoehe (ausser Kopfbild der Startseite) */
    body.elementor-kit-27 .elementor:not(.elementor-location-header):not(.elementor-location-footer):not([data-elementor-type="loop-item"]):not([data-elementor-type="popup"]) > .e-con:not(.elementor-152 > .elementor-element-58dcd25) {
        --padding-top: 48px;
        --padding-bottom: 48px;
        --margin-top: 0px;
        --margin-bottom: 0px;
        --min-height: 0px;
    }
    /* seitlich bei allen Hauptsektionen 33 px wie der Fussbereich (auch Galerien, damit Ueberschrift und Bilder mit den Karten fluchten) */
    body.elementor-kit-27 .elementor:not(.elementor-location-header):not(.elementor-location-footer):not([data-elementor-type="loop-item"]):not([data-elementor-type="popup"]) > .e-con:not(.elementor-152 > .elementor-element-58dcd25) {
        --container-max-width: 100%;
        --padding-left: 33px;
        --padding-right: 33px;
    }
    /* innere Container ohne eigenen Grund: kein eigener Rand; am Anfang und Ende einer Sektion kein Abstand */
    body.elementor-kit-27 .e-con.e-child:not(.elementor-element-166a5fc0, .elementor-element-1a67acb6, .elementor-element-1aa0e4ca, .elementor-element-1c7b122e, .elementor-element-1efc862, .elementor-element-1f599311, .elementor-element-203ca05a, .elementor-element-209eea23, .elementor-element-20d4d803, .elementor-element-21d33aa6, .elementor-element-22327504, .elementor-element-22390837, .elementor-element-226a1b5d, .elementor-element-25e1de28, .elementor-element-2672daba, .elementor-element-2a6058ad, .elementor-element-2b503b1, .elementor-element-2dfb52f, .elementor-element-2e0b140f, .elementor-element-2e7d26ad, .elementor-element-2eb659a4, .elementor-element-2f66831, .elementor-element-306cde59, .elementor-element-322a215, .elementor-element-3306c167, .elementor-element-336de1fb, .elementor-element-338fc199, .elementor-element-33eda50, .elementor-element-36966cee, .elementor-element-37452965, .elementor-element-38fdfed0, .elementor-element-3c730f33, .elementor-element-3e9a548, .elementor-element-3ebc5640, .elementor-element-3f08d580, .elementor-element-3f379895, .elementor-element-4393deba, .elementor-element-444888a8, .elementor-element-466d7669, .elementor-element-47755820, .elementor-element-48fc587f, .elementor-element-4b118ef6, .elementor-element-4e83e40d, .elementor-element-4f9a9af0, .elementor-element-520d368c, .elementor-element-57c2a937, .elementor-element-590b8256, .elementor-element-590f4be4, .elementor-element-598615d3, .elementor-element-5c635cd1, .elementor-element-5d73711c, .elementor-element-5e7dc6b3, .elementor-element-5ede7e79, .elementor-element-5fb0735c, .elementor-element-638303b1, .elementor-element-651254b4, .elementor-element-67266b7, .elementor-element-6793c1e, .elementor-element-68bb3a2d, .elementor-element-6c1f2b2f, .elementor-element-6d70f32b, .elementor-element-6fc19022, .elementor-element-70c678aa, .elementor-element-7126d857, .elementor-element-7597ca4a, .elementor-element-77d3598a, .elementor-element-788529c9, .elementor-element-788a0277, .elementor-element-7b15901e, .elementor-element-7df0aceb, .elementor-element-7fa94094, .elementor-element-85b4590, .elementor-element-b0d5ce9, .elementor-element-b267f1f3, .elementor-element-b53ffea6, .elementor-element-b5b7555, .elementor-element-b5bf532, .elementor-element-badfde52, .elementor-element-bdaee06, .elementor-element-c5ac68da, .elementor-element-c720a1d, .elementor-element-c755e23, .elementor-element-cc5d80c, .elementor-element-d0d1767, .elementor-element-e6a7827, .elementor-element-eb11536, .elementor-element-fc44be9):not(.elementor-element-2bab957f, .elementor-element-6208d8f3, .elementor-element-c13cf7e, .elementor-element-e352a0b0) {
        --padding-left: 0px;
        --padding-right: 0px;
    }
    /* verschachtelte Boxen nicht nochmals auf 90 % schrumpfen (sonst 16 px zusaetzlicher Rand) */
    body.elementor-kit-27 .elementor .e-con.e-child.e-con-boxed {
        --container-max-width: 100%;
    }
    /* Zaehler-Kacheln: 24 px Abstand dazwischen, 24 px innen wie alle Karten */
    body.elementor-kit-27 .e-con:has(> .e-con-inner > .elementor-widget-jkit_fun_fact, > .elementor-widget-jkit_fun_fact) {
        --gap: 24px 24px;
        --row-gap: 24px;
        --column-gap: 24px;
    }
    body .elementor-widget-jkit_fun_fact .jkit-fun-fact {
        padding: 24px !important;
    }
    body.elementor-kit-27 :is(.e-con-inner, .e-con) > .e-con.e-child:first-child:not(.elementor-element-166a5fc0, .elementor-element-1a67acb6, .elementor-element-1aa0e4ca, .elementor-element-1c7b122e, .elementor-element-1efc862, .elementor-element-1f599311, .elementor-element-203ca05a, .elementor-element-209eea23, .elementor-element-20d4d803, .elementor-element-21d33aa6, .elementor-element-22327504, .elementor-element-22390837, .elementor-element-226a1b5d, .elementor-element-25e1de28, .elementor-element-2672daba, .elementor-element-2a6058ad, .elementor-element-2b503b1, .elementor-element-2dfb52f, .elementor-element-2e0b140f, .elementor-element-2e7d26ad, .elementor-element-2eb659a4, .elementor-element-2f66831, .elementor-element-306cde59, .elementor-element-322a215, .elementor-element-3306c167, .elementor-element-336de1fb, .elementor-element-338fc199, .elementor-element-33eda50, .elementor-element-36966cee, .elementor-element-37452965, .elementor-element-38fdfed0, .elementor-element-3c730f33, .elementor-element-3e9a548, .elementor-element-3ebc5640, .elementor-element-3f08d580, .elementor-element-3f379895, .elementor-element-4393deba, .elementor-element-444888a8, .elementor-element-466d7669, .elementor-element-47755820, .elementor-element-48fc587f, .elementor-element-4b118ef6, .elementor-element-4e83e40d, .elementor-element-4f9a9af0, .elementor-element-520d368c, .elementor-element-57c2a937, .elementor-element-590b8256, .elementor-element-590f4be4, .elementor-element-598615d3, .elementor-element-5c635cd1, .elementor-element-5d73711c, .elementor-element-5e7dc6b3, .elementor-element-5ede7e79, .elementor-element-5fb0735c, .elementor-element-638303b1, .elementor-element-651254b4, .elementor-element-67266b7, .elementor-element-6793c1e, .elementor-element-68bb3a2d, .elementor-element-6c1f2b2f, .elementor-element-6d70f32b, .elementor-element-6fc19022, .elementor-element-70c678aa, .elementor-element-7126d857, .elementor-element-7597ca4a, .elementor-element-77d3598a, .elementor-element-788529c9, .elementor-element-788a0277, .elementor-element-7b15901e, .elementor-element-7df0aceb, .elementor-element-7fa94094, .elementor-element-85b4590, .elementor-element-b0d5ce9, .elementor-element-b267f1f3, .elementor-element-b53ffea6, .elementor-element-b5b7555, .elementor-element-b5bf532, .elementor-element-badfde52, .elementor-element-bdaee06, .elementor-element-c5ac68da, .elementor-element-c720a1d, .elementor-element-c755e23, .elementor-element-cc5d80c, .elementor-element-d0d1767, .elementor-element-e6a7827, .elementor-element-eb11536, .elementor-element-fc44be9):not(.elementor-element-2bab957f, .elementor-element-6208d8f3, .elementor-element-c13cf7e, .elementor-element-e352a0b0) {
        --padding-top: 0px;
        --margin-top: 0px;
    }
    body.elementor-kit-27 :is(.e-con-inner, .e-con) > .e-con.e-child:last-child:not(.elementor-element-166a5fc0, .elementor-element-1a67acb6, .elementor-element-1aa0e4ca, .elementor-element-1c7b122e, .elementor-element-1efc862, .elementor-element-1f599311, .elementor-element-203ca05a, .elementor-element-209eea23, .elementor-element-20d4d803, .elementor-element-21d33aa6, .elementor-element-22327504, .elementor-element-22390837, .elementor-element-226a1b5d, .elementor-element-25e1de28, .elementor-element-2672daba, .elementor-element-2a6058ad, .elementor-element-2b503b1, .elementor-element-2dfb52f, .elementor-element-2e0b140f, .elementor-element-2e7d26ad, .elementor-element-2eb659a4, .elementor-element-2f66831, .elementor-element-306cde59, .elementor-element-322a215, .elementor-element-3306c167, .elementor-element-336de1fb, .elementor-element-338fc199, .elementor-element-33eda50, .elementor-element-36966cee, .elementor-element-37452965, .elementor-element-38fdfed0, .elementor-element-3c730f33, .elementor-element-3e9a548, .elementor-element-3ebc5640, .elementor-element-3f08d580, .elementor-element-3f379895, .elementor-element-4393deba, .elementor-element-444888a8, .elementor-element-466d7669, .elementor-element-47755820, .elementor-element-48fc587f, .elementor-element-4b118ef6, .elementor-element-4e83e40d, .elementor-element-4f9a9af0, .elementor-element-520d368c, .elementor-element-57c2a937, .elementor-element-590b8256, .elementor-element-590f4be4, .elementor-element-598615d3, .elementor-element-5c635cd1, .elementor-element-5d73711c, .elementor-element-5e7dc6b3, .elementor-element-5ede7e79, .elementor-element-5fb0735c, .elementor-element-638303b1, .elementor-element-651254b4, .elementor-element-67266b7, .elementor-element-6793c1e, .elementor-element-68bb3a2d, .elementor-element-6c1f2b2f, .elementor-element-6d70f32b, .elementor-element-6fc19022, .elementor-element-70c678aa, .elementor-element-7126d857, .elementor-element-7597ca4a, .elementor-element-77d3598a, .elementor-element-788529c9, .elementor-element-788a0277, .elementor-element-7b15901e, .elementor-element-7df0aceb, .elementor-element-7fa94094, .elementor-element-85b4590, .elementor-element-b0d5ce9, .elementor-element-b267f1f3, .elementor-element-b53ffea6, .elementor-element-b5b7555, .elementor-element-b5bf532, .elementor-element-badfde52, .elementor-element-bdaee06, .elementor-element-c5ac68da, .elementor-element-c720a1d, .elementor-element-c755e23, .elementor-element-cc5d80c, .elementor-element-d0d1767, .elementor-element-e6a7827, .elementor-element-eb11536, .elementor-element-fc44be9):not(.elementor-element-2bab957f, .elementor-element-6208d8f3, .elementor-element-c13cf7e, .elementor-element-e352a0b0) {
        --padding-bottom: 0px;
        --margin-bottom: 0px;
    }
    /* Bausteine am Anfang und Ende eines Containers ohne Aussenabstand; Abstandshalter am Rand weg, in der Mitte 24 px */
    body.elementor-kit-27 :is(.e-con-inner, .e-con) > .elementor-element.elementor-widget:first-child {
        margin-top: 0 !important;
    }
    body.elementor-kit-27 :is(.e-con-inner, .e-con) > .elementor-element.elementor-widget:last-child {
        margin-bottom: 0 !important;
    }
    /* (ein alleinstehender Abstandshalter gibt einem Bildcontainer die Hoehe und bleibt unberuehrt) */
    body.elementor-kit-27 :is(.e-con-inner, .e-con) > .elementor-widget-spacer:is(:first-child, :last-child):not(:only-child) {
        display: none;
    }
    body.elementor-kit-27 .elementor-widget-spacer:not(:only-child) {
        --spacer-size: 24px;
    }
    /* Ueberschriften-Baustein (JKit) am Anfang oder Ende eines Containers: kein Rand ueber dem Titel,
       leere Beschreibung ohne Leerzeile (sonst 8 px oben bzw. 43 px unten zu viel); zwischen Bausteinen bleibt alles wie es ist */
    body.elementor-kit-27 :is(.e-con-inner, .e-con) > .elementor-widget-jkit_heading:first-child .jkit-heading .heading-title {
        margin-top: 0 !important;
    }
    body.elementor-kit-27 :is(.e-con-inner, .e-con) > .elementor-widget-jkit_heading:last-child .jkit-heading {
        display: flex;
        flex-direction: column;
    }
    body.elementor-kit-27 :is(.e-con-inner, .e-con) > .elementor-widget-jkit_heading:last-child .jkit-heading .heading-section-description:empty {
        display: none;
    }
    body.elementor-kit-27 :is(.e-con-inner, .e-con) > .elementor-widget-jkit_heading:last-child .jkit-heading .heading-section-title:has(+ .heading-section-description:empty) .heading-title,
    body.elementor-kit-27 :is(.e-con-inner, .e-con) > .elementor-widget-jkit_heading:last-child .jkit-heading .heading-section-title:last-child .heading-title {
        margin-bottom: 0 !important;
    }
    /* Ansprechpartner-Suche: Baustein volle Breite, sonst berechnet Chrome die Hoehe bei falscher Breite (rund 1000 px Leerraum) */
    body.elementor-kit-27 .elementor-widget-shortcode:has(.egcf) {
        width: 100%;
    }
    /* Rechtstexte (Impressum, Datenschutz, AGB): Karte 24 px innen wie alle Karten, kein Leerraum nach der letzten */
    body .energas-rechtstext-karte {
        padding: 24px !important;
        margin-bottom: 24px !important;
    }
    body .energas-rechtstext-karte:last-child {
        margin-bottom: 0 !important;
    }
    /* Ansprechpartner-Suche: Spalten 24 px innen, erste Ueberschrift ohne Zusatzabstand */
    body .egcf__col {
        padding: 24px !important;
    }
    body .egcf__col > :first-child,
    body .egcf__col > .egcf__panel:first-child > .egcf-hotline:first-child > :first-child {
        margin-top: 0 !important;
    }
    /* Standorte: Karte und Standortkarten buendig mit dem Raster (33 px), 24 px innen */
    body .energas-map-section {
        padding: 0 !important;
    }
    body .energas-map-platzhalter {
        padding: 0 !important;
    }
    body .energas-map-section__locations {
        grid-template-columns: minmax(0, 1fr) !important;
        margin-top: 24px !important;
    }
    body .energas-location-card {
        padding: 24px !important;
        box-sizing: border-box;
        width: 100%;
        min-width: 0;
    }
    body .energas-map-platzhalter__box {
        padding: 24px !important;
    }
    /* innere Container: Abstand zwischen Bausteinen hoechstens 24 px (z. B. Zahl "02" zu Titel waren 50 px) */
    body.elementor-kit-27 .e-con.e-child {
        row-gap: min(var(--row-gap, 0px), 24px) !important;
    }
    /* Raster: Zeilenvorgabe vom PC (z. B. 3 gleich hohe Zeilen) gilt am Handy nicht, sonst Leerraum unter kurzen Kacheln */
    body.elementor-kit-27 .e-con.e-grid {
        grid-template-rows: none !important;
    }
    /* Groessenstaffel: Fliesstext in Beitraegen, Stellen und Rechtstexten wie ueberall 17 px (vorher 16 bis 18 gemischt) */
    body .elementor-widget-theme-post-content :is(p, li, td, th),
    body .energas-rechtstext :is(p, li) {
        font-size: 17px;
        line-height: 27px;
    }
    /* Icons in Karten 56 statt 86 px, Listenpunkte 20 statt 25 px */
    body .jkit-icon-box .icon-box-header .icon,
    body .jkit-icon-box .icon-box-header .icon img {
        width: 56px !important;
        height: 56px !important;
    }
    body .elementor-icon-list-icon svg {
        width: 20px !important;
        height: 20px !important;
    }
    /* Stellenanzeigen: Ueberschrift "Du willst uns naeher kennenlernen?" beginnt mit zwei Leerzeilen */
    body .elementor-element-391c7f8 .elementor-heading-title > br:first-child,
    body .elementor-element-391c7f8 .elementor-heading-title > br:first-child + br {
        display: none;
    }
    /* letzter Absatz eines Bausteins ohne Abstand nach unten */
    body .elementor-widget:not(.elementor-widget-theme-post-content) :is(p, ul, ol):last-child {
        margin-bottom: 0;
    }
    /* 16b. Aus der Messung erzeugt (generiere.mjs, 2026-11-03) */
    /* Karten: einheitlich 24 px Innenabstand */
    body.elementor-kit-27 .e-con.e-child:is(.elementor-element-166a5fc0, .elementor-element-1a67acb6, .elementor-element-1aa0e4ca, .elementor-element-1c7b122e, .elementor-element-1efc862, .elementor-element-1f599311, .elementor-element-203ca05a, .elementor-element-209eea23, .elementor-element-20d4d803, .elementor-element-21d33aa6, .elementor-element-22327504, .elementor-element-22390837, .elementor-element-226a1b5d, .elementor-element-25e1de28, .elementor-element-2672daba, .elementor-element-2a6058ad, .elementor-element-2b503b1, .elementor-element-2dfb52f, .elementor-element-2e0b140f, .elementor-element-2e7d26ad, .elementor-element-2eb659a4, .elementor-element-2f66831, .elementor-element-306cde59, .elementor-element-322a215, .elementor-element-3306c167, .elementor-element-336de1fb, .elementor-element-338fc199, .elementor-element-33eda50, .elementor-element-36966cee, .elementor-element-37452965, .elementor-element-38fdfed0, .elementor-element-3c730f33, .elementor-element-3e9a548, .elementor-element-3ebc5640, .elementor-element-3f08d580, .elementor-element-3f379895, .elementor-element-4393deba, .elementor-element-444888a8, .elementor-element-466d7669, .elementor-element-47755820, .elementor-element-48fc587f, .elementor-element-4b118ef6, .elementor-element-4e83e40d, .elementor-element-4f9a9af0, .elementor-element-520d368c, .elementor-element-57c2a937, .elementor-element-590b8256, .elementor-element-590f4be4, .elementor-element-598615d3, .elementor-element-5c635cd1, .elementor-element-5d73711c, .elementor-element-5e7dc6b3, .elementor-element-5ede7e79, .elementor-element-5fb0735c, .elementor-element-638303b1, .elementor-element-651254b4, .elementor-element-67266b7, .elementor-element-6793c1e, .elementor-element-68bb3a2d, .elementor-element-6c1f2b2f, .elementor-element-6d70f32b, .elementor-element-6fc19022, .elementor-element-70c678aa, .elementor-element-7126d857, .elementor-element-7597ca4a, .elementor-element-77d3598a, .elementor-element-788529c9, .elementor-element-788a0277, .elementor-element-7b15901e, .elementor-element-7df0aceb, .elementor-element-7fa94094, .elementor-element-85b4590, .elementor-element-b0d5ce9, .elementor-element-b267f1f3, .elementor-element-b53ffea6, .elementor-element-b5b7555, .elementor-element-b5bf532, .elementor-element-badfde52, .elementor-element-bdaee06, .elementor-element-c5ac68da, .elementor-element-c720a1d, .elementor-element-c755e23, .elementor-element-cc5d80c, .elementor-element-d0d1767, .elementor-element-e6a7827, .elementor-element-eb11536, .elementor-element-fc44be9) {
        --padding-top: 24px; --padding-bottom: 24px; --padding-left: 24px; --padding-right: 24px;
        --margin-top: 0px; --margin-bottom: 0px;
    }
    /* Folgesektion mit gleichem Grund wie die vorige: oben kein zweiter Innenabstand */
    body.elementor-kit-27 :is(.elementor-10418 > .elementor-element-2e64cf92, .elementor-10418 > .elementor-element-61de5aec, .elementor-10418 > .elementor-element-6c8ff768, .elementor-10424 > .elementor-element-18649704, .elementor-10424 > .elementor-element-585231ea, .elementor-10429 > .elementor-element-72cc4298, .elementor-10429 > .elementor-element-76ce05b8, .elementor-10435 > .elementor-element-17098c5, .elementor-10435 > .elementor-element-1dabfaa8, .elementor-10435 > .elementor-element-48037681, .elementor-10435 > .elementor-element-59a102fa, .elementor-10440 > .elementor-element-1ab86714, .elementor-10440 > .elementor-element-56aa0da0, .elementor-10440 > .elementor-element-6b3ddbf, .elementor-10445 > .elementor-element-43d9c50, .elementor-10445 > .elementor-element-6121d479, .elementor-10445 > .elementor-element-68949820, .elementor-10453 > .elementor-element-3bb56cd, .elementor-10460 > .elementor-element-117d1fae, .elementor-10460 > .elementor-element-26035d3f, .elementor-10465 > .elementor-element-62111856, .elementor-10471 > .elementor-element-2d83bc1b, .elementor-10471 > .elementor-element-35a7e04c, .elementor-10471 > .elementor-element-4bb2be2, .elementor-10476 > .elementor-element-22d7901, .elementor-10476 > .elementor-element-2d63486e, .elementor-10476 > .elementor-element-491a897c, .elementor-10476 > .elementor-element-5a711c76, .elementor-10476 > .elementor-element-7d29bd5b, .elementor-10481 > .elementor-element-67c8ac8, .elementor-10493 > .elementor-element-cd1676a, .elementor-10507 > .elementor-element-4ebe23a7, .elementor-10507 > .elementor-element-56f7bf08, .elementor-10507 > .elementor-element-5dfffd1b, .elementor-10507 > .elementor-element-61036063, .elementor-10507 > .elementor-element-656402e3, .elementor-10507 > .elementor-element-7c1e2b9a, .elementor-10512 > .elementor-element-2c5fa460, .elementor-10512 > .elementor-element-7b6ccd07, .elementor-10512 > .elementor-element-804a4d7, .elementor-10517 > .elementor-element-26291d99, .elementor-10517 > .elementor-element-5f6510f9, .elementor-10528 > .elementor-element-253dfa15, .elementor-10528 > .elementor-element-519d9222, .elementor-10528 > .elementor-element-63e7ed5d, .elementor-10533 > .elementor-element-5482a0a9, .elementor-10533 > .elementor-element-72f59f6a, .elementor-10533 > .elementor-element-740d5bce, .elementor-10538 > .elementor-element-457e8e11, .elementor-10538 > .elementor-element-ea27f21, .elementor-11251 > .elementor-element-71f31ad, .elementor-11357 > .elementor-element-253dfa15, .elementor-11357 > .elementor-element-519d9222, .elementor-11357 > .elementor-element-63e7ed5d, .elementor-11374 > .elementor-element-acb5f1f, .elementor-11382 > .elementor-element-e07914e, .elementor-12033 > .elementor-element-886b67e, .elementor-12033 > .elementor-element-d5f1e2e, .elementor-12033 > .elementor-element-eccd7c0, .elementor-12574 > .elementor-element-3b6d6d6, .elementor-12599 > .elementor-element-3b6d6d6, .elementor-12600 > .elementor-element-3b6d6d6, .elementor-12601 > .elementor-element-3b6d6d6, .elementor-12602 > .elementor-element-3b6d6d6, .elementor-12603 > .elementor-element-3b6d6d6, .elementor-12604 > .elementor-element-3b6d6d6, .elementor-12605 > .elementor-element-3b6d6d6, .elementor-13124 > .elementor-element-9c0c3d4, .elementor-13157 > .elementor-element-714d630, .elementor-13157 > .elementor-element-a354f17, .elementor-13564 > .elementor-element-a964f295, .elementor-13564 > .elementor-element-bb51a574, .elementor-13564 > .elementor-element-c1f29833, .elementor-13564 > .elementor-element-fa7bbd25, .elementor-152 > .elementor-element-04d6c02, .elementor-152 > .elementor-element-a21c2c7, .elementor-152 > .elementor-element-a37f8ab, .elementor-152 > .elementor-element-aa9907d, .elementor-152 > .elementor-element-f20edcf, .elementor-549 > .elementor-element-03024d4, .elementor-760 > .elementor-element-714d630, .elementor-760 > .elementor-element-a354f17) {
        --padding-top: 0px !important;
    }

    /* 15. Datenschutz: E-Mail-Knopf bleibt in der Karte; bricht er um, wird er kein Oval */
    body .energas-rechtstext a.energas-rechtstext__knopf {
        font-size: 14px;
        padding-left: 14px;
        padding-right: 14px;
        max-width: 100%;
        white-space: normal;
        overflow-wrap: anywhere;
        border-radius: 16px;
        text-align: center;
    }
}

/* Einwilligung in allen Formularen als eckiges Kaestchen mit Haken (Kai 03.11.: "ja bitte eckig"), PC und Handy */
body .sg-privacy input[type="checkbox"] {
    border-radius: 3px !important;
}
body .sg-privacy input[type="checkbox"]:checked {
    background: #111 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px 14px no-repeat !important;
    box-shadow: none !important;
}
/* END Handy-Optimierung */