/* ---------- Botón flotante de WhatsApp ---------- */
.wa-float {
    position: fixed; right: 20px; bottom: calc(20px + env(safe-area-inset-bottom, 0px)); z-index: 80; display: flex; align-items: center; gap: 10px;
    height: 58px; min-width: 58px; padding: 0 17px; border-radius: 999px; background: #25d366; color: #fff; text-decoration: none;
    box-shadow: 0 14px 30px -10px rgba(37, 211, 102, .65), 0 4px 10px rgba(0, 0, 0, .18); transition: transform .3s cubic-bezier(.22, .8, .3, 1), box-shadow .3s;
    animation: waIn .6s cubic-bezier(.22, .8, .3, 1) 1.2s both;
}
.wa-float svg { width: 26px; height: 26px; flex: 0 0 auto; }
.wa-float::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: 0 0 0 0 rgba(37, 211, 102, .55); animation: waPulse 2.6s ease-out 2.4s infinite; pointer-events: none; }
.wa-float-tip { max-width: 0; overflow: hidden; white-space: nowrap; font-size: 14px; font-weight: 700; transition: max-width .35s cubic-bezier(.22, .8, .3, 1); }
.wa-float:hover { transform: translateY(-3px); } .wa-float:hover .wa-float-tip, .wa-float:focus-visible .wa-float-tip { max-width: 220px; }
.wa-float:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@keyframes waIn { from { opacity: 0; transform: translateY(20px) scale(.8); } to { opacity: 1; transform: none; } }
@keyframes waPulse { to { box-shadow: 0 0 0 18px rgba(37, 211, 102, 0); } }
@media (max-width: 480px) { .wa-float { right: 14px; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); height: 54px; min-width: 54px; } }
@media (prefers-reduced-motion: reduce) { .wa-float, .wa-float::after { animation: none; } }