/* Balão de WhatsApp: fala direto com o Henrique. Adicionado a pedido, fora do protótipo. */
.zap{
  --zap-cor:#25D366;          /* trocar para var(--ink) se preferir na cor da marca */
  --zap-tamanho:60px;
  position:fixed;
  right:max(20px, env(safe-area-inset-right));
  bottom:max(20px, env(safe-area-inset-bottom));
  z-index:40;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:var(--zap-tamanho);
  height:var(--zap-tamanho);
  border-radius:50%;
  background:var(--zap-cor);
  color:#fff;
  text-decoration:none;
  box-shadow:0 6px 20px rgba(21,25,27,.24), 0 2px 6px rgba(21,25,27,.16);
  transition:transform .18s ease, box-shadow .18s ease;
}
.zap svg{width:calc(var(--zap-tamanho) * .56);height:auto;display:block;fill:currentColor}
.zap:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 10px 26px rgba(21,25,27,.28), 0 3px 8px rgba(21,25,27,.18)}
.zap:active{transform:translateY(0) scale(.98)}
.zap:focus-visible{outline:3px solid var(--accent,#F16532);outline-offset:4px}

/* rótulo que aparece no ponteiro fino, escondido no toque para não ocupar tela */
.zap__texto{
  position:absolute;right:calc(100% + 12px);
  white-space:nowrap;
  background:var(--ink,#15191B);color:var(--paper,#E8E6DF);
  font:600 13px/1 var(--body, 'Manrope', Arial, sans-serif);
  letter-spacing:.01em;
  padding:10px 14px;border-radius:50px;
  opacity:0;transform:translateX(6px);pointer-events:none;
  transition:opacity .18s ease, transform .18s ease;
}
.zap:hover .zap__texto,.zap:focus-visible .zap__texto{opacity:1;transform:translateX(0)}
@media (hover:none),(pointer:coarse){.zap__texto{display:none}}

@media (max-width:820px){.zap{--zap-tamanho:54px;right:max(16px, env(safe-area-inset-right));bottom:max(16px, env(safe-area-inset-bottom))}}
@media (prefers-reduced-motion:reduce){.zap,.zap__texto{transition:none}.zap:hover{transform:none}}
@media print{.zap{display:none}}