/* Pulsify motion scenes: small illustrations drawn in code from the brand tokens.
   <div class="scene" data-scene="website"></div>  Each plays once when it is almost fully on screen, then idles.
   Rules: ease-out enters, nothing moves until seen, decorative only (aria-hidden), reduced motion = finished state. */
.scene { position: relative; overflow: hidden; }
.scene svg { width: 100%; height: 100%; display: block; }
.scene text { font-family: 'Outfit', system-ui, sans-serif; }
.scene .pop { transform-box: fill-box; transform-origin: center; scale: 0; }
.scene .rise { opacity: 0; translate: 0 12px; }
.scene .grow-x { transform-box: fill-box; transform-origin: left center; scale: 0 1; }
.scene .grow-y { transform-box: fill-box; transform-origin: center bottom; scale: 1 0; }
.scene .draw { stroke-dasharray: 1; stroke-dashoffset: 1; }
.scene .drop { opacity: 0; translate: 0 -70px; }
.scene .shift { transform-box: fill-box; }
.scene .pulse { transform-box: fill-box; transform-origin: center; }
.scene .fill-on { fill: var(--from); }
.scene .count { opacity: 0; }
.scene.play .pop { animation: sc-pop .75s cubic-bezier(.2,.9,.3,1.3) both; animation-delay: var(--d, 0s); }
.scene.play .rise { animation: sc-rise .75s cubic-bezier(.2,.8,.2,1) both; animation-delay: var(--d, 0s); }
.scene.play .grow-x { animation: sc-grow-x .85s cubic-bezier(.2,.8,.2,1) both; animation-delay: var(--d, 0s); }
.scene.play .grow-y { animation: sc-grow-y .85s cubic-bezier(.2,.8,.2,1) both; animation-delay: var(--d, 0s); }
.scene.play .draw { animation: sc-draw 1.1s cubic-bezier(.3,.7,.2,1) both; animation-delay: var(--d, 0s); }
.scene.play .drop { animation: sc-drop .9s cubic-bezier(.2,.8,.2,1) both; animation-delay: var(--d, 0s); }
.scene.play .shift { animation: sc-shift .5s cubic-bezier(.2,.8,.2,1) both; animation-delay: var(--d, 0s); }
.scene.play .fill-on { animation: sc-fill .5s ease-out both; animation-delay: calc(var(--d, 0s) + 1.4s); }
.scene.play .grow-y.fill-on { animation: sc-grow-y .85s cubic-bezier(.2,.8,.2,1) both, sc-fill .5s ease-out both; animation-delay: var(--d, 0s), calc(var(--d, 0s) + 1.4s); }
.scene.play .count { animation: sc-rise .6s cubic-bezier(.2,.8,.2,1) both; animation-delay: var(--d, 0s); }
.scene.play .pulse { animation: sc-pulse 2.4s 1.2s ease-in-out infinite; }
.scene.play .loop-pop { animation: sc-pop .6s cubic-bezier(.2,.9,.3,1.3) both, sc-breathe 4s ease-in-out infinite; animation-delay: var(--d, 0s), calc(var(--d, 0s) + 2s); }
.scene.play .blink { animation: sc-blink 1.1s ease-in-out infinite; animation-delay: var(--d, 0s); }
.scene.off .pulse, .scene.off .loop-pop, .scene.off .blink, .scene.off .travel { animation-play-state: paused; }
@keyframes sc-pop { to { scale: 1; } }
@keyframes sc-rise { to { opacity: 1; translate: 0 0; } }
@keyframes sc-grow-x { to { scale: 1 1; } }
@keyframes sc-grow-y { to { scale: 1 1; } }
@keyframes sc-draw { to { stroke-dashoffset: 0; } }
@keyframes sc-drop { to { opacity: 1; translate: 0 0; } }
@keyframes sc-shift { to { translate: var(--dx, 18px) 0; } }
@keyframes sc-fill { to { fill: var(--to); } }
@keyframes sc-pulse { 50% { scale: 1.12; } }
@keyframes sc-breathe { 50% { scale: 1.1; } }
@keyframes sc-blink { 50% { opacity: .25; } }
@media (prefers-reduced-motion: reduce) {
  .scene .pop { scale: 1; } .scene .rise, .scene .count, .scene .drop { opacity: 1; translate: 0 0; }
  .scene .grow-x, .scene .grow-y { scale: 1 1; } .scene .draw { stroke-dashoffset: 0; }
  .scene .shift { translate: var(--dx, 18px) 0; } .scene .fill-on { fill: var(--to); }
  .scene.play .pulse, .scene.play .loop-pop, .scene.play .blink { animation: none; }
}