/* OLS type scale. Mobile-first (390px). Numerals are display objects, not body text. */
:root{
  /* weights — Graphik ships 9; we use 4 */
  --weight-light: 300; /* @kind font */
  --weight-regular: 400; /* @kind font */
  --weight-medium: 500; /* @kind font */
  --weight-bold: 700; /* @kind font */

  /* ---- digital scale (px, mobile-first) ---- */
  --text-display: 40px;   --lh-display: 0.98; /* @kind other */  --ls-display: -0.028em; /* @kind spacing */
  --text-h1: 32px;        --lh-h1: 1.04; /* @kind other */       --ls-h1: -0.022em; /* @kind spacing */
  --text-h2: 26px;        --lh-h2: 1.10; /* @kind other */       --ls-h2: -0.018em; /* @kind spacing */
  --text-h3: 21px;        --lh-h3: 1.18; /* @kind other */       --ls-h3: -0.012em; /* @kind spacing */
  --text-lead: 17px;      --lh-lead: 1.42; /* @kind other */     --ls-lead: -0.006em; /* @kind spacing */
  --text-body: 15px;      --lh-body: 1.50; /* @kind other */     --ls-body: 0em; /* @kind spacing */
  --text-caption: 13px;   --lh-caption: 1.38; /* @kind other */  --ls-caption: 0em; /* @kind spacing */
  --text-micro: 11px;     --lh-micro: 1.30; /* @kind other */    --ls-micro: 0.06em; /* @kind spacing */

  /* ---- numerals: calories, protein, price ---- */
  --numeral-hero: 56px;   --numeral-lg: 34px;  --numeral-md: 24px;  --numeral-sm: 18px;
  --lh-numeral: 0.92; /* @kind other */     --ls-numeral: -0.04em; /* @kind spacing */
  --unit-size: 11px;      --unit-ls: 0.10em; /* @kind spacing */   --unit-weight: var(--weight-medium); /* @kind font */

  /* ---- long-form reading rhythm — PARAGRAPHS ONLY (never numerals/labels/prices/buttons).
     Deliberately diverges upward from --text-body (15px UI chrome): prose is 16px. Keep the
     two tokens separate, never merge. Apply as a .prose treatment: per-paragraph size/lh +
     max-inline-size, --prose-gap between paragraphs, --space-page-end before the footer. ---- */
  --prose-size: 16px;       --prose-lh: 1.7; /* @kind other */
  --prose-size-lead: 18px;  --prose-lh-lead: 1.6; /* @kind other */
  --prose-measure: 42ch;
  --prose-measure-latin: 56ch; /* Latin glyphs are narrower — 56 Latin ch ≈ the physical line-width of 42 Arabic ch */
  --prose-gap: 1.15em;

  /* ---- social / print scale from the brand book's 40px grid ---- */
  --social-content: 26.5pt; /* @kind font */   /* 0.5x */
  --social-head: 54.5pt; /* @kind font */      /* 3x   */
  --social-display: 80pt; /* @kind font */     /* 4x   */
}
@media (min-width: 820px){
  :root{
    --text-display: 72px; --text-h1: 48px; --text-h2: 34px; --text-h3: 24px;
    --text-lead: 19px; --text-body: 16px; --text-caption: 14px;
    --numeral-hero: 88px; --numeral-lg: 46px; --numeral-md: 28px;
    --prose-measure: 66ch;
    --prose-measure-latin: 66ch;
  }
}