/* ============================================================
   EK ABDICHTUNG — Design Tokens
   Marke aus Logo gesampelt: Navy #244371 · Brick #92332D · Weiß
   System: "Der Schnitt durch die Wand" · Dichtungslinie
   ============================================================ */

:root {
  /* — Marken-Anker (NICHT ändern) — */
  --brand-navy:   #244371;
  --brand-brick:  #92332D;
  --white:        #ffffff;
  --off-white:    #f5f7fa;

  /* — Navy-Tiefenskala (für dunkle Sektionen & Hero) — */
  --navy-950: #0c1626;
  --navy-900: #10203a;
  --navy-850: #132641;
  --navy-800: #16294a;
  --navy-700: #1c3760;
  --navy-600: #244371;
  --navy-500: #335896;
  --navy-400: #5c7ba8;
  --navy-300: #8aa3c6;
  --navy-200: #aec0da;

  /* — Flächen & Linien (Hell) — */
  --surface-light:  #ffffff;
  --surface-raised: #eef2f8;
  --surface-sunken: #e9eef5;
  --line-light:     #dbe2ec;
  --line-strong:    #c3cede;

  /* — Text-Hierarchie (Hell) — */
  --text-strong: #10203a;
  --text-body:   #2e3a4d;
  --text-muted:  #647289;
  --text-faint:  #97a2b3;

  /* — Text-Hierarchie (Dunkel) — */
  --text-on-dark:     #eef3fa;
  --text-on-dark-mut: #9fb2cc;
  --text-on-dark-faint:#6f86a6;

  /* — Akzent (Rot, kontrolliert · max ~5% Fläche) — */
  --accent:      #92332d;
  --accent-soft: #b65349;
  --accent-bright:#c8453d;

  /* — Typografie — */
  --font-display: 'Sora', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body:    'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:    'IBM Plex Mono', ui-monospace, 'Cascadia Mono', monospace;

  /* Type scale (clamp, mobile→desktop) */
  --fs-h1:    clamp(2.6rem, 1.6rem + 4.4vw, 5rem);
  --fs-h2:    clamp(2rem, 1.4rem + 2.6vw, 3.25rem);
  --fs-h3:    clamp(1.4rem, 1.1rem + 1.3vw, 2rem);
  --fs-h4:    clamp(1.15rem, 1.02rem + 0.6vw, 1.4rem);
  --fs-lead:  clamp(1.08rem, 1rem + 0.5vw, 1.3rem);
  --fs-body:  1rem;
  --fs-small: 0.875rem;
  --fs-label: 0.75rem;
  --fs-stat:  clamp(2.6rem, 1.6rem + 3.6vw, 4.25rem);
  --fs-index: clamp(1.6rem, 1.1rem + 2.4vw, 2.6rem);

  /* — Spacing scale (8pt-basiert) — */
  --sp-1: 0.25rem; --sp-2: 0.5rem;  --sp-3: 0.75rem; --sp-4: 1rem;
  --sp-5: 1.5rem;  --sp-6: 2rem;    --sp-7: 2.5rem;  --sp-8: 3rem;
  --sp-9: 4rem;    --sp-10: 5rem;   --sp-12: 6rem;
  --section-y: clamp(4.5rem, 3rem + 6.5vw, 9.5rem);

  /* — Layout — */
  --maxw: 1320px;
  --gutter: clamp(20px, 5vw, 80px);
  --radius: 4px;
  --radius-lg: 8px;

  /* — Motion — */
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0.05, 0.36, 1);
  --dur-fast: 200ms;
  --dur: 450ms;
  --dur-slow: 700ms;

  /* — Elevation (dezent, technisch) — */
  --shadow-sm: 0 1px 2px rgba(16,32,58,0.06);
  --shadow-md: 0 12px 32px -12px rgba(16,32,58,0.18);
  --shadow-lg: 0 30px 70px -30px rgba(12,22,38,0.45);

  --z-nav: 100;
  --z-overlay: 200;
  --z-rail: 60;
}
