/* Motion only. Layout changes do not belong here. */

:root {
  --duration-fast: 180ms;
  --duration-menu: 320ms;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}

.nav-overlay,
.site-menu {
  transition-duration: var(--duration-menu);
  transition-timing-function: var(--ease-out);
}

.nav-overlay {
  transition-property: opacity;
}

.site-menu {
  transition-property: transform;
}

.events-seal {
  transform-origin: center;
  animation: events-spin 28s linear infinite;
}

@keyframes events-spin {
  to {
    transform: rotate(360deg);
  }
}

.button,
.text-link,
.site-nav a,
.language-menu a,
.language-toggle,
.theme-toggle,
.nav-toggle,
.nav-close,
.footer-social a,
.footer-info a,
.menu-nav a,
.menu-strip-arrow,
.event-form input,
.event-form select,
.event-form textarea {
  transition-property: color, background-color, border-color, box-shadow;
  transition-duration: var(--duration-fast);
  transition-timing-function: var(--ease-out);
}

.menu-card-media img,
.menu-strip-media img,
.event-card-media img {
  transition-property: transform;
  transition-duration: var(--duration-fast);
  transition-timing-function: var(--ease-out);
}

.menu-marquee-track {
  --marquee-duration: 110s;
  animation: menu-marquee var(--marquee-duration) linear infinite;
}

.menu-marquee:hover .menu-marquee-track,
.menu-marquee:focus-within .menu-marquee-track {
  animation-play-state: paused;
}

@keyframes menu-marquee {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-50%);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .menu-marquee {
    overflow-x: auto;
    cursor: auto;
    touch-action: auto;
  }

  .menu-marquee-track {
    animation: none !important;
    transform: none !important;
  }

  .menu-marquee-set[aria-hidden="true"] {
    display: none;
  }
}
