 /* WhatsApp floating button */
  .whatsapp-btn {
    position: fixed;              /* stick to viewport */
    right: 20px;                  /* distance from right edge */
    bottom: 20px;                 /* distance from bottom edge */
    z-index: 9999;                /* sit on top */
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: linear-gradient(180deg, #25D366, #1DA851);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 20px rgba(37, 211, 102, 0.25);
    text-decoration: none;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
    -webkit-tap-highlight-color: transparent;
  }

  .whatsapp-btn i {
    color: #fff;
    font-size: 28px;
    line-height: 1;
    pointer-events: none; /* icon itself not clickable separately */
  }

  /* Hover + focus effects */
  .whatsapp-btn:hover,
  .whatsapp-btn:focus {
    transform: translateY(-6px) scale(1.02);
    box-shadow: 0 14px 30px rgba(37, 211, 102, 0.32);
    outline: none;
  }

  .whatsapp-btn:active {
    transform: translateY(-2px) scale(0.99);
  }

  /* Small pulsing accent (subtle) */
  .whatsapp-btn::after{
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    box-shadow: 0 0 0 rgba(37,211,102,0.0);
    animation: pulse 2.6s infinite;
    pointer-events: none;
  }

  @keyframes pulse {
    0% {
      box-shadow: 0 0 0 0 rgba(37,211,102,0.18);
    }
    70% {
      box-shadow: 0 0 0 12px rgba(37,211,102,0.02);
    }
    100% {
      box-shadow: 0 0 0 12px rgba(37,211,102,0);
    }
  }

  /* Accessibility focus-visible */
  .whatsapp-btn:focus-visible {
    box-shadow: 0 0 0 4px rgba(37,211,102,0.18), 0 14px 30px rgba(37,211,102,0.32);
  }

  /* Responsive sizing for small screens */
  @media (max-width: 480px) {
    .whatsapp-btn {
      width: 56px;
      height: 56px;
      right: 16px;
      bottom: 16px;
    }
    .whatsapp-btn i { font-size: 24px; }
  }

  /* Optional: avoid overlapping with site UI (e.g., cookie bar) */
  @media (max-height: 420px) {
    .whatsapp-btn { bottom: 10px; }
  }