/* Design-System-Tokens aus Divi global_colors */
:root {
  /* Farben */
  --color-primary: #243447;          /* dunkles Navy: Headings, Hero-Overlay */
  --color-secondary: #71869e;        /* Slate: Icons, Akzente */
  --color-heading: #243447;
  --color-link: #2a64aa;             /* Buttons, Links */
  --color-white: rgba(255, 255, 255, 0.99);

  /* abgeleitete Tints (secondary mit Opacity) */
  --tint-slate-10: rgba(113, 134, 158, 0.10);  /* Zitat-, FAQ-Hintergrund */
  --tint-slate-03: rgba(113, 134, 158, 0.03);
  --color-surface: #ffffff;
  --color-surface-alt: #edeff0;
  --color-text: #3f443f;
  --color-card-mint: rgba(235, 255, 243, 0.85);

  /* Typografie */
  --font-base: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-heading: "Sora", system-ui, -apple-system, "Segoe UI", sans-serif;

  --fs-h1: clamp(2.4rem, 5vw, 3.6rem);
  --fs-h2: clamp(1.9rem, 3.2vw, 2.6rem);
  --fs-h3: clamp(1.25rem, 2vw, 1.6rem);
  --fs-h4: 1.1rem;
  --fs-body: 1rem;
  --fs-small: 0.8rem;

  /* Abstaende */
  --section-pad: 100px;
  --section-pad-sm: 75px;
  --content-max: 1400px;
  --gap: 30px;
  --header-h: 65px;

  /* Form */
  --radius-sm: 12px;
  --radius: 20px;
  --radius-lg: 25px;
  --shadow-card: 0 18px 40px rgba(36, 52, 71, 0.10);
  --shadow-soft: 0 8px 24px rgba(36, 52, 71, 0.08);
}