:root { 
  --black: #000000;
  --governor-bay: #3a2abf;
  --honeysuckle: #effc79;
  --white: #ffffff;
  --white-2: #ffffff14;
 
  --font-size-m: 36px;
  --font-size-s: 34px;
  --font-size-xs: 32px;
  --font-size-xxs: 30px;
  --font-size-xxxs: 22px;
  --font-size-xxxxs: 21px;
  --font-size-xxxxxs: 16px;
 
  --font-family-hk_grotesk-light: "HK Grotesk-Light", Helvetica;
  --font-family-hk_grotesk-medium: "HK Grotesk-Medium", Helvetica;
  --font-family-hk_grotesk-regular: "HK Grotesk-Regular", Helvetica;
}
.hkgrotesk-regular-normal-white-32px {
  color: var(--white);
  font-family: var(--font-family-hk_grotesk-regular);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 400;
}

.hkgrotesk-regular-normal-white-21px {
  color: var(--white);
  font-family: var(--font-family-hk_grotesk-regular);
  font-size: var(--font-size-xxxxs);
  font-style: normal;
  font-weight: 400;
}

.hkgrotesk-regular-normal-white-24-9px {
  color: var(--white);
  font-family: var(--font-family-hk_grotesk-regular);
  font-size: 24.9px;
  font-style: normal;
  font-weight: 400;
}

.hkgrotesk-light-white-36px {
  color: var(--white);
  font-family: var(--font-family-hk_grotesk-light);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 300;
}

.hkgrotesk-light-white-22px {
  color: var(--white);
  font-family: var(--font-family-hk_grotesk-light);
  font-size: var(--font-size-xxxs);
  font-style: normal;
  font-weight: 300;
}

.hkgrotesk-medium-governor-bay-16px {
  color: var(--governor-bay);
  font-family: var(--font-family-hk_grotesk-medium);
  font-size: var(--font-size-xxxxxs);
  font-style: normal;
  font-weight: 500;
}

.hkgrotesk-light-white-30px {
  color: var(--white);
  font-family: var(--font-family-hk_grotesk-light);
  font-size: var(--font-size-xxs);
  font-style: normal;
  font-weight: 300;
}
