header .wordmark {
  transition: color .22s ease, filter .22s ease;
}

header .wordmark:hover,
header .wordmark:focus-visible,
header .wordmark:active {
  color: #d5a747;
  background: linear-gradient(110deg, #b78128 4%, #e6bf65 34%, #fff1bd 51%, #d9a840 69%, #b98129 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 0 5px rgba(210, 156, 55, .34));
}

@media (hover: none) and (pointer: coarse) {
  header .wordmark:hover,
  header .wordmark:focus-visible,
  header .wordmark:active {
    color: #a97522;
    background: none;
    -webkit-text-fill-color: currentColor;
    filter: none;
  }
}