:root{
  --font-display:"Chakra Petch","Conduit 2 Italics BRK",system-ui,sans-serif;
  --font-text:"Space Grotesk","PP Gosha Sans",system-ui,sans-serif;
  --font-mono:"Space Grotesk",ui-monospace,monospace;

  --fs-display-xl:clamp(56px,11vw,148px); /* @kind font */
  --fs-display-lg:clamp(40px,7vw,88px); /* @kind font */
  --fs-display-md:clamp(30px,4.4vw,56px); /* @kind font */
  --fs-title-lg:32px; /* @kind font */
  --fs-title-md:24px; /* @kind font */
  --fs-title-sm:19px; /* @kind font */
  --fs-body-lg:18px; /* @kind font */
  --fs-body:16px; /* @kind font */
  --fs-body-sm:14px; /* @kind font */
  --fs-caption:12px; /* @kind font */
  --fs-micro:11px; /* @kind font */

  --lh-display:0.86; /* @kind font */
  --lh-title:1.1; /* @kind font */
  --lh-body:1.5; /* @kind font */
  --lh-tight:1.25; /* @kind font */

  --ls-display:-0.02em; /* @kind font */
  --ls-title:-0.01em; /* @kind font */
  --ls-body:0em; /* @kind font */
  --ls-caps:0.16em; /* @kind font */
  --ls-caps-wide:0.3em; /* @kind font */

  --fw-regular:400; /* @kind font */
  --fw-medium:500; /* @kind font */
  --fw-bold:700; /* @kind font */

  /* semantic type roles */
  --type-hero:italic var(--fw-bold) var(--fs-display-xl)/var(--lh-display) var(--font-display); /* @kind font */
  --type-section:italic var(--fw-bold) var(--fs-display-md)/var(--lh-title) var(--font-display); /* @kind font */
  --type-eyebrow:var(--fw-bold) var(--fs-micro)/1.2 var(--font-text); /* @kind font */
  --type-body:var(--fw-regular) var(--fs-body)/var(--lh-body) var(--font-text); /* @kind font */
}