@font-face {
  font-family: montserrat;
  src:
    url('../../../fonts/montserrat-medium.woff2') format('woff2'),
    url('../../../fonts/montserrat-medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: montserrat;
  src:
    url('../../../fonts/montserrat-semibold.woff2') format('woff2'),
    url('../../../fonts/montserrat-semibold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: montserrat;
  src:
    url('../../../fonts/montserrat-bold.woff2') format('woff2'),
    url('../../../fonts/montserrat-bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: montserrat;
  src:
    url('../../../fonts/montserrat-extraBold.woff2') format('woff2'),
    url('../../../fonts/montserrat-extraBold.woff') format('woff');
  font-weight: 800;
  font-style: normal;
}

/**
 * Do not edit directly, this file was auto-generated.
 */

:root {
  --osds-line-height-global-compact: 1;
  --osds-line-height-global-snug: 1.25;
  --osds-line-height-global-comfortable: 1.5;
}

/**
 * Do not edit directly, this file was auto-generated.
 */

:root {
  --osds-font-weight-normal: 500;
  --osds-font-weight-bold: 600;
  --osds-font-weight-heavy: 700;
  --osds-font-weight-extra: 800;
  --osds-font-size-xs: 13px;
  --osds-font-size-s: 15px;
  --osds-font-size-m: 20px;
  --osds-font-size-l: 28px;
  --osds-font-size-xl: 36px;
  --osds-font-family-primary: montserrat, system-ui, sans-serif;
  --osds-font-h1: var(--osds-font-weight-bold) var(--osds-font-size-xl)/var(--osds-line-height-global-snug) var(--osds-font-family-primary);
  --osds-font-h2: var(--osds-font-weight-bold) var(--osds-font-size-l)/var(--osds-line-height-global-snug) var(--osds-font-family-primary);
  --osds-font-h3: var(--osds-font-weight-bold) var(--osds-font-size-m)/var(--osds-line-height-global-snug) var(--osds-font-family-primary);
  --osds-font-h4: var(--osds-font-weight-bold) var(--osds-font-size-s)/var(--osds-line-height-global-snug) var(--osds-font-family-primary);
  --osds-font-h5: var(--osds-font-weight-bold) var(--osds-font-size-xs)/var(--osds-line-height-global-snug) var(--osds-font-family-primary);
  --osds-font-h6: var(--osds-font-weight-bold) var(--osds-font-size-xs)/var(--osds-line-height-global-snug) var(--osds-font-family-primary);
  --osds-font-body: var(--osds-font-weight-normal) var(--osds-font-size-s)/var(--osds-line-height-global-comfortable) var(--osds-font-family-primary);
  --osds-font-paragraph: var(--osds-font-weight-normal) var(--osds-font-size-s)/var(--osds-line-height-global-comfortable) var(--osds-font-family-primary);
  --osds-font-subtext: var(--osds-font-weight-normal) var(--osds-font-size-xs)/var(--osds-line-height-global-comfortable) var(--osds-font-family-primary);
}

/**
 * Do not edit directly, this file was auto-generated.
 */

:root {
  --osds-color-global-gray-0: #ffffff;
  --osds-color-global-gray-100: #f3f5f7;
  --osds-color-global-gray-300: #c3cbd5;
  --osds-color-global-gray-400: #93a2b4;
  --osds-color-global-gray-600: #657990;
  --osds-color-global-gray-700: #4b5b6c;
  --osds-color-global-gray-800: #323c48;
  --osds-color-global-gray-900: #191e24;
  --osds-color-global-blue-100: #ebf8ff;
  --osds-color-global-blue-300: #99dbff;
  --osds-color-global-blue-400: #47bfff;
  --osds-color-global-blue-600: #00a0f5;
  --osds-color-global-blue-700: #0078b8;
  --osds-color-global-blue-800: #00507a;
  --osds-color-global-blue-900: #00283d;
  --osds-color-global-green-100: #f5f8f1;
  --osds-color-global-green-300: #ccdeba;
  --osds-color-global-green-400: #a3c482;
  --osds-color-global-green-600: #7aa64f;
  --osds-color-global-green-700: #5c7d3b;
  --osds-color-global-green-800: #3d5327;
  --osds-color-global-green-900: #1f2a14;
  --osds-color-global-yellow-100: #fefaeb;
  --osds-color-global-yellow-300: #fbe49d;
  --osds-color-global-yellow-400: #f8ce4e;
  --osds-color-global-yellow-600: #ecb409;
  --osds-color-global-yellow-700: #b18707;
  --osds-color-global-yellow-800: #765a05;
  --osds-color-global-yellow-900: #3b2d02;
  --osds-color-global-orange-100: #fff6eb;
  --osds-color-global-orange-300: #fdd39b;
  --osds-color-global-orange-400: #fcaf4b;
  --osds-color-global-orange-600: #f08a05;
  --osds-color-global-orange-700: #b46803;
  --osds-color-global-orange-800: #784502;
  --osds-color-global-orange-900: #3c2301;
  --osds-color-global-red-100: #fff1eb;
  --osds-color-global-red-300: #fdb79b;
  --osds-color-global-red-400: #fc7d4b;
  --osds-color-global-red-600: #f04804;
  --osds-color-global-red-700: #b43603;
  --osds-color-global-red-800: #782402;
  --osds-color-global-red-900: #3c1201;
  --osds-color-brand-white-surface: var(--osds-color-global-gray-0);
  --osds-color-brand-primary-surface: var(--osds-color-global-gray-100);
  --osds-color-brand-primary-ultralight: var(--osds-color-global-gray-300);
  --osds-color-brand-primary-light: var(--osds-color-global-gray-400);
  --osds-color-brand-primary-normal: var(--osds-color-global-gray-600);
  --osds-color-brand-primary-dark: var(--osds-color-global-gray-700);
  --osds-color-brand-primary-ultradark: var(--osds-color-global-gray-800);
  --osds-color-brand-primary-deep: var(--osds-color-global-gray-900);
  --osds-color-brand-accent-surface: var(--osds-color-global-blue-100);
  --osds-color-brand-accent-ultralight: var(--osds-color-global-blue-300);
  --osds-color-brand-accent-light: var(--osds-color-global-blue-400);
  --osds-color-brand-accent-normal: var(--osds-color-global-blue-600);
  --osds-color-brand-accent-dark: var(--osds-color-global-blue-700);
  --osds-color-brand-accent-ultradark: var(--osds-color-global-blue-800);
  --osds-color-brand-accent-deep: var(--osds-color-global-blue-900);
  --osds-color-brand-success-surface: var(--osds-color-global-green-100);
  --osds-color-brand-success-ultralight: var(--osds-color-global-green-300);
  --osds-color-brand-success-light: var(--osds-color-global-green-400);
  --osds-color-brand-success-normal: var(--osds-color-global-green-600);
  --osds-color-brand-success-dark: var(--osds-color-global-green-700);
  --osds-color-brand-success-ultradark: var(--osds-color-global-green-800);
  --osds-color-brand-success-deep: var(--osds-color-global-green-900);
  --osds-color-brand-secondary-surface: var(--osds-color-global-yellow-100);
  --osds-color-brand-secondary-ultralight: var(--osds-color-global-yellow-300);
  --osds-color-brand-secondary-light: var(--osds-color-global-yellow-400);
  --osds-color-brand-secondary-normal: var(--osds-color-global-yellow-600);
  --osds-color-brand-secondary-dark: var(--osds-color-global-yellow-700);
  --osds-color-brand-secondary-ultradark: var(--osds-color-global-yellow-800);
  --osds-color-brand-secondary-deep: var(--osds-color-global-yellow-900);
  --osds-color-brand-warning-surface: var(--osds-color-global-orange-100);
  --osds-color-brand-warning-ultralight: var(--osds-color-global-orange-300);
  --osds-color-brand-warning-light: var(--osds-color-global-orange-400);
  --osds-color-brand-warning-normal: var(--osds-color-global-orange-600);
  --osds-color-brand-warning-dark: var(--osds-color-global-orange-700);
  --osds-color-brand-warning-ultradark: var(--osds-color-global-orange-800);
  --osds-color-brand-warning-deep: var(--osds-color-global-orange-900);
  --osds-color-brand-danger-surface: var(--osds-color-global-red-100);
  --osds-color-brand-danger-ultralight: var(--osds-color-global-red-300);
  --osds-color-brand-danger-light: var(--osds-color-global-red-400);
  --osds-color-brand-danger-normal: var(--osds-color-global-red-600);
  --osds-color-brand-danger-dark: var(--osds-color-global-red-700);
  --osds-color-brand-danger-ultradark: var(--osds-color-global-red-800);
  --osds-color-brand-danger-deep: var(--osds-color-global-red-900);
}

/**
 * Do not edit directly, this file was auto-generated.
 */

:root {
  --osds-border-global-sm: 1px;
  --osds-border-global-md: 2px;
  --osds-border-global-lg: 3px;
  --osds-border-global-xl: 4px;
}

/**
 * Do not edit directly, this file was auto-generated.
 */

:root {
  --osds-border-radius-global-xs: 4px;
  --osds-border-radius-global-s: 8px;
  --osds-border-radius-global-m: 12px;
  --osds-border-radius-global-l: 16px;
  --osds-border-radius-global-xl: 20px;
}

/**
 * Do not edit directly, this file was auto-generated.
 */

:root {
  --osds-spacing-global-xxxs: 2px;
  --osds-spacing-global-xxs: 4px;
  --osds-spacing-global-xs: 8px;
  --osds-spacing-global-s: 12px;
  --osds-spacing-global-m: 16px;
  --osds-spacing-global-l: 24px;
  --osds-spacing-global-xl: 32px;
  --osds-spacing-global-xxl: 48px;
  --osds-spacing-global-xxxl: 64px;
}

/* Storybook preview root. Add to body when Galaxia is the site theme. */
.osds-root {
  font: var(--osds-font-body);
}

/* socialblue only has .main-navigation. Storybook uses .osds-root so
   other components do not each copy these rules. */
.main-navigation .sr-only,
.osds-root .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    white-space: nowrap;
    border: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
  }