:root {
  --color-primary: #222222;
  --color-secondary: #fc5a11;
  --color-white-dark: #f9f9f9;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-text: #0f0f0f;
  --color-black-light: #555555;
  --font-family-sora: "Sora", sans-serif;
  --font-family-manrope: "Manrope", sans-serif;
  --font-family-space-grotesk: "Space Grotesk", sans-serif;
  --font-family-dm-sans: "DM Sans", sans-serif;
  --font-family-cinzel: "Cinzel", serif;
}
body {
  font-family: var(--font-family-sora);
  color: var(--color-text);
  background-color: var(--color-white);
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.06px;
}
p {
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.06px;
  color: var(--color-black-light);
}

.hero-text-gradient {
  animation: textAnimate 5s linear infinite;
  background-size: 200%;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  display: inline-block;
  background-repeat: no-repeat;
}
.hero-text-color-1 {
  background-image: linear-gradient(45deg, #a585ff, #ffc2ad, #a585ff);
}
.hero-text-color-2 {
  background-image: linear-gradient(45deg, #83e7ee, #f9eb57, #83e7ee);
}

/* ===404=== */

.error-description {
  font-family: Manrope;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.6%;
  text-align: center;
}