/* fec-sub-hero.css — Unterseiten-Header im Look der Redesign-Home (2026-08-14).
   Gehört zum Template page-template-unterseite-2026.php (.fec-sub-hero liegt
   direkt in #main-content, VOR dem Divi-Content — wie der alte .head-container).
   Design-Referenz: Home-Hero (fec-custom.css .fec-hero) — Navy mit radialen
   Cyan-Verläufen, Rubik-Eyebrow, Avenir-Black-H1 (uppercase) mit Fraunces-
   Italic-Akzent (<em>), Rubik-Subline. Bewusst OHNE overflow:hidden und ohne
   @import (Fraunces kommt als eigenes Stylesheet über functions.php).
   Fonts: Avenir-Black + Rubik lokal aus style.css. */

.fec-sub-hero {
    position: relative;
    color: #ffffff;
    background:
        radial-gradient(60% 80% at 75% 30%, rgba(60, 163, 221, 0.32) 0%, rgba(60, 163, 221, 0) 65%),
        radial-gradient(70% 80% at 0% 50%, rgba(20, 30, 80, 0.55) 0%, rgba(20, 30, 80, 0) 65%),
        #283582;
    background-repeat: no-repeat;
    padding: 216px 0 96px;
    border-radius: 0 0 100px 100px;
}

.fec-sub-hero-inner {
    max-width: 1200px;
    width: 92%;
    margin: 0 auto;
}

/* Eyebrow — wie Home (Rubik caps, weiß) */
.fec-sub-hero-eyebrow {
    font-family: 'Rubik', 'Helvetica Neue', Arial, sans-serif;
    font-weight: 600;
    font-size: 12px;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    line-height: 1.4;
    color: #ffffff;
    margin: 0 0 20px;
    padding: 0;
}

/* H1 — Avenir-Black uppercase wie Home-Hero; <em> = Fraunces italic Cyan */
h1.fec-sub-hero-h1 {
    font-family: 'Avenir-Black', 'Avenir', 'Avenir Next', 'Helvetica Neue', Arial, sans-serif;
    font-weight: 900;
    text-transform: uppercase;
    color: #ffffff;
    font-size: clamp(40px, 4.6vw, 64px);
    line-height: 1.06;
    letter-spacing: -0.01em;
    margin: 0;
    padding: 0;
    font-feature-settings: normal;
    font-variation-settings: normal;
}
h1.fec-sub-hero-h1 em {
    font-family: 'Fraunces', Georgia, 'Times New Roman', serif;
    font-style: italic;
    font-weight: 400;
    color: #3ca3dd;
}

/* Subline — Rubik, gedecktes Weiß, begrenzte Zeilenlänge */
.fec-sub-hero-sub {
    font-family: 'Rubik', 'Helvetica Neue', Arial, sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.92);
    max-width: 640px;
    margin: 22px 0 0;
    padding: 0;
}

@media (max-width: 980px) {
    .fec-sub-hero {
        padding: 150px 0 64px;
        border-radius: 0 0 36px 36px;
    }
    h1.fec-sub-hero-h1 {
        font-size: clamp(32px, 9vw, 48px);
    }
    .fec-sub-hero-sub {
        font-size: 17px;
    }
}

/* Archive: Intro-Absatz unter dem Hero (ersetzt altes Welcome-h2/h4,
   Text-Spec von Stefanie, Mails 11.+13.08.) */
.fec-archive-welcome {
    font-family: 'Rubik', 'Helvetica Neue', Arial, sans-serif;
    font-size: 18px;
    line-height: 1.6;
    color: #444444;
    max-width: 760px;
    margin: 0 auto 28px;
}

/* Alt-Design-Überlappung neutralisieren: das alte Template zog den weißen
   Artikel per margin-top:-50px + elliptischer Top-Rundung ÜBER den Foto-Header
   (style.css .page-template-page-template-unterseite article). Unter dem neuen
   Hero beginnt der Inhalt bündig — sonst Doppel-Kurve/Navy-Keile an den Ecken.
   Bottom-Rundungen (Footer-Übergang) bleiben unberührt. */
body.page-template-page-template-unterseite-2026-php #main-content article {
    margin-top: 0 !important;
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}