/* Acessio Designsystem – Tokens
   Quelle: live ausgelesen von https://acessio.de am 11.10.2026.
   Werte nur hier aendern, nie in einzelnen Seiten neu erfinden. */
:root {
  /* Flaechen */
  --canvas: #F3F1F0;      /* Seitenhintergrund, warmes Grau */
  --canvas-2: #EEE9E4;    /* Papier in Zeichnungen, ruhige Bereiche */
  --canvas-3: #E7E0D8;    /* Sand, Trennflaechen */
  --flaeche: #FBFAF8;     /* helle Flaeche fuer hervorgehobene Bereiche */

  /* Schrift und Linien */
  --ink: #19191C;
  --ink-2: #2B2B2F;
  --muted: #6E6A66;
  --line: rgba(25, 25, 28, .10);
  --line-2: rgba(25, 25, 28, .18);

  /* Akzent: Tuerkis. Nur fuer Handlung, Markierung und Zeichnungsakzente. */
  --cta: #22C7D6;
  --cta-hover: #16B4C2;
  --cta-schrift: #151621;
  --teal: #0E8A97;
  --accent: #097078;      /* Links und Text auf hellem Grund (Kontrast AA) */
  --hellcyan: #DDF8FA;

  /* Schrift: Figtree fuer alles. Newsreader nur fuer echte Zitate. */
  --sans: "Figtree", Verdana, -apple-system, "Segoe UI", system-ui, sans-serif;
  --zitat: "Newsreader", Georgia, "Times New Roman", serif;

  --fs-display: clamp(40px, 6.4vw, 84px);
  --fs-h1: clamp(32px, 4.2vw, 56px);
  --fs-h2: clamp(28px, 3.2vw, 44px);
  --fs-h3: clamp(20px, 1.6vw, 23px);
  --fs-lead: clamp(17px, 1.3vw, 20px);
  --fs-body: clamp(16px, 1.05vw, 18px);
  --fs-klein: 14px;
  --fs-label: 12px;

  --lh-titel: 1.08;
  --lh-body: 1.55;
  --ls-titel: -0.022em;
  --ls-label: .14em;
  --mass: 62ch;           /* maximale Zeilenlaenge Fliesstext */

  /* Raum */
  --gutter: clamp(20px, 5vw, 72px);
  --max: 1240px;
  --section-y: clamp(80px, 11vw, 180px);
  --section-y-eng: clamp(56px, 7vw, 112px);
  --gap-1: 8px; --gap-2: 16px; --gap-3: 24px; --gap-4: 40px; --gap-5: 64px;

  /* Form */
  --radius-pill: 999px;
  --radius-bild: 18px;
  --schatten-werk: 0 1px 0 rgba(25,25,28,.05), 0 26px 60px -22px rgba(25,25,28,.34);

  /* Bewegung */
  --ease: cubic-bezier(.22,.61,.36,1);
  --dur: 700ms;
  --dur-schnell: 300ms;
}