:root {
  --color-evergreen: #004b41;
  --color-aqua-green: #2a9d8f;
  --color-marigold: #f4a261;
  --color-bright-orange: #f15a24;
  --color-fog: #f5f8f7;
  --color-charcoal: #0e1d1b;
  --font-family-primary: "Kanit", sans-serif;
}

h1,
h2,
h3 {
  margin: 0;
  color: var(--color-charcoal);
  font-family: var(--font-family-primary);
  font-weight: 700;
}

h1 {
  font-size: 24px;
  text-transform: uppercase;
}

h2 {
  font-size: 20px;
  text-transform: uppercase;
}

h3 {
  font-size: 16px;
}

p {
  font-size: 12px;
}

.sby-headline--charcoal {
  color: var(--color-charcoal);
}

.sby-headline--fog {
  color: var(--color-fog);
}

.sby-headline--aqua-green {
  color: var(--color-aqua-green);
}

.sby-eyebrow {
  margin: 0;
  font-family: var(--font-family-primary);
  font-size: 12px;
  font-weight: 400;
}

.sby-eyebrow--bright-orange {
  color: var(--color-bright-orange);
}

.sby-eyebrow--fog {
  color: var(--color-fog);
}