/* ============================================================
   Infomedia Studios — Typography
   Brand fonts:
     • Area Normal (Adobe Fonts)  — primary grotesque
     • GTF Riposte (commercial)   — accent serif (links, flourishes)
   Substitutes (free):
     • Area Normal  -> DM Sans  (self-hosted variable TTF — see tokens/fonts.css)
     • GTF Riposte  -> Newsreader (Google Fonts — see tokens/fonts.css)
   @font-face / @import live in tokens/fonts.css.
   ============================================================ */

:root {
  /* Families */
  --font-sans: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-serif: 'Newsreader', Georgia, 'Times New Roman', serif;

  /* Weights (mapped from Area Normal) */
  --fw-regular: 400;   /* @kind font */
  --fw-semibold: 600;  /* @kind font */
  --fw-bold: 700;      /* @kind font */
  --fw-extrabold: 700; /* @kind font */ /* DM Sans tops out at 700; Area Normal ExtraBold maps here */

  /* ---- Type scale (size) ---- */
  --fs-h1: 80px;     /* @kind font */ /* Area Normal SemiBold */
  --fs-h2: 62px;     /* @kind font */ /* Area Normal Bold */
  --fs-h3: 40px;     /* @kind font */ /* Area Normal Regular / Bold */
  --fs-h4: 20px;     /* @kind font */ /* Area Normal ExtraBold, uppercase */
  --fs-large: 18px;  /* @kind font */ /* Large Paragraph — SemiBold */
  --fs-body: 14px;   /* @kind font */ /* Paragraph — Regular */
  --fs-button: 14px; /* @kind font */ /* Buttons — Bold, uppercase */
  --fs-link: 18px;   /* @kind font */ /* Text Links — Bold */
  --fs-quote: 25px;  /* @kind font */ /* Testimonials — Regular */

  /* ---- Line heights ---- */
  --lh-h1: 1.0;     /* @kind other */
  --lh-h2: 1.1;     /* @kind other */
  --lh-h3: 1.2;     /* @kind other */
  --lh-h4: 1.3;     /* @kind other */
  --lh-large: 1.33; /* @kind other */
  --lh-body: 1.4;   /* @kind other */
  --lh-link: 1.33;  /* @kind other */
  --lh-quote: 1.4;  /* @kind other */

  /* ---- Letter spacing ---- */
  --ls-tight: -0.02em;  /* large headings */
  --ls-label: 0.05em;   /* H4 / wordmark / eyebrows */
  --ls-caps: 0.06em;    /* buttons + chips (uppercase) */
  --ls-body: 0.02em;    /* body / meta */
}

/* ---- Reusable type classes ---- */
.is-h1 { font-family: var(--font-sans); font-weight: var(--fw-semibold); font-size: var(--fs-h1); line-height: var(--lh-h1); letter-spacing: var(--ls-tight); }
.is-h2 { font-family: var(--font-sans); font-weight: var(--fw-bold); font-size: var(--fs-h2); line-height: var(--lh-h2); letter-spacing: var(--ls-tight); }
.is-h3 { font-family: var(--font-sans); font-weight: var(--fw-regular); font-size: var(--fs-h3); line-height: var(--lh-h3); letter-spacing: var(--ls-tight); }
.is-h3-bold { font-family: var(--font-sans); font-weight: var(--fw-bold); font-size: var(--fs-h3); line-height: var(--lh-h3); letter-spacing: var(--ls-tight); }
.is-h4 { font-family: var(--font-sans); font-weight: var(--fw-extrabold); font-size: var(--fs-h4); line-height: var(--lh-h4); letter-spacing: var(--ls-label); text-transform: uppercase; }
.is-large { font-family: var(--font-sans); font-weight: var(--fw-semibold); font-size: var(--fs-large); line-height: var(--lh-large); }
.is-body { font-family: var(--font-sans); font-weight: var(--fw-regular); font-size: var(--fs-body); line-height: var(--lh-body); letter-spacing: var(--ls-body); }
.is-button { font-family: var(--font-sans); font-weight: var(--fw-bold); font-size: var(--fs-button); letter-spacing: var(--ls-caps); text-transform: uppercase; }
.is-link { font-family: var(--font-sans); font-weight: var(--fw-bold); font-size: var(--fs-link); line-height: var(--lh-link); }
.is-quote { font-family: var(--font-sans); font-weight: var(--fw-regular); font-size: var(--fs-quote); line-height: var(--lh-quote); }
.is-serif { font-family: var(--font-serif); }