/* ============================================================
   Mille Mentors — Typography
   ------------------------------------------------------------
   Display typeface (brand): Yowza Display by Blaze Type.
   Substituted here with Bricolage Grotesque until the licensed
   files are installed (see tokens/fonts.css).

   Principle from the créative playbook: « Structurer sans
   écraser » — structure without crushing. Type guides, it does
   not impose. Generous air, clear hierarchy, calm rhythm.
   ============================================================ */

:root {
  /* ---- Families ---- */
  --font-display: 'Bricolage Grotesque', 'Yowza Display', system-ui, sans-serif;
  --font-text:    'Hanken Grotesk', system-ui, -apple-system, sans-serif;

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

  /* ---- Type scale (1.25 major-third, 16px base) ---- */
  --text-2xs:   0.6875rem;  /* 11px — micro labels      */
  --text-xs:    0.75rem;    /* 12px — captions          */
  --text-sm:    0.875rem;   /* 14px — secondary UI       */
  --text-base:  1rem;       /* 16px — body               */
  --text-md:    1.125rem;   /* 18px — lead body          */
  --text-lg:    1.375rem;   /* 22px — large body / H5    */
  --text-xl:    1.75rem;    /* 28px — H4                 */
  --text-2xl:   2.25rem;    /* 36px — H3                 */
  --text-3xl:   3rem;       /* 48px — H2                 */
  --text-4xl:   4rem;       /* 64px — H1                 */
  --text-5xl:   5.5rem;     /* 88px — display            */
  --text-6xl:   7.5rem;     /* 120px — hero display      */

  /* ---- Line heights ---- */
  --leading-tight:   1.02;  /* big display lockups       */
  --leading-snug:    1.12;  /* headings                  */
  --leading-normal:  1.5;   /* body                      */
  --leading-relaxed: 1.65;  /* long-form reading         */

  /* ---- Letter spacing ---- */
  --tracking-display: -0.02em;  /* tighten large display   */
  --tracking-heading: -0.01em;
  --tracking-normal:   0em;
  --tracking-wide:     0.04em;
  --tracking-eyebrow:  0.22em;   /* the airy spaced-cap label motif */
}

/* ============================================================
   Optional helper classes — convenient, not required.
   Components rely on the variables above directly.
   ============================================================ */

.mm-display {
  font-family: var(--font-display);
  font-weight: var(--weight-bold);
  font-size: var(--text-5xl);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-display);
  color: var(--text-strong);
  text-wrap: balance;
}

.mm-h1 { font-family: var(--font-display); font-weight: var(--weight-bold); font-size: var(--text-4xl); line-height: var(--leading-snug); letter-spacing: var(--tracking-heading); color: var(--text-strong); text-wrap: balance; }
.mm-h2 { font-family: var(--font-display); font-weight: var(--weight-semibold); font-size: var(--text-3xl); line-height: var(--leading-snug); letter-spacing: var(--tracking-heading); color: var(--text-strong); text-wrap: balance; }
.mm-h3 { font-family: var(--font-display); font-weight: var(--weight-semibold); font-size: var(--text-2xl); line-height: var(--leading-snug); color: var(--text-strong); text-wrap: balance; }
.mm-h4 { font-family: var(--font-display); font-weight: var(--weight-semibold); font-size: var(--text-xl); line-height: var(--leading-snug); color: var(--text-strong); }
.mm-h5 { font-family: var(--font-text); font-weight: var(--weight-semibold); font-size: var(--text-lg); line-height: var(--leading-snug); color: var(--text-strong); }

.mm-lead { font-family: var(--font-text); font-weight: var(--weight-regular); font-size: var(--text-md); line-height: var(--leading-relaxed); color: var(--text-body); }
.mm-body { font-family: var(--font-text); font-weight: var(--weight-regular); font-size: var(--text-base); line-height: var(--leading-normal); color: var(--text-body); }
.mm-small { font-family: var(--font-text); font-weight: var(--weight-regular); font-size: var(--text-sm); line-height: var(--leading-normal); color: var(--text-muted); }

/* The signature spaced-capital label (« p r é s e n t a t i o n ») */
.mm-eyebrow {
  font-family: var(--font-text);
  font-weight: var(--weight-semibold);
  font-size: var(--text-xs);
  line-height: 1;
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--color-primary);
}
