/* ============================================
   animations.css - Scroll reveal, motion tokens
   Sobrio motion per Design System section 14:
   easing var(--ease-out), micro 180ms / reveal 600ms.
   ============================================ */

/* ---- Scroll reveal (discrete, no bounce) ---- */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity var(--duration-slow) var(--ease-out),
              transform var(--duration-slow) var(--ease-out);
}

.reveal--visible {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger support via custom property */
.reveal--stagger {
  transition-delay: calc(var(--reveal-index, 0) * 70ms);
}

/* ---- Parallel reveal for project images (very subtle) ---- */
.image-parallax {
  transform: translateZ(0);
  transition: transform 400ms var(--ease-out);
}

/* ---- Animated link underline (used on nav + links) ---- */
.u-underline {
  position: relative;
}

.u-underline::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  height: 1px;
  width: 0;
  background: currentColor;
  transition: width var(--duration-normal) var(--ease-out);
}

.u-underline:hover::after,
.u-underline[aria-current="page"]::after {
  width: 100%;
}

/* ---- Border expansion on hover (subtle, architectural) ---- */
.b-expand {
  transition: border-color var(--duration-fast) var(--ease-out),
              transform var(--duration-normal) var(--ease-out);
}

/* ---- Respect reduced motion - show everything immediately (DS 22) ---- */
@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .image-parallax {
    transform: none;
    transition: none;
  }
}