/* MHL-SH-PLANNER-CARD-COPY-V6
   Korrigiert die zuletzt hinzugefügten Regeln.
   Die ursprünglichen Schriftgrößen bleiben erhalten.
*/

/* Kartenüberschriften: ursprüngliche Größe aus dem Editorial-Layout. */
html body.scene-sh.mhl-attractions-logo-size-fix
.mhl-sh-editorial-layout__card h3 {
    font-size: 1.03rem !important;
    line-height: 1.25 !important;
    letter-spacing: normal !important;
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}

/* Kartenbeschreibungen: ursprüngliche Größe aus dem Editorial-Layout. */
html body.scene-sh.mhl-attractions-logo-size-fix
.mhl-sh-editorial-layout__card > p:last-child {
    font-size: .91rem !important;
    line-height: 1.55 !important;
    letter-spacing: normal !important;
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    text-align: left !important;
}

/* Gleichmäßige Textkante innerhalb der Karten. */
html body.scene-sh.mhl-attractions-logo-size-fix
.mhl-sh-editorial-layout__card {
    box-sizing: border-box !important;
    min-width: 0 !important;
}

html body.scene-sh.mhl-attractions-logo-size-fix
.mhl-sh-editorial-layout__card .eyebrow,
html body.scene-sh.mhl-attractions-logo-size-fix
.mhl-sh-editorial-layout__card h3,
html body.scene-sh.mhl-attractions-logo-size-fix
.mhl-sh-editorial-layout__card > p:last-child {
    text-align: left !important;
}

/* Seitentitel: ursprüngliche responsive Größen der vorhandenen
   mhl-attractions-heading-responsive-v2.css wieder aufnehmen. */
html body.mhl-attractions-logo-size-fix
main#content.site-main.shell > .page-header h1 {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;

    font-size: clamp(2rem, 3vw, 3.3rem) !important;
    line-height: 1.08 !important;
    letter-spacing: normal !important;

    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
}

/* Einzeiligen Seitentitel auf breiten Displays bevorzugen,
   ohne die Schriftgröße zu reduzieren. */
@media (min-width: 1400px) {
    html body.mhl-attractions-logo-size-fix
    main#content.site-main.shell > .page-header h1 {
        white-space: nowrap !important;
    }
}

/* Tablet: ursprüngliche responsive Größe, Umbruch nur an Wortgrenzen. */
@media screen and (min-width: 768px) and (max-width: 1100px) {
    html body.mhl-attractions-logo-size-fix
    main#content.site-main.shell > .page-header h1 {
        font-size: clamp(1.9rem, 3.4vw, 2.65rem) !important;
        white-space: normal !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: none !important;
    }
}

/* Smartphone: ursprüngliche responsive Größe, keine Worttrennung. */
@media screen and (max-width: 767px) {
    html body.mhl-attractions-logo-size-fix
    main#content.site-main.shell > .page-header h1 {
        font-size: clamp(1.65rem, 6vw, 2.3rem) !important;
        line-height: 1.12 !important;
        letter-spacing: -.02em !important;
        white-space: normal !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: none !important;
    }
}

@media screen and (max-width: 380px) {
    html body.mhl-attractions-logo-size-fix
    main#content.site-main.shell > .page-header h1 {
        font-size: 1.6rem !important;
    }
}

/* Auf schmalen Smartphones dürfen Kartenbeschreibungen zwischen Wörtern
   umbrechen. Die Schriftgröße wird dabei nicht verändert. */
@media (max-width: 380px) {
    html body.scene-sh.mhl-attractions-logo-size-fix
    .mhl-sh-editorial-layout__card > p:last-child,
    html body.scene-sh.mhl-attractions-logo-size-fix
    .mhl-sh-editorial-layout__card h3 {
        white-space: normal !important;
    }
}
