/* Shared motion finish; load after the existing page styles. */
:root {
  --fp-motion-ease: cubic-bezier(.16, 1, .3, 1);
  --fp-motion-fast: 280ms;
}

/* Replace the older persistent hidden-state reveal with optional one-shot motion. */
.will-reveal,
.will-reveal.is-revealed {
  opacity: 1;
  transform: none;
  transition: none;
}

.text-link,
.button,
.fp-social-follow,
.contact-v2-email {
  transition-timing-function: var(--fp-motion-ease);
}

.text-link > span[aria-hidden="true"],
.fp-social-arrow,
.contact-v2-arrow,
#main-nav .nav-contact > span {
  display: inline-block;
  transition: transform 380ms var(--fp-motion-ease), color var(--fp-motion-fast) ease;
}

#main-nav a:not(.nav-contact)::after {
  transition: transform 380ms var(--fp-motion-ease);
}

.fp-feature-report img,
.fp-news-card-image img,
.fp-instagram-card img,
.fp-press-thumbnail,
.race-photo-grid-item img {
  transition-timing-function: var(--fp-motion-ease);
  transition-duration: 800ms;
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .text-link:is(:hover, :focus-visible) > span[aria-hidden="true"],
  .fp-social-follow:is(:hover, :focus-visible) .fp-social-arrow,
  .contact-v2-email:is(:hover, :focus-visible) .contact-v2-arrow,
  #main-nav .nav-contact:is(:hover, :focus-visible) > span {
    transform: translate(3px, -3px);
  }
}

/* Native navigation enhancement. There is no click interception or artificial delay. */
@media (prefers-reduced-motion: no-preference) {
  @view-transition {
    navigation: auto;
  }

  /* Keep the shared navigation steady as the page content changes beneath it. */
  .site-header { view-transition-name: fp-site-header; }
  ::view-transition-group(fp-site-header) { animation-duration: 0s; }
  ::view-transition-old(fp-site-header),
  ::view-transition-new(fp-site-header) {
    animation: none;
    mix-blend-mode: normal;
  }

  ::view-transition-old(root) {
    animation: fp-page-out 180ms ease-out both;
    mix-blend-mode: normal;
  }

  ::view-transition-new(root) {
    animation: fp-page-in 420ms var(--fp-motion-ease) both;
    mix-blend-mode: normal;
  }
}

@keyframes fp-page-out {
  to { opacity: 0; }
}

@keyframes fp-page-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

html.motion-paused::view-transition-old(root),
html.motion-paused::view-transition-new(root) {
  animation: none;
}

html.motion-paused .text-link > span[aria-hidden="true"],
html.motion-paused .fp-social-arrow,
html.motion-paused .contact-v2-arrow {
  transform: none;
  transition: none;
}

@media (prefers-reduced-motion: reduce) {
  .will-reveal,
  .will-reveal.is-revealed {
    opacity: 1;
    transform: none;
  }

  ::view-transition-old(root),
  ::view-transition-new(root) {
    animation: none;
  }

  .text-link > span[aria-hidden="true"],
  .fp-social-arrow,
  .contact-v2-arrow,
  #main-nav .nav-contact > span {
    transform: none;
    transition: none;
  }
}