:root{
  --wa-green: #25D366;
  --wa-size: 56px;
  --wa-gap: 18px;
  --wa-shadow: 0 10px 25px rgba(0,0,0,.22);
}

.whatsapp-float{
  position: fixed;
  right: var(--wa-gap);
  bottom: var(--wa-gap);
  width: var(--wa-size);
  height: var(--wa-size);
  border-radius: 50%;
  background: var(--wa-green);
  box-shadow: var(--wa-shadow);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;

  opacity: 0;
  visibility: hidden;
  transform: translateY(15px) scale(.95);
  pointer-events: none;
  transition: .3s ease;
  text-decoration: none;
}

.whatsapp-float.is-visible{
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

.whatsapp-icon{
  width: 60%;
  height: 60%;
  z-index: 2;
}

.whatsapp-pulse{
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  animation: pulse 2.5s infinite;
}

@keyframes pulse{
  0%{
    box-shadow: 0 0 0 0 rgba(37,211,102,.6);
  }
  70%{
    box-shadow: 0 0 0 20px rgba(37,211,102,0);
  }
  100%{
    box-shadow: 0 0 0 0 rgba(37,211,102,0);
  }
}

/* Mobile */
@media (max-width: 480px){
  :root{
    --wa-size: 52px;
    --wa-gap: 14px;
  }
}