/*
 * Die Marke the.noomad: Signika fuer Ueberschriften, Noto Sans fuer Text und
 * Bedienoberflaeche. Quelle der Festlegung ist
 * AI_OS/04 Resources/Brand Material/the.noomad/the.noomad_branding.md.
 *
 * DIE SCHRIFTEN LIEGEN HIER, NICHT BEI GOOGLE, und das ist keine Bequemlichkeit.
 * Ein <link> auf fonts.googleapis.com laesst den Browser jeder Besucherin
 * Google aufrufen und dabei ihre IP-Adresse uebertragen — genau das hat das
 * LG Muenchen 2022 als Verstoss gewertet. Beide Familien stehen unter der SIL
 * Open Font License; Selbsthosten ist ausdruecklich erlaubt. Die
 * Content-Security-Policy im Caddyfile wuerde einen Fremdaufruf ohnehin
 * blockieren (default-src 'self', kein eigenes font-src), aber ein Riegel
 * ersetzt keine Entscheidung.
 *
 * EINE DATEI JE FAMILIE, NICHT EINE JE SCHNITT. Beide sind variable Schriften.
 * Vier @font-face-Regeln mit vier URLs waeren vier Downloads derselben Datei —
 * Browser cachen pro URL, nicht pro Inhalt. Genau so lagen sie bis zum
 * 2026-09-04 im Vault: sieben Dateien, zwei Schriften.
 *
 * DIE BEREICHE SIND GEMESSEN, NICHT GESCHAETZT (Browser, 2026-09-04): Signika
 * variiert von 300 bis 700 — darunter und darueber rendert es wie die
 * Randwerte. Noto Sans laeuft durchgehend von 100 bis 900 und deckt damit auch
 * die 500 ab, die Unfold fuer seine mittlere Staerke anfordert.
 */

@font-face {
  font-family: "Signika";
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/Signika-Variable.woff2") format("woff2");
}

@font-face {
  font-family: "Noto Sans";
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/NotoSans-Variable.woff2") format("woff2");
}

/*
 * WARUM :root:root UND NICHT :root. Unfold bindet die Stylesheets aus
 * UNFOLD["STYLES"] VOR seinem eigenen styles.css ein (skeleton.html, Zeile 25
 * gegen Zeile 33). Bei gleicher Spezifitaet gewinnt damit immer Unfold, und
 * diese Datei waere gesetzt und wirkungslos. Die doppelte Nennung hebt die
 * Spezifitaet auf (0,2,0) und entscheidet die Sache unabhaengig von der
 * Reihenfolge. Dieselbe Fehlerform hat am 2026-09-04 schon die
 * Content-Security-Policy im Caddyfile getroffen.
 */
:root:root {
  --font-sans: "Noto Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --marke-font-heading: "Signika", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --marke-font-body: "Noto Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

h1,
h2,
h3,
h4 {
  font-family: var(--marke-font-heading);
}

/*
 * DER GEFUELLTE KNOPF NIMMT ORANGE 700, NICHT 600.
 *
 * Die Marke legt fuer gefuellte Orange-Buttons Orange 700 mit Hover Orange 800
 * fest (the.noomad_branding.md, Abschnitt 11, Entscheidung 2026-09-04). Unfold
 * greift ab Werk `bg-primary-600`; gemessen am 2026-09-04 in Produktion ergab
 * das Klarweiss auf #cf6726 — 3.74:1. Die Knopfbeschriftung ist 14px und damit
 * kein Grosstext, verlangt also 4.5:1. Mit Orange 700 sind es 6.05:1.
 *
 * DER HOVER WAR DER SCHLIMMERE TEIL. Unfold setzt `hover:bg-primary-600/80`,
 * also 80% Deckkraft. Auf hellem Grund wird der Knopf dadurch HELLER, der
 * Kontrast beim Ueberfahren also schlechter statt besser. Hier geht er statt
 * dessen eine Stufe tiefer auf Orange 800 (9.01:1), wie die Marke es fuer alle
 * gefuellten Buttons vorsieht.
 *
 * NICHT die Palette in settings.UNFOLD verschoben, und das ist Absicht: Sie
 * bildet die Markenrampe stufengetreu ab (500 #dd8148, 600 #cf6726, 700
 * #9b4d1c, 800 #753812). Wuerde man die Werte verruecken, damit Unfolds 600 das
 * Richtige trifft, hiesse "Orange 700" in EventMan danach etwas anderes als im
 * Branding — und der naechste Mensch, der beides nebeneinanderlegt, findet den
 * Fehler nicht mehr.
 *
 * Elementname vor der Klasse (button.bg-primary-600) hebt die Spezifitaet ueber
 * Unfolds Utility-Klasse und entscheidet damit unabhaengig von der
 * Einbindereihenfolge — dieselbe Vorsichtsmassnahme wie bei :root:root oben.
 */
button.bg-primary-600,
a.bg-primary-600,
input.bg-primary-600 {
  background-color: var(--color-primary-700);
}

button.bg-primary-600:hover,
a.bg-primary-600:hover,
input.bg-primary-600:hover {
  background-color: var(--color-primary-800);
}