/* ==================================================================
   COLD2HORSE — botón flotante de WhatsApp

   Cuadrado y a filo, como el resto de botones de la web, con el
   barrido de .btn en hover. El verde es el de la marca WhatsApp: es
   lo que hace que se reconozca de un vistazo, que es justo para lo
   que está.

   Se aparta solo de las barras inferiores —el aviso de cookies y la
   barra de compra de las fichas— mediante --wa-lift, que escribe
   whatsapp.js. Sin JS el botón sigue estando y sigue enlazando; solo
   se queda a su altura de reposo.
   ================================================================== */

.wa {
  --wa-green: #25d366;

  position: fixed;
  right: var(--pad);
  bottom: calc(1.5rem + var(--wa-lift, 0px) + env(safe-area-inset-bottom));
  z-index: 95;

  display: grid;
  place-items: center;
  width: 3.5rem;
  height: 3.5rem;

  background: var(--wa-green);
  color: #fff;
  border: 1px solid var(--wa-green);
  overflow: clip;

  transition: bottom 0.55s var(--ease);
}

/* Mismo barrido que .btn: el relleno sube desde abajo. */
.wa::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--paper);
  transform: translateY(102%);
  transition: transform 0.5s var(--ease);
}

.wa:hover::before,
.wa:focus-visible::before { transform: translateY(0); }
.wa:hover, .wa:focus-visible { color: var(--wa-green); }

.wa:focus-visible { outline: 2px solid var(--paper); outline-offset: 3px; }

.wa svg {
  position: relative;
  width: 1.75rem;
  height: 1.75rem;
  fill: currentColor;
}

@media (prefers-reduced-motion: reduce) {
  .wa, .wa::before { transition: none; }
}

/* En pantallas estrechas el botón se aprieta contra el borde y encoge
   un punto, para no comerse la lectura. */
@media (max-width: 760px) {
  .wa {
    width: 3.1rem;
    height: 3.1rem;
    right: 1rem;
    bottom: calc(1rem + var(--wa-lift, 0px) + env(safe-area-inset-bottom));
  }
  .wa svg { width: 1.55rem; height: 1.55rem; }
}

/* Al imprimir no pinta nada. */
@media print { .wa { display: none; } }
