.elementor-871 .elementor-element.elementor-element-59673c3{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for html, class: .elementor-element-2571d7e *//* ==========================================================
   REALISTIC RUNNING & BOUNCING DOG ANIMATION
   ========================================================== */

.apex-running-dog {
  position: absolute;
  top: 380px;
  width: 100px;
  z-index: 100; /* Keeps the dog running over the gallery grid */
  pointer-events: none;
  /* Combines moving across the screen, galloping up/down, and tilting */
  animation: runAcross 20s linear infinite, gallopBounce 0.3s ease-in-out infinite alternate;
}

.apex-running-dog img {
  width: 100%;
  height: auto;
  display: block;
  user-select: none;
}

/* 1. Horizontal movement and direction flipping */
@keyframes runAcross {
  0% { 
    left: -120px; 
    transform: scaleX(1); 
  }
  48% { 
    left: calc(100vw + 50px); 
    transform: scaleX(1); 
  }
  50% { 
    left: calc(100vw + 50px); 
    transform: scaleX(-1); /* Flips facing direction when turning back */
  }
  98% { 
    left: -120px; 
    transform: scaleX(-1); 
  }
  100% { 
    left: -120px; 
    transform: scaleX(1); 
  }
}

/* 2. Galloping bounce with body stretch & squash */
@keyframes gallopBounce {
  0% { 
    transform: translateY(0) scaleY(1) scaleX(1) rotate(-3deg); 
  }
  50% {
    transform: translateY(-16px) scaleY(1.08) scaleX(0.95) rotate(2deg); /* Stretches up at peak */
  }
  100% { 
    transform: translateY(2px) scaleY(0.92) scaleX(1.05) rotate(5deg); /* Squashes down as it pushes off */
  }
}/* End custom CSS */