.lg\:pb-12 {
  @media (width >= 960px) {
    padding-bottom: calc(var(--spacing) * 12);
  }
}

.ml-5 {
  margin-left: calc(var(--spacing) * 5);
}

#topnav.bg-white {
  background-color: var(--color-white);
}

#topnav.dark\:bg-slate-800 {
  &:where(.dark, .dark *) {
    background-color: var(--color-slate-800);
  }
}

.pr-4 {
  padding-right: calc(var(--spacing) * 4);
}

.hover\:text-indigo-700 {
  &:hover {
    @media (hover: hover) {
      color: var(--color-indigo-700);
    }
  }
}