/* Carbone 4 — Typography
   ----------------------------------------------------------------
   One family carries the brand: a friendly geometric-humanist sans
   (substituted with Manrope — see tokens/fonts.css). Display weights
   are heavy (700/800) and tight; body is regular/medium and roomy.
   Carbone 4's voice is precise, so type stays unfussy: no italics for
   emphasis, generous line-height, bold for weight. */
:root {
  --font-display: 'Manrope', 'Segoe UI', system-ui, sans-serif;
  --font-sans:    'Manrope', 'Segoe UI', system-ui, sans-serif;
  --font-mono:    ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  /* Weights */
  --fw-regular:  400; /* @kind font */
  --fw-medium:   500; /* @kind font */
  --fw-semibold: 600; /* @kind font */
  --fw-bold:     700; /* @kind font */
  --fw-heavy:    800; /* @kind font */

  /* Type scale (1.25 major-third-ish, tuned) */
  --fs-display:  clamp(2.6rem, 1.6rem + 3.4vw, 4rem); /* @kind other */
  --fs-h1:       2.4rem;   /* @kind font */
  --fs-h2:       1.875rem; /* @kind font */
  --fs-h3:       1.375rem; /* @kind font */
  --fs-h4:       1.125rem; /* @kind font */
  --fs-lead:     1.25rem;  /* @kind font */
  --fs-body:     1rem;     /* @kind font */
  --fs-sm:       0.875rem; /* @kind font */
  --fs-xs:       0.75rem;  /* @kind font */

  /* Line heights */
  --lh-tight:   1.08;  /* @kind font */
  --lh-snug:    1.25;  /* @kind font */
  --lh-body:    1.62;  /* @kind font */

  /* Letter spacing */
  --ls-display: -0.02em; /* @kind font */
  --ls-tight:   -0.01em; /* @kind font */
  --ls-normal:  0;       /* @kind font */
  --ls-label:   0.08em;  /* @kind font */
}

/* Optional convenience classes (tokens are the source of truth) */
.c4-display {
  font-family: var(--font-display);
  font-weight: var(--fw-heavy);
  font-size: var(--fs-display);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-display);
  color: var(--text-strong);
}
.c4-h2 {
  font-family: var(--font-display);
  font-weight: var(--fw-bold);
  font-size: var(--fs-h2);
  line-height: var(--lh-snug);
  letter-spacing: var(--ls-tight);
  color: var(--text-strong);
}
.c4-kicker {
  font-family: var(--font-sans);
  font-weight: var(--fw-bold);
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: var(--accent);
}
.c4-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);
}