/* Scroll-driven effects run on the compositor — no JavaScript in the scroll loop.
   Kept outside the Astro build on purpose: its minifier merges `animation` + `animation-timeline` into one
   shorthand that Safari throws away. Browsers without scroll timelines simply show the images still. */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .about-pic .pic > img,
    .sv-hero.hires .pic > img {
      animation-name: bsc-par;
      animation-duration: auto;
      animation-timing-function: linear;
      animation-fill-mode: both;
      animation-timeline: view();
      animation-range: cover 0% cover 100%;
    }
  }
}
@keyframes bsc-par {
  from { transform: translate3d(0, -5%, 0); }
  to { transform: translate3d(0, 5%, 0); }
}

/* the rope access technician lowers a little as the services scroll past */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .services { view-timeline-name: --svc; view-timeline-axis: block; view-timeline-inset: 0px; }
    .rope-tech-svg {
      animation-name: bsc-abseil;
      animation-duration: auto;
      animation-timing-function: linear;
      animation-fill-mode: both;
      animation-timeline: --svc;
      animation-range: entry 0% exit 30%;
    }
  }
}
@keyframes bsc-abseil {
  from { transform: translate3d(0, -60px, 0); }
  to { transform: translate3d(0, 70px, 0); }
}