/* ============================================================
   zz-scroll-detail.css — scroll-driven detail motion
   ------------------------------------------------------------
   Tasteful, additive touches keyed to scrolling. Loaded after
   micro-interactions.css (z > m) so its .top-link transform
   rules win at equal/greater specificity.

   Back-to-top button: spring "pop-in".
   The footer script toggles `.is-visible` on #top-link once the
   page is scrolled past 800px (desktop only — the button is
   display:none on mobile). We animate a scale + slight rise so
   the control springs into view instead of only fading. The
   inline opacity/visibility set by the script stays as the
   no-CSS fallback; this layer only adds the transform.

   micro-interactions.css already gives .top-link a
   `transform 0.3s cubic-bezier(0.34,1.56,0.64,1)` transition,
   so the pop inherits a gentle overshoot for free.
   ============================================================ */

.top-link {
  /* Resting (hidden) state: tucked down and shrunk. When hidden the
     button is also opacity:0 / visibility:hidden (inline), so this is
     only ever seen mid-transition as it springs in/out. */
  transform: scale(0.6) translateY(10px);
}

.top-link.is-visible {
  transform: scale(1) translateY(0);
}

/* Keep the existing hover lift, but compose it with the visible
   scale so hovering doesn't snap the button back to its rest size.
   Higher specificity than micro-interactions.css `.top-link:hover`. */
.top-link.is-visible:hover {
  transform: scale(1) translateY(-3px);
}

@media (prefers-reduced-motion: reduce) {
  /* No movement for visitors who ask for less motion: the button
     simply fades in via the inline opacity, never springs. */
  .top-link,
  .top-link.is-visible,
  .top-link.is-visible:hover {
    transform: none !important;
  }
}
