:root { 
  --black: #000000;
  --celeste: #d0d0d0;
  --guardsman-red: #c40000;
  --vermilion: #ff4c00;
  --white: #ffffff;
 
  --font-size-l: 24.5px;
  --font-size-m: 18.2px;
  --font-size-s: 17.8px;
  --font-size-xl: 26.7px;
  --font-size-xs: 17.3px;
  --font-size-xxl: 38.1px;
  --font-size-xxs: 12.9px;
 
  --font-family-inter: "Inter", Helvetica;
  --font-family-manrope: "Manrope", Helvetica;
  --font-family-roboto: "Roboto", Helvetica;
}
.manrope-bold-black-18-2px {
  color: var(--black);
  font-family: var(--font-family-manrope);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 700;
}

.manrope-bold-white-17-3px {
  color: var(--white);
  font-family: var(--font-family-manrope);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 700;
}

.manrope-bold-black-12-9px {
  color: var(--black);
  font-family: var(--font-family-manrope);
  font-size: var(--font-size-xxs);
  font-style: normal;
  font-weight: 700;
}

.manrope-bold-guardsman-red-18-1px {
  color: var(--guardsman-red);
  font-family: var(--font-family-manrope);
  font-size: 18.1px;
  font-style: normal;
  font-weight: 700;
}

.manrope-semi-bold-celeste-26-7px {
  color: var(--celeste);
  font-family: var(--font-family-manrope);
  font-size: var(--font-size-xl);
  font-style: normal;
  font-weight: 600;
}

.roboto-semi-bold-celeste-17-8px {
  color: var(--celeste);
  font-family: var(--font-family-roboto);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 600;
}