/* Cobalt V5 — generated from tokens.json */
:root, [data-theme="light"] {
  --color-brand-0: rgba(87, 140, 255, 0);
  --color-brand-main: #0000ff; /* Brand · Blue Main. */
  --color-brand-20: #212AA7;
  --color-brand-40: #2A49FF;
  --color-brand-45: #365AFF;
  --color-brand-50: #3067FF;
  --color-brand-60-alpha: rgba(87, 140, 255, 0.12);
  --color-brand-60: #578CFF;
  --color-brand-70: #84AAFF;
  --color-brand-95: #EAF1FF;

  --color-neutral-content-strong: #27272b; /* Neutral · Content Strong. */
  --color-neutral-content-medium: #4f4f56; /* Neutral · Content Medium. */
  --color-neutral-border-strong: #aaaab6; /* Neutral · Border Strong. */
  --color-neutral-border-medium: #e2e2e9; /* Neutral · Border Medium. */
  --color-neutral-background-strong: #f6f6f9; /* Neutral · Background Strong. */
  --color-neutral-background-medium: #ffffff; /* Neutral · Background Medium. */
  --color-neutral-background-soft: #f0f0f4; /* Neutral · Background Soft. */
  --color-brand-content: var(--color-brand-main); /* Brand · Content. */
  --color-brand-decoration: var(--color-brand-70); /* Brand · Decoration. */
  --color-brand-background: var(--color-brand-95); /* Brand · Background. */
  --color-brand-Docaposte-DarkYellow: #ffcb05; /* Color used for Docaposte visuals */
  --color-brand-Docaposte-LightYellow: #ffff80; /* Color used for Docaposte visuals */
  --color-brand-Docaposte-LightTurquoise: #0cffc6; /* Color used for Docaposte visuals */
  --color-brand-Docaposte-DarkTurquoise: #1aa6a6; /* Color used for Docaposte visuals */
  --color-brand-Docaposte-Purple: #bf7cff; /* Color used for Docaposte visuals */
  --color-brand-Docaposte-Blue: var(--color-brand-main); /* Color used for Docaposte visuals */
  --color-brand-Docaposte-White: #ffffff; /* Color used for Docaposte visuals */
  --color-brand-Docaposte-Black: #27272b;
  --color-status-content-success: #007f00; /* Status · Content Success. */
  --color-status-background-success: #e2f6e2; /* Status · Background Success. */
  --color-status-content-warning: #c24100; /* Status · Content Warning. */
  --color-status-background-warning: #ffeedd; /* Status · Background Warning. */
  --color-status-content-error: #d91414; /* Status · Content Error. */
  --color-status-background-error: #ffedeb; /* Status · Background Error. */
  --color-status-content-information: #006bd4; /* Status · Content Information. */
  --color-status-background-information: #e5f2ff; /* Status · Background Information. */
  --color-status-content-all-accent: #ffffff; /* Status · Content All Accent. */
  --color-status-background-success-accent: #008800; /* Status · Background Success Accent. */
  --color-status-background-warning-accent: #ce4600; /* Status · Background Warning Accent. */
  --color-status-background-error-accent: #e71616; /* Status · Background Error Accent. */
  --color-status-background-information-accent: #0072e2; /* Status · Background Information Accent. */
  --color-additional-content-color1: #007c60; /* Additionnal · Content Color 1. */
  --color-additional-background-color1: #dbf7f0; /* Additionnal · Background Color 1. */
  --color-additional-content-color2: #9528ff; /* Additionnal · Content Color 2. */
  --color-additional-background-color2: #f6edff; /* Additionnal · Background Color 2. */
  --color-additional-content-color3: #d8142d; /* Additionnal · Content Color 3. */
  --color-additional-background-color3: #ffedec; /* Additionnal · Background Color 3. */
  --color-additional-content-color4: #6c7300; /* Additionnal · Content Color 4. */
  --color-additional-background-color4: #f5f4ba; /* Additionnal · Background Color 4. */
  --color-additional-content-all-accent: #27272b; /* Additionnal · Content All Accent. */
  --color-additional-background-color1-accent: #0cffc6; /* Additionnal · Background Color 1 Accent. */
  --color-additional-background-color2-accent: #bf7cff; /* Additionnal · Background Color 2 Accent. */
  --color-additional-background-color3-accent: #ff5657; /* Additionnal · Background Color 3 Accent. */
  --color-additional-background-color4-accent: #ffff80; /* Additionnal · Background Color 4 Accent. */
  --color-global-content-link: var(--color-brand-main); /* Global · Content Link. */
  --color-global-border-focus: var(--color-brand-45); /* Global · Border Focus. */
  --color-global-all-disabled-strong: #aaaab6; /* Global · All Disabled Strong. */
  --color-global-all-disabled-soft: #e2e2e9; /* Global · All Disabled Soft. */
  --color-global-overlay-medium: rgba(23, 23, 26, 0.32); /* Global · Overlay Medium. */
  --color-action-primary-content-default: #ffffff; /* Action Primary · Content Default. */
  --color-action-primary-content-interacting: #ffffff; /* Action Primary · Content Interacting. */
  --color-action-primary-border-default: rgba(144, 144, 154, 0); /* Action Primary · Border Default. */
  --color-action-primary-border-interacting: rgba(144, 144, 154, 0); /* Action Primary · Border Interacting. */
  --color-action-primary-background-default: var(--color-brand-main); /* Action Primary · Background Default. */
  --color-action-primary-background-interacting: var(--color-brand-40); /* Action Primary · Background Interacting. */
  --color-action-secondary-content-default: var(--color-brand-main); /* Action Secondary · Content Default. */
  --color-action-secondary-content-interacting: var(--color-brand-40); /* Action Secondary · Content Interacting. */
  --color-action-secondary-border-default: rgba(144, 144, 154, 0); /* Action Secondary · Border Default. */
  --color-action-secondary-border-interacting: rgba(144, 144, 154, 0); /* Action Secondary · Border Interacting. */
  --color-action-secondary-background-default: rgba(144, 144, 154, 0.12); /* Action Secondary · Background Default. */
  --color-action-secondary-background-interacting: var(--color-brand-60-alpha); /* Action Secondary · Background Interacting. */
  --color-action-tertiary-content-default: var(--color-brand-main); /* Action Tertiary · Content Default. */
  --color-action-tertiary-content-interacting: var(--color-brand-40); /* Action Tertiary · Content Interacting. */
  --color-action-tertiary-border-default: rgba(144, 144, 154, 0); /* Action Tertiary · Border Default. */
  --color-action-tertiary-border-interacting: rgba(144, 144, 154, 0); /* Action Tertiary · Border Interacting. */
  --color-action-tertiary-background-default: rgba(144, 144, 154, 0); /* Action Tertiary · Background Default. */
  --color-action-tertiary-background-interacting: rgba(144, 144, 154, 0.12); /* Action Tertiary · Background Interacting. */
  --color-selection-primary-content-default: #4f4f56; /* Selection Primary · Content Default. */
  --color-selection-primary-content-interacting: var(--color-brand-40); /* Selection Primary · Content Interacting. */
  --color-selection-primary-content-selected: #ffffff; /* Selection Primary · Content Selected. */
  --color-selection-primary-border-default: #737380; /* Selection Primary · Border Default. */
  --color-selection-primary-border-interacting: var(--color-brand-40); /* Selection Primary · Border interacting. */
  --color-selection-primary-border-selected: var(--color-brand-0); /* Selection Primary · Border Selected. */
  --color-selection-primary-background-default: #ffffff; /* Selection Primary · Background Default. */
  --color-selection-primary-background-interacting: var(--color-brand-60-alpha); /* Selection Primary · Background Interacting. */
  --color-selection-primary-background-selected: var(--color-brand-50); /* Selection Primary · Background Selected. */
  --color-selection-secondary-content-default: #62626f; /* Selection Secondary · Content Default. */
  --color-selection-secondary-content-interacting: #3d3d43; /* Selection Secondary · Content Interacting. */
  --color-selection-secondary-content-selected: var(--color-brand-main); /* Selection Secondary · Content Selected. */
  --color-selection-secondary-border-default: rgba(144, 144, 154, 0); /* Selection Secondary · Border Default. */
  --color-selection-secondary-border-interacting: rgba(144, 144, 154, 0); /* Selection Secondary · Border interacting. */
  --color-selection-secondary-border-selected: rgba(144, 144, 154, 0); /* Selection Secondary · Border Selected. */
  --color-selection-secondary-background-default: rgba(144, 144, 154, 0); /* Selection Secondary · Background Default. */
  --color-selection-secondary-background-interacting: rgba(144, 144, 154, 0.12); /* Selection Secondary · Background Interacting. */
  --color-selection-secondary-background-selected: var(--color-brand-60-alpha); /* Selection Secondary · Background Selected. */
  --color-edition-content-default: #27272b; /* Edition · Content Default. */
  --color-edition-content-interacting: var(--color-brand-main); /* Edition · Content Interacting. */
  --color-edition-border-default: #90909a; /* Edition · Border Default. */
  --color-edition-border-interacting: var(--color-brand-50); /* Edition · Border interacting. */
  --color-edition-background-default: #ffffff; /* Edition · Background Default. */
  --color-edition-background-interacting: #ffffff; /* Edition · Background Interacting. Dark value missing from the CSV: #17171A taken from theme.css (Cobalt V5 skill), to be confirmed. */
  --effect-drop-small: 0 1px 3px 0px rgba(24, 24, 57, 0.08); /* Drop/Small — light elevation. */
  --effect-drop-medium: 0 5px 8px -3px rgba(24, 24, 57, 0.16); /* Drop/Medium — floating elements: Tooltip. */
  --effect-drop-large: 0 13px 21px -8px rgba(24, 24, 57, 0.24); /* Drop/Large — strong elevation. */
  --effect-inner-bottom: inset 0 -1px 3px 0px rgba(24, 24, 57, 0.08); /* Inner/Bottom — inner shadow at the bottom of the component: Topbar Large. Same in light and dark. */
  --effect-inner-top: inset 0 1px 3px 0px rgba(24, 24, 57, 0.08); /* Inner/Top — inner shadow at the top of the component: Topbar Small (Bottombar). Same in light and dark. */
  --effect-inner-right: inset -1px 0 3px 0px rgba(24, 24, 57, 0.08); /* Inner/Right — inner shadow on the right of the component: Sidebar Large (x -1, y 0, blur 3, #181839 at 8%). Same in light and dark. */
}
[data-theme="dark"] {
  --color-brand-60-alpha: rgba(87, 140, 255, 0.12);
  --color-brand-0: rgba(87, 140, 255, 0);

  --color-neutral-content-strong: #ffffff;
  --color-neutral-content-medium: #c6c6d0;
  --color-neutral-border-strong: #62626f;
  --color-neutral-border-medium: #3d3d43;
  --color-neutral-background-strong: #27272b;
  --color-neutral-background-medium: #17171a;
  --color-neutral-background-soft: #343439;
  --color-brand-content: var(--color-brand-70);
  --color-brand-decoration: var(--color-brand-60);
  --color-brand-background: var(--color-brand-20);
  --color-brand-Docaposte-Blue: var(--color-brand-main);
  --color-brand-Docaposte-White: #ffffff;
  --color-status-content-success: #41c441;
  --color-status-background-success: #004900;
  --color-status-content-warning: #f49435;
  --color-status-background-warning: #702500;
  --color-status-content-error: #ff897f;
  --color-status-background-error: #820000;
  --color-status-content-information: #5fb0ff;
  --color-status-background-information: #003d7a;
  --color-status-content-all-accent: #ffffff;
  --color-status-background-success-accent: #008800;
  --color-status-background-warning-accent: #ce4600;
  --color-status-background-error-accent: #e71616;
  --color-status-background-information-accent: #0072e2;
  --color-additional-content-color1: #00c296;
  --color-additional-background-color1: #004737;
  --color-additional-content-color2: #ca93ff;
  --color-additional-background-color2: #571d8c;
  --color-additional-content-color3: #ff8986;
  --color-additional-background-color3: #7e0722;
  --color-additional-content-color4: #adb14b;
  --color-additional-background-color4: #3b4100;
  --color-additional-content-all-accent: #27272b;
  --color-additional-background-color1-accent: #0cffc6;
  --color-additional-background-color2-accent: #bf7cff;
  --color-additional-background-color3-accent: #ff5657;
  --color-additional-background-color4-accent: #ffff80;
  --color-global-content-link: var(--color-brand-70);
  --color-global-border-focus: var(--color-brand-70);
  --color-global-all-disabled-strong: #90909a;
  --color-global-all-disabled-soft: #3d3d43;
  --color-global-overlay-medium: rgba(23, 23, 26, 0.32);
  --color-action-primary-content-default: #ffffff;
  --color-action-primary-content-interacting: #ffffff;
  --color-action-primary-border-default: rgba(144, 144, 154, 0);
  --color-action-primary-border-interacting: rgba(144, 144, 154, 0);
  --color-action-primary-background-default: var(--color-brand-50);
  --color-action-primary-background-interacting: var(--color-brand-40);
  --color-action-secondary-content-default: var(--color-brand-70);
  --color-action-secondary-content-interacting: var(--color-brand-70);
  --color-action-secondary-border-default: rgba(144, 144, 154, 0);
  --color-action-secondary-border-interacting: rgba(144, 144, 154, 0);
  --color-action-secondary-background-default: rgba(145, 145, 145, 0.12);
  --color-action-secondary-background-interacting: var(--color-brand-60-alpha);
  --color-action-tertiary-content-default: var(--color-brand-70);
  --color-action-tertiary-content-interacting: var(--color-brand-70);
  --color-action-tertiary-border-default: rgba(144, 144, 154, 0);
  --color-action-tertiary-border-interacting: rgba(144, 144, 154, 0);
  --color-action-tertiary-background-default: rgba(144, 144, 154, 0);
  --color-action-tertiary-background-interacting: rgba(144, 144, 154, 0.12);
  --color-selection-primary-content-default: #e2e2e9;
  --color-selection-primary-content-interacting: var(--color-brand-70);
  --color-selection-primary-content-selected: #ffffff;
  --color-selection-primary-border-default: #90909a;
  --color-selection-primary-border-interacting: var(--color-brand-60);
  --color-selection-primary-border-selected: var(--color-brand-0);
  --color-selection-primary-background-default: #27272b;
  --color-selection-primary-background-interacting: var(--color-brand-60-alpha);
  --color-selection-primary-background-selected: var(--color-brand-50);
  --color-selection-secondary-content-default: #aaaab6;
  --color-selection-secondary-content-interacting: #e2e2e9;
  --color-selection-secondary-content-selected: var(--color-brand-70);
  --color-selection-secondary-border-default: rgba(144, 144, 154, 0);
  --color-selection-secondary-border-interacting: rgba(144, 144, 154, 0);
  --color-selection-secondary-border-selected: rgba(144, 144, 154, 0);
  --color-selection-secondary-background-default: rgba(144, 144, 154, 0);
  --color-selection-secondary-background-interacting: rgba(144, 144, 154, 0.12);
  --color-selection-secondary-background-selected: var(--color-brand-60-alpha);
  --color-edition-content-default: #ffffff;
  --color-edition-content-interacting: var(--color-brand-70);
  --color-edition-border-default: #6d6d6d;
  --color-edition-border-interacting: var(--color-brand-70);
  --color-edition-background-default: #17171a;
  --color-edition-background-interacting: #17171a;
  --effect-drop-small: 0 1px 3px 0px rgba(0, 0, 0, 0.24);
  --effect-drop-medium: 0 5px 8px -3px rgba(0, 0, 0, 0.48);
  --effect-drop-large: 0 13px 21px -8px rgba(0, 0, 0, 0.72);
}
:root {
  --number-spacing-none: 0; /* Spacing None. */
  --number-spacing-5xsmall: 2px; /* Spacing 5xSmall. */
  --number-spacing-4xsmall: 4px; /* Spacing 4xSmall. */
  --number-spacing-3xsmall: 6px; /* Spacing 3xSmall. */
  --number-spacing-2xsmall: 8px; /* Spacing 2xSmall. */
  --number-spacing-xsmall: 10px; /* Spacing XSmall. */
  --number-spacing-small: 12px; /* Spacing Small. */
  --number-spacing-medium: 16px; /* Spacing Medium. */
  --number-spacing-large: 20px; /* Spacing Large. */
  --number-spacing-xlarge: 24px; /* Spacing XLarge. */
  --number-spacing-2xlarge: 32px; /* Spacing 2xLarge. */
  --number-spacing-3xlarge: 40px; /* Spacing 3xLarge. */
  --number-spacing-4xlarge: 48px; /* Spacing 4xLarge. */
  --number-spacing-5xlarge: 56px; /* Spacing 5xLarge. */
  --number-spacing-6xlarge: 64px; /* Spacing 6xLarge. */
  --number-spacing-7xlarge: 80px; /* Spacing 7xLarge. */
  --number-spacing-8xlarge: 120px; /* Spacing 8xLarge. */
  --number-radius-none: 0; /* Radius None: square corners (tables, full-width panels). */
  --number-radius-small: 2px; /* Radius Small (2px, formerly 3xSmall): default rounding of Cobalt V5 (buttons, fields, cards, tooltips, pop-in) — deliberately subtle rounding. */
  --number-radius-xsmall: 1px; /* Radius XSmall (1px): segmented control track. */
  --number-radius-medium: 4px; /* Radius Medium (4px): inline links, breadcrumb overflow button focus shape. */
  --number-radius-circle: 50%; /* Radius Circle (50%): circular shapes (info buttons, glows). */
  --number-radius-round: 9999px; /* Radius Round (9999px): dots, avatars, pill-shaped badges. */
  --number-size-icon-small: 12px; /* Size Icon Small. */
  --number-size-icon-medium: 16px; /* Size Icon Medium. */
  --number-size-icon-large: 20px; /* Size Icon Large. */
  --number-size-icon-xlarge: 24px; /* Size Icon XLarge. */
  --number-size-icon-2xlarge: 32px; /* Size Icon 2xLarge. */
  --number-size-icon-3xlarge: 40px; /* Size Icon 3xLarge. */
  --number-breakpoint-large: 1024px; /* Window width from which the project uses breakpoint="large" (desktop); below it, breakpoint="small" (tablet and smartphone). Based on Matomo data and can be changed if needed. */
  --font-heading: Montserrat, sans-serif;
  --font-system: system-ui, sans-serif;
  --text-typography-heading-2xlarge: 700 2rem/2rem var(--font-heading); /* Heading 2xLarge. */
  --text-typography-heading-xlarge: 700 1.75rem/2rem var(--font-heading); /* Heading XLarge. */
  --text-typography-heading-large: 700 1.5rem/1.75rem var(--font-heading); /* Heading Large. */
  --text-typography-heading-medium: 600 1.25rem/1.5rem var(--font-heading); /* Heading Medium. */
  --text-typography-heading-small: 600 1.125rem/1.5rem var(--font-heading); /* Heading Small. */
  --text-typography-heading-xsmall: 600 1rem/1.25rem var(--font-heading); /* Heading XSmall. */
  --text-typography-body-large-regular: 400 1rem/1.5rem var(--font-system); /* Body Large Regular. */
  --text-typography-body-large-bold: 500 1rem/1.5rem var(--font-system); /* Body Large Bold. */
  --text-typography-body-large-bold-underline: 500 1rem/1.5rem var(--font-system); /* Body Large Bold Underline. Underlined (text-decoration: underline) — apply in CSS, not carried by the token. */
  --text-typography-body-large-italic: italic 400 1rem/1.5rem var(--font-system); /* Body Large Italic. */
  --text-typography-body-medium-regular: 400 0.875rem/1.25rem var(--font-system); /* Body Medium Regular. */
  --text-typography-body-medium-bold: 500 0.875rem/1.25rem var(--font-system); /* Body Medium Bold. */
  --text-typography-body-medium-bold-underline: 500 0.875rem/1.25rem var(--font-system); /* Body Medium Bold Underline. Underlined (text-decoration: underline) — apply in CSS, not carried by the token. */
  --text-typography-body-medium-italic: italic 400 0.875rem/1.25rem var(--font-system); /* Body Medium Italic. */
  --text-typography-body-small-regular: 400 0.75rem/1rem var(--font-system); /* Body Small Regular. */
  --text-typography-body-small-bold: 500 0.75rem/1rem var(--font-system); /* Body Small Bold. */
  --text-typography-body-small-bold-underline: 500 0.75rem/1rem var(--font-system); /* Body Small Bold Underline. Underlined (text-decoration: underline) — apply in CSS, not carried by the token. */
  --text-typography-body-small-italic: italic 400 0.75rem/1rem var(--font-system); /* Body Small Italic. */
  --text-typography-monoline-large: 600 0.9375rem/1.5rem var(--font-heading); /* Monoline Large — large label meant never to wrap (e.g. Button Large). Montserrat SemiBold 15/24px, -1.5%. */
  --text-typography-monoline-medium: 600 0.8125rem/1rem var(--font-heading); /* Monoline Medium — label meant never to wrap (e.g. Tabs). Montserrat SemiBold 13/16px, -1%. */
  --text-typography-monoline-small: 500 0.875rem/1rem var(--font-system); /* Monoline Small — small label meant never to wrap (e.g. Button Small). System font Medium 14/16px. */
  --text-typography-monoline-xsmall: 600 0.75rem/1rem var(--font-heading); /* Monoline XSmall — very small label meant never to wrap (e.g. Notification Pill). Montserrat SemiBold 12/16px. */
}
.typography-heading-2xlarge {
  font-family: var(--font-heading);
  font-size: 2rem;
  line-height: 2rem;
  font-weight: 700;
  letter-spacing: -0.05rem;
}
.typography-heading-xlarge {
  font-family: var(--font-heading);
  font-size: 1.75rem;
  line-height: 2rem;
  font-weight: 700;
  letter-spacing: -0.043rem;
}
.typography-heading-large {
  font-family: var(--font-heading);
  font-size: 1.5rem;
  line-height: 1.75rem;
  font-weight: 700;
  letter-spacing: -0.037rem;
}
.typography-heading-medium {
  font-family: var(--font-heading);
  font-size: 1.25rem;
  line-height: 1.5rem;
  font-weight: 600;
  letter-spacing: -0.025rem;
}
.typography-heading-small {
  font-family: var(--font-heading);
  font-size: 1.125rem;
  line-height: 1.5rem;
  font-weight: 600;
  letter-spacing: -0.022rem;
}
.typography-heading-xsmall {
  font-family: var(--font-heading);
  font-size: 1rem;
  line-height: 1.25rem;
  font-weight: 600;
  letter-spacing: -0.02rem;
}
.typography-body-large-regular {
  font-family: var(--font-system);
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 400;
  letter-spacing: 0;
}
.typography-body-large-bold {
  font-family: var(--font-system);
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  letter-spacing: 0;
}
.typography-body-large-bold-underline {
  font-family: var(--font-system);
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  letter-spacing: 0;
}
.typography-body-large-italic {
  font-family: var(--font-system);
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 400;
  letter-spacing: 0;
  font-style: italic;
}
.typography-body-medium-regular {
  font-family: var(--font-system);
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 400;
  letter-spacing: 0;
}
.typography-body-medium-bold {
  font-family: var(--font-system);
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  letter-spacing: 0;
}
.typography-body-medium-bold-underline {
  font-family: var(--font-system);
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  letter-spacing: 0;
}
.typography-body-medium-italic {
  font-family: var(--font-system);
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 400;
  letter-spacing: 0;
  font-style: italic;
}
.typography-body-small-regular {
  font-family: var(--font-system);
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 400;
  letter-spacing: 0;
}
.typography-body-small-bold {
  font-family: var(--font-system);
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 500;
  letter-spacing: 0;
}
.typography-body-small-bold-underline {
  font-family: var(--font-system);
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 500;
  letter-spacing: 0;
}
.typography-body-small-italic {
  font-family: var(--font-system);
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 400;
  letter-spacing: 0;
  font-style: italic;
}
.typography-monoline-large {
  font-family: var(--font-heading);
  font-size: 0.9375rem;
  line-height: 1.5rem;
  font-weight: 600;
  letter-spacing: -0.014rem;
}
.typography-monoline-medium {
  font-family: var(--font-heading);
  font-size: 0.8125rem;
  line-height: 1rem;
  font-weight: 600;
  letter-spacing: -0.008rem;
}
.typography-monoline-small {
  font-family: var(--font-system);
  font-size: 0.875rem;
  line-height: 1rem;
  font-weight: 500;
  letter-spacing: 0;
}
.typography-monoline-xsmall {
  font-family: var(--font-heading);
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 600;
  letter-spacing: 0;
}
@font-face {
  font-family: "Montserrat";
  src: url("fonts/Montserrat-Variable-latin.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}