/* Each scene has its own ambient cadence. Off-screen and background-tab motion stops. */
.hero-image {
  animation: breath 20s ease-in-out infinite alternate;
}
.light-pass {
  animation: light-drift 19s ease-in-out infinite alternate;
}
.roof-line path {
  animation: trace 16s ease-in-out infinite;
}
.field-frame {
  animation: field-drift 13s ease-in-out infinite alternate;
}
.draft-grid {
  animation: grid-drift 20s linear infinite;
}
.scan-line {
  animation: scan 9s ease-in-out infinite alternate;
}
.paper-shadow {
  animation: paper-drift 14s ease-in-out infinite alternate;
}
.render-image {
  animation: breath 20s ease-in-out infinite alternate;
}
.method-orbit {
  animation: orbit 18s ease-in-out infinite alternate;
}
.method-list li {
  animation: record-light 12s infinite;
}
.method-list li:nth-child(2) {
  animation-delay: 3s;
}
.method-list li:nth-child(3) {
  animation-delay: 6s;
}
.method-list li:nth-child(4) {
  animation-delay: 9s;
}
.epilogue-image {
  animation: epilogue-drift 18s ease-in-out infinite alternate;
}
.scene:not(.is-active) * {
  animation-play-state: paused !important;
}
body.is-hidden * {
  animation-play-state: paused !important;
}
.scene.is-active .hero-copy,
.scene.is-active .chapter-copy,
.scene.is-active .construction-heading,
.scene.is-active .archive-index,
.scene.is-active .method-copy,
.scene.is-active .epilogue-copy {
  animation: copy-in 1.1s var(--ease) both;
}
.scene-measure.is-active .drawing-stage {
  animation: drawing-in 1.1s var(--ease) both;
}
.scene-archive.is-active .archive-desk {
  animation: paper-in 1.1s var(--ease) both;
}
.scene-render.is-active {
  animation: reveal 0.82s var(--ease);
}
.scene-image {
  translate: calc(var(--pointer-x, 0) * 8px) calc(var(--pointer-y, 0) * 5px);
}
.is-changing {
  animation: image-reveal 0.7s var(--ease) !important;
}
.is-changing[data-enter='back'] {
  animation-name: image-reveal-back !important;
}
@keyframes image-reveal-back {
  from {
    opacity: 0.15;
    clip-path: inset(0 0 0 30%);
  }
  to {
    opacity: 1;
    clip-path: inset(0);
  }
}
@keyframes breath {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(1.045);
  }
}
@keyframes light-drift {
  from {
    transform: translateX(-12%) rotate(-2deg);
    opacity: 0.3;
  }
  to {
    transform: translateX(12%) rotate(2deg);
    opacity: 1;
  }
}
@keyframes trace {
  0%,
  10% {
    stroke-dashoffset: 1000;
    opacity: 0;
  }
  45%,
  70% {
    stroke-dashoffset: 0;
    opacity: 1;
  }
  100% {
    stroke-dashoffset: 0;
    opacity: 0;
  }
}
@keyframes field-drift {
  from {
    transform: translateY(0) rotate(-1deg);
  }
  to {
    transform: translateY(-8px) rotate(0.4deg);
  }
}
@keyframes grid-drift {
  to {
    background-position: 60px 60px;
  }
}
@keyframes scan {
  from {
    left: 0;
    opacity: 0.2;
  }
  to {
    left: 100%;
    opacity: 0.8;
  }
}
@keyframes paper-drift {
  to {
    rotate: -1deg;
    translate: 0 -7px;
  }
}
@keyframes orbit {
  to {
    transform: rotate(3deg) scale(0.97);
  }
}
@keyframes record-light {
  0%,
  20% {
    color: #dfbd8e;
  }
  25%,
  100% {
    color: #a9b3a5;
  }
}
@keyframes epilogue-drift {
  to {
    transform: scale(1.03) translateX(-0.6%);
  }
}
@keyframes copy-in {
  from {
    opacity: 0;
    transform: translateY(25px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes drawing-in {
  from {
    opacity: 0;
    transform: translateX(60px) rotate(0);
  }
  to {
    opacity: 1;
    transform: translateX(0) rotate(-3deg);
  }
}
@keyframes paper-in {
  from {
    opacity: 0;
    transform: translateX(50px) rotate(3deg);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes reveal {
  from {
    clip-path: inset(0 100% 0 0);
  }
  to {
    clip-path: inset(0);
  }
}
@keyframes image-reveal {
  from {
    opacity: 0.15;
    clip-path: inset(0 30% 0 0);
  }
  to {
    opacity: 1;
    clip-path: inset(0);
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
  .scene-image {
    translate: none;
  }
  .roof-line path {
    stroke-dashoffset: 0;
  }
}