/* Type. Two families with a hard division of labour.

   Neue Haas Grotesk — display only, Medium 500 or Bold 700, nothing else.
   Medium carries names and case study titles; Bold carries statements and
   section heads. Set tight and large; it is drawn to be crowded.

   Inter — body, UI, labels, numerals. Full 100–900 range available. */
:root{
  --font-display:"Neue Haas Grotesk","Helvetica Neue",Helvetica,Arial,sans-serif;
  --font-body:"Inter","Helvetica Neue",Helvetica,Arial,sans-serif;

  /* display weights — the only two that exist */
  --fw-display-medium:500; /* @kind font */
  --fw-display-bold:700; /* @kind font */

  /* body weights */
  --fw-light:300; /* @kind font */
  --fw-regular:400; /* @kind font */
  --fw-medium:500; /* @kind font */
  --fw-semibold:600; /* @kind font */
  --fw-bold:700; /* @kind font */

  /* static ramp */
  --fs-3xs:11px; /* @kind font */
  --fs-2xs:12px; /* @kind font */
  --fs-xs:13px; /* @kind font */
  --fs-sm:15px; /* @kind font */
  --fs-md:17px; /* @kind font */
  --fs-lg:20px; /* @kind font */
  --fs-xl:24px; /* @kind font */
  --fs-2xl:32px; /* @kind font */
  --fs-3xl:44px; /* @kind font */
  --fs-4xl:60px; /* @kind font */
  --fs-5xl:84px; /* @kind font */
  --fs-6xl:120px; /* @kind font */

  /* fluid display ramp */
  --fs-hero:clamp(46px,7.8vw,132px); /* @kind font */
  --fs-case:clamp(40px,6.2vw,104px); /* @kind font */
  --fs-section:clamp(30px,4.2vw,68px); /* @kind font */
  --fs-statement:clamp(28px,3.8vw,60px); /* @kind font */
  --fs-marquee:clamp(64px,11vw,190px); /* @kind font */

  --lh-tight:0.90; /* @kind font */
  --lh-snug:1.02; /* @kind font */
  --lh-heading:1.12; /* @kind font */
  --lh-body:1.52; /* @kind font */
  --lh-loose:1.64; /* @kind font */

  --ls-mega:-0.038em; /* @kind font */
  --ls-display:-0.026em; /* @kind font */
  --ls-heading:-0.016em; /* @kind font */
  --ls-body:-0.006em; /* @kind font */
  --ls-label:0.06em; /* @kind font */
  --ls-caps:0.16em; /* @kind font */

  /* semantic roles */
  --type-hero:var(--fw-display-medium) var(--fs-hero)/var(--lh-tight) var(--font-display); /* @kind font */
  --type-case:var(--fw-display-medium) var(--fs-case)/var(--lh-tight) var(--font-display); /* @kind font */
  --type-statement:var(--fw-display-bold) var(--fs-statement)/var(--lh-snug) var(--font-display); /* @kind font */
  --type-section:var(--fw-display-bold) var(--fs-section)/var(--lh-snug) var(--font-display); /* @kind font */
  --type-marquee:var(--fw-display-bold) var(--fs-marquee)/0.86 var(--font-display); /* @kind font */
  --type-subhead:var(--fw-display-bold) var(--fs-xl)/var(--lh-heading) var(--font-display); /* @kind font */

  --type-title:var(--fw-semibold) var(--fs-lg)/var(--lh-heading) var(--font-body); /* @kind font */
  --type-body:var(--fw-regular) var(--fs-md)/var(--lh-body) var(--font-body); /* @kind font */
  --type-body-sm:var(--fw-regular) var(--fs-sm)/var(--lh-body) var(--font-body); /* @kind font */
  --type-label:var(--fw-medium) var(--fs-2xs)/1.2 var(--font-body); /* @kind font */
  --type-pill:var(--fw-medium) var(--fs-xs)/1 var(--font-body); /* @kind font */
}
