/* PAR MOTION , rebuilt 2026-08-23 against WEB-ANIMATION-PATTERNS-KB.
   Preview only.

   THE BRIEF, from the KB's first principle: "if this business were a person,
   how would it move?" This one is a repair man who shows up when he said he
   would, does the job, and leaves. So: decisive arrival, no drift, no flourish,
   nothing that loops. Racim's kit law says the same thing from the other side,
   motion means ARRIVAL, once per screen.

   WHAT WAS WRONG. One curve for 46 pages and one duration for every element:
   a 12px eyebrow and a 58px headline both took 550ms to travel the same 18px.
   That breaks the KB's MASS rule, which says bigger things move slower and
   further, and it is why the reveals read as a generic fade rather than as
   weight arriving. */

:root{
  /* The old curve is a mild ease-out. It drifts into place. This one gets
     most of the distance covered early and settles hard, which reads as
     something being SET DOWN rather than floating in. */
  --ease-arrive:cubic-bezier(.16,.92,.28,1);

  /* MASS: three weights, and both duration AND travel scale with size.
     Speed alone does not read as mass; distance is half the cue. */
  --rise-s:300ms; --lift-s:8px;    /* labels, eyebrows, captions       */
  --rise-m:440ms; --lift-m:14px;   /* body, rows, list items           */
  --rise-l:620ms; --lift-l:24px;   /* headlines, images, whole blocks  */
}

/* default any un-classed reveal to the middle weight rather than the heavy one,
   so the exceptional thing stays exceptional */
.reveal{
  opacity:0;transform:translateY(var(--lift-m));
  transition:opacity var(--rise-m) var(--ease-arrive),
             transform var(--rise-m) var(--ease-arrive);
}
.reveal.m-s{transform:translateY(var(--lift-s));
  transition-duration:var(--rise-s),var(--rise-s)}
.reveal.m-l{transform:translateY(var(--lift-l));
  transition-duration:var(--rise-l),var(--rise-l)}
.reveal.is-in{opacity:1;transform:none}

/* CHOREOGRAPHY. The KB: what animates LAST is the focus. So the small type
   goes first and the heavy element lands last, which means the eye finishes on
   the headline or the image rather than on a caption. The stagger stays small,
   this is arrival, not a performance. */
.reveal{transition-delay:var(--d,0ms)}

/* Everything off, completely, for anyone who asked for that. */
@media(prefers-reduced-motion:reduce){
  .reveal,.reveal.m-s,.reveal.m-l{
    opacity:1!important;transform:none!important;transition:none!important}
}
