@font-face {
  font-family: "CenturyGothicRegular";
  src: url("/static/fonts/CenturyGothicRegular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "CenturyGothicBold";
  src: url("/static/fonts/CenturyGothicBold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}

:root {
  --primary-400: #263c66;
  --gray-300: #a7a8ab;
  --gray-500: #707070;
}

body {
  font-family: "CenturyGothicRegular", sans-serif;
  font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "CenturyGothicBold", sans-serif;
  font-weight: 700;
  color: var(--primary-400);
}

h1 {
  font-size: 4.8rem;
}

h3 {
  font-size: 3.2rem;
}

h4 {
  font-size: 2.5rem;
}

p,
a {
  font-size: 1.8rem;
  color: var(--gray-500);
}

a {
  text-decoration: none;
  transition: color 0.3s;
}

a:hover {
  color: var(--gray-300);
}