@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Manrope:wght@400;500;600;700;800&display=swap');

:root {
  --font-ui: "DM Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-heading: "Manrope", var(--font-ui);
  --font-data: var(--font-ui);

  --type-display-family: var(--font-heading);
  --type-display-size: clamp(2.4rem, 4.2vw, 3.9rem);
  --type-display-weight: 800;
  --type-display-line-height: 1.05;
  --type-display-letter-spacing: -0.04em;
  --type-display-transform: none;
  --type-page-title-family: var(--font-heading);
  --type-page-title-size: clamp(2rem, 4vw, 3.15rem);
  --type-page-title-weight: 800;
  --type-page-title-line-height: 1.05;
  --type-page-title-letter-spacing: -0.04em;
  --type-page-title-transform: none;
  --type-section-title-family: var(--font-heading);
  --type-section-title-size: 1.25rem;
  --type-section-title-weight: 800;
  --type-section-title-line-height: 1.25;
  --type-section-title-letter-spacing: -0.02em;
  --type-section-title-transform: none;
  --type-card-title-family: var(--font-heading);
  --type-card-title-size: 1rem;
  --type-card-title-weight: 700;
  --type-card-title-line-height: 1.3;
  --type-card-title-letter-spacing: -0.01em;
  --type-card-title-transform: none;
  --type-brand-family: var(--font-heading);
  --type-brand-size: 1rem;
  --type-brand-weight: 700;
  --type-brand-line-height: 1.2;
  --type-brand-letter-spacing: -0.02em;
  --type-brand-transform: none;
  --type-lead-family: var(--font-ui);
  --type-lead-size: clamp(1.05rem, 1.2vw, 1.15rem);
  --type-lead-weight: 400;
  --type-lead-line-height: 1.6;
  --type-lead-letter-spacing: normal;
  --type-lead-transform: none;
  --type-body-family: var(--font-ui);
  --type-body-size: 1rem;
  --type-body-weight: 400;
  --type-body-line-height: 1.6;
  --type-body-letter-spacing: normal;
  --type-body-transform: none;
  --type-supporting-family: var(--font-ui);
  --type-supporting-size: 0.875rem;
  --type-supporting-weight: 400;
  --type-supporting-line-height: 1.5;
  --type-supporting-letter-spacing: normal;
  --type-supporting-transform: none;
  --type-caption-family: var(--font-ui);
  --type-caption-size: 0.75rem;
  --type-caption-weight: 500;
  --type-caption-line-height: 1.4;
  --type-caption-letter-spacing: normal;
  --type-caption-transform: none;
  --type-label-family: var(--font-ui);
  --type-label-size: 0.75rem;
  --type-label-weight: 800;
  --type-label-line-height: 1.2;
  --type-label-letter-spacing: 0.08em;
  --type-label-transform: uppercase;
  --type-control-family: var(--font-ui);
  --type-control-size: 0.875rem;
  --type-control-weight: 700;
  --type-control-line-height: 1.2;
  --type-control-letter-spacing: normal;
  --type-control-transform: none;
  --type-navigation-family: var(--font-ui);
  --type-navigation-size: 0.875rem;
  --type-navigation-weight: 600;
  --type-navigation-line-height: 1.2;
  --type-navigation-letter-spacing: normal;
  --type-navigation-transform: none;
  --type-stat-family: var(--font-data);
  --type-stat-size: 1.5rem;
  --type-stat-weight: 800;
  --type-stat-line-height: 1.1;
  --type-stat-letter-spacing: -0.02em;
  --type-stat-transform: none;
  --type-data-family: var(--font-data);
  --type-data-size: 1rem;
  --type-data-weight: 700;
  --type-data-line-height: 1.25;
  --type-data-letter-spacing: normal;
  --type-data-transform: none;
  --type-count-family: var(--font-data);
  --type-count-size: 0.75rem;
  --type-count-weight: 700;
  --type-count-line-height: 1;
  --type-count-letter-spacing: normal;
  --type-count-transform: none;
  --type-callout-title-family: var(--font-heading);
  --type-callout-title-size: 0.75rem;
  --type-callout-title-weight: 700;
  --type-callout-title-line-height: 1.25;
  --type-callout-title-letter-spacing: normal;
  --type-callout-title-transform: none;
  --type-callout-description-family: var(--font-ui);
  --type-callout-description-size: 0.625rem;
  --type-callout-description-weight: 400;
  --type-callout-description-line-height: 1.4;
  --type-callout-description-letter-spacing: normal;
  --type-callout-description-transform: none;

  --bs-font-sans-serif: var(--font-ui);
  --bs-body-font-family: var(--font-ui);
}

body {
  font-family: var(--type-body-family);
  font-size: var(--type-body-size);
  font-weight: var(--type-body-weight);
  line-height: var(--type-body-line-height);
  letter-spacing: var(--type-body-letter-spacing);
  text-transform: var(--type-body-transform);
}

button,
input,
select,
textarea { font-family: inherit; }

:is(h1, h2, h3, h4, h5, h6),
:is(.h1, .h2, .h3, .h4, .h5, .h6) { font-family: var(--font-heading); }