/* Four held drawings, like a cutout walk shot on twos. The SVG root is
   reserved for page travel; joints move together without tweened wobble. */
.walker {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
  fill: currentColor;
}
.walker__pose,
.walker__rear-leg,
.walker__front-leg,
.walker__arm {
  transform-box: view-box;
}
/* Static SVG translations put each limb joint at its own local zero.
   This avoids percentage-origin ambiguity with the source viewBox offset. */
.walker__rear-leg,
.walker__front-leg,
.walker__arm { transform-origin: 0 0; }

.walker.is-walking .walker__pose {
  animation: walker-footfall var(--walker-stride, .36s) steps(1, end) infinite;
}
.walker.is-walking .walker__rear-leg {
  animation: walker-rear-stride var(--walker-stride, .36s) steps(1, end) infinite;
}
.walker.is-walking .walker__front-leg {
  animation: walker-front-stride var(--walker-stride, .36s) steps(1, end) infinite;
}
.walker.is-walking .walker__arm {
  animation: walker-arm-stride var(--walker-stride, .36s) steps(1, end) infinite;
}
/* Contact / passing / opposite contact / passing. The overlapping hip pieces
   remain connected in every drawing. One complete stride lasts 360 ms. */
@keyframes walker-rear-stride {
  0% { transform: rotate(12deg); }
  25% { transform: rotate(1deg); }
  50% { transform: rotate(-12deg); }
  75% { transform: rotate(-1deg); }
  100% { transform: rotate(12deg); }
}
@keyframes walker-front-stride {
  0% { transform: rotate(-12deg); }
  25% { transform: rotate(-2deg); }
  50% { transform: rotate(12deg); }
  75% { transform: rotate(2deg); }
  100% { transform: rotate(-12deg); }
}
@keyframes walker-arm-stride {
  0% { transform: rotate(8deg); }
  25% { transform: rotate(2deg); }
  50% { transform: rotate(-8deg); }
  75% { transform: rotate(-2deg); }
  100% { transform: rotate(8deg); }
}
@keyframes walker-footfall {
  0% { transform: translate(0, 6px); }
  25% { transform: translate(-1px, -2px); }
  50% { transform: translate(1px, -7px); }
  75% { transform: translate(0, -2px); }
  100% { transform: translate(0, 6px); }
}
@media (prefers-reduced-motion: reduce) {
  .walker.is-walking .walker__pose,
  .walker.is-walking .walker__rear-leg,
  .walker.is-walking .walker__front-leg,
  .walker.is-walking .walker__arm { animation: none; }
}