/* ═══ La perrovaquita — LADRIDO ════════════════════════════════════════════
   Conducta puntual: dos golpes secos de cabeza con la boca abierta, disparada
   por ladrido.js cuando la página notifica algo. Sincronizada con el audio
   (un solo "waf" corto): la animación dura lo que el sonido más su eco visual.

   Archivo propio, como tendrá cada animación nueva: así se cargan solo donde
   hacen falta y ninguna crece hasta volverse inmanejable.

   SE CARGA DESPUÉS de mascota.css y de mascota-poses.css: sobreescribe la
   animation de la cabeza declarada allí, y con la misma especificidad gana la
   hoja que llega última. Sobre la vista de FRENTE, igual que el resto de
   conductas salvo caminar. ═══════════════════════════════════════════════ */

/* La cabeza dispara hacia arriba y vuelve, dos veces: el retroceso corto es lo
   que hace "ladrido" y no "asentimiento". En la capa de los gestos, así que se suma
   a lo que la cabeza ya estuviera haciendo, y empieza y acaba en reposo. */
.edu-mascota--ladrando .edu-mascota__cabeza-gesto {
    animation: edu-pv-ladrar .72s ease-in-out 1;
}

.edu-mascota--ladrando .edu-mascota__cabeza-ladeo {
    animation-play-state: paused;
}

@keyframes edu-pv-ladrar {
    0%, 100% {
        transform: rotate(0) translateY(0);
    }

    12%, 50% {
        /* Toma de aire: agacha un punto antes de soltar el golpe. */
        transform: rotate(3deg) translateY(2px);
    }

    24%, 62% {
        /* El golpe: hocico arriba y cuello estirado. */
        transform: rotate(-7deg) translateY(-4px);
    }

    36%, 74% {
        transform: rotate(-2deg) translateY(-1px);
    }
}

/* La boca se abre en los golpes: el trazo engorda como en el bostezo, que es el
   recurso que este dibujo tiene para "boca abierta". */
.edu-mascota--ladrando .edu-mascota__boca {
    animation: edu-pv-ladrar-boca .72s ease-in-out 1;
}

@keyframes edu-pv-ladrar-boca {
    0%, 42%, 80%, 100% {
        stroke-width: 2;
    }

    20%, 62% {
        stroke-width: 5;
    }
}

/* La lengua asoma solo en los golpes, a la misma cadencia que la boca. */
.edu-mascota--ladrando .edu-mascota__lengua {
    animation: edu-pv-ladrar-lengua .72s ease-in-out 1;
}

@keyframes edu-pv-ladrar-lengua {
    0%, 42%, 80%, 100% {
        transform: scaleY(0);
    }

    20%, 62% {
        transform: scaleY(1);
    }
}

/* El cuerpo retrocede un punto en cada golpe: el ladrido empuja, no sale solo
   del cuello. */
.edu-mascota--ladrando .edu-mascota__tronco {
    animation: edu-pv-ladrar-empuje .72s ease-in-out 1;
}

@keyframes edu-pv-ladrar-empuje {
    0%, 40%, 78%, 100% {
        transform: scale(1, 1);
    }

    22%, 60% {
        transform: scale(1.035, .965) translateY(1px);
    }
}

/* Orejas tiesas y atentas mientras dura: un perro que avisa no las lleva caídas. */
.edu-mascota--ladrando .edu-mascota__oreja--izq {
    transform: rotate(-9deg);
}

.edu-mascota--ladrando .edu-mascota__oreja--der {
    transform: rotate(9deg);
}

/* La cola acelera: avisar también le gusta. */
.edu-mascota--ladrando .edu-mascota__cola {
    animation-duration: .3s;
}