/* ═══ La perrovaquita — ESTORNUDAR ═════════════════════════════════════
   Conducta espontánea del repertorio, clase edu-mascota--estornudando, sobre la
   vista de frente con la pose sentada. Toma aire con la cabeza atrás y los ojos
   entornados, aprieta la cara y suelta el estornudo de golpe hacia delante, con
   un sacudón del cuerpo y las orejas aleteando. La da de alta
   js/compartido/mascota/conducta/estornudar.js, que dice cuánto dura: 1.3 s, lo
   mismo que sus animaciones, que corren una sola vez y empiezan y acaban en
   reposo para que al quitarse la clase no haya salto. ═══ */

/* Mientras dura, el vaivén de mirar alrededor se PAUSA en vez de quitarse: al
   acabar sigue donde iba. */
.edu-mascota--estornudando .edu-mascota__cabeza-ladeo {
    animation-play-state: paused;
}

/* La cabeza va atrás al tomar aire y se dispara hacia delante en el estornudo. En
   __cabeza-gesto, la capa de las conductas, que gira sobre la base del cráneo. */
.edu-mascota--estornudando .edu-mascota__cabeza-gesto {
    animation: edu-pv-estornudar-cabeza 1.3s ease-in-out 1 both;
}

@keyframes edu-pv-estornudar-cabeza {
    0%, 100% {
        transform: none;
    }

    35%, 45% {
        transform: translateY(-3px) rotate(-3deg);
    }

    52% {
        transform: translateY(4px) rotate(2deg) scale(.97);
    }

    62% {
        transform: translateY(1px);
    }

    80% {
        transform: none;
    }
}

/* El hocico se arruga antes y se infla en el estornudo. Gira y escala sobre su
   origen de base.css, el puente de la nariz. */
.edu-mascota--estornudando .edu-mascota__morro {
    animation: edu-pv-estornudar-morro 1.3s ease-in-out 1 both;
}

@keyframes edu-pv-estornudar-morro {
    0%, 100% {
        transform: none;
    }

    30%, 45% {
        transform: scale(1.04, .95);
    }

    52% {
        transform: scale(1.08);
    }

    70% {
        transform: none;
    }
}

/* Los ojos se entornan al tomar aire y se aprietan en el estornudo. Se anima el
   desplazamiento del párpado en las unidades de base.css: -27 px es abierto del
   todo, el reposo de una perra sin ánimo que lo cambie. Sin parpadeo mientras
   dura. */
.edu-mascota--estornudando .edu-mascota__parpado {
    animation: edu-pv-estornudar-parpado 1.3s ease-in-out 1 both;
}

.edu-mascota--estornudando .edu-mascota__parpado-parpadeo {
    animation: none;
}

@keyframes edu-pv-estornudar-parpado {
    0%, 100% {
        transform: translateY(-27px);
    }

    30% {
        transform: translateY(-14px);
    }

    45%, 60% {
        transform: translateY(-1px);
    }

    75% {
        transform: translateY(-27px);
    }
}

/* El cuerpo da el sacudón del estornudo. */
.edu-mascota--estornudando .edu-mascota__tronco {
    animation: edu-pv-estornudar-tronco 1.3s ease-in-out 1 both;
}

@keyframes edu-pv-estornudar-tronco {
    0%, 45%, 100% {
        transform: none;
    }

    52% {
        transform: translateY(2px) scale(1.02, .97);
    }

    66% {
        transform: none;
    }
}

/* Las orejas aletean con el golpe: lo blando va con retraso. */
.edu-mascota--estornudando .edu-mascota__oreja--izq {
    animation: edu-pv-estornudar-oreja-izq 1.3s ease-in-out 1 both;
}

.edu-mascota--estornudando .edu-mascota__oreja--der {
    animation: edu-pv-estornudar-oreja-der 1.3s ease-in-out 1 both;
}

@keyframes edu-pv-estornudar-oreja-izq {
    0%, 48%, 100% {
        transform: none;
    }

    56% {
        transform: rotate(-18deg);
    }

    66% {
        transform: rotate(6deg);
    }

    78% {
        transform: none;
    }
}

@keyframes edu-pv-estornudar-oreja-der {
    0%, 48%, 100% {
        transform: none;
    }

    56% {
        transform: rotate(18deg);
    }

    66% {
        transform: rotate(-6deg);
    }

    78% {
        transform: none;
    }
}