/* Animations are only enabled once the observer is ready. No-JS is fully visible. */
.motion-ready body { overflow-x: clip; }
.motion-ready [data-reveal] {
  opacity: 0;
  transform: translate3d(0, 26px, 0);
  transition:
    opacity 750ms cubic-bezier(.22, 1, .36, 1),
    transform 900ms cubic-bezier(.22, 1, .36, 1);
  transition-delay: var(--reveal-delay, 0ms);
}
.motion-ready [data-reveal="right"] { transform: translate3d(22px, 12px, 0); }
.motion-ready [data-reveal="scale"] { transform: translate3d(0, 30px, 0) scale(.975); }
.motion-ready [data-reveal].is-revealed,
.motion-ready [data-reveal]:focus-within {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

.motion-ready .hero-eyebrow { animation: hero-enter 900ms cubic-bezier(.22, 1, .36, 1) both; }
.motion-ready .hero h1 { animation: hero-enter 1100ms 90ms cubic-bezier(.22, 1, .36, 1) both; }
.motion-ready .hero-answer { animation: hero-enter 1100ms 210ms cubic-bezier(.22, 1, .36, 1) both; }
.motion-ready .hero-footer { animation: hero-enter 1000ms 340ms cubic-bezier(.22, 1, .36, 1) both; }
.motion-ready .hero-art { transition: transform 160ms linear; }
.motion-ready .hero-art img { animation: glass-drift 24s ease-in-out alternate infinite; }
.motion-ready .hero-scene:not(.is-in-view) .hero-art img { animation-play-state: paused; }
.motion-ready .hero-answer .answer-wave i {
  animation: voice-breath 1800ms ease-in-out infinite alternate;
  transform-origin: center;
}
.motion-ready .answer-wave i:nth-child(2) { animation-delay: -550ms; }
.motion-ready .answer-wave i:nth-child(3) { animation-delay: -1100ms; }
.motion-ready .answer-wave i:nth-child(4) { animation-delay: -350ms; }
.motion-ready .answer-wave i:nth-child(5) { animation-delay: -900ms; }

.outcome-card .evidence-image, .outcome-card .notice-evidence {
  transition: transform 450ms cubic-bezier(.22, 1, .36, 1), box-shadow 450ms ease;
}
@media (hover: hover) and (pointer: fine) {
  .outcome-card:hover .evidence-image, .outcome-card:hover .notice-evidence {
    transform: translateY(-5px);
    box-shadow: 0 12px 26px #16376009;
  }
}

@keyframes hero-enter {
  from { opacity: 0; transform: translate3d(0, 21px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}
@keyframes glass-drift {
  from { transform: scale(1.015) translate3d(-.4%, -.3%, 0); }
  to { transform: scale(1.075) translate3d(.4%, .3%, 0); }
}
@keyframes voice-breath {
  from { transform: scaleY(.65); opacity: .6; }
  to { transform: scaleY(1); opacity: 1; }
}

@media (max-width: 720px) {
  .motion-ready [data-reveal] { transform: translate3d(0, 18px, 0); transition-duration: 650ms, 750ms; }
  .motion-ready [data-reveal="scale"] { transform: translate3d(0, 18px, 0) scale(.985); }
  .motion-ready [data-reveal].is-revealed,
  .motion-ready [data-reveal]:focus-within { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-art, .hero-art img { transform: none !important; }
  [data-reveal] { opacity: 1 !important; transform: none !important; transition: none !important; }
}
@media print {
  [data-reveal] { opacity: 1 !important; transform: none !important; }
}
