/* ============================================================
   MHL RESPONSIVE FINAL – TYPOGRAPHY ONLY
   ------------------------------------------------------------
   Keine Änderung an Fullscreen.
   Keine Änderung an Planner-JS.
   Keine Änderung am Datenbestand.

   Ziel:
     - H1 auf allen Desktopbreiten begrenzen
     - Sehenswürdigkeiten/Leuchttürme nicht übergroß
     - Planner-Heading stabil
     - Logbuchtext innerhalb der Buchseite halten
     - kleinere Schriftgröße darf nicht zu Überlauf führen
   ============================================================ */


/* ============================================================
   1. GLOBALE SEITENÜBERSCHRIFTEN
   ============================================================ */

main h1,
.page-content h1,
.hero h1,
.hero-title,
.page-title {
    font-size: clamp(
        2rem,
        1.55rem + 1.35vw,
        3.35rem
    ) !important;

    line-height: 1.04 !important;

    letter-spacing: -0.025em !important;

    max-width: 100% !important;

    overflow-wrap: anywhere !important;

    word-break: normal !important;

    hyphens: auto !important;
}


/* Große Attractions-Überschrift ausdrücklich begrenzen. */
[data-attractions-page] h1,
.attractions-page h1,
.attractions-hero h1,
main[data-page="attractions"] h1 {
    font-size: clamp(
        2rem,
        1.55rem + 1.15vw,
        3.05rem
    ) !important;

    line-height: 1.05 !important;

    max-width: min(
        100%,
        1050px
    ) !important;
}


/* ============================================================
   2. SH-PLANER
   ============================================================ */

[data-attractions-planner] h2,
[data-attractions-planner] .planner-title,
[data-attractions-planner] .planner__title {
    font-size: clamp(
        1.35rem,
        1.08rem + .72vw,
        2rem
    ) !important;

    line-height: 1.12 !important;

    max-width: 100% !important;

    overflow-wrap: anywhere !important;

    word-break: normal !important;
}


[data-attractions-planner] p,
[data-attractions-planner] label,
[data-attractions-planner] input,
[data-attractions-planner] select,
[data-attractions-planner] button {
    line-height: 1.35 !important;
}


/* ============================================================
   3. DESKTOP 1400+
   ============================================================ */

@media (min-width: 1400px) {

    main h1,
    .page-content h1,
    .hero h1,
    .hero-title,
    .page-title {
        font-size: clamp(
            2.25rem,
            1.7rem + .85vw,
            3.2rem
        ) !important;
    }

    [data-attractions-page] h1,
    .attractions-page h1,
    .attractions-hero h1,
    main[data-page="attractions"] h1 {
        font-size: clamp(
            2.25rem,
            1.75rem + .8vw,
            3.05rem
        ) !important;
    }
}


/* ============================================================
   4. TABLET
   ============================================================ */

@media (max-width: 1100px) {

    main h1,
    .page-content h1,
    .hero h1,
    .hero-title,
    .page-title,
    [data-attractions-page] h1,
    .attractions-page h1,
    .attractions-hero h1,
    main[data-page="attractions"] h1 {
        font-size: clamp(
            1.85rem,
            1.45rem + .95vw,
            2.65rem
        ) !important;

        line-height: 1.06 !important;
    }

    [data-attractions-planner] h2,
    [data-attractions-planner] .planner-title,
    [data-attractions-planner] .planner__title {
        font-size: clamp(
            1.25rem,
            1.05rem + .7vw,
            1.75rem
        ) !important;
    }
}


/* ============================================================
   5. MOBILE
   ============================================================ */

@media (max-width: 700px) {

    main h1,
    .page-content h1,
    .hero h1,
    .hero-title,
    .page-title,
    [data-attractions-page] h1,
    .attractions-page h1,
    .attractions-hero h1,
    main[data-page="attractions"] h1 {
        font-size: clamp(
            1.65rem,
            1.25rem + 2.1vw,
            2.1rem
        ) !important;

        line-height: 1.08 !important;

        letter-spacing: -0.018em !important;
    }

    [data-attractions-planner] h2,
    [data-attractions-planner] .planner-title,
    [data-attractions-planner] .planner__title {
        font-size: clamp(
            1.18rem,
            1rem + 1.4vw,
            1.55rem
        ) !important;

        line-height: 1.12 !important;
    }
}


/* ============================================================
   6. SEITENTEXT NICHT MEHR GLOBAL ZU GROSS
   ============================================================ */

[data-attractions-planner] .planner-description,
[data-attractions-planner] .planner__description,
[data-attractions-planner] .planner-copy,
[data-attractions-planner] > p {
    max-width: 720px !important;

    line-height: 1.55 !important;

    overflow-wrap: anywhere !important;
}


/* ============================================================
   7. LOGBUCH – GEOMETRIE STABILISIEREN
   ------------------------------------------------------------
   Wir verwenden mehrere bekannte/übliche Containerbezeichner,
   ohne die eigentliche Buchansicht umzubauen.
   ============================================================ */

[data-logbuch],
.logbuch-page,
.logbuch,
.logbuch-shell,
.logbuch-book,
.logbuch-openbook,
.openbook,
.openbook-book {
    box-sizing: border-box !important;
}


/* Buch selbst darf nicht durch Textinhalt wachsen. */
[data-logbuch] .book,
.logbuch-book,
.logbuch-openbook,
.openbook-book {
    min-width: 0 !important;
    max-width: 100% !important;

    overflow: hidden !important;
}


/* ============================================================
   8. LOGBUCH – TEXT CONTAINER
   ============================================================ */

[data-logbuch] .entry,
[data-logbuch] .entry-text,
[data-logbuch] .logbuch-entry,
[data-logbuch] .logbuch-text,
[data-logbuch] .book-text,
[data-logbuch] .article-text,

.logbuch-entry,
.logbuch-text,
.logbuch-entry__text,
.openbook-text,
.book-text,
.book-page-text {
    box-sizing: border-box !important;

    max-width: 100% !important;

    min-width: 0 !important;

    overflow-wrap: anywhere !important;

    word-break: normal !important;

    hyphens: auto !important;

    white-space: normal !important;

    text-overflow: clip !important;

    overflow: visible !important;
}


/* ============================================================
   9. LOGBUCH – TYPOGRAFIE
   ============================================================ */

[data-logbuch] .entry-text,
[data-logbuch] .logbuch-text,
[data-logbuch] .book-text,
.logbuch-text,
.logbuch-entry__text,
.openbook-text,
.book-text,
.book-page-text {

    font-size: clamp(
        .86rem,
        .80rem + .18vw,
        1.03rem
    ) !important;

    line-height: 1.48 !important;

    letter-spacing: .005em !important;

    margin-block-start: 0 !important;

    margin-block-end: .8rem !important;
}


/* Kleine Bildschirme */
@media (max-width: 900px) {

    [data-logbuch] .entry-text,
    [data-logbuch] .logbuch-text,
    [data-logbuch] .book-text,
    .logbuch-text,
    .logbuch-entry__text,
    .openbook-text,
    .book-text,
    .book-page-text {
        font-size: clamp(
            .78rem,
            .73rem + .32vw,
            .94rem
        ) !important;

        line-height: 1.45 !important;
    }
}


@media (max-width: 600px) {

    [data-logbuch] .entry-text,
    [data-logbuch] .logbuch-text,
    [data-logbuch] .book-text,
    .logbuch-text,
    .logbuch-entry__text,
    .openbook-text,
    .book-text,
    .book-page-text {
        font-size: clamp(
            .72rem,
            .66rem + .42vw,
            .86rem
        ) !important;

        line-height: 1.42 !important;

        letter-spacing: 0 !important;
    }
}


/* ============================================================
   10. LOGBUCH – ÜBERSCHRIFTEN NICHT ÜBERLAUFEN LASSEN
   ============================================================ */

[data-logbuch] h1,
[data-logbuch] h2,
[data-logbuch] h3,
.logbuch h1,
.logbuch h2,
.logbuch h3,
.logbuch-entry h1,
.logbuch-entry h2,
.logbuch-entry h3 {

    max-width: 100% !important;

    overflow-wrap: anywhere !important;

    word-break: normal !important;

    hyphens: auto !important;
}


[data-logbuch] h1,
.logbuch h1 {
    font-size: clamp(
        1.45rem,
        1.15rem + .72vw,
        2.1rem
    ) !important;

    line-height: 1.08 !important;
}


[data-logbuch] h2,
.logbuch h2 {
    font-size: clamp(
        1.08rem,
        .94rem + .42vw,
        1.45rem
    ) !important;

    line-height: 1.15 !important;
}


/* ============================================================
   11. LOGBUCH – Absätze / Listen
   ============================================================ */

[data-logbuch] p,
[data-logbuch] li,
.logbuch p,
.logbuch li,
.logbuch-entry p,
.logbuch-entry li {

    max-width: 100% !important;

    overflow-wrap: anywhere !important;

    word-break: normal !important;

    white-space: normal !important;

    line-height: 1.48 !important;
}


/* ============================================================
   12. LOGBUCH – NICHT ÜBER DIE BUCHSEITE HINAUS
   ============================================================ */

[data-logbuch] .page,
[data-logbuch] .book-page,
[data-logbuch] .left-page,
[data-logbuch] .right-page,
.logbuch-page,
.logbuch-book-page,
.book-page {

    min-width: 0 !important;

    max-width: 100% !important;

    overflow: hidden !important;
}


/* ============================================================
   13. USER-SCHRIFTGRÖSSE:
       LOGBUCH DARF NICHT DURCH ROOT-16PX-LOCK VERZERRT WERDEN
   ============================================================ */

[data-logbuch] {
    font-size: 16px !important;
}

[data-logbuch] .entry-text,
[data-logbuch] .logbuch-text,
[data-logbuch] .book-text,
.logbuch-text,
.logbuch-entry__text,
.openbook-text,
.book-text,
.book-page-text {
    /*
     * Größe wird lokal geregelt.
     * Der globale Root-Lock wirkt damit nicht auf die
     * Geometrie des Buches.
     */
    font-size: clamp(
        .78rem,
        .72rem + .22vw,
        1rem
    ) !important;
}


/* ============================================================
   14. SEITENBREITE / BUCHTEXT AUF TABLET
   ============================================================ */

@media (max-width: 900px) {

    [data-logbuch] .page,
    [data-logbuch] .book-page,
    [data-logbuch] .left-page,
    [data-logbuch] .right-page,
    .logbuch-page,
    .logbuch-book-page,
    .book-page {

        padding-inline: clamp(
            .65rem,
            2.2vw,
            1.25rem
        ) !important;
    }
}


/* ============================================================
   15. MOBILE – BUCHTEXT NOCH ETWAS KOMPAKTER
   ============================================================ */

@media (max-width: 600px) {

    [data-logbuch] .page,
    [data-logbuch] .book-page,
    [data-logbuch] .left-page,
    [data-logbuch] .right-page,
    .logbuch-page,
    .logbuch-book-page,
    .book-page {

        padding-inline: .55rem !important;

        padding-block: .45rem !important;
    }
}


/* ============================================================
   16. KEINE GLOBALEN TRANSFORMS AUF TEXT
   ============================================================ */

[data-attractions-page] h1,
.attractions-page h1,
.attractions-hero h1,
[data-logbuch] h1,
[data-logbuch] h2,
[data-logbuch] h3,
[data-logbuch] p,
[data-logbuch] .entry-text,
[data-logbuch] .logbuch-text {
    transform: none !important;
}


/* ============================================================
   17. LOGBUCH NICHT CLIPPEN DURCH ELLIPSIS-REGELN
   ============================================================ */

[data-logbuch] p,
[data-logbuch] li,
[data-logbuch] .entry-text,
[data-logbuch] .logbuch-text,
[data-logbuch] .book-text,
.logbuch p,
.logbuch li,
.logbuch-text,
.book-page-text {
    text-overflow: clip !important;
}