:root { 
  --black: #000000;
  --black-2: #0000004c;
  --blue-zodiac: #162a51;
  --blue-zodiac-2: #162950;
  --blueberry: #4977fe;
  --chartreuse-yellow: #e2ff00;
  --chartreuse-yellow-2: #eeff00;
  --pattens-blue: #e0f2fe;
  --shark: #272727;
  --tangaroa: #0a1a3a;
  --white: #ffffff;
  --zircon: #f5fbff;
 
  --font-size-l: 21px;
  --font-size-m: 16px;
  --font-size-s: 11px;
  --font-size-xl: 26px;
  --font-size-xxl: 28px;
  --font-size-xxxl: 36px;
  --font-size-xxxxl: 36.5px;
 
  --font-family-clash_grotesk_variable-bold: "Clash Grotesk Variable-Bold", Helvetica;
  --font-family-clash_grotesk_variable-medium: "Clash Grotesk Variable-Medium", Helvetica;
  --font-family-clash_grotesk_variable-regular: "Clash Grotesk Variable-Regular", Helvetica;
  --font-family-clash_grotesk_variable-semibold: "Clash Grotesk Variable-Semibold", Helvetica;
}
.clashgroteskvariable-regular-normal-white-16px {
  color: var(--white);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-white-11px {
  color: var(--white);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-pattens-blue-16px {
  color: var(--pattens-blue);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-black-16px {
  color: var(--black);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-blueberry-36px {
  color: var(--blueberry);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: var(--font-size-xxxl);
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-blueberry-53-6px {
  color: var(--blueberry);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: 53.6px;
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-black-21px {
  color: var(--black);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-blueberry-21px {
  color: var(--blueberry);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-pattens-blue-21px {
  color: var(--pattens-blue);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-bold-blueberry-15-7px {
  color: var(--blueberry);
  font-family: var(--font-family-clash_grotesk_variable-bold);
  font-size: 15.7px;
  font-style: normal;
  font-weight: 700;
}

.clashgroteskvariable-regular-normal-white-21px {
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-chartreuse-yellow-36px {
  color: var(--chartreuse-yellow-2);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: var(--font-size-xxxl);
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-blueberry-36-5px {
  color: var(--blueberry);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: var(--font-size-xxxxl);
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-black-16px-2 {
  color: var(--black-2);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-normal-shark-16px {
  color: var(--shark);
  font-family: var(--font-family-clash_grotesk_variable-semibold);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-white-13px {
  color: var(--white);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-blue-zodiac-18px {
  color: var(--blue-zodiac);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-white-18px {
  color: var(--white);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-chartreuse-yellow-36-5px {
  color: var(--chartreuse-yellow);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: var(--font-size-xxxxl);
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-white-16px-2 {
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-regular-normal-chartreuse-yellow-16px {
  color: var(--chartreuse-yellow);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.clashgroteskvariable-bold-pattens-blue-16px {
  color: var(--pattens-blue);
  font-family: var(--font-family-clash_grotesk_variable-bold);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 700;
}

.clashgroteskvariable-regular-normal-blueberry-15px {
  color: var(--blueberry);
  font-family: var(--font-family-clash_grotesk_variable-regular);
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
}
