$font-family-primary: "IBM Plex Sans", sans-serif !default;
$font-family-secondary: SFMono-Regular, Menlo, Monaco, Consolas, "Roboto Mono",
  "Ubuntu Mono", "Lucida Console", "Courier New", monospace !default;

// Base font sizes
//
// Restructured to the VARStreet listing-page scale. The spec supplies six
// steps (11/12/13/14/18/22) and the ladder has six slots above `xxs`, so each
// spec value lands on exactly one existing name and the scale stays monotonic:
//
//   xxs  10px  — was 8px; raised so the 1px cadence holds at the bottom
//   xs   11px  — was 10px  (--vs-font-size-xs)   badges, helper text
//   sm   12px  — was 11px  (--vs-font-size-sm)   labels, column headers
//   md   13px  — was 12px  (--vs-font-size-md)   grid body, controls
//   lg   14px  — unchanged (--vs-font-size-base) page/body default
//   xl   18px  — was 16px  (--vs-font-size-lg)   section headings
//   xxl  22px  — was 18px  (--vs-font-size-xl)   page title
//
// `lg` keeping its 14px is what makes this safe: it is the most-used step in
// the consuming app, and it is also the spec's body size.
$font-size-xxs: 10px !default;
$font-size-xs: 11px !default;
$font-size-sm: 12px !default;
$font-size-md: 13px !default;
$font-size-lg: 14px !default;
$font-size-xl: 18px !default;
$font-size-xxl: 22px !default;

// The spec's `--vs-font-size-base`: the page default, which is `lg` on this
// ladder. Declared as an alias rather than a new step so there is one 14px.
$font-size-base: $font-size-lg !default;

// Heading font sizes
//
// A UI scale, not a document scale. These were a Bootstrap-shaped rem ladder —
// 1rem to 2.5rem, so 16px to 40px — which is sized for an article on a page of
// 16px body text. This is a back-office application whose body size is
// `$font-size-lg` (14px) and whose densest text is 11px; a 40px H1 on a screen
// like that is a banner, not a heading, which is why nothing in any of the four
// packages ever used one of these.
//
// The scale is now stated in px against the ladder above, and four of the six
// steps ARE that ladder — only H1 and H3 need a size of their own. Each step is
// one to two pixels, which is what separates a heading from its neighbours at
// this density; the weight below is what makes it read as a heading at all,
// especially for H4–H6, which sit at or under the body size on purpose.
//
//   h1  20px   section title — the largest type the design system offers
//   h2  18px   $font-size-xl
//   h3  16px
//   h4  14px   $font-size-lg — the body size, distinguished by weight alone
//   h5  13px   $font-size-md
//   h6  12px   $font-size-sm — an overline / caption heading
$font-size-h1: 20px !default;
$font-size-h2: $font-size-xl !default;
$font-size-h3: 16px !default;
$font-size-h4: $font-size-lg !default;
$font-size-h5: $font-size-md !default;
$font-size-h6: $font-size-sm !default;

// Their leading and weight are declared with the ramps they belong to, at the
// foot of this file — `$font-weight-heading` cannot be stated here because the
// weight it aliases is not declared yet.

// The same six, keyed by level, for loop-based generation — this is what the
// `qo-h1` … `qo-h6` utilities are built from. Keys are the generated class
// suffixes and must stay as they are, exactly like `$spacers` below. The
// variables above remain the place to override a single step: each is
// `!default`, and this map reads them.
$heading-sizes: (
  1: $font-size-h1,
  2: $font-size-h2,
  3: $font-size-h3,
  4: $font-size-h4,
  5: $font-size-h5,
  6: $font-size-h6,
) !default;

// Line heights
//
// Paired with the size of the same name. Values are unchanged — the spec does
// not declare line height as a variable — with `base` added from the listing
// page's body rule (line-height: 1.4).
$line-height-xxs: 1.25 !default;
$line-height-xs: 1.3 !default;
$line-height-sm: 1.27 !default;
$line-height-md: 1.33 !default;
$line-height-lg: 1.29 !default;
$line-height-xl: 1.31 !default;
$line-height-xxl: 1.28 !default;
$line-height-base: 1.4 !default;

// Font weights
$font-weight-light: 300 !default;
$font-weight-regular: 400 !default;
$font-weight-medium: 500 !default;
$font-weight-semibold: 600 !default;
$font-weight-bold: 700 !default;
$font-weight-extrabold: 800 !default;

// Headings — one leading and one weight for all six steps.
//
// A heading is short, usually one line, so the per-size line heights above buy
// nothing here and would be six more values to keep in sync. Tight, so a
// heading that does wrap onto two lines does not open a gap the size of a blank
// line between them.
//
// The weight is what makes H4, H5 and H6 read as headings at all: they sit at
// or below the body size, so size alone cannot carry them.
$line-height-heading: 1.3 !default;
$font-weight-heading: $font-weight-semibold !default;