/**
 * Floating WhatsApp control.
 * Kept separate so the original presentation stylesheet remains unchanged.
 */
.whatsapp:focus-visible {
  outline: 3px solid var(--gold-dark);
  outline-offset: 3px;
}

.whatsapp {
  background: var(--vd-whatsapp, #25d366);
  color: #10241a;
  box-shadow: 0 12px 30px rgba(37, 211, 102, .28);
}

.whatsapp:hover {
  background: color-mix(in srgb, var(--vd-whatsapp, #25d366) 88%, #000);
  box-shadow: 0 15px 34px rgba(37, 211, 102, .34);
  transform: translateY(-2px);
}

@media (max-width: 650px) {
  .whatsapp {
    right: 18px;
    bottom: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .whatsapp {
    transition: none;
  }

  .whatsapp:hover {
    transform: none;
  }
}