/*
=================================
--- HEADLINE MODULE --- 
=================================
*/

.ks-block-headline {
    padding: var(--ks-spacing-xs) var(--ks-spacing-sm);
    text-align: center;
    background-color: var(--ks-color-white);
}

/* H1 Headlines */
.ks-block-headline__content h1 {
    color: var(--ks-color-text-primary);
    font-size: clamp(1.5rem, 5vw, 5rem);
    font-weight: var(--ks-font-weight-bold);
    margin: 0;
    line-height: var(--ks-line-height-tight);

    /* Word-break rules - only between words, never within */
    white-space: normal;
    word-break: normal;
    overflow-wrap: normal;
    hyphens: none;
    -webkit-hyphens: none;

    /* Overflow protection */
    max-width: 100%;
    overflow: visible;
}

/* H2 Headlines - Standardized: Left aligned, full text-width */
.ks-block-headline__content {
    display: block;
    width: 100%;
    max-width: var(--ks-text-max-width);
    margin: 0 auto;
    text-align: left;
    padding-left: var(--ks-spacing-sm);
    padding-right: var(--ks-spacing-sm);
}

.ks-block-headline__content h2 {
    font-size: clamp(1rem, 4vw, 2.5rem);
    /* Standard margins */
    margin: 50px auto 20px auto;
    width: 100%;
    text-align: left;
    border-bottom: 2px solid var(--ks-color-secondary);
    padding-bottom: 10px;
    padding-left: 0;
    padding-right: 0;

    /* Word-break rules - only between words, never within */
    white-space: normal;
    word-break: normal;
    overflow-wrap: normal;
    hyphens: none;
    -webkit-hyphens: none;

    /* Overflow protection */
    max-width: 100%;
    overflow: visible;
}

/* Responsive Breakpoints */
@media (max-width: 1024px) {
    .ks-block-headline__content h1 {
        font-size: clamp(1.3rem, 4vw, 4rem);
    }

    .ks-block-headline__content h2 {
        font-size: clamp(1rem, 3vw, 2rem);
    }
}

@media (max-width: 768px) {
    .ks-block-headline__content h1 {
        font-size: clamp(1.2rem, 4vw, 3rem);
    }

    .ks-block-headline__content h2 {
        font-size: clamp(1.2rem, 3vw, 1.8rem);
    }
}

@media (max-width: 380px) {
    .ks-block-headline__content h1 {
        font-size: clamp(1rem, 3vw, 2rem);
    }

    .ks-block-headline__content h2 {
        font-size: clamp(1.0rem, 2.5vw, 1.5rem);
    }
}

@media (max-width: 200px) {
    .ks-block-headline__content h1 {
        font-size: clamp(10px, 2.5vw, 14px);
    }

    .ks-block-headline__content h2 {
        font-size: clamp(8px, 2vw, 10px);
    }
}

/* 
=================================
--- CONTEXTUAL OVERRIDES --- 
=================================
Styles moved from pages.css to maintain encapsulation.
*/

/* Home Page */
.page-home .ks-block-headline__content h1 {
    word-break: normal;
    overflow-wrap: normal;
    hyphens: none;
}

@media (max-width: 768px) {
    .page-home .ks-block-headline__content h1 {
        padding-top: var(--ks-spacing-md) !important;
        font-size: 2.5rem !important;
        word-break: normal;
        overflow-wrap: normal;
        hyphens: none;
    }

    .page-home .ks-block-headline__content h2 {
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    .page-home .ks-block-headline__content {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* Kontakt Page */
.page-kontakt .ks-block-headline__content h1 {
    word-break: normal;
    overflow-wrap: normal;
    hyphens: none;
    margin-top: 90px;
    color: var(--ks-color-white) !important;
}

.page-kontakt .ks-block-headline {
    background: transparent !important;
}

/* 
=================================
--- HERO OVERLAY MODE --- 
=================================
Used on Offer Pages (Intuitiver Spaziergang, etc.)
These styles turn the standard headline into an overlay on top of the hero image.
*/

.page-intuitiverspaziergang main>.ks-block-headline:first-of-type,
.page-paarberatung main>.ks-block-headline:first-of-type,
.page-powercoaching main>.ks-block-headline:first-of-type,
.page-persoenliches-coaching main>.ks-block-headline:first-of-type,
.page-visionaerefuehrung main>.ks-block-headline:first-of-type,
.page-gruppensupervision main>.ks-block-headline:first-of-type,
.page-situativegruppensupervision main>.ks-block-headline:first-of-type {
    grid-column: 1;
    grid-row: 1;
    z-index: 10;

    /* Centering */
    align-self: center;
    justify-self: center;
    width: 100%;

    /* Clean overrides */
    margin-top: 0 !important;
    height: auto !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    pointer-events: none;
}

/* Ensure pure text overlay style */
.page-intuitiverspaziergang .ks-block-headline__content,
.page-paarberatung .ks-block-headline__content,
.page-powercoaching .ks-block-headline__content,
.page-persoenliches-coaching .ks-block-headline__content,
.page-visionaerefuehrung .ks-block-headline__content,
.page-gruppensupervision .ks-block-headline__content,
.page-situativegruppensupervision .ks-block-headline__content {
    text-align: center !important;
    width: 100% !important;
    padding: 0 !important;
    background: transparent !important;
}

/* White Text & Shadow */
.page-intuitiverspaziergang .ks-block-headline__content h1,
.page-paarberatung .ks-block-headline__content h1,
.page-powercoaching .ks-block-headline__content h1,
.page-persoenliches-coaching .ks-block-headline__content h1,
.page-visionaerefuehrung .ks-block-headline__content h1,
.page-gruppensupervision .ks-block-headline__content h1,
.page-situativegruppensupervision .ks-block-headline__content h1 {
    color: var(--ks-color-white) !important;
    text-shadow: 0 2px 15px rgba(0, 0, 0, 0.8) !important;
    margin: 0 !important;
    pointer-events: auto !important;
}

/* Hide empty subheadlines */
.page-intuitiverspaziergang .ks-block-headline .hero-subheadline,
.page-paarberatung .ks-block-headline .hero-subheadline,
.page-powercoaching .ks-block-headline .hero-subheadline,
.page-persoenliches-coaching .ks-block-headline .hero-subheadline,
.page-visionaerefuehrung .ks-block-headline .hero-subheadline,
.page-gruppensupervision .ks-block-headline .hero-subheadline,
.page-situativegruppensupervision .ks-block-headline .hero-subheadline {
    display: none !important;
}