/* ERZEUGT aus gestaltung/gestaltung.tokens.json — nicht von Hand ändern. */

@font-face {
  font-family: "Manrope";
  src: url("../schrift/Manrope.var.woff2") format("woff2-variations");
  font-weight: 200 800;
  font-display: swap;
}

:root {
  --schrift: "Manrope", "Segoe UI", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  --gewicht-normal: 400;
  --gewicht-halbfett: 600;
  --gewicht-fett: 700;
  --gewicht-extrafett: 800;
  --klein-groesse: 12px;
  --klein-zeile: 16px;
  --grund-groesse: 14px;
  --grund-zeile: 20px;
  --betont-groesse: 16px;
  --betont-zeile: 24px;
  --titel3-groesse: 16px;
  --titel3-zeile: 24px;
  --titel2-groesse: 20px;
  --titel2-zeile: 28px;
  --titel2-laufweite: -0.01em;
  --titel1-groesse: 24px;
  --titel1-zeile: 32px;
  --titel1-laufweite: -0.015em;
  --riese-groesse: 40px;
  --riese-zeile: 48px;
  --riese-laufweite: -0.02em;
  --halb: 4px;
  --r1: 8px;
  --r2: 16px;
  --r3: 24px;
  --r4: 32px;
  --r5: 40px;
  --r6: 48px;
  --r8: 64px;
  --seitenrand: 80px;
  --seitenrand-tablet: 24px;
  --seitenrand-telefon: 16px;
  --rinne: 16px;
  --spalten: 12;
  --farbe-navy-900: #172538;
  --farbe-navy-800: #17324F;
  --farbe-navy-600: #246B9E;
  --farbe-navy-300: #8A9BB0;
  --farbe-navy-200: #AEBED0;
  --farbe-navy-100: #DCE4EE;
  --farbe-gold-700: #B8860B;
  --farbe-gold-500: #C2A15C;
  --farbe-gold-100: #F8E5C6;
  --farbe-gruen-600: #15715F;
  --farbe-gruen-100: #D8EEE8;
  --farbe-rot-700: #A64038;
  --farbe-rot-600: #D14343;
  --farbe-rot-100: #F6DCDA;
  --farbe-orange-700: #A45C00;
  --farbe-orange-500: #E0762E;
  --farbe-grau-700: #51677C;
  --farbe-grau-600: #51677C;
  --farbe-grau-400: #8A9BB0;
  --farbe-grau-300: #C6C9CF;
  --farbe-grau-200: #E3E7EB;
  --farbe-grau-100: #DCE4EE;
  --farbe-sand-200: #F3EFE2;
  --farbe-sand-100: #F3EFE2;
  --farbe-papier: #FBFBF8;
  --farbe-weiss: #FFFFFF;
  --farbe-navy-500: #51677C;
  --flaeche: #FFFFFF;
  --flaeche-ruhig: #F3EFE2;
  --karte: #FFFFFF;
  --tinte: #172538;
  --tinte-gedaempft: #51677C;
  --tinte-hell: #FFFFFF;
  --kopf: #17324F;
  --akzent: #C2A15C;
  --akzent-tinte: #B8860B;
  --wirkung: #246B9E;
  --erfolg: #15715F;
  --erfolg-flaeche: #D8EEE8;
  --warnung: #A45C00;
  --offen: #E0762E;
  --fehler: #D14343;
  --fehler-flaeche: #F6DCDA;
  --linie: rgba(23,50,79,.16);
  --linie-zart: rgba(23,50,79,.09);
  --vorhang: rgba(23,37,56,.45);
  --rund-klein: 6px;
  --rund: 10px;
  --rund-gross: 16px;
  --rund-voll: 999px;
  --schatten-karte: 0 1px 2px rgba(23,37,56,.05), 0 4px 16px rgba(23,37,56,.06);
  --schatten-schwebend: 0 2px 8px rgba(23,50,79,.08), 0 16px 40px rgba(23,50,79,.16);
  --uebergang: 150ms ease;
  --fokus-schein: 0 0 0 3px rgba(36,107,158,.20);
}

@media (max-width: 1024px) { :root { --seitenrand: var(--seitenrand-tablet); } }
@media (max-width: 640px)  { :root { --seitenrand: var(--seitenrand-telefon); } }