/* =========================================================
   Floating WhatsApp contact button
   ========================================================= */
.wa-fab{
  position:fixed;
  right:clamp(1rem, 3vw, 1.75rem);
  bottom:clamp(1rem, 3vw, 1.75rem);
  z-index:190; /* below the promo bar (200) so it never covers an ad */
  display:flex;
  align-items:center;
  gap:.65em;
  padding:.85em 1.25em;
  border-radius:999px;
  background:#25d366; /* WhatsApp brand green — intentionally not themed */
  color:#0b2e17;
  font-family:var(--f-mono, monospace);
  font-size:.85rem;
  font-weight:500;
  text-decoration:none;
  box-shadow:0 10px 30px -8px rgba(37,211,102,0.5);
  transition:transform .18s ease, box-shadow .18s ease;
}
.wa-fab:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 38px -8px rgba(37,211,102,0.65);
}
.wa-fab svg{ width:22px; height:22px; flex:none; }

/* When a promo bar is on screen, lift the button above it so the two
   never sit on top of each other. */
body.has-promo-banner .wa-fab{
  bottom:calc(clamp(72px, 12vw, 116px) + .75rem);
}

/* On small screens collapse to a circular icon so it doesn't eat the
   width of the viewport or cover page content. */
@media (max-width:620px){
  .wa-fab{
    width:52px; height:52px; padding:0;
    justify-content:center; gap:0;
  }
  .wa-fab .wa-fab-label{ display:none; }
}

/* Inline WhatsApp buttons (used in CTA rows alongside email/phone) */
.btn-whatsapp{
  background:#25d366;
  color:#0b2e17;
  border-color:transparent;
}
.btn-whatsapp:hover{
  background:#1fbe5a;
  border-color:transparent;
  transform:translateY(-2px);
}
.btn-whatsapp svg{ width:16px; height:16px; }