/* ═══ La perrovaquita — PESTAÑEAR ══════════════════════════════════════
   Conducta espontánea del repertorio, clase edu-mascota--pestaneando, sobre la
   vista de frente con la pose sentada. Tres parpadeos rápidos y coquetos, con
   las pestañas grandes y la cabeza ladeada. La da de alta
   js/compartido/mascota/conducta/pestanear.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--pestaneando .edu-mascota__cabeza-ladeo {
    animation-play-state: paused;
}

/* TRES PARPADEOS seguidos en la capa del parpadeo, la misma que usa el parpadeo
   natural de base.css, con sus mismas unidades: 27 px es el ojo cerrado. Al acabar
   vuelve el parpadeo natural desde su reposo. */
.edu-mascota--pestaneando .edu-mascota__parpado-parpadeo {
    animation: edu-pv-pestanear 1.3s ease-in-out 1 both;
}

@keyframes edu-pv-pestanear {
    0%, 18%, 38%, 58%, 100% {
        transform: translateY(0);
    }

    10%, 30%, 50% {
        transform: translateY(27px);
    }
}

/* Las pestañas crecen mientras pestañea: es lo que lo hace coqueto. Escalan sobre
   su propio centro (base.css). */
.edu-mascota--pestaneando .edu-mascota__pestana {
    animation: edu-pv-pestanear-pestanas 1.3s ease-in-out 1 both;
}

@keyframes edu-pv-pestanear-pestanas {
    0%, 100% {
        transform: none;
    }

    8%, 62% {
        transform: scale(1.25);
    }

    80% {
        transform: none;
    }
}

.edu-mascota--pestaneando .edu-mascota__cabeza-gesto {
    animation: edu-pv-pestanear-cabeza 1.3s ease-in-out 1 both;
}

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

    8%, 68% {
        transform: translateY(-1px) rotate(4deg);
    }

    85% {
        transform: none;
    }
}