/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

/* ===== Accordion "Beratungsleistung" – Aufhuebschung (TWD 2026-06-17) ===== */
html body .elementor-widget-n-accordion .e-n-accordion{display:flex;flex-direction:column;gap:6px}
html body .elementor-widget-n-accordion .e-n-accordion-item{
    border:1px solid #e4e8ee !important;
    border-radius:8px !important;
    overflow:hidden;
    background:#fff;
    transition:box-shadow .2s ease,border-color .2s ease;
}
html body .elementor-widget-n-accordion .e-n-accordion-item:hover{border-color:#cfdbe8 !important}
html body .elementor-widget-n-accordion .e-n-accordion-item[open]{
    border-color:#003863 !important;
    box-shadow:0 2px 10px rgba(0,56,99,.08);
}
/* Rechtsgebiet-Titel */
html body .elementor-widget-n-accordion .e-n-accordion-item .e-n-accordion-item-title{
    padding:15px 18px !important;
    font-size:17px !important;
    font-weight:600 !important;
    color:#003863 !important;
    cursor:pointer;
    transition:background .18s ease;
    list-style:none;
}
html body .elementor-widget-n-accordion .e-n-accordion-item .e-n-accordion-item-title:hover{background:#f3f8fc !important}
html body .elementor-widget-n-accordion .e-n-accordion-item[open] > .e-n-accordion-item-title{background:#f3f8fc !important}
/* Inhalts-Bereich */
html body .elementor-widget-n-accordion .e-n-accordion-item-title + .e-con{padding:6px 18px 16px !important}
html body .elementor-widget-n-accordion .e-n-accordion-item .elementor-icon-list-items{border:0 !important;box-shadow:none !important;margin:0 !important;padding:0 !important}
/* Innere Pfeil-Liste */
html body .elementor-widget-n-accordion .e-n-accordion-item .elementor-icon-list-item{
    padding:9px 4px !important;
    border-bottom:1px solid #eef1f5 !important;
    align-items:flex-start !important;
    transition:background .15s ease,padding-left .15s ease;
}
html body .elementor-widget-n-accordion .e-n-accordion-item .elementor-icon-list-item:last-child{border-bottom:0 !important}
html body .elementor-widget-n-accordion .e-n-accordion-item .elementor-icon-list-item:hover{background:#f7fafc !important;padding-left:10px !important}
html body .elementor-widget-n-accordion .e-n-accordion-item .elementor-icon-list-icon{margin-top:3px !important}
html body .elementor-widget-n-accordion .e-n-accordion-item .elementor-icon-list-icon svg{fill:#003863 !important;width:13px !important;height:13px !important}
html body .elementor-widget-n-accordion .e-n-accordion-item .elementor-icon-list-text{line-height:1.5 !important;color:#2b2f36 !important;font-size:15px !important}
html body .elementor-widget-n-accordion .e-n-accordion-item .elementor-icon-list-item:hover .elementor-icon-list-text{color:#003863 !important}

/* ===== Fusszeile: Safari-Klickbarkeit + immer sichtbar (TWD 2026-06-30) ===== */
/* Fix D: Footer ueber die Canvas-Kacheln heben (Kacheln z-index 5, Grid 50000,
   Lade-Intro 99999, Bild-Modal 999999). 60000 = ueber Canvas, unter Intro/Modal.
   Ohne expliziten z-index kippt das Stacking in Safari/WebKit -> Impressum/Datenschutz tot.
   Selektor bewusst nur ueber .e-con-full (keine ID, kein .elementor-element) = update-robust. */
body footer.e-con-full{ z-index:60000 !important; }

/* Fix B: Fusszeile (mit Impressum/Datenschutz) auch auf Smartphones einblenden - rechtlich Pflicht.
   Elementor versteckt den ganzen Footer per .elementor-hidden-mobile (display:none, OHNE !important).
   Der Footer enthaelt live verifiziert NUR die echten DE-Rechtslinks (Datenschutz/Impressum),
   keinen Demo-Muell -> reines Einblenden genuegt. */
@media (max-width:767px){
    body footer.e-con-full.elementor-hidden-mobile{ display:flex !important; }
}

/* ===== iPad/Touch: Hover-Effekte killen (Freeze-Fix) - TWD 2026-06-30 ===== */
/* iOS laesst :hover beim Wischen an jeder ueberstrichenen Kachel kleben -> scale(1.2)- und
   opacity-Crossfade-Transitions stapeln sich -> Compositor-Ueberlauf -> Einfrieren nach 2-3s.
   Auf Touch komplett neutralisieren. (hover:none)/(pointer:coarse) trifft ALLE Touch-Geraete
   unabhaengig von der Breite - anders als der bisherige max-width:768-Breakpoint, durch den
   das iPad (>=768px CSS-Breite, auch Hochformat) durchfiel. Hover-Bildtausch ist auf Touch eh nutzlos. */
@media (hover: none), (pointer: coarse) {
    .infinite-canvas-tile:hover { transform: none !important; z-index: auto !important; }
    .infinite-canvas-tile:hover .tile-image { transform: none !important; }
    .infinite-canvas-tile:hover .tile-image.square { opacity: 1 !important; }
    .infinite-canvas-tile:hover .tile-image.wide { opacity: 0 !important; }
}

/* ===== Unterseiten-Footer Versicherungsrecht (Beitrag 1691): nicht fixiert + deckend ===== */
/* Footer-Container war Elementor-"Position: Fixed" (bottom:0) + eigener Hintergrund transparent
   -> schwebte durchsichtig ueber dem Inhalt (man konnte durchschauen). position:static holt ihn
   in den normalen Fluss ans Inhaltsende (wie bei Engagement); der weisse Eltern-Container traegt
   dann den Hintergrund -> deckend. Live verifiziert: Footer landet am docHeight-Ende, opak. */
.elementor-1691 .elementor-element.elementor-element-3f4c0b7 {
    position: static !important;
}

/* ===== Deutsches Forum fuer Erbrecht (Post 1323): Kachel ohne Text + Portfolio-Logo voll sichtbar - TWD 2026-06-30 ===== */
/* 1a: Startseiten-Kachel ist ein Logo -> Overlay-Text (Kategorie "News" + Titel) ausblenden.
   Nur diese eine Kachel (data-post-id 1323); alle anderen Kacheln behalten ihren Text.
   Live verifiziert: Forum-Overlay display:none, andere Kacheln unveraendert. */
.infinite-canvas-tile[data-post-id="1323"] .tile-overlay { display: none !important; }

/* 1b: Im Portfolio (weiterfuehrende Beitraege) wird das Querformat-Logo per object-fit:cover
   quadratisch beschnitten (links/rechts fehlt). contain zeigt es komplett (weisse Letterbox).
   Scope ueber die Elementor-Post-Klasse .post-1323 -> nur das Forum-Item, ueberall wo es im Portfolio erscheint. */
.post-1323 .elementor-portfolio-item__img img {
    object-fit: contain !important;
    background-color: #fff !important;
}

/* ===== #1 Kategorie-Badges auf den Startseiten-Kacheln blau hinterlegen (wie im Portfolio) - TWD 2026-06-30 ===== */
/* Marken-Blau #003863 (das auch die Portfolio-Kategorien nutzen), weisse Schrift = "blau hinterlegt".
   Forum-Kachel 1323 hat kein Overlay -> nicht betroffen. Optik ohne Chrome nicht final abgeglichen -> ggf. feinjustieren. */
.infinite-canvas-tile .tile-category {
    display: flex !important;               /* block-level Flex -> Titel bricht GARANTIERT darunter um (nicht daneben) */
    width: fit-content !important;          /* Badge nur so breit wie der Text = kompaktes Pill, nicht volle Overlay-Breite */
    align-items: center !important;         /* Text vertikal mittig */
    background-color: #003863 !important;
    color: #ffffff !important;
    font-size: 8px !important;              /* Kundenwunsch: Kaestchen klein (Theme war 15px; ueberschreibt bewusst auch mobile 12px) */
    letter-spacing: .3px !important;        /* enger -> kompakter (war 1px) */
    padding: 2px 5px !important;            /* Kundenwunsch (war 3px 8px) */
    border-radius: 3px !important;
    font-weight: 500 !important;            /* Kundenwunsch (war 600) */
    line-height: 1.4 !important;
    margin-bottom: -1px !important;         /* Kundenwunsch: Badge dicht an den Titel (leicht negativ; Theme-margin war 5px) */
}

/* ===== #3 Forum-Logo (Post 1323): duenner heller Rahmen, damit das weisse Logo nicht mit dem weissen Hintergrund verschwimmt ===== */
/* Kundenwunsch 1px #ccc. Gilt fuer Startseiten-Kachel UND Portfolio-Item (beide weiss-auf-weiss). */
.infinite-canvas-tile[data-post-id="1323"] .tile-image,
.post-1323 .elementor-portfolio-item__img img {
    border: 1px solid #cccccc !important;
    box-sizing: border-box !important;
}

/* ===== NEON Advanced Slider ("Weitere Team-Mitglieder"): Pfeil-Icons unsichtbar (width:0) - TWD 2026-07-01 ===== */
/* Live gemessen: SVG-Pfeil-Icon rendert mit Breite 0px, obwohl die Widget-eigene CSS eine feste width
   vorschreibt (Desktop 24/30px je Template, Mobile 20px). Ursache: Das SVG ist als Flex-Kind default
   flex-shrink:1 (anders als der Button drumherum, der schon flex-shrink:0 hat) - der Flex-Layout-Algorithmus
   quetscht es auf 0, sobald der Container knapp wird; die Hoehe bleibt (Row-Flex betrifft nur die Breite).
   WICHTIG: Das Problem ist BREITENUNABHAENGIG - /natalie-hentschel/ war auch am Desktop (1267px) betroffen,
   /mario-viehweger/ nur am Handy. Darum GLOBAL (keine Media-Query) und NUR flex-shrink:0 - die Breite bleibt
   Sache der Widget-eigenen Regeln (nicht ueberschrieben, so bleiben Template-spezifische Groessen erhalten).
   Widget wird als Theme-Builder-Baustein auf vielen Team-Unterseiten geteilt genutzt -> ein Fix wirkt ueberall. */
.nas-arrow svg { flex-shrink: 0 !important; }

/* ===== Footer EINHEITLICH auf ALLEN Seiten (Startseite + alle Unterseiten) - TWD 2026-07-01 ===== */
/* Problem: Die Footer sind auf verschiedenen Seiten UNTERSCHIEDLICH gebaut (Startseite aus geteilter Vorlage =
   flex-row; die 15 Content-Seiten je eigener Footer = mal row, mal column, Menue mal links/rechts/mittig;
   dazu ZWEI Credit-HTML-Varianten). Gemeinsamer Nenner: JEDER Footer hat das Credit-Widget mit der Klasse
   .elementor-element-twdcredit1, und das Footer-Menue (.elementor-widget-nav-menu) ist dessen direktes
   Geschwister. Wir greifen den gemeinsamen Eltern-Container per :has(> credit) und erzwingen ein IDENTISCHES
   Layout - unabhaengig von DOM-Reihenfolge (via order) und Ausgangs-Struktur:
     Desktop (>=768px): Werbung LINKS (20px), Footer-Menue RECHTS, eine Zeile.
     Mobil   (<=767px): Footer-Menue OBEN mittig, Werbung klein DARUNTER mittig.
   Live per Injektion auf Startseite (row/Variante A) UND arbeitsrecht (column/Variante B) verifiziert - Desktop
   und (per 375px-Simulation) Mobil jeweils korrekt. Der absolute "Go to Top"-Button ist out-of-flow -> order/
   flex beruehren ihn nicht. :has() ist in allen aktuellen Browsern unterstuetzt (2026). */
.elementor-element:has(> .elementor-element-twdcredit1) {
    display: flex !important;
    align-items: center !important;
}
.elementor-element-twdcredit1 a { margin: 0 !important; }
.elementor-element-twdcredit1 p { margin: 0 !important; text-align: inherit !important; }

@media (min-width: 768px) {
    .elementor-element:has(> .elementor-element-twdcredit1) {
        flex-direction: row !important;
        justify-content: space-between !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    .elementor-element:has(> .elementor-element-twdcredit1) > .elementor-element-twdcredit1 {
        order: 1 !important;
        text-align: left !important;
    }
    .elementor-element:has(> .elementor-element-twdcredit1) > .elementor-widget-nav-menu {
        order: 2 !important;
    }
}

@media (max-width: 767px) {
    .elementor-element:has(> .elementor-element-twdcredit1) {
        flex-direction: column !important;
        justify-content: center !important;
        row-gap: 3px !important;
    }
    .elementor-element:has(> .elementor-element-twdcredit1) > .elementor-widget-nav-menu {
        order: 1 !important;
    }
    .elementor-element:has(> .elementor-element-twdcredit1) > .elementor-element-twdcredit1 {
        order: 2 !important;
        text-align: center !important;
    }
    /* Footer-Menue-Links auf Mobil mittig */
    .elementor-element:has(> .elementor-element-twdcredit1) > .elementor-widget-nav-menu .elementor-nav-menu,
    .elementor-element:has(> .elementor-element-twdcredit1) > .elementor-widget-nav-menu ul {
        justify-content: center !important;
    }
}