@charset "UTF-8";

/*
 * frankhamburger.de – Design-Tokens
 *
 * Kontrast nach WCAG 2.2 (Text mindestens 4,5 : 1):
 *   Text       #272625  Weiß 15,1 : 1 · Greige 13,0 : 1
 *   Akzent     #7C4038  Weiß  7,9 : 1 · Greige  6,8 : 1 · Karte 7,1 : 1
 *   Nebentext  #665F5C  Weiß  6,3 : 1 · Greige  5,4 : 1 · Karte 5,6 : 1
 *   Linie      #9A625A  nur für Linien und Rahmen
 */

:root {
  /* Farben */
  --fh-farbe-akzent:         #7C4038;
  --fh-farbe-linie:          #9A625A;
  --fh-farbe-text:           #272625;
  --fh-farbe-text-neben:     #665F5C;
  --fh-farbe-flaeche:        #F2EDE9;
  --fh-farbe-karte:          #F7F2EF;
  --fh-farbe-hintergrund:    #FFFFFF;
  --fh-farbe-karte-rand:     color-mix(in srgb, var(--fh-farbe-linie) 22%, var(--fh-farbe-karte));

  /* Schrift */
  --fh-schrift:              "Lato", "Segoe UI", system-ui, -apple-system, sans-serif;
  --fh-schrift-normal:       400;
  --fh-schrift-fett:         700;

  --fh-groesse-klein:        0.875rem;
  --fh-groesse-text:         1.0625rem;
  --fh-groesse-ueberschrift: 0.9375rem;
  --fh-groesse-kennzahl:     1.75rem;
  --fh-groesse-name:         clamp(2rem, 5vw, 3rem);

  --fh-zeilenhoehe:          1.55;
  --fh-laufweite-name:       0.08em;
  --fh-laufweite-titel:      0.06em;

  /* Abstände */
  --fh-abstand-xs:           0.25rem;
  --fh-abstand-s:            0.5rem;
  --fh-abstand-m:            1rem;
  --fh-abstand-l:            1.75rem;
  --fh-abstand-xl:           3rem;

  /* Formen und Layout */
  --fh-radius:               0.625rem;
  --fh-linie-staerke:        1px;
  --fh-inhalt-breite:        60rem;

  /* Fokus */
  --fh-fokus-rahmen:         3px solid var(--fh-farbe-akzent);
  --fh-fokus-abstand:        3px;

  /* Symbol für externe Links */
  --fh-symbol-extern: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 4h6v6'/%3E%3Cpath d='M20 4l-9 9'/%3E%3Cpath d='M18 14v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h5'/%3E%3C/svg%3E");
}