.highlighted-word {
  color: var(--highlighted-word-color);
}
.fancy-heading {
  max-width: var(--width-container);
  margin-inline: auto;
}

/* h2's have a border */
h2.fancy-heading {
  position: relative;
  max-width: var(--width-container);
  margin-inline: auto;
}

h2.fancy-heading:before {
  border-top: 4px solid var(--fancy-heading-line-color);
  content: "";
  display: block;
  position: absolute;
  transform: translateY(-50%);
  top: 50%;
  width: 100%;
  left: 0;
}

h2.fancy-heading span:not(.highlighted-word) {
  background-color: var(--fancy-heading-bg-color);
  display: inline-block;
  padding-left: var(--spacing-smallest);
  padding-right: var(--spacing-smallest);
  position: relative;
  margin-left: var(--spacing);
}