Duvida com CSS

Estou tendo um problema em fazer um efeito em uma imagem. Consegui fazer o efeito de foco na imagem (quando coloco o mouse em cima ele cria uma pelicula com opacidade), porém queria que essa pelicula viesse de baixo para cima. Eu teria que animar a pelicula ou a divisão da imagem?

Acredito que um keyframe já deve resolver o problema. Uma simples animação no margin-top.

https://www.w3schools.com/cssref/css3_pr_animation-keyframes.php