/* Motion core for the hand-made directions (D1 Luz, D2 Cartões vivos, D3 Escuro).
   Every value here was measured on 21/10 (craft/tokens-agg.json, 75 sites, Chromium 1440×900):
   - Framer sites (29): entrances by WAAPI, median 800 ms, from translateY ~70 px, blur 8–10 px on 28 %,
     scale ~0.8 when used, ~380 ms between groups, appear from opacity 0.001.
   - The two spring curves below are the exact linear() easings those sites declare, simplified to
     16 points with max error 0.004: «spring» (4 sites, no overshoot) and «spring-pop» (2 sites, +1.5 %).
   - Hover transitions on the kits: 150–200 ms, cubic-bezier(0.4, 0, 0.2, 1).
   VULK's own sites measured 7 % with any entrance and 0 % with blur or stagger. */

:root {
  --ease-spring: linear(0 0%, 0.0212 1.562%, 0.0703 3.125%, 0.3932 10.94%, 0.5015 14.06%, 0.5919 17.19%, 0.6665 20.31%, 0.7539 25%, 0.7991 28.12%, 0.8519 32.81%, 0.8908 37.5%, 0.9195 42.19%, 0.9464 48.44%, 0.9643 54.69%, 0.9871 70.31%, 1 100%);
  --ease-spring-pop: linear(0 0%, 0.0235 2.564%, 0.083 5.128%, 0.1647 7.692%, 0.5423 17.95%, 0.6252 20.51%, 0.6991 23.08%, 0.7636 25.64%, 0.8186 28.21%, 0.8647 30.77%, 0.933 35.9%, 0.9571 38.46%, 0.9895 43.59%, 1.011 51.28%, 1.015 61.54%, 1 100%);
  --ease-framer: cubic-bezier(0.44, 0, 0.56, 1);
  --ease-ui: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-enter: 800ms;
  --enter-y: 64px;
  --enter-blur: 8px;
  --dur-hover: 180ms;
}

/* Hidden only once the script has claimed the page: without JS nothing stays invisible. */
html.motion [data-enter] {
  opacity: 0.001;
  transform: translate3d(0, var(--enter-y), 0);
  filter: blur(var(--enter-blur));
}
html.motion [data-enter="fade"] { transform: none; }
html.motion [data-enter="scale"] { transform: scale(0.96); filter: blur(var(--enter-blur)); }
html.motion [data-rise] {
  opacity: 0.001;
  transform: translate3d(0, 38%, 0) scale(0.94);
  filter: blur(6px);
}

/* Lines of a heading enter one by one from under a mask (each line is wrapped by motion.js). */
.line-mask { display: block; overflow: clip; padding-bottom: 0.08em; margin-bottom: -0.08em; }
.line-mask > .line { display: block; }

/* Numbers that count keep their width while counting. */
[data-count] { font-variant-numeric: tabular-nums; }

/* A skeleton that hands over to content: a soft sheen, not a spinner. */
.skeleton {
  background: linear-gradient(90deg, var(--sk-a, #eef0f3) 0%, var(--sk-b, #f7f8fa) 40%, var(--sk-a, #eef0f3) 80%) 0 0 / 300% 100%;
  animation: sk-sheen 1.6s var(--ease-framer) infinite;
  border-radius: inherit;
}
@keyframes sk-sheen { from { background-position: 100% 0; } to { background-position: -50% 0; } }

@media (prefers-reduced-motion: reduce) {
  html.motion [data-enter], html.motion [data-rise] { opacity: 1; transform: none; filter: none; }
  .skeleton { animation: none; }
}