/* Zap flutuante: tecla de WhatsApp em pixel que abre conversa com o Caio. Marcação: <a class="zap"> antes do </body>. */
/* ---------- zap flutuante (18/09/2026, em todas as páginas): tecla de WhatsApp na grade da cereja, 3 px por pixel ---------- */
.zap{position:fixed;right:16px;bottom:16px;z-index:55;display:flex;align-items:center;gap:10px;text-decoration:none;color:#25d366}
.zap-tecla{display:block;width:48px;height:48px;fill:currentColor;overflow:visible;filter:drop-shadow(0 2px 0 rgba(0,0,0,.6))}
.zap-tecla .px-base{opacity:.42}
.zap:active .px-tampa{transform:translate(0,2px)}
.zap:active .px-base{opacity:0}
@keyframes zap-pula{0%,88%,100%{transform:translate(0,0)}92%{transform:translate(0,-1px)}96%{transform:translate(0,0)}}
.zap .px-glifo{animation:zap-pula 4s steps(1) infinite}
.zap-fala{font-family:var(--casa-pixel);font-size:14px;letter-spacing:.04em;color:#fff;background:#0a0a0a;border:2px solid #25d366;padding:6px 10px 7px;
  opacity:0;transform:translateX(6px);transition:opacity .2s,transform .2s steps(3);white-space:nowrap}
.zap:hover .zap-fala,.zap:focus-visible .zap-fala{opacity:1;transform:translateX(0)}
.zap:focus-visible{outline:2px solid #25d366;outline-offset:6px}
@media(max-width:760px){.zap{right:14px;bottom:14px}.zap-fala{display:none}}
@media(prefers-reduced-motion:reduce){.zap .px-glifo{animation:none}}
/* nos cases a seta pra baixo mora no mesmo canto: enquanto ela está na tela, o zap sobe pra cima dela */
.zap{transition:bottom .35s}
body:has(.px-desce:not(.sumiu)) .zap{bottom:76px}
@media(max-width:760px){body:has(.px-desce:not(.sumiu)) .zap{bottom:72px}}

/* o zap nunca pousa em cima do fim da página: quando o rodapé entra na tela ele sai
   (zap.js põe .no-fim). Antes o body reservava 88px embaixo, e a faixa vazia
   sobrava em toda página e mostrava o vídeo de fundo fixo da Costa Gold e do Leozin */
.zap{transition:bottom .35s,opacity .25s,transform .25s}
.zap.no-fim{opacity:0;pointer-events:none;transform:translateY(12px)}