/* =========================================================
   GLOBAL FLEET & TRADE – EINHEITLICHE TYPOGRAFIE /PAGES/
   Wird bewusst als letzte CSS-Datei geladen.
========================================================= */

:root {
    --pages-font-body: "Segoe UI", Arial, sans-serif;
    --pages-font-heading: Georgia, "Times New Roman", serif;
    --pages-text-size: 16px;
    --pages-text-line: 1.7;
    --pages-h1-size: clamp(30px, 3.1vw, 42px);
    --pages-h1-line: 1.16;
    --pages-h1-spacing: .075em;
    --pages-h2-size: clamp(25px, 2.25vw, 32px);
    --pages-h2-line: 1.22;
    --pages-h2-spacing: .025em;
    --pages-h3-size: clamp(19px, 1.55vw, 22px);
    --pages-h3-line: 1.3;
    --pages-h3-spacing: .015em;
}

body,
.page-shell,
.spiel-page {
    font-family: var(--pages-font-body);
    font-size: var(--pages-text-size);
    line-height: var(--pages-text-line);
}

/* Hauptüberschrift auf jeder öffentlichen Seite */
.page-shell h1,
.spiel-page h1,
.box-head h1,
.faq-head h1,
.headline-with-icons h1 {
    font-family: var(--pages-font-heading) !important;
    font-size: var(--pages-h1-size) !important;
    font-weight: 400 !important;
    line-height: var(--pages-h1-line) !important;
    letter-spacing: var(--pages-h1-spacing) !important;
    overflow-wrap: anywhere;
}

/* Einheitliche Überschriften-Hierarchie innerhalb der Inhalte */
.page-shell h2,
.spiel-page h2,
.news-modal-content h2 {
    font-family: var(--pages-font-heading) !important;
    font-size: var(--pages-h2-size) !important;
    font-weight: 400 !important;
    line-height: var(--pages-h2-line) !important;
    letter-spacing: var(--pages-h2-spacing) !important;
    overflow-wrap: anywhere;
}

.page-shell h3,
.spiel-page h3 {
    font-family: var(--pages-font-heading) !important;
    font-size: var(--pages-h3-size) !important;
    line-height: var(--pages-h3-line) !important;
    letter-spacing: var(--pages-h3-spacing) !important;
    overflow-wrap: anywhere;
}

/* Fließtext: überall gleiche Grundgröße und ruhiger Zeilenabstand */
.box-head > p,
.faq-head > p,
.privacy-content p,
.legal-content p,
.contact-page p,
.news-page p,
.changelog-page p,
.faq-content p,
.faq-status-note p,
.faq-contact-box p:not(.faq-section-kicker),
.spiel-page section p:not(.spiel-kicker),
.news-modal-content .news-modal-text,
.news-modal-content .changelog-modal-text,
.news-modal-content p,
.changelog-modal-list li {
    font-family: var(--pages-font-body) !important;
    font-size: var(--pages-text-size) !important;
    line-height: var(--pages-text-line) !important;
    letter-spacing: 0 !important;
}

/* FAQ-Fragen sind Überschriften, Antworten bleiben Fließtext */
.faq-item summary {
    font-family: var(--pages-font-heading) !important;
    font-size: clamp(18px, 1.45vw, 20px) !important;
    line-height: 1.42 !important;
    letter-spacing: .01em !important;
}

.faq-answer p,
.faq-step-list p,
.faq-section-head > p:last-child {
    font-size: var(--pages-text-size) !important;
    line-height: var(--pages-text-line) !important;
    letter-spacing: 0 !important;
}

/* Unterzeilen/Kicker bleiben bewusst kleiner, aber seitenübergreifend gleich */
.box-subline strong,
.faq-section-kicker,
.spiel-kicker,
.news-label,
.contact-success-kicker {
    font-family: var(--pages-font-body) !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
    letter-spacing: .16em !important;
}

/* Lange deutsche und englische Titel dürfen responsiv sauber umbrechen */
.headline-with-icons,
.box-head,
.spiel-hero-content,
.spiel-section-head {
    min-width: 0;
}

.headline-with-icons h1,
.spiel-page h1,
.page-shell h2,
.spiel-page h2,
.page-shell h3,
.spiel-page h3 {
    min-width: 0;
    max-width: 100%;
    white-space: normal !important;
    word-break: normal !important;
    hyphens: auto;
}

@media (max-width: 700px) {
    :root {
        --pages-text-size: 15px;
        --pages-text-line: 1.68;
        --pages-h1-size: clamp(27px, 8vw, 34px);
        --pages-h1-line: 1.18;
        --pages-h1-spacing: .055em;
        --pages-h2-size: clamp(23px, 6.8vw, 28px);
        --pages-h2-line: 1.24;
        --pages-h3-size: clamp(18px, 5.4vw, 21px);
    }

    .headline-with-icons {
        gap: 10px;
    }

    .headline-icon {
        width: 24px;
        height: 24px;
        flex-basis: 24px;
    }

    .box-subline strong,
    .faq-section-kicker,
    .spiel-kicker,
    .news-label,
    .contact-success-kicker {
        font-size: 11px !important;
        letter-spacing: .14em !important;
    }

    .faq-item summary {
        font-size: 17px !important;
        line-height: 1.45 !important;
    }
}

@media (max-width: 390px) {
    :root {
        --pages-h1-size: clamp(25px, 7.6vw, 30px);
        --pages-h1-spacing: .04em;
    }

    .headline-with-icons {
        gap: 7px;
    }

    .headline-icon {
        width: 20px;
        height: 20px;
        flex-basis: 20px;
    }
}