/* Syfröst — typography. Barlow (UI/body), Roboto Slab (editorial accents), JetBrains Mono (code, tool calls). Logo fonts are logo-only. */
:root {
  --font-family-body: 'Barlow', system-ui, sans-serif;
  --font-family-heading: 'Barlow', system-ui, sans-serif;
  --font-family-accent: 'Roboto Slab', Georgia, serif;
  --font-family-mono: 'JetBrains Mono', ui-monospace, Menlo, monospace;
  --font-family-logo: 'Baloo 2', 'Barlow', sans-serif; /* LOGO ONLY */

  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  --font-size-2xs: 0.6875rem; /* 11px */
  --font-size-xs: 0.75rem;    /* 12px */
  --font-size-sm: 0.875rem;   /* 14px */
  --font-size-base: 1rem;     /* 16px */
  --font-size-md: 1.125rem;   /* 18px */
  --font-size-lg: 1.25rem;    /* 20px */
  --font-size-xl: 1.625rem;   /* 26px */
  --font-size-2xl: clamp(1.75rem, 1.4rem + 1.2vw, 2.25rem); /* @kind other */  /* 28 → 36px */
  --font-size-3xl: clamp(2.25rem, 1.6rem + 2.4vw, 3.25rem); /* @kind other */  /* 36 → 52px */
  --font-size-4xl: clamp(2.75rem, 1.6rem + 4.2vw, 4.5rem); /* @kind other */   /* 44 → 72px */

  --line-height-tight: 1.05;
  --line-height-snug: 1.2;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.7;

  --letter-spacing-tight: -0.02em;
  --letter-spacing-snug: -0.01em;
  --letter-spacing-eyebrow: 0.14em;
  --letter-spacing-caps: 0.08em;

  /* Heading composites (font shorthand). Colors: see readme — Display/H1 deep blue, H5 vivid gradient text. */
  --heading-display: var(--font-weight-semibold) var(--font-size-4xl)/var(--line-height-tight) var(--font-family-accent);
  --heading-h1: var(--font-weight-semibold) var(--font-size-3xl)/1.08 var(--font-family-accent);
  --heading-h2: var(--font-weight-semibold) var(--font-size-2xl)/1.12 var(--font-family-heading);
  --heading-h3: var(--font-weight-medium) var(--font-size-xl)/var(--line-height-snug) var(--font-family-accent);
  --heading-h4: var(--font-weight-semibold) var(--font-size-lg)/1.3 var(--font-family-heading);
  --heading-h5: var(--font-weight-bold) var(--font-size-xs)/1.3 var(--font-family-heading); /* eyebrow, uppercase */
  --heading-h6: var(--font-weight-semibold) var(--font-size-2xs)/1.3 var(--font-family-heading); /* label, uppercase */

  --body-lead: var(--font-weight-regular) var(--font-size-md)/var(--line-height-relaxed) var(--font-family-body);
  --body-default: var(--font-weight-regular) var(--font-size-base)/var(--line-height-normal) var(--font-family-body);
  --body-small: var(--font-weight-regular) var(--font-size-sm)/var(--line-height-normal) var(--font-family-body);
  --body-caption: var(--font-weight-medium) var(--font-size-xs)/1.4 var(--font-family-body);
  --code-default: var(--font-weight-regular) var(--font-size-sm)/1.6 var(--font-family-mono);
  --code-small: var(--font-weight-regular) var(--font-size-xs)/1.55 var(--font-family-mono);

  --button-font-weight: 600;
  --button-font-size: 0.9375rem; /* 15px */
}