/* Container */
  .floating-btns {
      position: fixed;
      bottom: 8vh;
      right: 20px;
      display: flex;
      flex-direction: column;
      gap: 12px;
      z-index: 9999;
  }

  /* Buttons */
  .floating-btn {
      width: 50px;
      height: 50px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      color: white;
      font-size: 22px;
      cursor: pointer;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
      position: relative;
      transition: transform 0.3s, box-shadow 0.3s;
      transform: translateX(80px);
      /* start off-screen */
      opacity: 0;
  }

  .floating-btn:hover {
      transform: scale(1.2);
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  }

  /* Button colors */
  .top-btn {
      background-color: #111827;
  }

  .whatsapp-btn {
      background-color: #25D366;
      animation: bounce 2s infinite;
  }

  .call-btn {
      background-color: #4a6bff;
  }

  /* Bounce for WhatsApp */
  @keyframes bounce {

      0%,
      100% {
          transform: translateY(0);
      }

      50% {
          transform: translateY(-6px);
      }
  }

  /* Tooltip */
  .tooltip {
      position: absolute;
      top: -36px;
      right: 50%;
      transform: translateX(50%);
      background-color: #111827;
      color: #fff;
      padding: 6px 10px;
      font-size: 13px;
      border-radius: 6px;
      white-space: nowrap;
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.25s, transform 0.25s;
  }

  .floating-btn:hover .tooltip {
      opacity: 1;
      transform: translateX(50%) translateY(-4px);
  }

  /* Mobile labels (always visible) */
  @media (max-width: 768px) {
      .tooltip {
          opacity: 1 !important;
          transform: translateX(60px) translateY(0);
          font-size: 14px;
          right: auto;
          left: 60px;
          padding: 6px 10px;
          border-radius: 6px;
      }
  }