.site-button,
.news-button,
.floating-entry__link,
.smf-action .smf-button-control__control {
  --button-hover-text: var(--color-primary);
  --button-hover-background: var(--color-accent);
  transition: color var(--motion-duration) ease, background-color var(--motion-duration) ease, box-shadow var(--motion-duration) ease;
}

.site-button--yellow,
.floating-entry__link {
  --button-hover-text: var(--color-accent);
  --button-hover-background: var(--color-primary);
}

:is(.site-button, .news-button, .floating-entry__link, .smf-action .smf-button-control__control):focus-visible {
  color: var(--button-hover-text);
  background-color: var(--button-hover-background);
  box-shadow: none;
  filter: none;
  opacity: 1;
}

.site-button:focus-visible .site-button__arrow,
.news-button:focus-visible .news-button__arrow,
.smf-action .smf-button-control__control:focus-visible::after {
  filter: brightness(0) saturate(100%) invert(27%) sepia(97%) saturate(1632%) hue-rotate(181deg) brightness(89%) contrast(103%);
}

.site-button--yellow:focus-visible .site-button__arrow {
  filter: brightness(0) invert(1);
}

@media (hover: hover) {
  :is(.site-button, .news-button, .floating-entry__link, .smf-action .smf-button-control__control):hover {
    color: var(--button-hover-text);
    background-color: var(--button-hover-background);
    box-shadow: none;
    filter: none;
    opacity: 1;
  }

  .site-button:hover .site-button__arrow,
  .news-button:hover .news-button__arrow,
  .smf-action .smf-button-control__control:hover::after {
    filter: brightness(0) saturate(100%) invert(27%) sepia(97%) saturate(1632%) hue-rotate(181deg) brightness(89%) contrast(103%);
  }

  .site-button--yellow:hover .site-button__arrow {
    filter: brightness(0) invert(1);
  }
}

.news-card.is-active {
  animation: news-reveal var(--motion-duration) ease;
}

@keyframes news-reveal {
  from { opacity: 0; transform: translateX(0.5rem); }
  to { opacity: 1; transform: translateX(0); }
}

@media (min-width: 992px) {
  .news-card.is-active { animation: none; }
}

@media (prefers-reduced-motion: reduce) {
  .news-card.is-active { animation: none; }
  .site-button,
  .news-button,
  .floating-entry__link,
  .smf-action .smf-button-control__control { transition: none; }
}
