/* ============================================================
   TELOS — DESIGN TOKENS (Übergangsfassung)
   ------------------------------------------------------------
   Diese Datei wird ersetzt, sobald design-system/tokens.css
   vorliegt. Die Variablennamen bleiben identisch — dann genügt
   ein Austausch der Datei, ohne dass HTML oder styles.css
   angefasst werden müssen.
   ============================================================ */
:root {
  /* --- Marke --- */
  --telos-ink:        #1B2440;
  --telos-ink-deep:   #121A30;
  --telos-accent:     #FF8C42;
  --telos-accent-ink: #E6702A;
  --telos-surface:    #F2F4F9;
  --telos-paper:      #FFFFFF;

  /* --- Neutrale (aus dem Blau abgeleitet) --- */
  --telos-n-900: #1B2440;
  --telos-n-700: #3A4460;
  --telos-n-500: #6B7391;
  --telos-n-300: #B3B9CC;
  --telos-n-100: #E3E6EF;

  /* --- Signal (nur Status) --- */
  --telos-ok:   #2E7D5B;
  --telos-warn: #C77700;
  --telos-risk: #B3402F;

  /* --- Typografie --- */
  --telos-font-head: Georgia, 'Times New Roman', serif;
  --telos-font-body: 'Segoe UI', system-ui, -apple-system, Arial, sans-serif;

  --telos-t-display: clamp(32px, 5vw, 52px);
  --telos-t-h1:      clamp(26px, 3.4vw, 36px);
  --telos-t-h2:      clamp(21px, 2.4vw, 27px);
  --telos-t-h3:      18px;
  --telos-t-body:    17px;
  --telos-t-small:   15px;
  --telos-t-label:   12px;

  /* --- Abstände (8er-Raster) --- */
  --telos-s1: 8px;  --telos-s2: 16px; --telos-s3: 24px;
  --telos-s4: 32px; --telos-s5: 48px; --telos-s6: 64px;
  --telos-s7: 96px; --telos-s8: 128px;

  /* --- Form --- */
  --telos-r-sm: 6px;
  --telos-r-md: 10px;
  --telos-r-lg: 16px;
  --telos-r-pill: 999px;

  --telos-shadow:    0 4px 20px rgba(27,36,64,.10);
  --telos-shadow-lg: 0 12px 40px rgba(27,36,64,.16);

  /* --- Layout --- */
  --telos-maxw: 1120px;
  --telos-maxw-text: 68ch;
}