/* ============================================================================
 * css/tokens/breakpoints.css  —  Responsive Breakpoints (v2 §6.7, §14.5)
 * Zentrale, projektweit einheitliche Breakpoints (alle durch 8 teilbar).
 *
 * Hinweis: CSS Custom Properties funktionieren NICHT in @media-Bedingungen.
 * Diese Tokens sind die verbindliche Referenz; @media-Queries verwenden die
 * gleichen Pixelwerte als Literal. Bei Build-Einfuehrung (Schritt 20) koennen
 * sie via Preprocessor/Custom-Media eingebunden werden.
 * Verbindliche Werte: 480 / 768 / 1024 / 1280 / 1536.
 * ==========================================================================*/

:root {
  --bp-xs: 480px;
  --bp-sm: 768px;
  --bp-md: 1024px;
  --bp-lg: 1280px;
  --bp-xl: 1536px;
}

/* Referenz fuer @media (als Literal zu verwenden):
 * @media (min-width: 480px)  { ... }   xs
 * @media (min-width: 768px)  { ... }   sm
 * @media (min-width: 1024px) { ... }   md
 * @media (min-width: 1280px) { ... }   lg
 * @media (min-width: 1536px) { ... }   xl
 */