:root {
  /* Colors */
  --color-pulp-cream: #f6f4f2;
  --color-graphite-veil: #e4e3e2;
  --color-mid-ash: #8c8c8c;
  --color-ink-black: #141414;
  --color-charcoal-press: #232323;
  --color-vapor: #ffffff;
  --color-null: #000000;
  --color-ember-diode: #e66f27;

  /* Typography — Font Families */
  --font-sl-regular-condensed-custom-superlative-condensed: 'SL-Regular-Condensed (custom: Superlative Condensed)', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-sl-light-custom-superlative-light: 'SL-Light (custom: Superlative Light)', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-sl-regular-custom-superlative-regular: 'SL-Regular (custom: Superlative Regular)', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* Typography — Scale */
  --text-caption: 15px;
  --leading-caption: 1;
  --tracking-caption: 1.2px;
  --text-heading: 23px;
  --leading-heading: 1.33;
  --tracking-heading: 1.84px;
  --text-subheading: 25px;
  --leading-subheading: 1.2;
  --text-display: 90px;
  --leading-display: 1;
  --tracking-display: 7.2px;

  /* Typography — Weights */
  --font-weight-regular: 400;

  /* Spacing */
  --spacing-unit: 8px;
  --spacing-8: 8px;
  --spacing-120: 120px;
  --spacing-240: 240px;

  /* Layout */
  --section-gap: 60-120px;
  --card-padding: 30px;
  --element-gap: 15px;

  /* Border Radius */
  --radius-sm: 3px;
  --radius-2xl: 15px;

  /* Named Radii */
  --radius-cards: 0px;
  --radius-badges: 15px;
  --radius-buttons: 3px;

  /* Surfaces */
  --surface-pulp-cream-canvas: #f6f4f2;
  --surface-graphite-veil: #e4e3e2;
  --surface-charcoal-press: #232323;
  --surface-ink-black: #141414;
}