/* ===============================================================
   MOTION  ·  parts/motion.css
   ---------------------------------------------------------------
   All hover, press and reveal timing lives here.
   Rule: colour 150ms ease-out, transform and shadow 200ms.
   Cards lift 2px, buttons drop 1px on press.
   The grid motif and ring outlines never animate.
   =============================================================== */

/* Reveal: fades up gently on scroll. main.js adds the class. */
.reveal{opacity:0;transform:translateY(14px);transition:opacity 420ms var(--ease),transform 420ms var(--ease)}
.reveal.is-in{opacity:1;transform:none}

/* Inside a grid, one item at a time */
.reveal-stagger > *{opacity:0;transform:translateY(14px);transition:opacity 420ms var(--ease),transform 420ms var(--ease)}
.reveal-stagger.is-in > *{opacity:1;transform:none}
.reveal-stagger.is-in > *:nth-child(2){transition-delay:60ms}
.reveal-stagger.is-in > *:nth-child(3){transition-delay:120ms}
.reveal-stagger.is-in > *:nth-child(4){transition-delay:180ms}
.reveal-stagger.is-in > *:nth-child(5){transition-delay:240ms}
.reveal-stagger.is-in > *:nth-child(6){transition-delay:300ms}

/* Answer slides in gently when details opens */
.fq__row[open] .fq__a{animation:lbgOpen 220ms var(--ease)}
@keyframes lbgOpen{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* Reduced motion: everything off. Do not remove this block. */
@media (prefers-reduced-motion:reduce){
  .reveal,.reveal-stagger > *{opacity:1 !important;transform:none !important;transition:none !important}
  .fq__row[open] .fq__a{animation:none}
}