/* ==========================================================================
   KE Dual Header Widget
   ========================================================================== */

.ke-dual-header {
    display: block;
}

.ke-dual-header-link {
    text-decoration: none;
    color: inherit;
}

.ke-dual-header-link:hover {
    text-decoration: none;
}

.ke-dual-header-text {
    margin: 0;
    padding: 0;
}

/* Inline Layout (v0.28.10): natürlicher Inline-Textfluss.
   Spans als display:inline → bei mehrzeiligem ersten Text fließt der zweite Text
   direkt nach dem ersten weiter (statt auf eine neue Flex-Line zu springen).
   text-align (vom Wrapper geerbt) zentriert alle Lines konsistent. */
.ke-dual-header--inline .ke-dual-header-text {
    display: block;
}

.ke-dual-header--inline .ke-dual-header-first,
.ke-dual-header--inline .ke-dual-header-second {
    display: inline;
    /* Hintergrund + Padding pro Line statt einmalig über die ganze Span —
       relevant für „Highlighter"-Effekte mit gesetztem Background/Padding. */
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}

/* Block Layout: erzwungener Umbruch zwischen den Teilen */
.ke-dual-header--block .ke-dual-header-text {
    display: block;
}

.ke-dual-header--block .ke-dual-header-first,
.ke-dual-header--block .ke-dual-header-second {
    display: block;
}

/* Gradient Text */
.ke-dual-header .ke-gradient-text {
    display: inline-block;
}

/* Separator (Text-only seit v0.28.9): inline für natürlichen Textfluss zusammen
   mit den first/second-Spans — separator_spacing setzt margin-left/right. */
.ke-dual-header-separator {
    display: inline;
}

/* Responsive: Separator bei schmalen Viewports verstecken — wirkt visuell
   meist störend, wenn der Inhalt sowieso umbricht. */
@media (max-width: 767px) {
    .ke-dual-header-separator {
        display: none;
    }
}