/* ===========================================================================
   Pertineo — Typography
   Maps SwiftUI Dynamic Type roles (.title, .body, .caption ...) to web tokens.
   Sizes follow iOS Large (default) Dynamic Type. The app leans on weight
   (.bold / .semibold) and uppercase tracking for hierarchy, not many sizes.
   ========================================================================== */
:root {
  --font-family-base: var(--font-system);

  /* Type scale (role : size / line-height) — iOS Dynamic Type, Large */
  --text-largetitle: 34px;   --lh-largetitle: 41px;
  --text-title: 28px;        --lh-title: 34px;
  --text-title2: 22px;       --lh-title2: 28px;
  --text-title3: 20px;       --lh-title3: 25px;
  --text-headline: 17px;     --lh-headline: 22px;   /* semibold body         */
  --text-body: 17px;         --lh-body: 22px;
  --text-callout: 16px;      --lh-callout: 21px;
  --text-subheadline: 15px;  --lh-subheadline: 20px;
  --text-footnote: 13px;     --lh-footnote: 18px;
  --text-caption: 12px;      --lh-caption: 16px;
  --text-caption2: 11px;     --lh-caption2: 13px;
  --text-micro: 10px;        --lh-micro: 12px;       /* tab labels            */
  --text-nano: 9px;          --lh-nano: 11px;        /* dense badge labels    */

  /* Weights (SF Pro) */
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  /* Letter-spacing (tracking) — used on uppercase eyebrow/labels */
  --tracking-tight: -0.2px;
  --tracking-normal: 0;
  --tracking-label: 0.4px;   /* tab labels                                   */
  --tracking-wide: 0.8px;    /* section eyebrows                             */
  --tracking-brand: 2px;     /* "PERTINEO" wordmark                          */
}

/* Optional helper classes (specimens / quick prototyping) */
.pt-title       { font: var(--weight-bold) var(--text-title)/var(--lh-title) var(--font-family-base); color: var(--label); }
.pt-title2      { font: var(--weight-bold) var(--text-title2)/var(--lh-title2) var(--font-family-base); color: var(--label); }
.pt-headline    { font: var(--weight-semibold) var(--text-headline)/var(--lh-headline) var(--font-family-base); color: var(--label); }
.pt-body        { font: var(--weight-regular) var(--text-body)/var(--lh-body) var(--font-family-base); color: var(--label); }
.pt-subheadline { font: var(--weight-regular) var(--text-subheadline)/var(--lh-subheadline) var(--font-family-base); color: var(--label); }
.pt-caption     { font: var(--weight-regular) var(--text-caption)/var(--lh-caption) var(--font-family-base); color: var(--label-secondary); }
.pt-eyebrow     { font: var(--weight-bold) var(--text-caption)/var(--lh-caption) var(--font-family-base);
                  text-transform: uppercase; letter-spacing: var(--tracking-wide); color: var(--label-secondary); }