/* Focus pull reveal: a hero comes up out of blur in three tiers (title, its copy, the art).
   Measured from decimals.co's layout shell (~/Dev/decimals-recreate/PARTS.md §1), rewritten.

   Knobs (custom properties on the [data-focus-pull] element, measured defaults):
     --fp-from-opacity  .3                          start opacity
     --fp-from-blur     12px                        start blur
     --fp-dur           .6s                         each element's clear-up
     --fp-ease          cubic-bezier(.22,1,.36,1)   the house ease-out (a fast start, a long soft landing)
     --fp-stagger       40ms                        between elements inside tiers 2 and 3
     --fp-fallback      2.6s                        no-JS / slow-JS: the whole hero clears on its own after this

   Before the script runs, every direct child of the hero already sits at .3 / blur(12px), so there is no flash of
   sharp content; if the script never arrives, the CSS clears it at 2.6s. The script adds html.fp-ready and takes over. */
[data-focus-pull] {
  --fp-from-opacity: .3;
  --fp-from-blur: 12px;
  --fp-dur: .6s;
  --fp-ease: cubic-bezier(.22, 1, .36, 1);
  --fp-stagger: 40ms;
  --fp-fallback: 2.6s;
}

html:not(.fp-ready) [data-focus-pull] > :not(style):not(script):not([data-focus-skip]) {
  opacity: var(--fp-from-opacity);
  filter: blur(var(--fp-from-blur));
  animation: fp-auto-reveal var(--fp-dur) var(--fp-fallback) forwards;
}

@keyframes fp-auto-reveal {
  to { opacity: 1; filter: none; }
}

@media (prefers-reduced-motion: reduce) {
  html:not(.fp-ready) [data-focus-pull] > :not(style):not(script) {
    opacity: 1; filter: none; animation: none;
  }
}

/* blur-lift-in (off by default; opt in per element with data-blur-lift, see part.js). Ripe's element blur-in:
   each element comes up from opacity .001 + translate 16px + blur(1px) on a 1.8 s bounce-0 spring once half of it
   is on screen. The JS holds the start frame, so nothing here hides anything: no JS = everything visible.
     --bl-y      rise distance (16px)
     --bl-blur   start blur (1px)
     --bl-dur    spring duration (1.8s); change it together with --bl-ease
     --bl-ease   the 1.8 s bounce-0 Framer spring as linear(), baked with spring-to-linear (bake.cjs "duration:1.8 bounce:0") */
[data-blur-lift] {
  --bl-y: 16px;
  --bl-blur: 1px;
  --bl-dur: 1.8s;
  --bl-ease: linear(0,0.0028,0.0107,0.0229,0.0387,0.0575,0.0788,0.1021,0.1271,0.1532,0.1803,0.208,0.2361,0.2643,0.2926,0.3208,0.3486,0.376,0.403,0.4294,0.4551,0.4802,0.5045,0.5281,0.5509,0.5729,0.5941,0.6146,0.6342,0.653,0.6711,0.6883,0.7049,0.7207,0.7357,0.7501,0.7638,0.7768,0.7892,0.801,0.8122,0.8228,0.8329,0.8425,0.8515,0.8601,0.8682,0.8759,0.8832,0.8901,0.8966,0.9027,0.9085,0.914,0.9191,0.924,0.9286,0.9329,0.937,0.9409,0.9445,0.9479,0.9511,0.9541,0.957,0.9596,0.9621,0.9645,0.9667,0.9688,0.9708,0.9726,0.9743,0.9759,0.9775,0.9789,0.9802,0.9815,0.9827,0.9838,0.9848,0.9858,0.9867,0.9876,0.9884,0.9891,0.9898,0.9905,0.9911,0.9917,0.9922,0.9927,0.9932,0.9936,0.9941,0.9944,0.9948,0.9951,0.9955,0.9958,0.996,0.9963,0.9965,0.9968,0.997,0.9972,0.9974,0.9975,0.9977,0.9979,0.998,0.9981,0.9983,0.9984,0.9985,0.9986,0.9987,0.9988,0.9989,0.9989,1);
}