/* Essential content stays visible before JavaScript runs. */
@keyframes arrive {
  from {
    opacity: 1;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .hero-copy > h1 {
    animation: arrive var(--arrival-duration) var(--ease) both;
  }
  .hero-introduction {
    animation: arrive var(--arrival-duration) 0.08s var(--ease) both;
  }
  .hero-actions {
    animation: arrive var(--arrival-duration) 0.15s var(--ease) both;
  }
  .request-figure {
    animation: arrive var(--arrival-duration) 0.1s var(--ease) both;
  }
  .reveal.will-reveal {
    opacity: 0;
    transform: translateY(var(--reveal-distance));
    transition:
      opacity var(--reveal-duration) var(--ease),
      transform var(--reveal-duration) var(--ease);
  }
  .reveal.will-reveal.is-visible {
    opacity: 1;
    transform: none;
  }
  .project-art-link:hover .art-filled {
    transition: opacity 0.3s;
    opacity: 0.75;
  }
  @view-transition {
    navigation: auto;
  }
  ::view-transition-old(root) {
    animation-duration: 0.18s;
  }
  ::view-transition-new(root) {
    animation-duration: 0.24s;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .reveal.will-reveal {
    opacity: 1;
    transform: none;
  }
  ::view-transition-old(root),
  ::view-transition-new(root) {
    animation: none;
  }
}