/*--------------------------------------------------------------
# Sticky Social Icons
--------------------------------------------------------------*/
.sticky-social-icons {
  position: fixed;
  right: 8px; /* Slight gap from edge to show full circle */
  bottom: 10vh; /* Positioned little above */
  display: flex;
  flex-direction: column;
  gap: 12px;
  z-index: 99998;
}

.sticky-social-icons .social-icon {
  width: 45px;
  height: 45px;
background: linear-gradient(135deg, #2AF598 0%, #009E6C 100%);
  color: white;
  border-radius: 50%; /* Full Circle */
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  box-shadow: 0 4px 10px rgba(0,0,0,0.2);
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  font-size: 1.6rem;
  margin-bottom: 0;
    animation: glowPulse 1.5s infinite alternate;

}

.sticky-social-icons .social-icon[href*="whatsapp"],
.sticky-social-icons .social-icon[href*="tel"] {
background: linear-gradient(135deg, #2AF598 0%, #009E6C 100%);
    color: #fff;
    box-shadow: 0 0 10px rgba(37, 211, 102, 0.2),
                0 0 20px rgba(37, 211, 102, 0.2),
                0 0 30px rgba(37, 211, 102, 0.3);
    animation: glowPulse 1.5s infinite alternate;
}

/* Glow animation */
@keyframes glowPulse {
    from {
        box-shadow: 0 0 8px rgba(37, 211, 102, 0.2),
                    0 0 15px rgba(37, 211, 102, 0.2);
    }
    to {
        box-shadow: 0 0 5px rgba(37, 211, 102, 0.2),
                    0 0 40px rgba(37, 211, 102, 0.2),
                    0 0 25px rgba(37, 211, 102, 0.2);
    }
}


.sticky-social-icons .social-icon[href*="mailto"] {
    background-color: #EA4335;
}

.sticky-social-icons .social-icon[href*="facebook"] {
    background-color: #1877F2;
}

.sticky-social-icons .social-icon[href*="instagram"] {
    background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
}

.sticky-social-icons .social-icon[href*="linkedin"] {
    background-color: #0a7fc2;
}

.sticky-social-icons .social-icon:hover {
  transform: translateX(-5px) scale(1.1);
  box-shadow: 0 8px 15px rgba(0,0,0,0.3);
  color: white;
}