:root {
  --motion-ease: cubic-bezier(.22, 1, .36, 1);
  --motion-fast: 180ms;
  --motion-reveal: 560ms;
}

a:focus-visible,
button:focus-visible {
  outline: 3px solid rgba(15, 118, 110, .55);
  outline-offset: 4px;
}

@media (prefers-reduced-motion: no-preference) {
  /* The gallery contains a large media archive; never hide its full wrapper while waiting for a reveal. */
  #gallery.motion-reveal,
  #gallery .motion-reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .motion-ready .motion-reveal {
    opacity: 0;
    transform: translate3d(0, 1.25rem, 0);
    transition:
      opacity var(--motion-reveal) var(--motion-ease) var(--motion-delay, 0ms),
      transform var(--motion-reveal) var(--motion-ease) var(--motion-delay, 0ms);
  }

  .motion-ready .motion-reveal--hero {
    transition-duration: 680ms;
  }

  .motion-ready .motion-reveal--hero:not(.motion-reveal--left):not(.motion-reveal--right) {
    transform: translate3d(0, .9rem, 0);
  }

  .motion-ready .motion-reveal--left {
    transform: translate3d(-1.5rem, 0, 0);
  }

  .motion-ready .motion-reveal--right {
    transform: translate3d(1.5rem, 0, 0);
  }

  .motion-ready .motion-reveal.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }

  .motion-control {
    transition:
      transform var(--motion-fast) var(--motion-ease),
      box-shadow var(--motion-fast) var(--motion-ease);
  }

  .motion-control:hover {
    transform: translate3d(0, -2px, 0);
  }

  .motion-control:active {
    transform: translate3d(0, 0, 0) scale(.985);
  }

  .motion-link span[aria-hidden="true"] {
    display: inline-block;
    transition: transform var(--motion-fast) var(--motion-ease);
  }

  .motion-link:hover span[aria-hidden="true"],
  .motion-link:focus-visible span[aria-hidden="true"] {
    transform: translate3d(.22rem, 0, 0);
  }

  .motion-card {
    transition:
      transform 220ms var(--motion-ease),
      box-shadow 220ms var(--motion-ease);
  }

  .motion-card:hover,
  .motion-card:focus-within {
    transform: translate3d(0, -3px, 0);
    box-shadow: 0 16px 34px -20px rgba(15, 23, 42, .38);
  }
}

@media (hover: none), (pointer: coarse) {
  .motion-control:hover,
  .motion-card:hover {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .motion-reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .motion-control,
  .motion-link,
  .motion-card {
    transition: none !important;
  }

  .reviews-marquee {
    overflow-x: auto;
    mask-image: none;
    -webkit-mask-image: none;
  }

  .reviews-marquee__track {
    width: 100%;
    transform: none !important;
  }

  .reviews-marquee__group {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr));
    padding-right: 0;
  }

  .reviews-marquee__group[aria-hidden="true"] {
    display: none;
  }

  .reviews-marquee__group > article {
    width: 100%;
  }
}