/* Design-Tokens des Verticals „Werbetechnik & Druck“ (Design „Werkstatt“).
   Für eine andere Branche diese Datei kopieren und Farben, Schriften und Formen anpassen. */
@font-face { font-family: "Geist"; src: url("fonts/geist-latin-wght.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Geist Mono"; src: url("fonts/geist-mono-latin-wght.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }

:root {
  /* Flächen und Text (Design „Werkstatt“: Papier, tiefes Blaugrün, Gelb als Akzent) */
  --bg: #f7f7f3;
  --surface: #ffffff;
  --surface-2: #eef4f3;
  --line: #dce3e3;
  --ink: #102b3f;
  --text: #102b3f;
  --text-soft: #5c6b73;       /* Kontrast auf Weiß 5,6:1 */

  /* Marke: Blau für Links und Aktionen, Cyan und Gelb als Akzente */
  --brand: #1476a5;           /* Blau, Text auf Weiß 5,0:1 */
  --brand-bright: #1476a5;    /* Linien, Rahmen, Kartenmarker */
  --brand-tint: #e3f3f6;
  --cyan: #8dd8e6;
  --magenta: #b3261e;         /* nur noch Warnhinweise */
  --magenta-tint: #fbe9e7;
  --foil-yellow: #ffd35a;
  --yellow-tint: #fff3cf;
  --ok: #15917b;

  /* Schrift */
  --font: "Geist", Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --fs-0: 0.8125rem;
  --fs-1: clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);
  --fs-2: clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);
  --fs-3: clamp(1.75rem, 1.3rem + 1.8vw, 2.6rem);
  --fs-4: clamp(2.5rem, 1.5rem + 4.4vw, 4.1rem);

  /* Form: runde Karten, Pillen für Schaltflächen, weiche blaue Schatten */
  --r-sm: 10px;
  --r: 19px;
  --r-lg: 25px;
  --shadow-1: 0 8px 28px rgba(16, 43, 63, .06);
  --shadow-2: 0 12px 36px rgba(16, 43, 63, .10);
  --shadow-3: 0 20px 60px rgba(16, 43, 63, .15);
  --ring: 0 0 0 4px rgba(20, 118, 165, .22);

  /* Abstände */
  --sp-1: .25rem; --sp-2: .5rem; --sp-3: .75rem; --sp-4: 1rem; --sp-5: 1.5rem; --sp-6: 2rem; --sp-7: 3rem; --sp-8: 5rem; --sp-9: 7rem;
  --gutter: clamp(1rem, 4vw, 1.5rem);
  --maxw: 1180px;

  /* Bewegung: dezent */
  --ease: cubic-bezier(.2, .7, .2, 1);
  --t-fast: 160ms;
  --t: 280ms;
}