/* Design Tokens v2 - lukasschwarz.info */
:root {
  /* Farben - Charcoal-Theme mit Coral-Akzent (warm, techy, weniger generisch) */
  --bg:        #111114;
  --bg-2:      #18181d;
  --bg-3:      #22222a;
  --paper:     #f4f1ea;
  --paper-2:   #e9e4d8;
  --ink:       #0b0b0e;
  --text:      #ece9df;
  --text-2:    #9a978d;
  --text-3:    #6a675f;
  --accent:    #ff5b41;
  --accent-2:  #ffb43d;
  --accent-3:  #b8ff5b;
  --line:      rgba(236, 233, 223, 0.12);
  --line-2:    rgba(236, 233, 223, 0.22);
  --success:   #6ee7a8;
  --danger:    #ff5b41;
  --glow:      rgba(255, 91, 65, 0.35);
  --glass-bg:  rgba(24, 24, 29, 0.72);

  /* Fluid Type Scale */
  --text-xs:    clamp(0.75rem, 0.71rem + 0.16vw, 0.8125rem);
  --text-sm:    clamp(0.875rem, 0.84rem + 0.15vw, 0.9375rem);
  --text-base:  clamp(1rem, 0.95rem + 0.21vw, 1.125rem);
  --text-lg:    clamp(1.125rem, 1.05rem + 0.32vw, 1.3125rem);
  --text-xl:    clamp(1.5rem, 1.3rem + 0.85vw, 2rem);
  --text-2xl:   clamp(2rem, 1.65rem + 1.5vw, 3rem);
  --text-3xl:   clamp(2.75rem, 2.1rem + 2.85vw, 4.5rem);
  --text-hero:  clamp(3rem, 1.4rem + 7vw, 9rem);

  /* 8pt Spacing */
  --space-1:   0.5rem;
  --space-2:   1rem;
  --space-3:   1.5rem;
  --space-4:   2rem;
  --space-5:   3rem;
  --space-6:   4rem;
  --space-7:   6rem;
  --space-8:   8rem;

  /* Typografie */
  --font-sans:   "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:   "JetBrains Mono", ui-monospace, "SF Mono", monospace;
  --leading-tight:  1.05;
  --leading-snug:   1.3;
  --leading-normal: 1.55;
  --tracking-wide:  0.08em;
  --tracking-tight: -0.025em;

  /* Radius & Shadow */
  --radius-xs:   4px;
  --radius-sm:   8px;
  --radius-md:   14px;
  --radius-lg:   22px;
  --radius-full: 999px;
  --shadow-soft: 0 10px 32px rgba(0,0,0,0.45);
  --shadow-pop:  0 16px 60px rgba(0,0,0,0.55);

  /* Motion */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast:    180ms;
  --dur-med:     360ms;
  --dur-slow:    720ms;

  /* Layout - fluid bis XL */
  --container:        min(90vw, 1480px);
  --container-wide:   min(94vw, 1680px);
  --container-narrow: min(88vw, 980px);
  --gutter:           clamp(1rem, 3vw, 3rem);
  --header-h:         64px;
}