/* Explicit homepage motion requested for Synny: transform-only, continuous and visible. */
body.synny-hero-motion-force .landing-synny-welcome {
  transform-origin: 50% 62%;
  will-change: transform;
  animation: synny-hero-alive-float 3.8s cubic-bezier(.42, 0, .34, 1) infinite !important;
}

body.synny-hero-motion-force .landing-synny-welcome .landing-synny-image {
  transform-origin: 50% 62%;
  will-change: transform, filter;
  animation: synny-hero-alive-breathe 2.35s ease-in-out infinite !important;
}

body.synny-hero-motion-force .landing-synny-welcome::before {
  content: "";
  position: absolute;
  z-index: 4;
  top: 52%;
  left: 50%;
  width: 38px;
  height: 38px;
  border: 3px solid rgba(53, 232, 202, .88);
  border-radius: 50%;
  box-shadow: 0 0 19px rgba(90, 244, 218, .62);
  pointer-events: none;
  will-change: transform, opacity;
  animation: synny-hero-alive-heart 2.3s ease-out .35s infinite !important;
}

body.synny-hero-motion-force .landing-synny-welcome::after {
  animation: synny-hero-alive-shadow 3.8s ease-in-out infinite !important;
  will-change: transform, opacity;
}

@keyframes synny-hero-alive-float {
  0%, 100% { transform: translate3d(0, 2px, 0) rotate(-1.3deg); }
  25% { transform: translate3d(6px, -8px, 0) rotate(.5deg); }
  52% { transform: translate3d(0, -22px, 0) rotate(1.8deg); }
  76% { transform: translate3d(-6px, -9px, 0) rotate(-.35deg); }
}

@keyframes synny-hero-alive-breathe {
  0%, 100% { transform: scale(1); filter: drop-shadow(0 15px 22px rgba(74, 61, 171, .14)); }
  50% { transform: scale(1.045); filter: drop-shadow(0 26px 34px rgba(74, 61, 171, .25)); }
}

@keyframes synny-hero-alive-heart {
  0%, 32% { opacity: 0; transform: translate(-50%, -50%) scale(.42); }
  46% { opacity: .96; transform: translate(-50%, -50%) scale(.76); }
  86%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(2.25); }
}

@keyframes synny-hero-alive-shadow {
  0%, 100% { opacity: .76; transform: scaleX(1); }
  52% { opacity: .28; transform: scaleX(.68); }
}

@media (max-width: 640px) {
  body.synny-hero-motion-force .landing-synny-welcome::before { width: 28px; height: 28px; }
}
