/* MHL-SH-TYPOGRAPHY-RESPONSIVE-V5
   Nur für Aktivitäten, Sehenswürdigkeiten und Leuchttürme.
*/

/* Bannertext: verfügbare Breite nutzen, keine Trennung innerhalb von Wörtern. */
html body.scene-sh.mhl-attractions-logo-size-fix
main#content.site-main.shell > .page-header
.page-header__copy > p:not(.eyebrow) {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: left !important;
    hyphens: none !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
}

/* Planerbeschreibung: nicht künstlich auf eine schmale Textspalte begrenzen. */
html body.scene-sh.mhl-attractions-logo-size-fix
.attractions-toolbar__intro > p:not(.eyebrow) {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: left !important;
    hyphens: none !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
}

/* Auf breiten Bildschirmen eine Zeile bevorzugen. */
@media (min-width: 1100px) {
    html body.scene-sh.mhl-attractions-logo-size-fix
    main#content.site-main.shell > .page-header
    .page-header__copy > p:not(.eyebrow) {
        white-space: nowrap !important;
        font-size: clamp(.75rem, .85vw, .9rem) !important;
    }

    html body.scene-sh.mhl-attractions-logo-size-fix
    .attractions-toolbar__intro > p:not(.eyebrow) {
        white-space: nowrap !important;
        font-size: clamp(.75rem, .85vw, .9rem) !important;
    }

    html body.scene-sh.mhl-attractions-logo-size-fix
    .mhl-sh-editorial-layout__lead-copy > p:last-child {
        white-space: nowrap !important;
        font-size: clamp(.75rem, .82vw, .88rem) !important;
    }
}

/* Die Themenkarten behalten gleichmäßige Textkanten und kompakte Beschreibungen. */
html body.scene-sh.mhl-attractions-logo-size-fix
.mhl-sh-editorial-layout__card {
    min-width: 0 !important;
    box-sizing: border-box !important;
}

html body.scene-sh.mhl-attractions-logo-size-fix
.mhl-sh-editorial-layout__card .eyebrow {
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: left !important;
}

html body.scene-sh.mhl-attractions-logo-size-fix
.mhl-sh-editorial-layout__card h3 {
    min-width: 0 !important;
    text-align: left !important;
    text-wrap: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
}

html body.scene-sh.mhl-attractions-logo-size-fix
.mhl-sh-editorial-layout__card > p:last-child {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
    font-size: clamp(.65rem, .68vw, .78rem) !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    text-align: left !important;
}

/* Untere Infokarten: kurze Beschreibungen auf derselben Grundlinie halten. */
html body.scene-sh.mhl-attractions-logo-size-fix
.mhl-sh-editorial-layout__note {
    min-width: 0 !important;
    box-sizing: border-box !important;
}

html body.scene-sh.mhl-attractions-logo-size-fix
.mhl-sh-editorial-layout__note h3,
html body.scene-sh.mhl-attractions-logo-size-fix
.mhl-sh-editorial-layout__note p {
    text-align: left !important;
    hyphens: none !important;
    word-break: normal !important;
}

html body.scene-sh.mhl-attractions-logo-size-fix
.mhl-sh-editorial-layout__note p {
    font-size: clamp(.7rem, .75vw, .82rem) !important;
    line-height: 1.4 !important;
    white-space: nowrap !important;
}

/* Bei kleineren Geräten keine Worttrennung erzwingen; Umbrüche erfolgen
   nur zwischen Wörtern. Die Karten sind dann schmaler oder untereinander. */
@media (max-width: 1099px) {
    html body.scene-sh.mhl-attractions-logo-size-fix
    main#content.site-main.shell > .page-header
    .page-header__copy > p:not(.eyebrow),
    html body.scene-sh.mhl-attractions-logo-size-fix
    .attractions-toolbar__intro > p:not(.eyebrow),
    html body.scene-sh.mhl-attractions-logo-size-fix
    .mhl-sh-editorial-layout__lead-copy > p:last-child {
        white-space: normal !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: none !important;
    }

    html body.scene-sh.mhl-attractions-logo-size-fix
    .mhl-sh-editorial-layout__note p {
        white-space: normal !important;
    }
}

/* Kleine Karten: kompakte Typografie, keine Trennung mitten im Wort. */
@media (max-width: 600px) {
    html body.scene-sh.mhl-attractions-logo-size-fix
    .mhl-sh-editorial-layout__card h3 {
        font-size: .95rem !important;
    }

    html body.scene-sh.mhl-attractions-logo-size-fix
    .mhl-sh-editorial-layout__card > p:last-child {
        font-size: .75rem !important;
        line-height: 1.4 !important;
        white-space: normal !important;
    }
}