@media (prefers-reduced-motion: no-preference) {
  .projects-page {
    --archive-motion-ease: cubic-bezier(.16, 1, .3, 1);
  }

  .projects-page .project-card {
    transition: transform 260ms var(--archive-motion-ease), filter 200ms var(--archive-motion-ease);
  }

  .projects-page .project-cover-visual[data-cover-sheet]::before {
    transition: transform 300ms var(--archive-motion-ease);
  }

  .projects-page .project-card:is(:hover, :focus-within, .is-expanded) .project-cover-visual[data-cover-sheet]::before {
    transform: scale(1.045);
  }

  .projects-page .project-cover-visual[data-cover-sheet]::after {
    transition: opacity 245ms var(--archive-motion-ease);
  }

  .projects-page .project-card :is(.project-expanded-copy, .project-hover-data) {
    transform: translateY(13px);
    clip-path: inset(0 0 100% 0);
    transition: opacity 125ms ease-out, transform 150ms ease-out, clip-path 150ms ease-out;
  }

  .projects-page .project-card:is(:hover, :focus-within, .is-expanded) .project-expanded-copy {
    transform: translateY(0);
    clip-path: inset(0);
    transition: opacity 165ms var(--archive-motion-ease) 35ms,
      transform 230ms var(--archive-motion-ease) 35ms, clip-path 220ms var(--archive-motion-ease) 35ms;
  }

  .projects-page .project-card:is(:hover, :focus-within, .is-expanded) .project-hover-data {
    transform: translateY(0);
    clip-path: inset(0);
    transition: opacity 160ms var(--archive-motion-ease) 74ms,
      transform 210ms var(--archive-motion-ease) 74ms, clip-path 210ms var(--archive-motion-ease) 74ms;
  }

  .projects-page .project-status-flyout {
    transition: opacity 135ms ease-out, transform 155ms ease-out, visibility 155ms;
  }

  .projects-page .project-other-filter:is(:hover, :focus-within, .is-touch-open) .project-status-flyout {
    transition: opacity 180ms var(--archive-motion-ease), transform 240ms var(--archive-motion-ease);
  }

  .projects-page .project-filters button {
    transition: background-color 150ms ease-out, color 150ms ease-out, border-color 150ms ease-out;
  }

  .projects-page .project-card.archive-filter-reveal > .project-cover-visual {
    animation: archive-filter-cover 205ms var(--archive-motion-ease) var(--archive-reveal-delay) backwards;
  }

  .projects-page .project-card.archive-filter-reveal > .project-info-band {
    animation: archive-filter-caption 195ms var(--archive-motion-ease) calc(var(--archive-reveal-delay) + 26ms) backwards;
  }
}

@keyframes archive-filter-cover {
  from { opacity: .59; }
  to { opacity: 1; }
}

@keyframes archive-filter-caption {
  from { opacity: .73; translate: 0 5px; }
  to { opacity: 1; translate: 0 0; }
}

@media (prefers-reduced-motion: reduce) {
  .projects-page .project-card,
  .projects-page .project-cover-visual::before,
  .projects-page .project-card :is(.project-symbol, .project-expanded-copy, .project-hover-data),
  .projects-page .project-status-flyout,
  .projects-page .project-filters button {
    animation: none;
    transition: none;
  }

  .projects-page .project-card :is(.project-expanded-copy, .project-hover-data) { transform: none; }
}
