/* =========================================
   HEADLINE WIDGETS
   RULE 019: Must be on container and element
   Änderungsprotokoll: 2026-06-06 | parent-agent | @skill-css-rules, @skill-change-provenance | Headline-Schriftgroessen dezent verkleinert
   ========================================= */

.base-headline-h1,
.base-headline-h2,
.base-headline-h3,
.base-headline-hero-h1-title,
.base-headline-section-h2-title,
.base-headline-tile-h3-title,
.base-headline-cta-h2-title {
    font-family: var(--font-family-primary);
    color: var(--color-headline);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
    font-synthesis: none;
}

.base-headline-h1 {
    font-size: clamp(1.5625rem, 3.5vw + 0.65rem, var(--font-size-4xl));
    font-weight: var(--font-weight-extrabold);
    line-height: 1.08;
    letter-spacing: -0.035em;
    margin-bottom: 1.5rem;
    max-width: 100%;
    text-wrap: balance;
}

.base-headline-h2 {
    font-size: clamp(1.25rem, 2.2vw + 0.45rem, var(--font-size-3xl));
    font-weight: var(--font-weight-bold);
    line-height: 1.12;
    letter-spacing: -0.03em;
    margin-bottom: 1.25rem;
    max-width: 100%;
    text-wrap: balance;
}

.base-headline-h3 {
    font-size: clamp(1rem, 1.35vw + 0.45rem, var(--font-size-xl));
    font-weight: var(--font-weight-semibold);
    line-height: 1.2;
    letter-spacing: -0.02em;
    margin-bottom: 0.875rem;
    max-width: 100%;
    text-wrap: balance;
}

.base-headline-h4 {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    margin-bottom: 0.5rem;
    color: var(--color-headline);
}

@media (min-width: 600px) {
    .base-headline-h1 {
        font-size: clamp(1.75rem, 2.2vw + 0.875rem, var(--font-size-5xl));
        letter-spacing: -0.04em;
        line-height: 1.05;
    }

    .base-headline-h2 {
        letter-spacing: -0.035em;
        line-height: 1.1;
    }

    .base-headline-h3 {
        letter-spacing: -0.025em;
        line-height: 1.18;
    }
}

/* Hero-H1: Container + Titel (RULE 019: beide Klassen am Markup setzen) */
/* Änderungsprotokoll: 2026-06-06 | parent-agent | @skill-css-rules, @skill-change-provenance | Hero-H1 Akzentlinie unter der Hauptueberschrift */
/* Änderungsprotokoll: 2026-06-16 | parent-agent | @skill-css-rules, @skill-change-provenance | Hero-H1 nutzt volle Spaltenbreite (width 100%) */
.base-headline-hero-h1 {
    margin-bottom: 1.75rem;
    width: 100%;
    max-width: 100%;
}

.base-headline-hero-h1::after {
    content: "";
    display: block;
    width: 5rem;
    height: 0.25rem;
    margin: 1rem 0 0;
    border-radius: 999px;
    background-color: var(--color-primary);
}

/* Änderungsprotokoll: 2026-06-06 | parent-agent | @skill-css-rules, @skill-change-provenance | Hero-H1 Schriftgroesse dezent verkleinert */
/* Änderungsprotokoll: 2026-06-16 | parent-agent | @skill-css-rules, @skill-change-provenance | Hero-H1 kleiner und einzeilig (nowrap) */
.base-headline-hero-h1-title {
    font-size: clamp(1.125rem, 3.2vw + 0.35rem, 3.25rem);
    font-weight: var(--font-weight-extrabold);
    line-height: 1.04;
    letter-spacing: -0.048em;
    margin: 0;
    width: 100%;
    max-width: 100%;
    white-space: nowrap;
    hyphens: none;
    word-break: normal;
    color: var(--color-headline);
}

@media (min-width: 600px) {
    .base-headline-hero-h1-title {
        font-size: clamp(1.875rem, 3.1vw + 0.65rem, 3.5rem);
        letter-spacing: -0.052em;
        line-height: 1.02;
    }

    .base-headline-hero-h1::after {
        width: 6rem;
        margin-top: 1.125rem;
    }
}

@media (min-width: 1024px) {
    .base-headline-hero-h1-title {
        font-size: clamp(2.125rem, 1.75vw + 1rem, 3.75rem);
        letter-spacing: -0.058em;
        line-height: 1;
    }

    .base-headline-hero-h1::after {
        width: 7rem;
        margin: 1.25rem 0 0;
    }
}

/* Section-H2: praesente Abschnittsueberschriften (z. B. Home Features) */
/* Änderungsprotokoll: 2026-06-06 | parent-agent | @skill-css-rules, @skill-change-provenance | Section-H2 Akzentlinie und staerkere Typografie */
.base-headline-section-h2 {
    margin-bottom: 1.5rem;
    max-width: 100%;
}

/* Änderungsprotokoll: 2026-06-06 | parent-agent | @skill-css-rules, @skill-change-provenance | Section-H2-Akzentlinie links unter der Ueberschrift */
.base-section-header .base-headline-section-h2::after {
    content: "";
    display: block;
    width: 4.5rem;
    height: 0.2rem;
    margin: 1.125rem 0 0;
    border-radius: 999px;
    background-color: var(--color-primary);
}

/* Änderungsprotokoll: 2026-06-06 | parent-agent | @skill-css-rules, @skill-change-provenance | Section-H2 Schriftgroesse dezent verkleinert */
.base-headline-section-h2-title {
    font-size: clamp(1.5625rem, 3.1vw + 0.45rem, 2.5rem);
    font-weight: var(--font-weight-extrabold);
    line-height: 1.06;
    letter-spacing: -0.04em;
    margin: 0;
    max-width: 100%;
    text-wrap: balance;
}

@media (min-width: 600px) {
    .base-headline-section-h2-title {
        font-size: clamp(1.875rem, 2.15vw + 0.775rem, 2.625rem);
        letter-spacing: -0.045em;
        line-height: 1.04;
    }

    .base-section-header .base-headline-section-h2::after {
        width: 5.5rem;
        margin-top: 1.25rem;
    }
}

@media (min-width: 1024px) {
    .base-headline-section-h2-title {
        line-height: 1.02;
        letter-spacing: -0.05em;
    }
}

/* Tile-H3: hochwertige Kachel-Ueberschriften (z. B. Home Features) */
.base-headline-tile-h3 {
    margin-bottom: 0;
    max-width: 100%;
    min-width: 0;
    flex: 1;
}

/* Änderungsprotokoll: 2026-06-06 | parent-agent | @skill-css-rules, @skill-change-provenance | Tile-H3 Schriftgroesse dezent verkleinert */
.base-headline-tile-h3-title {
    font-size: clamp(1rem, 1.2vw + 0.625rem, var(--font-size-xl));
    font-weight: var(--font-weight-bold);
    line-height: 1.18;
    letter-spacing: -0.025em;
    margin: 0;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (min-width: 1024px) {
    .base-headline-tile-h3-title {
        letter-spacing: -0.03em;
        line-height: 1.15;
    }
}

/* CTA-H2: hochwertige Call-to-Action-Ueberschriften (z. B. Home CTA) */
/* Änderungsprotokoll: 2026-06-06 | parent-agent | @skill-css-rules, @skill-change-provenance | CTA-H2 Schriftgroesse dezent verkleinert */
.base-headline-cta-h2 {
    margin-bottom: 1.25rem;
    max-width: 100%;
}

.base-headline-cta-h2-title {
    font-size: clamp(1.5625rem, 2.65vw + 0.45rem, 2.625rem);
    font-weight: var(--font-weight-extrabold);
    line-height: 1.06;
    letter-spacing: -0.04em;
    margin: 0;
    max-width: 100%;
    text-wrap: balance;
}

@media (min-width: 600px) {
    .base-headline-cta-h2-title {
        font-size: clamp(1.875rem, 1.85vw + 0.875rem, 2.875rem);
        letter-spacing: -0.045em;
        line-height: 1.04;
    }
}

@media (min-width: 1024px) {
    .base-headline-cta-h2-title {
        font-size: clamp(2rem, 1.45vw + 1.125rem, 3.125rem);
        letter-spacing: -0.05em;
        line-height: 1.02;
    }
}