/* Motion: scroll reveal, parallax, outline numbers. Last stylesheet. */

/* Reveal on scroll: app.js adds .is-in (IntersectionObserver). Without JS nothing is hidden;
   kit tools add .is-in themselves before full-page shots. */
@media (prefers-reduced-motion: no-preference) {
  .js [data-reveal] { transition: opacity .7s var(--ease), transform .8s var(--spring); }
  .js [data-reveal]:not(.is-in) { opacity: 0; transform: translateY(32px); }
  .js [data-reveal="left"]:not(.is-in) { transform: translateX(-40px); }
  .js .steps [data-reveal]:nth-child(2), .js .fam [data-reveal]:nth-child(2), .js .grid-4 [data-reveal]:nth-child(2) { transition-delay: .08s; }
  .js .steps [data-reveal]:nth-child(3), .js .fam [data-reveal]:nth-child(3), .js .grid-4 [data-reveal]:nth-child(3) { transition-delay: .16s; }
  .js .steps [data-reveal]:nth-child(4), .js .fam [data-reveal]:nth-child(4), .js .grid-4 [data-reveal]:nth-child(4) { transition-delay: .24s; }
  .js .steps [data-reveal]:nth-child(5) { transition-delay: .32s; }
}

/* Scroll-linked parallax and number tracking — decorative only, never hides content. */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .zz-photo .ph img, .parallax img { animation: par linear both; animation-timeline: view(); animation-range: cover; }
    @keyframes par { from { transform: scale(1.14) translateY(-3%); } to { transform: scale(1.04) translateY(3%); } }
    .sec-num { animation: numIn linear both; animation-timeline: view(); animation-range: entry 0% cover 35%; }
    @keyframes numIn { from { letter-spacing: .05em; } to { letter-spacing: -.05em; } }
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}