/*
 * Die Schriftstufen der Lernplattform.
 *
 * Zweck: Fuer jede Textsorte genau eine Stelle. Wer hier eine
 * Zeile aendert, aendert die Textsorte ueberall, wo sie steht.
 *
 * Der Grund fuer diese Datei ist gemessen und nicht vermutet. Am
 * 2026-09-04 standen in den einundzwanzig Stylesheets der
 * Plattform 63 verschiedene Schriftgroessen, 17 Zeilenabstaende
 * und 22 Sperrungen. Keiner dieser Werte war falsch; falsch war,
 * dass es sie so oft gab. Eine Groesse an 263 Stellen laesst
 * sich nicht aendern, sie laesst sich nur nachziehen, und beim
 * Nachziehen bleibt jedes Mal eine Stelle uebrig.
 *
 * Regel wie in farben.css: keine Schriftgroesse mehr direkt in
 * eine Regel schreiben, immer ueber die Variablen mit dem
 * Vorsatz mx-. Ein Sonderwert, der sich nicht auf eine Stufe
 * abbilden laesst, ist ein Hinweis auf eine fehlende Stufe und
 * nicht auf einen Sonderfall.
 */

/* ============================================================
   MITWACHSEN STATT UMSCHALTEN

   Jede Groesse steht als clamp(klein, waechst, gross) und nicht
   als fester Wert mit einem Medienabfrage-Sprung darunter.

   Der Unterschied ist am Telefon zu sehen. Ein fester Wert mit
   einer Grenze bei 600 Pixeln springt: Bis 601 Pixel ist die
   Ueberschrift gross, bei 600 ploetzlich klein, und zwischen
   Tablet und Telefon liegt nichts. Ein clamp waechst dazwischen
   stetig mit der Fensterbreite und bleibt oben wie unten
   begrenzt -- klein genug, dass am Telefon nichts umbricht,
   gross genug, dass am grossen Bildschirm nichts verloren
   wirkt.

   Gelesen wird der mittlere Wert so: 1.3vw + 18px heisst
   achtzehn Pixel Sockel und dazu 1,3 Prozent der Fensterbreite.
   Der Sockel in Pixeln ist Absicht und keine Bequemlichkeit:
   Eine Groesse aus reinem vw waechst nicht mehr mit, wenn
   jemand im Browser die Schrift vergroessert, und wer das tut,
   braucht es.
   ============================================================ */

:root {

    /* Der eine Regler fuer alles. 1 ist der heutige Stand. 1.1
       macht jede Textsorte um ein Zehntel groesser, ohne dass
       die Verhaeltnisse zwischen ihnen sich verschieben. Fuer
       eine einzelne Textsorte wird stattdessen ihre eigene
       Zeile unten geaendert. */
    --mx-schrift-faktor: 1;

    /* --- titel-gross: der Titel einer Seite, einmal je Seite --
       Heute 34 Pixel am Bildschirm und 28 unter 600 Pixeln
       Fensterbreite. Der clamp trifft beide Enden und fuellt
       den Weg dazwischen. */
    --mx-titel-gross-groesse: calc(clamp(26px, 1.6vw + 20px, 34px) * var(--mx-schrift-faktor));
    --mx-titel-gross-zeile: 1.2;
    --mx-titel-gross-gewicht: 700;
    --mx-titel-gross-sperrung: normal;

    /* --- titel: der Kopf eines Bereichs mitten auf der Seite -- */
    --mx-titel-groesse: calc(clamp(23px, 1.3vw + 18px, 28px) * var(--mx-schrift-faktor));
    --mx-titel-zeile: 1.2;
    --mx-titel-gewicht: 700;
    --mx-titel-sperrung: normal;

    /* --- titel-klein: Kartentitel und Unteransichten --------- */
    --mx-titel-klein-groesse: calc(clamp(20px, 1vw + 16px, 24px) * var(--mx-schrift-faktor));
    --mx-titel-klein-zeile: 1.25;
    --mx-titel-klein-gewicht: 700;
    --mx-titel-klein-sperrung: normal;

    /* --- marke: die gesperrte Versalzeile ueber dem Titel -----
       Werte der Homepage, uebernommen am 2026-08-30: vierzehn
       Pixel, halbfett, 0.29em Sperrung. Sie waechst weniger
       mit als der Titel; eine gesperrte Versalzeile wird schon
       bei kleinen Zuwaechsen zu breit fuer ihre Zeile. */
    --mx-marke-groesse: calc(clamp(12px, 0.4vw + 10.5px, 14px) * var(--mx-schrift-faktor));
    --mx-marke-zeile: 1.3;
    --mx-marke-gewicht: 600;
    --mx-marke-sperrung: 0.29em;

    /* --- einleitung: der ruhige Absatz unter einem Kopf ------
       Groesse und Zeilenabstand des Fliesstextes, bewusst als
       eigene Stufe: Er wird ueberflogen und nicht gelesen, und
       sobald in P67 ueber den Fliesstext entschieden ist, soll
       er sich getrennt davon einstellen lassen. Heute stehen in
       beiden Zeilen dieselben Werte; das ist kein Versehen. */
    --mx-einleitung-groesse: calc(clamp(17px, 0.25vw + 16px, 18px) * var(--mx-schrift-faktor));
    --mx-einleitung-zeile: 1.65;
    --mx-einleitung-gewicht: 400;
    --mx-einleitung-sperrung: normal;

    /* --- fliess: der Fliesstext ------------------------------
       Heute 18 Pixel bei Zeilenabstand 1.65, unter 640 Pixeln
       17. Die Werte stammen aus dem Theme und bleiben zunaechst
       so. Ob der Fliesstext groesser werden soll, entscheidet
       Alex in P67; dann aendert sich genau diese eine Zeile. */
    --mx-fliess-groesse: calc(clamp(17px, 0.25vw + 16px, 18px) * var(--mx-schrift-faktor));
    --mx-fliess-zeile: 1.65;
    --mx-fliess-gewicht: 400;
    --mx-fliess-sperrung: normal;

    /* --- klein: Nebentext, Hinweise, Beschriftung an Knoepfen  */
    --mx-klein-groesse: calc(clamp(13px, 0.3vw + 12px, 15px) * var(--mx-schrift-faktor));
    --mx-klein-zeile: 1.45;
    --mx-klein-gewicht: 400;
    --mx-klein-sperrung: normal;

    /* --- winzig: Kennzeichen und Marken an Kacheln ----------- */
    --mx-winzig-groesse: calc(clamp(11px, 0.2vw + 10.3px, 12px) * var(--mx-schrift-faktor));
    --mx-winzig-zeile: 1.4;
    --mx-winzig-gewicht: 600;
    --mx-winzig-sperrung: 0.06em;
}