:root{
  --font-sans:"PT Sans","Segoe UI",Tahoma,sans-serif;
  --font-narrow:"PT Sans Narrow","PT Sans Condensed","Arial Narrow",sans-serif;

  /* Hearmeout has no display serif and no monospace face. */
  --font-body:var(--font-sans);
  --font-heading:var(--font-sans);
  --font-brand:var(--font-narrow);

  --weight-regular:400;
  --weight-bold:700;

  /* Sizes measured off the 1350px-wide mockups */
  --text-hero:54px;      /* "Talk and be heard" */
  --text-title:24px;     /* section titles: "Thanks to our partners!" */
  --text-name:22px;      /* profile / talker name */
  --text-lead:16px;      /* sub-copy under a title */
  --text-body-size:15px; /* default body + button label */
  --text-small:13px;     /* nav, footer, meta */
  --text-micro:11px;     /* counters, tiny meta */

  --leading-hero:1.05;
  --leading-tight:1.25;
  --leading-body:1.5;
  --leading-loose:1.65;

  /* All-caps UI text is always tracked out */
  --tracking-caps:.06em;
  --tracking-caps-wide:.1em;
  --tracking-normal:0;

  /* Composed roles */
  --type-hero:var(--weight-regular) var(--text-hero)/var(--leading-hero) var(--font-heading);
  --type-title:var(--weight-regular) var(--text-title)/var(--leading-tight) var(--font-heading);
  --type-page-title:var(--weight-regular) var(--text-lead)/1.4 var(--font-heading); /* caps + tracking */
  --type-body:var(--weight-regular) var(--text-body-size)/var(--leading-body) var(--font-body);
  --type-small:var(--weight-regular) var(--text-small)/1.4 var(--font-body);
  --type-nav:var(--weight-regular) var(--text-small)/1 var(--font-body);
}