/*
 * fahrtauglich.ch – Design-Tokens (Etappe 3a-0)
 * Wird unverändert ins Theme übernommen (assets/css/tokens.css).
 *
 * Markengelb #FFBF00 = Elementor-Kit «--e-global-color-748de2b» (live verifiziert).
 * Regel: Gelb nur als Fläche mit dunklem Text, nie gelber Text auf Weiss (1.65:1).
 *
 * Geprüfte Kontrastpaare (WCAG 2.2, Verhältnis):
 *   tinte   #1C1C1E auf weiss  #FFFFFF  17.0  (Text)
 *   tinte   #1C1C1E auf gelb   #FFBF00  10.3  (Text auf Buttons, Hero)
 *   tinte   #1C1C1E auf gelb-hell #FFF3CC 15.4 (Hinweisboxen)
 *   tinte   #1C1C1E auf flaeche #F5F4F0 15.5
 *   tinte-2 #45454A auf weiss  #FFFFFF   9.5  (Nebentext)
 *   tinte-2 #45454A auf creme  #FFF6E0   8.9
 *   tinte-2 #45454A auf gelb   #FFBF00   5.8
 *   gelb    #FFBF00 auf tinte  #1C1C1E  10.3  (Links und Fokus im dunklen Footer)
 *   weiss   #FFFFFF auf tinte  #1C1C1E  17.0
 *   rahmen  #7A756C auf weiss            4.6  (Formularfelder, ≥ 3:1 für Bedienelemente)
 *   fehler  #B3261E auf weiss            6.5
 *   ok      #1F6E43 auf weiss            6.2
 *   tinte   #1C1C1E auf gelb-hover #E6AB00 8.3
 */

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("../fonts/poppins-latin-300-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/poppins-latin-400-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/poppins-latin-600-normal.woff2") format("woff2");
}
/* Ersatzschrift mit angeglichenen Metriken: weniger Layoutverschiebung, bis Poppins geladen ist */
@font-face {
  font-family: "Poppins Ersatz";
  src: local("Arial");
  size-adjust: 112%;
  ascent-override: 93%;
  descent-override: 31%;
  line-gap-override: 9%;
}

:root {
  /* Farben */
  --ft-gelb: #FFBF00;
  --ft-gelb-hover: #E6AB00;
  --ft-gelb-hell: #FFF3CC;
  --ft-creme: #FFF6E0;
  --ft-tinte: #1C1C1E;
  --ft-tinte-2: #45454A;
  --ft-weiss: #FFFFFF;
  --ft-flaeche: #F5F4F0;
  --ft-linie: #DEDAD2;
  --ft-rahmen: #7A756C;
  --ft-fehler: #B3261E;
  --ft-fehler-hell: #FCEBEA;
  --ft-ok: #1F6E43;
  --ft-ok-hell: #E7F3EC;
  --ft-fokus: #1C1C1E;
  --ft-fokus-dunkel: #FFBF00;

  /* Schrift */
  --ft-schrift: "Poppins", "Poppins Ersatz", Arial, sans-serif;
  --ft-fs-klein: 1.0625rem;   /* 17 px: nur Metaangaben, nie Fliesstext */
  --ft-fs-text: 1.1875rem;    /* 19 px: Grundschrift, mobil und Desktop gleich */
  --ft-fs-gross: 1.375rem;    /* 22 px: Einleitung, Antwortbox */
  --ft-fs-h4: 1.25rem;
  --ft-fs-h3: 1.5rem;
  --ft-fs-h2: clamp(1.625rem, 1.25rem + 1.2vw, 2.125rem);
  --ft-fs-h1: clamp(2rem, 1.4rem + 2.2vw, 2.875rem);
  --ft-lh-text: 1.6;
  --ft-lh-titel: 1.22;
  --ft-gewicht-leicht: 300;
  --ft-gewicht-normal: 400;
  --ft-gewicht-fett: 600;

  /* Abstände (4er-Raster) */
  --ft-a-1: 0.25rem;
  --ft-a-2: 0.5rem;
  --ft-a-3: 0.75rem;
  --ft-a-4: 1rem;
  --ft-a-5: 1.5rem;
  --ft-a-6: 2rem;
  --ft-a-7: 3rem;
  --ft-a-8: 4rem;
  --ft-a-9: 6rem;
  --ft-rand: 1.25rem;          /* seitlicher Rand mobil */
  --ft-abschnitt: clamp(3rem, 2rem + 4vw, 5.5rem);

  /* Radien */
  --ft-radius-klein: 6px;
  --ft-radius: 12px;
  --ft-radius-pill: 999px;

  /* Breiten */
  --ft-breite-text: 68ch;      /* ca. 70 Zeichen pro Zeile */
  --ft-breite-seite: 75rem;    /* 1200 px */
  --ft-breite-schmal: 52rem;

  /* Bedienelemente */
  --ft-ziel-min: 3rem;         /* 48 px Mindestgrösse für Klickflächen */
  --ft-button-hoehe: 3.375rem; /* 54 px */
  --ft-feld-hoehe: 3.5rem;     /* 56 px */
  --ft-fokus-ring: 0 0 0 3px var(--ft-weiss), 0 0 0 6px var(--ft-fokus);

  /* Schatten: sparsam, nur für schwebende Elemente (Menü, Cookie-Leiste) */
  --ft-schatten: 0 8px 24px rgba(28, 28, 30, 0.12);

  /* Breakpoints (in Media Queries als Zahl verwenden):
     40em = 640 px (Tablet), 60em = 960 px (Desktop-Navigation), 75em = 1200 px (Seitenleiste) */
}