/*
 * Zentrale Website-Typografie
 * ---------------------------
 * Diese Datei wird ABSICHTLICH als letzter CSS-Layer geladen.
 * Damit haben die Schriftgrössen aus den ERP-Einstellungen Vorrang vor
 * shop.css, brand.css und den Rich-Text-Styles.
 *
 * Instanzneutral: keine Farben, Namen oder firmenspezifischen Werte.
 */

html,
body {
    font-size: var(--site-font-base);
}

/* Hauptüberschriften – auch dort, wo Theme-/Shop-CSS spezifischere Selektoren nutzt */
h1,
.hero h1,
.page-head h1,
.product-info h1,
.account-card h1,
.site-page h1,
.site-page-content h1,
.article-rich-content h1 {
    font-size: var(--site-font-h1);
}

h2,
.account-card h2,
.site-page-content h2,
.article-rich-content h2 {
    font-size: var(--site-font-h2);
}

h3,
.product-body h3,
.site-page-content h3,
.article-rich-content h3 {
    font-size: var(--site-font-h3);
}

/* Für H4 existiert aktuell keine eigene Einstellung.
   H4 wird proportional aus H3 abgeleitet und skaliert daher trotzdem zentral mit. */
.site-page-content h4,
.article-rich-content h4 {
    font-size: calc(var(--site-font-h3) * .81);
}

/* Navigation */
.site-header nav,
.site-header nav a {
    font-size: var(--site-font-nav);
}

/* Formularfelder / Buttons */
input,
select,
textarea,
button,
.btn {
    font-size: var(--site-font-control);
}

/* Footer – eine zentrale Footer-Grösse für alle Footer-Texte */
.site-footer,
.site-footer a,
.site-footer strong,
.site-footer div,
.footer-company strong,
.footer-company div,
.footer-claim,
.footer-links,
.footer-links a,
.footer-email {
    font-size: var(--site-font-footer);
}

/*
 * Sekundäre Texte skalieren mit der Grundschrift.
 * Damit verschwinden die bisherigen festen px-Werte, ohne zusätzliche
 * Einstellfelder zu benötigen.
 */
.lead {
    font-size: calc(var(--site-font-base) * 1.25);
}

.lead.compact,
.site-page-content {
    font-size: var(--site-font-base);
}

.price {
    font-size: calc(var(--site-font-base) * 1.875);
}

.cart-total {
    font-size: calc(var(--site-font-base) * 1.1875);
}

.summary-total {
    font-size: calc(var(--site-font-base) * 1.125);
}

.account-links {
    font-size: calc(var(--site-font-base) * .875);
}

.eyebrow,
.category,
.add-cart span,
.checkout-form label span,
.account-form label span,
.nav nav span {
    font-size: calc(var(--site-font-base) * .75);
}

.availability,
.checkout-consent {
    font-size: calc(var(--site-font-base) * .8125);
}

/* rein visuelle Elemente bleiben proportional zur Grundschrift */
.image-placeholder {
    font-size: calc(var(--site-font-base) * 3.375);
}

.success-icon {
    font-size: calc(var(--site-font-base) * 2);
}

/*
 * Wichtig:
 * Keine mobilen px-Overrides für H1/H2/H3 mehr.
 * Die in den Einstellungen gewählten Werte gelten deshalb auf Desktop
 * und Mobile konsistent. Das responsive Layout selbst bleibt unverändert.
 */