/* Floating WhatsApp button for desktop.
   Kept isolated so the existing website design remains unchanged. */
.fixwob-whatsapp-float {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 9990;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 62px;
  height: 62px;
  border-radius: 50%;
  background: #25d366;
  box-shadow:
    0 10px 24px rgba(0, 0, 0, 0.22),
    0 0 0 0 rgba(37, 211, 102, 0.34);
  text-decoration: none;
  transform-origin: center bottom;
  animation: fixwob-whatsapp-bounce 8s ease-in-out infinite;
  will-change: transform;
}

.fixwob-whatsapp-float svg {
  display: block;
  width: 35px;
  height: 35px;
  fill: #ffffff;
}

.fixwob-whatsapp-float:hover {
  animation-play-state: paused;
  transform: translateY(-4px) scale(1.05);
  box-shadow:
    0 14px 30px rgba(0, 0, 0, 0.27),
    0 0 0 8px rgba(37, 211, 102, 0.14);
}

.fixwob-whatsapp-float:focus-visible {
  outline: 3px solid #ffffff;
  outline-offset: 3px;
  box-shadow:
    0 0 0 6px rgba(37, 211, 102, 0.55),
    0 12px 28px rgba(0, 0, 0, 0.24);
}

/* Two soft bounces, then one short upward hop.
   The remaining time is intentionally calm. */
@keyframes fixwob-whatsapp-bounce {
  0%, 4%, 8%, 12%, 18%, 100% {
    transform: translateY(0) scale(1);
  }
  2% {
    transform: translateY(-10px) scale(1.02, 0.98);
  }
  6% {
    transform: translateY(-6px) scale(1.01, 0.99);
  }
  10% {
    transform: translateY(-17px) scale(1.025, 0.975);
  }
  14% {
    transform: translateY(-3px) scale(1.005, 0.995);
  }
}

/* The site already has a mobile WhatsApp action, so avoid duplication. */
@media (max-width: 780px) {
  .fixwob-whatsapp-float {
    display: none;
  }
}

/* Respect users who prefer reduced motion. */
@media (prefers-reduced-motion: reduce) {
  .fixwob-whatsapp-float {
    animation: none;
  }
}