/* Automatisier – Design-Tokens
   Quelle: logo.png (Farben) + design/referenz/automatisier/startseite-aktuell.html (Rest)
   Schriften: Space Grotesk (Überschriften), IBM Plex Sans (Text)
   <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=IBM+Plex+Sans:wght@400;500;600&display=swap" rel="stylesheet"> */

:root {
  /* Marke – Farben aus dem Logo (logo.png) */
  --brand: #4a4ed6;          /* Hauptfarbe Logo */
  --brand-2: #6c70e6;        /* heller, für Hover/Verlauf */
  --brand-deep: #35389f;     /* Schattenfarbe im Logo */
  --brand-dim: #1e2060;
  --brand-soft: #c3c5f5;
  --brand-gradient: linear-gradient(135deg, #4a4ed6 0%, #35389f 100%);
  --logo-white: #f8fbfa;     /* Blitz im Logo */

  /* Dunkle Flächen */
  --page-dark: #050611;
  --card-dark: #0b0c14;
  --text-on-dark: #f6f7fb;
  --text-muted-on-dark: #a7acc0;
  --line-on-dark: rgba(255, 255, 255, 0.14);

  /* Helle Flächen */
  --bg-light: #f5f6f8;
  --card-light: #ffffff;
  --ink: #0b0c10;
  --ink-muted: #5b5f6b;
  --line-light: #e3e5ea;

  /* Plattform-Akzent – heller Modus */
  --app-accent-light: #4a4ed6;
  --app-on-accent-light: #ffffff;
  --app-accent-text-light: #4a4ed6;

  /* Plattform-Akzent – dunkler Modus */
  --app-accent-dark: #4a4ed6;
  --app-on-accent-dark: #ffffff;
  --app-accent-text-dark: #8f92f0;

  /* Status */
  --danger: #ff6b6b;
  --danger-soft: #ff8a8a;

  /* Schrift */
  --font-heading: 'Space Grotesk', sans-serif;
  --font-body: 'IBM Plex Sans', sans-serif;
  --heading-weight: 600;
  --heading-tracking: -0.01em;
  --heading-leading: 1.08;
  --body-leading: 1.5;

  /* Form */
  --radius-pill: 100px;
  --pad-x-desktop: 48px;
  --pad-x-mobile: 20px;
}