/* Botões flutuantes (portal e landings): WhatsApp à direita, voltar ao topo à esquerda */

.wa-fab{position:fixed;right:18px;bottom:18px;z-index:70;display:flex;align-items:flex-end;gap:10px}
.wa-btn{position:relative;width:62px;height:62px;border-radius:50%;flex:none;display:grid;place-items:center;color:#fff;
  background:linear-gradient(150deg,#3be27a,#1fb954);box-shadow:0 18px 36px -12px rgba(31,185,84,.75),inset 0 -3px 0 rgba(0,0,0,.08);
  animation:waIn .7s cubic-bezier(.3,1.6,.5,1) .6s both, waBalanca 9s ease-in-out 4s infinite}
.wa-btn:hover{animation-play-state:paused;transform:scale(1.06)}
.wa-btn svg{position:relative;z-index:2;width:31px;height:31px}
.wa-btn .pulse{position:absolute;inset:0;border-radius:50%;background:#25d366;z-index:0;animation:waPulso 2.4s ease-out 1.4s infinite}
.wa-btn .pulse.p2{animation-delay:2.6s}
.wa-btn .badge{position:absolute;top:-5px;right:-5px;z-index:3;min-width:24px;height:24px;padding:0 6px;border-radius:12px;background:#ff3b30;color:#fff;
  font-size:12.5px;font-weight:800;display:grid;place-items:center;border:2.5px solid #fff;box-shadow:0 6px 12px -4px rgba(255,59,48,.7);
  animation:waBadge .6s cubic-bezier(.3,1.8,.5,1) 2.2s both, waBadgeBate 6s ease-in-out 5s infinite}
.wa-balao{position:relative;max-width:240px;background:#fff;color:#16221a;border-radius:16px 16px 4px 16px;padding:12px 30px 12px 14px;
  font-size:13.5px;line-height:1.4;box-shadow:0 18px 40px -16px rgba(0,0,0,.35),0 0 0 1px rgba(0,0,0,.05);margin-bottom:8px;
  opacity:0;transform:translateY(10px) scale(.92);transform-origin:100% 100%;pointer-events:none;transition:opacity .35s,transform .45s cubic-bezier(.3,1.5,.5,1)}
.wa-balao.on{opacity:1;transform:none;pointer-events:auto}
.wa-balao b{display:block;font-size:14px;margin-bottom:2px}
.wa-balao a{color:inherit;text-decoration:none}
.wa-balao .x{position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:50%;border:none;background:#f1f3f2;color:#6d7f74;font-size:14px;line-height:1;cursor:pointer}
@media(max-width:480px){.wa-fab{right:14px;bottom:14px}.wa-btn{width:58px;height:58px}.wa-btn svg{width:28px;height:28px}.wa-balao{max-width:200px;font-size:13px}}

@keyframes waIn{0%{opacity:0;transform:scale(0) rotate(-45deg)}100%{opacity:1;transform:none}}
@keyframes waPulso{0%{transform:scale(1);opacity:.5}100%{transform:scale(1.85);opacity:0}}
@keyframes waBadge{0%{opacity:0;transform:scale(0)}100%{opacity:1;transform:none}}
@keyframes waBadgeBate{0%,88%,100%{transform:none}92%{transform:scale(1.3)}96%{transform:scale(.92)}}
@keyframes waBalanca{0%,90%,100%{transform:none}92%{transform:rotate(-12deg)}94%{transform:rotate(10deg)}96%{transform:rotate(-6deg)}98%{transform:rotate(3deg)}}

.topo-btn{position:fixed;left:18px;bottom:18px;z-index:69;width:48px;height:48px;border-radius:50%;border:1px solid rgba(0,0,0,.08);
  background:rgba(255,255,255,.94);color:#16221a;display:grid;place-items:center;cursor:pointer;
  box-shadow:0 14px 30px -14px rgba(10,40,25,.5);
  opacity:0;transform:translateY(16px) scale(.9);pointer-events:none;transition:opacity .3s,transform .35s cubic-bezier(.3,1.5,.5,1)}
.topo-btn.on{opacity:1;transform:none;pointer-events:auto}
.topo-btn:hover{transform:translateY(-2px)}
.topo-btn svg{width:20px;height:20px}
@media(max-width:480px){.topo-btn{left:14px;bottom:18px;width:44px;height:44px}}

@media (prefers-reduced-motion:reduce){.wa-btn,.wa-btn .pulse,.wa-btn .badge{animation:none!important}.wa-btn .pulse{display:none}}