/* ============================================================
   RS Glas — TYPOGRAPHY
   Eine Familie: Montserrat. Charakter entsteht durch extreme
   Gewichts- und Laufweiten-Kontraste, nicht durch Schriftmischung.
   • Titel: 800/900, GROSSBUCHSTABEN, negatives Tracking
   • Overline/Label: 800, GROSSBUCHSTABEN, weites Tracking
   • Fließtext: 400/500, normal, line-height 1.6–2.0
   ============================================================ */
:root {
  --font-sans: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Gewichte */
  --fw-light:    300; /* @kind font */
  --fw-regular:  400; /* @kind font */
  --fw-medium:   500; /* @kind font */
  --fw-semibold: 600; /* @kind font */
  --fw-bold:     700; /* @kind font */
  --fw-extra:    800; /* @kind font */
  --fw-black:    900; /* @kind font */

  /* Type-Scale (fluide Titel per clamp) */
  --fs-display:  clamp(44px, 7vw, 96px);   /* @kind font */
  --fs-h1:       clamp(36px, 5.5vw, 72px); /* @kind font */
  --fs-h2:       clamp(32px, 5vw, 64px);   /* @kind font */
  --fs-h3:       16px;                      /* Karten-Titel  @kind font */
  --fs-lead:     16px;                      /* Sektions-Untertitel  @kind font */
  --fs-body:     14px; /* @kind font */
  --fs-body-sm:  13px; /* @kind font */
  --fs-label:    10px;                      /* Overline  @kind font */
  --fs-micro:    9px;                       /* Icon-Bar-Label  @kind font */

  /* Laufweite */
  --ls-display:  -2px; /* @kind font */
  --ls-title:    -1px; /* @kind font */
  --ls-label:    2px; /* @kind font */
  --ls-label-wide: 3px; /* @kind font */

  /* Zeilenhöhe */
  --lh-tight:    1.05; /* @kind font */
  --lh-snug:     1.4; /* @kind font */
  --lh-body:     1.6; /* @kind font */
  --lh-legal:    2.0; /* @kind font */
}

/* ── Rollen-Klassen (optional nutzbar) ── */
.rs-display { font-family: var(--font-sans); font-weight: var(--fw-black); font-size: var(--fs-display); line-height: var(--lh-tight); letter-spacing: var(--ls-display); text-transform: uppercase; color: var(--text-strong); }
.rs-h1      { font-family: var(--font-sans); font-weight: var(--fw-black); font-size: var(--fs-h1); line-height: var(--lh-tight); letter-spacing: var(--ls-title); text-transform: uppercase; color: var(--text-strong); }
.rs-h2      { font-family: var(--font-sans); font-weight: var(--fw-black); font-size: var(--fs-h2); line-height: var(--lh-tight); letter-spacing: var(--ls-title); text-transform: uppercase; color: var(--text-strong); }
.rs-h3      { font-family: var(--font-sans); font-weight: var(--fw-extra); font-size: var(--fs-h3); line-height: var(--lh-snug); letter-spacing: 0.5px; text-transform: uppercase; color: var(--text-strong); }
.rs-label   { font-family: var(--font-sans); font-weight: var(--fw-extra); font-size: var(--fs-label); line-height: 1; letter-spacing: var(--ls-label-wide); text-transform: uppercase; color: var(--label); }
.rs-lead    { font-family: var(--font-sans); font-weight: var(--fw-regular); font-size: var(--fs-lead); line-height: var(--lh-body); color: var(--text-body); }
.rs-body    { font-family: var(--font-sans); font-weight: var(--fw-regular); font-size: var(--fs-body); line-height: var(--lh-body); color: var(--text-body); }