/* Reveal + count-up. [data-reveal] rises 18px and fades in over 700ms on cubic-bezier(.22,1,.36,1) the first
   time 10% of it is on screen; [data-count] counts its number up from 0 over 1400ms (1-(1-t)^3). Things already
   on screen at load show at once. Nothing is hidden until part.js has sorted every element into "on screen" or
   "waiting" (html.rc-motion), so nothing flashes. Numbers from DUNA's BaseLayout script + global.css. */
:root {
  --rc-rise: 18px;                        /* rise distance */
  --rc-dur: .7s;                          /* rise length */
  --rc-ease: cubic-bezier(.22, 1, .36, 1);
}
html.rc-motion [data-reveal]:not(.is-revealed) { opacity: 0; transform: translateY(var(--rc-rise)); }
html.rc-motion [data-reveal].is-revealed {
  animation: rc-rise var(--rc-dur) var(--rc-ease) both;
  animation-delay: var(--reveal-delay, 0s);
}
html.rc-motion [data-reveal].is-revealed.is-instant { animation: none; }
/* start keyframe only: the element rises to its OWN resting opacity/transform, whatever those are */
@keyframes rc-rise { from { opacity: 0; transform: translateY(var(--rc-rise)); } }

/* counting numbers keep their width, so the line around them doesn't wobble */
[data-count] { font-variant-numeric: tabular-nums; }

@media (prefers-reduced-motion: reduce) {
  html.rc-motion [data-reveal]:not(.is-revealed) { opacity: 1; transform: none; }
  html.rc-motion [data-reveal].is-revealed { animation: none; }
}
@media print {
  html.rc-motion [data-reveal]:not(.is-revealed) { opacity: 1; transform: none; }
}
