/* ---------- Botão flutuante do WhatsApp (verde e logo oficiais) ---------- */
.wa-flutuante {
  position: fixed; right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 9999;
  width: 60px; height: 60px; border-radius: 50%;
  display: grid; place-items: center;
  background: #25D366;
  box-shadow: 0 6px 18px rgba(0,0,0,.28);
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease;
  -webkit-tap-highlight-color: transparent;
}
.wa-flutuante svg { width: 34px; height: 34px; position: relative; z-index: 1; }
.wa-flutuante::before {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  background: #25D366; z-index: 0;
  animation: wa-pulso 2.6s ease-out infinite;
}
.wa-flutuante:hover { transform: scale(1.08); box-shadow: 0 10px 26px rgba(0,0,0,.32); }
.wa-flutuante:focus-visible { outline: 3px solid #128C7E; outline-offset: 4px; }
.wa-flutuante__balao {
  position: absolute; right: calc(100% + 12px); top: 50%;
  transform: translate(8px, -50%); opacity: 0;
  background: #fff; color: #111B21;
  font: 600 14px/1 "Archivo", system-ui, sans-serif;
  padding: 10px 14px; border-radius: 10px; white-space: nowrap;
  box-shadow: 0 4px 16px rgba(0,0,0,.18);
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
}
.wa-flutuante__balao::after {
  content: ""; position: absolute; left: 100%; top: 50%; transform: translateY(-50%);
  border: 6px solid transparent; border-left-color: #fff;
}
.wa-flutuante:hover .wa-flutuante__balao,
.wa-flutuante:focus-visible .wa-flutuante__balao,
.wa-flutuante.is-convite .wa-flutuante__balao { opacity: 1; transform: translate(0, -50%); }
@keyframes wa-pulso {
  0% { transform: scale(1); opacity: .55; }
  70%, 100% { transform: scale(1.55); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) { .wa-flutuante::before { animation: none; opacity: 0; } }
