Transition aplicada no 'imagem-beneficio' e não no hover

Olá Shaini, tudo bem?

O que ocorre é que no efeito de CSS existem duas fases distintas com responsabilidades distintas que precisamos entender.

Controlando o efeito na classe do elemento

A primeira é a que prevê como o efeito irá acontecer, isso é responsabilidade da propriedade transition. É ela que irá criar controles para a ocorrencia de um efeito, como por exemplo quanto tempo ele irá durar, quanto tempo demorará para começar etc. Você pode ler mais aqui, na documentação do MDN sobre transition, aqui muitas configurações podem ser criadas!

Nesta etapa, nós não temos conhecimento de qual é esse efeito e por isso o código do transition é colocado no elemento em si, no caso do projeto do curso, .imagem-beneficios.

Criando o efeito na pseudoclasse

O efeito é criado dentro do bloco da pseudoclasse, que é uma palavra-chave adicionada a seletores que especifica um estado especial do elemento selecionado, como por exemplo o :hover que é usado quando o cursor do mouse é passado encima do elemento. Aqui, é onde irá conter o que o efeito irá gerar, ou seja, uma mudança na cor de fundo, uma borda, mudança na opacidade, etc.

Espero ter ajudado, em caso de dúvidas ou dificuldades, estou por aqui!

Abraços e bons estudos!