/* /public/css/tokens-typography.css */
:root {
  /* Families */
  --font-sans: "Poppins", ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
    Arial, 'Noto Sans', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
    'Liberation Mono', 'Courier New', monospace;

  /* Base sizing */
  --font-size-root: 16px;
  /* 1rem */
  --line-height-tight: 1.15;
  --line-height-default: 1.5;
  --line-height-relaxed: 1.7;
  --measure: 65ch;
  /* largura ideal de parágrafo */

  /* Weights */
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  /* Escala fixa (rem) — referência Bootstrap 5 */
  --fs-h1: 2.5rem;
  /* 40px  — ~Bootstrap h1 */
  --fs-h2: 2rem;
  /* 32px  — ~Bootstrap h2 */
  --fs-h3: 1.75rem;
  /* 28px  — ~Bootstrap h3 */
  --fs-h4: 1.5rem;
  /* 24px  — ~Bootstrap h4 */
  --fs-h5: 1.25rem;
  /* 20px  — ~Bootstrap h5 */
  --fs-h6: 1rem;
  /* 16px  — ~Bootstrap h6 */
  --fs-p: 1rem;
  /* 16px */
  --fs-lead: 1.25rem;
  /* 20px  — Bootstrap .lead */
  --fs-small: 0.875rem;
  /* 14px — Bootstrap .small */
  --fs-subtle: 0.8125rem;
  /* 13px */

  /* Escala fluída (clamp) — equivalente ao RFS do Bootstrap 5+ */
  /* Os valores baixos aproximam mobile; altos aproximam desktop widescreen */
  --ffs-h1: clamp(2rem, 1.2rem + 3vw, 3rem);
  /* ~32 → 48 */
  --ffs-h2: clamp(1.75rem, 1.1rem + 2vw, 2.5rem);
  /* ~28 → 40 */
  --ffs-h3: clamp(1.5rem, 1rem + 1.5vw, 2rem);
  /* ~24 → 32 */
  --ffs-h4: clamp(1.25rem, 0.9rem + 1vw, 1.5rem);
  /* ~20 → 24 */
  --ffs-h5: clamp(1.125rem, 0.95rem + 0.6vw, 1.25rem);
  /* ~18 → 20 */
  --ffs-h6: clamp(1rem, 0.95rem + 0.2vw, 1.0625rem);
  /* ~16 → 17 */
  --ffs-p: clamp(1rem, 0.96rem + 0.2vw, 1.0625rem);
  /* ~16 → 17 */
  --ffs-lead: clamp(1.125rem, 1rem + 0.8vw, 1.5rem);
  /* ~18 → 24 */
  --ffs-small: clamp(0.875rem, 0.85rem + 0.2vw, 0.9375rem);
  /* 14 → 15 */

  /* Cores comuns (puxe do seu tokens.css se já tem) */
  --text: #221f28;
  --text-muted: #6b647c;
  /* cinza roxo elegante */
  --surface: #ffffff;
  --border-subtle: #e7e4ee;
  --accent: #a04ad9;
  /* seu Violet Core */
}