/* ============================================================
   THE SYD — TYPOGRAPHY TOKENS
   Serif (PT Serif sub for Imperial URW) carries copy & display.
   Mono (Cutive Mono sub for Prestige Elite) carries labels,
   eyebrows, taglines, CTAs — always UPPERCASE, letterspaced.
   ============================================================ */

:root {
  /* ---- Type scale (rem, 1rem = 16px) ---- */
  --text-2xs:  0.6875rem;  /* 11px — fine print */
  --text-xs:   0.75rem;    /* 12px — captions, mono labels */
  --text-sm:   0.875rem;   /* 14px */
  --text-base: 1rem;       /* 16px — body */
  --text-md:   1.125rem;   /* 18px — lead body */
  --text-lg:   1.375rem;   /* 22px */
  --text-xl:   1.75rem;    /* 28px */
  --text-2xl:  2.25rem;    /* 36px — section titles */
  --text-3xl:  3rem;       /* 48px */
  --text-4xl:  4rem;       /* 64px — page headlines */
  --text-5xl:  5.5rem;     /* 88px — hero display */

  /* ---- Weights ---- */
  --weight-regular: 400;
  --weight-bold:    700;

  /* ---- Line heights ---- */
  --leading-tight:   1.08;  /* display headlines */
  --leading-snug:    1.25;  /* sub-heads */
  --leading-normal:  1.55;  /* body copy */
  --leading-relaxed: 1.7;

  /* ---- Letter spacing ---- */
  --tracking-tight:  -0.01em;
  --tracking-normal: 0;
  --tracking-label:  0.22em;   /* mono eyebrows / nav */
  --tracking-wide:   0.3em;    /* taglines "TAG LINE GOES HERE" */

  /* ============================================================
     SEMANTIC TYPE ROLES
     ============================================================ */

  /* Display / headlines — serif */
  --type-hero:       var(--weight-regular) var(--text-5xl)/var(--leading-tight) var(--font-display);
  --type-h1:         var(--weight-regular) var(--text-4xl)/var(--leading-tight) var(--font-display);
  --type-h2:         var(--weight-regular) var(--text-3xl)/var(--leading-tight) var(--font-display);
  --type-h3:         var(--weight-bold)    var(--text-2xl)/var(--leading-snug) var(--font-display);
  --type-h4:         var(--weight-bold)    var(--text-xl)/var(--leading-snug)  var(--font-display);

  /* Body — serif */
  --type-lead:       var(--weight-regular) var(--text-md)/var(--leading-normal) var(--font-body);
  --type-body:       var(--weight-regular) var(--text-base)/var(--leading-normal) var(--font-body);
  --type-small:      var(--weight-regular) var(--text-sm)/var(--leading-normal) var(--font-body);

  /* Labels — mono, uppercase + tracking applied in component */
  --type-eyebrow:    var(--weight-regular) var(--text-xs)/1.4 var(--font-label);
  --type-nav:        var(--weight-regular) var(--text-sm)/1 var(--font-label);
  --type-tagline:    var(--weight-regular) var(--text-base)/1.4 var(--font-label);
  --type-button:     var(--weight-regular) var(--text-sm)/1 var(--font-label);

  /* ============================================================
     PRINT / EDITORIAL SCALE  (from the Artist Template guide)
     ------------------------------------------------------------
     In print artifacts the roles flip from the web: SERIF carries
     headlines only; MONO carries the body copy. Sizes below are the
     brand's print-tested values (pt). 5×7in cards, 0.125in bleed.
     ============================================================ */
  --print-headline-1: 32pt;   /* @kind font */
  --print-headline-2: 28pt;   /* @kind font */
  --print-headline-3: 24pt;   /* @kind font */
  --print-body-lg:    14pt;   /* @kind font */
  --print-body-md:    12pt;   /* @kind font */
  --print-body-sm:    10pt;   /* @kind font */
  --print-leading-lg: 16pt;
  --print-leading-md: 16pt;
  --print-leading-sm: 14pt;
}