
.floating-buttons {
  position: fixed;
  left: 20px;
  bottom: 100px;
  display: flex;
  flex-direction: column;
  gap: 15px;
  z-index: 999999;
}

.float-btn {
  width: 62px;
  height: 62px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  transition: transform 0.3s ease;
}

.float-btn.call {
  background: #000;
}

.float-btn.whatsapp {
  background: #25D366;
}

.float-btn:hover {
  transform: scale(1.15) rotate(5deg);
}

/* Icons */
.icon {
  width: 28px;
  height: 28px;
  display: block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.icon.phone {
  background-image: url("data:image/svg+xml,%3Csvg fill='white' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.62 10.79a15.05 15.05 0 006.59 6.59l2.2-2.2a1 1 0 011.01-.24c1.12.37 2.33.57 3.58.57a1 1 0 011 1v3.5a1 1 0 01-1 1C10.3 22 2 13.7 2 3.5a1 1 0 011-1H6.5a1 1 0 011 1c0 1.25.2 2.46.57 3.58a1 1 0 01-.25 1.01l-2.2 2.2z'/%3E%3C/svg%3E");
}

.icon.whatsapp {
  background-image: url("data:image/svg+xml,%3Csvg fill='white' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M19.11 17.21c-.27-.14-1.58-.78-1.83-.87-.25-.09-.43-.14-.61.14-.18.27-.7.87-.86 1.05-.16.18-.32.2-.59.07-.27-.14-1.15-.42-2.19-1.35-.81-.72-1.36-1.6-1.52-1.87-.16-.27-.02-.42.12-.56.12-.12.27-.32.41-.48.14-.16.18-.27.27-.45.09-.18.05-.34-.02-.48-.07-.14-.61-1.48-.84-2.02-.22-.54-.45-.47-.61-.48h-.52c-.18 0-.48.07-.73.34-.25.27-.96.94-.96 2.3 0 1.36.98 2.67 1.12 2.85.14.18 1.93 2.95 4.68 4.13.65.28 1.15.45 1.55.58.65.21 1.25.18 1.72.11.52-.08 1.58-.65 1.8-1.28.22-.63.22-1.17.16-1.28-.06-.11-.25-.18-.52-.32zM16.02 3C9.38 3 4 8.38 4 15.02c0 2.64.87 5.08 2.34 7.04L4 29l7.13-2.27a11.96 11.96 0 004.89 1.02c6.64 0 12.02-5.38 12.02-12.02C28.04 8.38 22.66 3 16.02 3z'/%3E%3C/svg%3E");
}

/* Stars */
.float-btn::before {
  content: "✦ ✧ ✦ ✧";
  position: absolute;
  inset: -15px;
  border-radius: 50%;
  color: #fff;
  font-size: 12px;
  opacity: 0;
  animation: stars 1.2s linear infinite;
  display: flex;
  align-items: center;
  justify-content: center;
}

.float-btn:hover::before {
  opacity: 1;
}

@keyframes stars {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
