/* ============================================================
   TALDIS DESIGN TOKENS
   ============================================================ */

:root {

  /* --- Primitives --- */
  --color-black:      #000000;
  --color-white:      #ffffff;
  --color-green:      #a0b36d;
  --color-blue:       #5d85a9;
  --color-beige:      #dfd4cd;
  --color-grey-light: #e6e6e6;

  /* --- Semantics: Beige --- */
  --taldis-beige:        var(--color-beige);
  --taldis-beige-menu:   color-mix(in srgb, var(--color-beige) 95%, transparent);
  --taldis-beige-hover:  color-mix(in srgb, var(--color-beige) 70%, transparent);
  --taldis-beige-teaser: color-mix(in srgb, var(--color-beige) 40%, transparent);
  /* deckende 5%-Aufhellung (Farbe in Weiss) — kein Durchscheinen */
  --taldis-beige-tint:   color-mix(in srgb, var(--color-beige) 8%, white);

  /* --- Semantics: Project (Blau) --- */
  --taldis-project:        var(--color-blue);
  --taldis-project-menu:   color-mix(in srgb, var(--color-blue) 95%, transparent);
  --taldis-project-hover:  color-mix(in srgb, var(--color-blue) 24%, transparent);
  --taldis-project-teaser: color-mix(in srgb, var(--color-blue) 15%, transparent);
  --taldis-project-tint:   color-mix(in srgb, var(--color-blue) 8%, white);

  /* --- Semantics: Print (Grün) --- */
  --taldis-print:        var(--color-green);
  --taldis-print-menu:   color-mix(in srgb, var(--color-green) 95%, transparent);
  --taldis-print-hover:  color-mix(in srgb, var(--color-green) 24%, transparent);
  --taldis-print-teaser: color-mix(in srgb, var(--color-green) 15%, transparent);
  --taldis-print-tint:   color-mix(in srgb, var(--color-green) 8%, white);

  /* --- Typography --- */
  --font-family: 'Obvia', sans-serif;

  --font-weight-thin:     250;
  --font-weight-light:    300;
  --font-weight-regular:  400;
  --font-weight-medium:   550;
  --font-weight-semibold: 600;

  --font-size-xxl:  80px;
  --font-size-xl:   42px;
  --font-size-lg:   36px;
  --font-size-md:   28px;
  --font-size-base: 22px;
  --font-size-sm:   20px;
  --font-size-xs:   24px;

  /* --- Spacing --- */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-7:  28px;
  --space-8:  34px;
  --space-9:  40px;
  --space-10: 60px;
  --space-11: 80px;

  /* --- Layout --- */
  --container-max: 1440px;
  --container-padding: var(--space-10);

}