/**
 * GENERATED by tools/design/build-tokens.mjs from design/tokens.json.
 * Do not edit by hand, your changes will be overwritten by the next build.
 * See docs/phase1-spec.md section 4.
 */

@font-face {
  font-family: 'MKB Open Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/open-sans-600.woff2') format('woff2');
}

@font-face {
  font-family: 'MKB Barlow Semi Condensed';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/barlow-semi-condensed-700.woff2') format('woff2');
}

:root {
  --mkb-font-heading: 'Barlow Semi Condensed', sans-serif;
  --mkb-font-heading-weight: 600;
  --mkb-font-heading-weight-strong: 700;
  --mkb-font-heading-strong: 'MKB Barlow Semi Condensed', 'Barlow Semi Condensed', sans-serif;
  --mkb-font-body: 'Open Sans', sans-serif;
  --mkb-font-body-weight: 400;
  --mkb-font-body-weight-strong: 600;
  --mkb-font-body-strong: 'MKB Open Sans', 'Open Sans', sans-serif;
  --mkb-measure: 62ch;
  --mkb-size-h1: clamp(36px, 3.6vw, 52px);
  --mkb-lh-h1: 1.1;
  --mkb-size-h1-hero: clamp(38px, 4.2vw, 60px);
  --mkb-lh-h1-hero: 1.05;
  --mkb-size-h2: clamp(30px, 2.8vw, 40px);
  --mkb-lh-h2: 1.15;
  --mkb-size-h3: 26px;
  --mkb-lh-h3: 1.25;
  --mkb-size-h3-card: 22px;
  --mkb-lh-h3-card: 1.25;
  --mkb-size-h4: 20px;
  --mkb-lh-h4: 1.3;
  --mkb-size-body: 16px;
  --mkb-lh-body: 1.65;
  --mkb-size-lead: clamp(16px, 1.25vw, 18px);
  --mkb-lh-lead: 1.6;
  --mkb-size-small: 14px;
  --mkb-lh-small: 1.5;
  --mkb-size-tiny: 13px;
  --mkb-lh-tiny: 1.5;
  --mkb-size-eyebrow: 13px;
  --mkb-lh-eyebrow: 1;
  --mkb-eyebrow-weight: 600;
  --mkb-eyebrow-tracking: 1.5px;
  --mkb-size-button: 16px;
  --mkb-lh-button: 1;
  --mkb-button-weight: 600;
  --mkb-size-button-9er: 18px;
  --mkb-lh-button-9er: 1;
  --mkb-button-9er-weight: 700;
  --mkb-size-price-big: 56px;
  --mkb-lh-price-big: 1;
  --mkb-size-step-number: 48px;
  --mkb-lh-step-number: 1;
  --mkb-size-quote: 20px;
  --mkb-lh-quote: 1.45;
  --mkb-quote-weight: 600;
  --mkb-space-4: 4px;
  --mkb-space-8: 8px;
  --mkb-space-12: 12px;
  --mkb-space-16: 16px;
  --mkb-space-24: 24px;
  --mkb-space-32: 32px;
  --mkb-space-48: 48px;
  --mkb-space-64: 64px;
  --mkb-space-96: 96px;
  --mkb-space-section-y: clamp(48px, 6.6vw, 96px);
  --mkb-space-section-x: clamp(20px, 12vw - 27px, 150px);
  --mkb-space-container: 1140px;
  --mkb-space-grid-gap: 24px;
  --mkb-space-steps-gap: 32px;
  --mkb-space-card-padding: 32px;
  --mkb-space-card-padding-small: 24px;
  --mkb-space-article-column: 720px;
  --mkb-space-article-gap: 28px;
  --mkb-width-narrow: 800px;
  --mkb-width-normal: var(--mkb-space-container);
  --mkb-width-full: none;
  --mkb-color-accent: var(--ast-global-color-0, #ab0a0a);
  --mkb-color-accent-hover: #7d0707;
  --mkb-color-primary: var(--ast-global-color-1, #ebb426);
  --mkb-color-primary-hover: #d9a41c;
  --mkb-color-text: var(--ast-global-color-3, #2c2c2c);
  --mkb-color-text-muted: #4a4a4a;
  --mkb-color-text-subtle: #6b6b6b;
  --mkb-color-heading: var(--ast-global-color-3, #2c2c2c);
  --mkb-color-background: var(--ast-global-color-4, #ffffff);
  --mkb-color-surface: var(--ast-global-color-8, #f2f2f2);
  --mkb-color-sand: var(--ast-global-color-7, #eecfa9);
  --mkb-color-sand-text: #5a4a30;
  --mkb-color-line: #e5e5e5;
  --mkb-color-line-strong: #d5d5d5;
  --mkb-color-dark: #2c2c2c;
  --mkb-color-dark-text: #ffffff;
  --mkb-color-dark-text-muted: #dddddd;
  --mkb-color-button-text: #2c2c2c;
  --mkb-color-button-primary-text: #2c2c2c;
  --mkb-color-hero-overlay: rgba(44,44,44,.62);
  --mkb-radius-button: 4px;
  --mkb-radius-card: 6px;
  --mkb-radius-image: 6px;
  --mkb-radius-pill: 999px;
  --mkb-radius-input: 4px;
  --mkb-shadow-card: 0 2px 8px rgba(44,44,44,.08);
  --mkb-shadow-pricing: 0 8px 24px rgba(44,44,44,.12);
  --mkb-border-card: 1px solid #e5e5e5;
  --mkb-border-warning: 2px solid #ab0a0a;
  --mkb-border-guarantee: 2px solid #ebb426;
  --mkb-border-outline-button: 2px solid #2c2c2c;
}

.mkb-scheme-9er {
  --mkb-color-accent: #924f2a;
  --mkb-color-accent-hover: #6e3a1e;
  --mkb-color-primary: #b06f3f;
  --mkb-color-primary-hover: #924f2a;
  --mkb-color-primary-light: #c5845c;
  --mkb-color-text: #171717;
  --mkb-color-text-muted: #3d3429;
  --mkb-color-text-subtle: #3d3429;
  --mkb-color-heading: #1f1a14;
  --mkb-color-background: #faf8f5;
  --mkb-color-surface: #f3efe8;
  --mkb-color-sand: #f3efe8;
  --mkb-color-sand-text: #3d3429;
  --mkb-color-line: #e8e0d4;
  --mkb-color-line-strong: #e8e0d4;
  --mkb-color-dark: #1f1a14;
  --mkb-color-dark-text: #faf8f5;
  --mkb-color-dark-text-muted: #e8e0d4;
  --mkb-color-dark-2: #3d3429;
  --mkb-color-button-text: #1f1a14;
  --mkb-color-button-primary-text: #ffffff;
  --mkb-color-hero-overlay: rgba(31,26,20,.66);
  --mkb-radius-button: 8px;
  --mkb-radius-card: 12px;
  --mkb-radius-image: 12px;
  --mkb-radius-pill: 999px;
  --mkb-radius-input: 8px;
  --mkb-shadow-card: 0 1px 2px rgba(31,26,20,.06), 0 8px 24px rgba(31,26,20,.06);
  --mkb-shadow-pricing: 0 1px 2px rgba(31,26,20,.06), 0 8px 24px rgba(31,26,20,.06);
  --mkb-border-card: 1px solid #e8e0d4;
  --mkb-border-warning: 2px solid #b06f3f;
  --mkb-border-guarantee: 2px solid #b06f3f;
  --mkb-border-outline-button: 1.5px solid #1f1a14;
}