.whatsapp-float {
    position: fixed;
    bottom: 20px;
    right: 20px; 
    width: 55px;
    height: 55px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    filter: drop-shadow(0 6px 15px rgba(37,211,102,0.4));
    z-index: 9999;
}

.whatsapp-icon {
    width: 100%;
    height: 100%;
    animation: float 3s ease-in-out infinite;
    z-index: 2;
}

.whatsapp-icon svg {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.ripple, .ripple-delay {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: rgba(37,211,102,0.25);
    animation: ripple 2.5s ease-out infinite;
    z-index: 1;
}

.ripple-delay {
    animation-delay: 1.25s;
}

.whatsapp-float:hover {
    transform: scale(1.2) rotate(5deg);
    filter: drop-shadow(0 10px 25px rgba(37,211,102,0.6));
}

.whatsapp-float:hover .whatsapp-icon {
    animation: shake 0.6s ease-in-out;
}

@keyframes float {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50% { transform: translateY(-6px) rotate(2deg); }
}

@keyframes ripple {
    0% { transform: scale(1); opacity: 0.8; }
    100% { transform: scale(2.2); opacity: 0; }
}

@keyframes shake {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(-10deg); }
    75% { transform: rotate(10deg); }
}

@media (max-width: 768px) {
    .whatsapp-float { width: 50px; height: 50px; bottom: 15px; right: 15px; }
}