/* Remoby — Typography tokens
   Manrope carries all display + body. Space Grotesk is the label/eyebrow
   voice (medium, occasionally tracked +0.02em). Outfit appears only on
   secondary/white buttons. Sizes are the exact values used in-file. */

:root {
  /* ---- Families ---- */
  --font-primary:   "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-label:     "Space Grotesk", "Manrope", -apple-system, sans-serif;
  --font-secondary: "Outfit", "Manrope", -apple-system, sans-serif;

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

  /* ---- Size scale (px) ---- */
  --fs-10: 10px;
  --fs-12: 12px;
  --fs-14: 14px;
  --fs-16: 16px;
  --fs-18: 18px;
  --fs-20: 20px;
  --fs-24: 24px;
  --fs-32: 32px;
  --fs-40: 40px;
  --fs-48: 48px;
  --fs-52: 52px;
  --fs-72: 72px;
  --fs-84: 84px;

  /* ---- Line heights ---- */
  --lh-tight:   1.0;    /* @kind other */    /* hero display */
  --lh-snug:    1.1;    /* @kind other */    /* large headings */
  --lh-heading: 1.2;    /* @kind other */    /* section headings, labels */
  --lh-body:    1.4;    /* @kind other */    /* UI copy */
  --lh-relaxed: 1.5;    /* @kind other */    /* long-form paragraphs */

  /* ---- Tracking ---- */
  --tracking-tight:  -0.01em;  /* display + primary buttons */
  --tracking-label:  0.02em;   /* tracked Space Grotesk tags */

  /* ---- Composite roles ---- */
  --type-display:  var(--fw-semibold) var(--fs-72)/var(--lh-tight) var(--font-primary);
  --type-h1:       var(--fw-semibold) var(--fs-48)/var(--lh-snug) var(--font-primary);
  --type-h2:       var(--fw-semibold) var(--fs-32)/var(--lh-heading) var(--font-primary);
  --type-h3:       var(--fw-semibold) var(--fs-24)/var(--lh-heading) var(--font-primary);
  --type-body-lg:  var(--fw-regular) var(--fs-18)/var(--lh-relaxed) var(--font-primary);
  --type-body:     var(--fw-regular) var(--fs-16)/var(--lh-body) var(--font-primary);
  --type-eyebrow:  var(--fw-medium) var(--fs-18)/var(--lh-heading) var(--font-label);
  --type-label:    var(--fw-medium) var(--fs-14)/var(--lh-heading) var(--font-label);
}
