// ────────────────────────────────────────────────────────────────
// Tokens · Typografie
//
// Drei Rollen (nicht Abhaengigkeiten):
//   UI/Text   → Inter          (--font-sans)
//   Daten     → JetBrains Mono (--font-mono)
//   Marke     → Syne           (--font-brand, --font-display)
// ────────────────────────────────────────────────────────────────

$font-sans:    "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif !default;
$font-mono:    "JetBrains Mono", ui-monospace, SFMono-Regular, "Cascadia Mono", monospace !default;
$font-brand:   "Syne", "Inter", system-ui, sans-serif !default;   // Wortmarke
$font-display: "Syne", "Inter", system-ui, sans-serif !default;   // Titel/Ueberschriften

// Feste Groessen-Skala (rem, relativ zur Basis 16px).
$font-sizes: (
  xs:   .6875rem, // 11
  sm:   .75rem,   // 12
  md:   .875rem,  // 14
  base: 1rem,     // 16
  lg:   1.25rem,  // 20
  xl:   1.5rem,   // 24
  2xl:  2rem,     // 32
  3xl:  2.5rem,   // 40
) !default;

// Fluid-Display-Groessen (clamp) — fuer Marke/Hero.
$font-displays: (
  sm: clamp(1.6rem, 4vw, 2.4rem),
  md: clamp(2.3rem, 6vw, 3.7rem),
  lg: clamp(3rem, 9vw, 5.4rem),
) !default;

$font-weights: (
  light:    300,
  normal:   400,
  medium:   500,
  semibold: 600,
  bold:     700,
) !default;

$line-heights: (
  tight: 1.2,
  base:  1.5,
  loose: 1.7,
) !default;

$trackings: (
  tight:  -.02em,
  normal: 0,
  wide:   .14em,
  wider:  .26em,
  widest: .34em,
) !default;

@mixin type-tokens {
  --font-sans: #{$font-sans};
  --font-mono: #{$font-mono};
  --font-brand: #{$font-brand};
  --font-display: #{$font-display};

  @each $name, $value in $font-sizes {
    --fs-#{$name}: #{$value};
  }
  @each $name, $value in $font-displays {
    --display-#{$name}: #{$value};
  }
  @each $name, $value in $font-weights {
    --fw-#{$name}: #{$value};
  }
  @each $name, $value in $line-heights {
    --lh-#{$name}: #{$value};
  }
  @each $name, $value in $trackings {
    --tracking-#{$name}: #{$value};
  }
}