/* Homepage-only decorative motion. The original illustration assets remain
   intact; animation never changes layout, hit areas, or the engine's labels.
   Tempo (2026-10-12) follows pluto.security (6s floating loops, 2.5-3s small
   elements) and the MCP Inspector (1-1.2s decor drift): planets loop in ~6-7s,
   cursors in ~3-3.6s. The three-moves rocket and the risk engine are below. */
.home-motion-ready .home-planet-left {
  animation: home-planet-left 3s ease-in-out infinite alternate;
  animation-play-state: var(--home-hero-play-state, paused);
}
.home-motion-ready .home-planet-right {
  animation: home-planet-right 3.4s ease-in-out infinite alternate;
  animation-play-state: var(--home-hero-play-state, paused);
}
.home-motion-ready .hero-cursor-pink {
  animation: home-cursor-pink 1.5s ease-in-out infinite alternate;
  animation-play-state: var(--home-hero-play-state, paused);
}
.home-motion-ready .hero-cursor-green {
  animation: home-cursor-green 1.8s ease-in-out infinite alternate;
  animation-play-state: var(--home-hero-play-state, paused);
}
@keyframes home-planet-left {
  from { transform: translate(0, .15rem) rotate(-1.5deg); }
  to { transform: translate(.2rem, -.65rem) rotate(1.5deg); }
}
@keyframes home-planet-right {
  from { transform: translate(0, -.35rem) rotate(1deg); }
  to { transform: translate(-.25rem, .45rem) rotate(-1.5deg); }
}
@keyframes home-cursor-pink {
  from { transform: translate(-.1rem, .1rem); }
  to { transform: translate(.2rem, -.35rem); }
}
@keyframes home-cursor-green {
  from { transform: translate(.1rem, -.15rem); }
  to { transform: translate(-.2rem, .3rem); }
}

/* ---- Three moves: flowing wave and rocket landings (home-motion.js) --------
   The wave's dashes flow left to right, one 28px dash+gap per second: a calm
   drift well under the rocket's 230px/s cruise. The Figma rocket (same artwork
   as the Hardening progress rocket) hops off the wave at each planet, lands
   nose-up on top, wiggles, and lifts off; the planet squishes under it while
   two dust puffs and three sparkles in the planet's colour pop out. */
.moves-wave path {
  animation: moves-wave-flow 1s linear infinite;
  animation-play-state: var(--home-moves-play-state, paused);
}
@keyframes moves-wave-flow { to { stroke-dashoffset: -28; } }
.moves-rocket {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  width: clamp(2.75rem, 5.6vw, 4.4375rem);
  height: auto;
  aspect-ratio: 71.0148 / 46.003;
  max-width: none;
  pointer-events: none;
  visibility: hidden;
  transform-origin: center;
  will-change: transform;
}
.moves-rocket.is-ready { visibility: visible; }
.moves-art-inspect { --dock-x: 43%; --dock-y: 40%; }
.moves-art-adopt { --dock-x: 46%; --dock-y: 61%; }
.moves-art-harden { --dock-x: 50%; --dock-y: 40%; }
.moves-art img { transform-origin: var(--dock-x) 100%; }
.moves-art.is-docked img { animation: moves-dock .7s cubic-bezier(.34, 1.56, .64, 1); }
@keyframes moves-dock {
  0% { transform: none; }
  30% { transform: scale(1.03, .96); }
  60% { transform: scale(.99, 1.02); }
  100% { transform: none; }
}
.moves-landing {
  --land-color: #fa673a;
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  pointer-events: none;
  transform: translate(var(--land-x, 0), var(--land-y, 0));
}
.moves-landing[data-planet="adopt"] { --land-color: #39bf97; }
.moves-landing[data-planet="harden"] { --land-color: #2f80ed; }
.moves-puff, .moves-spark { position: absolute; left: 0; top: 0; opacity: 0; }
.moves-puff {
  width: 1.125rem;
  height: 1.125rem;
  margin: -.75rem 0 0 -.5625rem;
  border: .0625rem solid #000;
  border-radius: 50%;
  background: #fdf2d4;
}
.moves-landing.is-landing .moves-puff-l { animation: moves-puff-l .8s ease-out; }
.moves-landing.is-landing .moves-puff-r { animation: moves-puff-r .8s ease-out .05s; }
@keyframes moves-puff-l {
  0% { opacity: 1; transform: translate(0, 0) scale(.3); }
  35% { opacity: 1; }
  100% { opacity: 0; transform: translate(-2.25rem, -.625rem) scale(1.2); }
}
@keyframes moves-puff-r {
  0% { opacity: 1; transform: translate(0, 0) scale(.3); }
  35% { opacity: 1; }
  100% { opacity: 0; transform: translate(2.25rem, -.625rem) scale(1); }
}
/* Sparkles: little plus signs, like the page's plus field, around the nose. */
.moves-spark {
  width: .75rem;
  height: .75rem;
  margin: -.375rem 0 0 -.375rem;
  top: calc(var(--land-h, 4rem) * -1);
  background:
    linear-gradient(var(--land-color), var(--land-color)) center / 100% .1875rem no-repeat,
    linear-gradient(var(--land-color), var(--land-color)) center / .1875rem 100% no-repeat;
}
.moves-landing.is-landing .moves-spark-a { animation: moves-spark-a .9s ease-out .12s; }
.moves-landing.is-landing .moves-spark-b { animation: moves-spark-b .9s ease-out .2s; }
.moves-landing.is-landing .moves-spark-c { animation: moves-spark-c .9s ease-out .28s; }
@keyframes moves-spark-a {
  0% { opacity: 1; transform: translate(0, 1rem) scale(0) rotate(0); }
  45% { opacity: 1; transform: translate(-1.6rem, -.4rem) scale(1) rotate(45deg); }
  100% { opacity: 0; transform: translate(-2rem, -.7rem) scale(.4) rotate(90deg); }
}
@keyframes moves-spark-b {
  0% { opacity: 1; transform: translate(0, 1rem) scale(0) rotate(0); }
  45% { opacity: 1; transform: translate(.15rem, -1.3rem) scale(.8) rotate(-45deg); }
  100% { opacity: 0; transform: translate(.15rem, -1.7rem) scale(.3) rotate(-90deg); }
}
@keyframes moves-spark-c {
  0% { opacity: 1; transform: translate(0, 1rem) scale(0) rotate(0); }
  45% { opacity: 1; transform: translate(1.6rem, -.2rem) scale(.9) rotate(45deg); }
  100% { opacity: 0; transform: translate(2rem, -.5rem) scale(.35) rotate(90deg); }
}
@media (max-width: 1023px) {
  /* The stacked layout bends the wave behind single planets; no flight there. */
  .moves-rocket, .moves-landing { display: none; }
}

/* ---- Agentic risk engine (index.html inline SVG layers + home-motion.js) -----
   One 6s loop shared with the SMIL pulses in .engine-flow: add-ons flow in
   (0-31%), the four checks light up clockwise (31-71%), the badge pulses
   (72-78%) and findings flow out to the risk cards (74-100%). Around it the
   dashed ring turns, red signals travel the orbits and the sparkles twinkle. */
.engine-ring-spin {
  animation: engine-ring-spin 40s linear infinite;
  animation-play-state: var(--home-engine-play-state, paused);
}
@keyframes engine-ring-spin { to { transform: rotate(360deg); } }
.engine-star {
  transform-box: fill-box;
  transform-origin: center;
  animation: engine-twinkle 2.6s ease-in-out infinite;
  animation-play-state: var(--home-engine-play-state, paused);
}
.engine-star-b { animation-delay: -1.3s; }
@keyframes engine-twinkle {
  0%, 100% { transform: scale(1) rotate(0deg); opacity: 1; }
  50% { transform: scale(.55) rotate(45deg); opacity: .65; }
}
.home-motion-ready .engine-quad {
  animation: engine-quad-scan 6s ease-in-out infinite;
  animation-play-state: var(--home-engine-play-state, paused);
}
.home-motion-ready .engine-quad-tl { animation-delay: 1.86s; }
.home-motion-ready .engine-quad-tr { animation-delay: 2.46s; }
.home-motion-ready .engine-quad-br { animation-delay: 3.06s; }
.home-motion-ready .engine-quad-bl { animation-delay: 3.66s; }
@keyframes engine-quad-scan {
  0%, 16%, 100% { background-color: #fdf2d4; }
  4%, 10% { background-color: #ffff78; }
}
.home-motion-ready .engine-badge {
  animation: engine-badge-pulse 6s ease-in-out infinite;
  animation-play-state: var(--home-engine-play-state, paused);
}
@keyframes engine-badge-pulse {
  0%, 71%, 80%, 100% { transform: none; }
  75% { transform: scale(1.14); }
}
.home-motion-ready .engine-tile-risk {
  animation: engine-risk-hit 6s ease-out infinite;
  animation-play-state: var(--home-engine-play-state, paused);
}
.home-motion-ready .engine-risk:nth-child(2) .engine-tile-risk { animation-delay: .09s; }
.home-motion-ready .engine-risk:nth-child(3) .engine-tile-risk { animation-delay: .18s; }
.home-motion-ready .engine-risk:nth-child(4) .engine-tile-risk { animation-delay: .27s; }
.home-motion-ready .engine-risk:nth-child(5) .engine-tile-risk { animation-delay: .36s; }
@keyframes engine-risk-hit {
  0%, 91%, 100% { transform: none; background-color: #ffe5e5; }
  95% { transform: scale(1.18); background-color: #ffc9c9; }
}

@media (prefers-reduced-motion: reduce) {
  .home-motion-ready .home-planet,
  .home-motion-ready .hero-cursor,
  .engine-ring-spin, .engine-star,
  .home-motion-ready .engine-quad, .home-motion-ready .engine-badge, .home-motion-ready .engine-tile-risk,
  .moves-wave path, .moves-art.is-docked img, .moves-landing .moves-puff, .moves-landing .moves-spark { animation: none; }
  .engine-flow { display: none; }
}