/* The approved Beyond Bounds arrival, shared by the eight project pages. */
.project-motion {
  --project-arrival-ease: linear(0, .027 3%, .102 8%, .216 14%, .352 21%, .493 29%, .622 38%, .732 48%, .82 59%, .887 69%, .936 79%, .969 88%, .99 95%, 1);
}
.project-motion .hero-title-line { display: inline-block; }
@media (prefers-reduced-motion: no-preference) {
  .project-motion.project-entering .hero-world {
    animation: project-world-arrive 760ms 70ms var(--project-arrival-ease) both;
  }
  .project-motion.project-entering .hero-title-line {
    animation: project-title-arrive 380ms 420ms var(--project-arrival-ease) both;
  }
  .project-motion.project-entering .hero-title-line + br + .hero-title-line { animation-delay: 510ms; }
  .project-motion.project-entering .hero-tagline {
    animation: project-copy-arrive 320ms 720ms var(--project-arrival-ease) both;
  }
  .project-motion.project-entering .chapter-navigation {
    animation: project-navigation-arrive 280ms 240ms ease-out both;
  }
  .project-motion.project-entering .project-entry {
    position: relative;
    overflow: hidden;
    animation: project-entry-arrive 380ms 900ms var(--project-arrival-ease) both;
  }
  .project-motion.project-entering .project-entry::after {
    position: absolute;
    inset-block: -40%;
    left: -24%;
    width: 16%;
    background: linear-gradient(90deg, transparent, #ffffff08 24%, #ffffff30 50%, #ffffff08 76%, transparent);
    content: '';
    pointer-events: none;
    transform: skewX(-14deg);
    animation: project-entry-sheen 360ms 920ms ease-in-out both;
  }
  .project-motion.project-entering:not(.project-entering-ready) .hero-world,
  .project-motion.project-entering:not(.project-entering-ready) .hero-title-line,
  .project-motion.project-entering:not(.project-entering-ready) .hero-tagline,
  .project-motion.project-entering:not(.project-entering-ready) .chapter-navigation,
  .project-motion.project-entering:not(.project-entering-ready) .project-entry,
  .project-motion.project-entering:not(.project-entering-ready) .project-entry::after {
    animation-play-state: paused;
  }
}
@keyframes project-world-arrive {
  0% { opacity: 0; filter: saturate(.46) brightness(.18) contrast(1.18) blur(2px); transform: translateX(14px) scale(1.035); }
  16% { opacity: .2; }
  52% { opacity: .82; filter: saturate(.7) brightness(.58) contrast(1.12); transform: translateX(5px) scale(1.012); }
  100% { opacity: 1; filter: saturate(1) brightness(1) contrast(1) blur(0); transform: none; }
}
@keyframes project-title-arrive {
  from { opacity: 0; clip-path: inset(0 100% 0 0); filter: blur(2px); transform: translateX(-14px); }
  to { opacity: 1; clip-path: inset(0); filter: blur(0); transform: none; }
}
@keyframes project-copy-arrive {
  from { opacity: 0; clip-path: inset(0 100% 0 0); filter: blur(2px); transform: translateY(6px); }
  to { opacity: 1; clip-path: inset(0); filter: blur(0); transform: none; }
}
@keyframes project-navigation-arrive {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: none; }
}
@keyframes project-entry-arrive {
  from { opacity: 0; filter: brightness(.3); transform: translateY(7px) scale(.98); }
  to { opacity: 1; filter: brightness(1); transform: none; }
}
@keyframes project-entry-sheen {
  from { left: -24%; opacity: 0; }
  20% { opacity: 1; }
  to { left: 120%; opacity: 0; }
}

/* Content enters once, in authored groups, as each part reaches the viewport. */
@media (prefers-reduced-motion: no-preference) {
  .project-motion.project-content-awaiting :is(.overview-copy > h2, .overview-copy > .lead, .contribution-list > li, .overview-facts > div, .overview-trailer) { opacity: 0; }
  .project-motion .project-reveal-pending { opacity: 0; }
  .project-motion .project-reveal-entering {
    animation: project-content-copy 308.571ms var(--project-reveal-delay, 0ms) var(--project-arrival-ease) both;
  }
  .project-motion .project-reveal-entering[data-project-reveal="heading"] {
    animation-name: project-content-heading;
    animation-duration: 354.286ms;
  }
  .project-motion .project-reveal-entering[data-project-reveal="card"] {
    animation-name: project-content-card;
    animation-duration: 320ms;
  }
  .project-motion .project-reveal-entering[data-project-reveal="fact"] {
    animation-name: project-content-fact;
    animation-duration: 240ms;
  }
  .project-motion .project-reveal-entering:is([data-project-reveal="media"], [data-project-reveal="trailer"]) {
    animation-name: project-content-media;
    animation-duration: 411.429ms;
  }
  .project-motion .project-reveal-entering[data-project-reveal="trailer"] :is(.trailer-player, .fm-player)::after {
    position: absolute;
    z-index: 2;
    inset-block: -40%;
    left: -24%;
    width: 16%;
    background: linear-gradient(90deg, transparent, #ffffff08 24%, #ffffff28 50%, #ffffff08 76%, transparent);
    content: '';
    pointer-events: none;
    transform: skewX(-14deg);
    animation: project-entry-sheen 245.714ms calc(var(--project-reveal-delay, 0ms) + 102.857ms) ease-in-out both;
  }
}
@keyframes project-content-heading {
  from { opacity: 0; filter: blur(5px); transform: translateY(13px); }
  to { opacity: 1; filter: blur(0); transform: none; }
}
@keyframes project-content-copy {
  from { opacity: 0; filter: blur(3px); transform: translateY(9px); }
  to { opacity: 1; filter: blur(0); transform: none; }
}
@keyframes project-content-card {
  0% { opacity: 0; transform: translateY(16px) scale(.975); border-color: #ffffff00; }
  65% { border-color: #ffffff40; }
  100% { opacity: 1; transform: none; border-color: var(--line); }
}
@keyframes project-content-fact {
  from { opacity: 0; filter: blur(2px); transform: translateY(7px); }
  to { opacity: 1; filter: blur(0); transform: none; }
}
@keyframes project-content-media {
  0% { opacity: 0; filter: brightness(.45) saturate(.65); clip-path: inset(4% 0 4% 0 round var(--radius)); transform: translateY(18px) scale(.985); }
  100% { opacity: 1; filter: brightness(1) saturate(1); clip-path: inset(0 round var(--radius)); transform: none; }
}