header .navlinks .nav-label {
  display: inline-block;
  position: relative;
}

header .navlinks .nav-label::after {
  position: absolute;
  inset: auto 0 -5px;
  height: 2px;
  border-radius: 2px;
  background: var(--green, #244e41);
  content: "";
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 180ms ease-out;
}

header .navlinks a[aria-current],
header .navlinks a:focus-visible {
  color: var(--green, #244e41);
  text-decoration: none;
}

header .navlinks a[aria-current] .nav-label::after,
header .navlinks a:focus-visible .nav-label::after {
  transform: scaleX(1);
}

header .navlinks a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 5px;
  border-radius: 2px;
}

@media (hover: hover) {
  header .navlinks a:hover {
    color: var(--green, #244e41);
  }

  header .navlinks a:hover .nav-label::after {
    transform: scaleX(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  header .navlinks .nav-label::after {
    transition: none;
  }
}