/* ═══════════════════════════════════════════════════════
   SHK-NORD GmbH — Design-Grundlagen
   Farbskala aus dem Logo-Blau (#052c8a) abgeleitet.
   Ein einziger Warm-Akzent, ausschliesslich fuer Preis,
   Foerderung und Notdienst — nie fuer normale Knoepfe.
═══════════════════════════════════════════════════════ */

:root {
  /* ── Markenblau ─────────────────────────────────────── */
  --blau-50:  #eef3fc;
  --blau-100: #d8e3f8;
  --blau-200: #b3c8f0;
  --blau-300: #839fe4;
  --blau-400: #4f72d3;
  --blau-500: #2a4cbb;
  --blau-600: #1a37a4;   /* Knopf-Grundfarbe */
  --blau-700: #052c8a;   /* Logo-Blau */
  --blau-800: #03215f;   /* Logo-Blau dunkel */
  --blau-900: #02173f;

  /* ── Neutral ────────────────────────────────────────── */
  --ink-900: #14181c;    /* Ueberschriften */
  --ink-700: #2d353d;
  --ink-600: #4a535c;    /* Fliesstext */
  --ink-400: #8b959e;
  --ink-200: #dde2e7;    /* Linien */
  --ink-100: #eef1f4;
  --flaeche: var(--sand-50);   /* helle Sektionen */
  --weiss:   #ffffff;

  /* ── Warm-Akzent: Preis, Foerderung, Notdienst ──────── */
  /* Wasserblau als Akzent — hebt sich vom Marken-Blau ab, ohne zu beißen */
  --akzent:        #52bee5;
  --akzent-dunkel: #13708d;   /* für Text auf Hell */
  --akzent-hell:   #90defc;   /* für Text auf Dunkel */

  /* Sandtöne als ruhige Flächen */
  --sand-50:  #fdf4e4;
  --sand-100: #f0e7d6;
  --sand-200: #d9d0be;

  /* ── Signal ─────────────────────────────────────────── */
  --gruen: #16a34a;
  --rot:   #c0392b;

  /* ── Schatten, in Markenfarbe getoent ───────────────── */
  --schatten-karte:  0 4px 14px -4px rgba(3, 33, 95, .18);
  --schatten-hover:  0 8px 24px -10px rgba(3, 33, 95, .24);
  --schatten-hoch:   0 24px 60px -15px rgba(3, 33, 95, .40);
  --schatten-knopf:  0 14px 34px -12px rgba(26, 55, 164, .55);

  /* ── Radien ─────────────────────────────────────────── */
  --radius-pille: 999px;
  --radius-karte: 16px;
  --radius-bild:  24px;

  /* ── Breiten ────────────────────────────────────────── */
  --breite-seite:  87.5rem; /* 1400px */
  --breite-schmal: 68rem;
  --breite-text:   46rem;   /* ca. 70 Zeichen */

  /* ── Abstaende ──────────────────────────────────────── */
  --sektion:      clamp(4.5rem, 9vw, 8rem);
  --sektion-gross: clamp(5.5rem, 11vw, 10rem);
  --gap:          clamp(1.5rem, 3vw, 2rem);
  --rand:         1.25rem;

  /* ── Schrift ────────────────────────────────────────── */
  --schrift-display: 'Archivo', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --schrift-text:    'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --h1: clamp(2.5rem, 6.5vw, 5.25rem);
  --h2: clamp(1.95rem, 4.5vw, 3.25rem);
  --h3: clamp(1.25rem, 2vw, 1.6rem);
  --text:  1.0625rem;   /* 17px */
  --klein: 0.9375rem;   /* 15px */

  /* ── Bewegung ───────────────────────────────────────── */
  --kurve: cubic-bezier(.16, 1, .3, 1);
}
