:root {
  --step--2: clamp(0.75rem, calc(0.729rem + 0.093vw), 0.812rem);
  --step--1: clamp(0.875rem, calc(0.854rem + 0.093vw), 0.938rem);
  --step-0:  clamp(1rem, calc(0.958rem + 0.185vw), 1.125rem);
  --step-1:  clamp(1.188rem, calc(1.125rem + 0.278vw), 1.375rem);
  --step-2:  clamp(1.375rem, calc(1.25rem + 0.556vw), 1.75rem);
  --step-3:  clamp(1.625rem, calc(1.438rem + 0.833vw), 2.188rem);
  --step-4:  clamp(1.938rem, calc(1.667rem + 1.204vw), 2.75rem);
  --step-5:  clamp(2.25rem, calc(1.854rem + 1.759vw), 3.438rem);
  --step-6:  clamp(2.5rem, calc(1.5rem + 4.444vw), 5.5rem);
  --text-fine: var(--step--2);
  --text-ui: var(--step--1);
  --text-body: var(--step-0);
  --text-lead: var(--step-1);
  --text-h4: var(--step-1);
  --text-h3: var(--step-2);
  --text-h2: var(--step-3);
  --text-h1: var(--step-4);
  --text-statement: var(--step-5);
  --text-display: var(--step-6);
  --lh-latin: 1.5;
  --lh-arabic: 1.7;
  --lh-long: 1.65;
  --lh-ui: 1.3;
  --lh-display: 1.08;
  --measure: 65ch;
  --measure-narrow: 50ch;
  --measure-wide: 75ch;
  --tracking-display: -0.02em;
  --tracking-eyebrow: 0.08em;
  --font-body: var(--font-body-latin, system-ui, sans-serif);
  --font-display: var(--font-display-latin, var(--font-body));
}
html { font-size: 100%; }
body {
  font-family: var(--font-body);
  font-size: var(--text-body);
  line-height: var(--lh-latin);
  text-rendering: optimizeLegibility;
}
h1, h2, h3, h4 {
  font-family: var(--font-display);
  line-height: var(--lh-display);
  text-wrap: balance;
}
h1 { font-size: var(--text-h1); letter-spacing: var(--tracking-display); }
h2 { font-size: var(--text-h2); letter-spacing: var(--tracking-display); }
h3 { font-size: var(--text-h3); }
h4 { font-size: var(--text-h4); line-height: var(--lh-ui); }
.text-display {
  font-family: var(--font-display);
  font-size: var(--text-display);
  line-height: var(--lh-display);
  letter-spacing: var(--tracking-display);
}
.text-lead { font-size: var(--text-lead); line-height: var(--lh-long); }
.text-ui { font-size: var(--text-ui); line-height: var(--lh-ui); }
.text-fine { font-size: var(--text-fine); line-height: 1.45; }
.prose { max-width: var(--measure); }
.prose > * + * { margin-block-start: 1em; }
.prose p { text-wrap: pretty; }
.eyebrow {
  font-size: var(--text-ui);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
}
[dir="rtl"] {
  --step-0: clamp(1.169rem, calc(1.142rem + 0.12vw), 1.25rem);
  line-height: var(--lh-arabic);
  --measure: 58ch;
  --font-display: var(--font-display-ar, var(--font-body-ar, var(--font-body)));
  --font-body: var(--font-body-ar, system-ui, sans-serif);
  --body: var(--font-body-ar, system-ui, sans-serif);
}
[dir="ltr"] body { line-height: var(--lh-latin); }
[dir="rtl"] body { line-height: var(--lh-arabic); }
[dir="rtl"] .eyebrow,
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] .text-display { letter-spacing: normal; }
[dir="rtl"] .eyebrow { text-transform: none; }
