/* Design-Tokens Autoankauf-Netz. EINZIGE Stelle fuer Farben, Schriften,
   Abstaende, Radien, Schatten, Bewegung. Quelle: Autoankauf/DESIGN.md
   (freigegeben 16.10.2026). Neue Werte erst dort eintragen, dann hier. */

@font-face {
  font-family: "Archivo";
  src: url("/assets/fonts/archivo-var.woff2") format("woff2");
  font-weight: 600 800;
  font-stretch: 100% 125%;
  font-style: normal;
  font-display: swap;
}
@font-face { font-family: "IBM Plex Sans"; src: url("/assets/fonts/plex-sans-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("/assets/fonts/plex-sans-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("/assets/fonts/plex-sans-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("/assets/fonts/plex-mono-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }

:root {
  /* Farben (DESIGN.md Abschnitt 3) */
  --c-kreide: #F4F1EA;
  --c-papier: #FFFDF8;
  --c-sand: #EAE4D8;
  --c-asphalt: #211F1C;
  --c-asphalt-700: #34312C;
  --c-graphit: #1B1A18;
  --c-stein: #5E584F;
  --c-linie: #DCD5C8;
  --c-linie-stark: #1B1A18;
  --c-ocker: #E2B23A;
  --c-ocker-600: #CF9E27;
  --c-ocker-50: #FBF3DC;
  --c-kz-blau: #1F4FA3;
  --c-eu-gelb: #FFCC00;   /* nur Sterne im Kennzeichen */
  --c-kz-grund: #FBFBF8;  /* Kennzeichen-Weiss, minimal warm */
  --c-fehler: #B42318;
  /* Reza-Override 25.10.2026: WhatsApp-Gruen AUSSCHLIESSLICH fuer WhatsApp-Aktionen.
     Kontrast: #25D366 mit Graphit-Schrift 8,77:1, Hover #1EBE5A 7,10:1 (AA). Weiss auf Gruen nur 1,98:1, verboten. */
  --c-wa: #25D366;
  --c-wa-600: #1EBE5A;
  --c-wa-text: #1B1A18;
  --c-kreide-auf-dunkel: rgba(244, 241, 234, .72);

  /* Schriften (Abschnitt 4) */
  --f-display: "Archivo", "Arial Narrow", Arial, sans-serif;
  --f-text: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  --t-h1: clamp(2.1rem, 4.6vw, 3.75rem);
  --t-h2: clamp(1.6rem, 2.8vw, 2.5rem);
  --t-h3: clamp(1.2rem, 1.8vw, 1.4rem);
  --t-body: 1.0625rem;
  --t-lead: clamp(1.125rem, 1.5vw, 1.25rem);
  --t-mono: .875rem;
  --t-kicker: .78rem;

  /* Abstaende (Abschnitt 5) */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px; --s-10: 128px;
  --s-sektion: clamp(56px, 8vw, 112px);
  --container: 1180px;
  --rand: clamp(16px, 4vw, 32px);

  /* Radien, Linien, Schatten (Abschnitt 6) */
  --r-btn: 4px;
  --r-karte: 6px;
  --r-feld: 4px;
  --r-chip: 3px;
  --r-kz: 5px;
  --r-nav: 0;
  --sh-1: 0 1px 0 rgba(33, 31, 28, .06);
  --sh-2: 0 14px 32px -18px rgba(33, 31, 28, .28);

  /* Bewegung (Abschnitt 10) */
  --ease: cubic-bezier(.2, .7, .2, 1);
  --d-reveal: 420ms;
  --d-btn: 160ms;
  --d-schritt: 200ms;
  --d-linie: 700ms;
}
