Olá Renata, tudo bem?
Entendo que você está com dúvidas sobre o uso de @media screen em HTML e CSS. Quando usamos essa função, estamos especificando que as regras de estilo dentro desse bloco serão aplicadas apenas em determinados tamanhos de tela. Por exemplo, se quisermos que um elemento tenha uma cor de fundo diferente apenas em telas maiores que 768 pixels, podemos usar o seguinte código:
@media screen and (min-width: 768px) {
.elemento {
background-color: #f2f2f2;
}
}
Sobre a sua pergunta específica, se entendi corretamente, você está se perguntando por que a classe "container__titulo" foi adicionada novamente na versão tablet, mesmo que já tenha sido especificada no @media screen. A resposta é que, ao usar o @media screen, estamos definindo regras de estilo para um determinado intervalo de tamanho de tela, mas ainda precisamos especificar as regras de estilo para cada elemento individualmente. Portanto, se quisermos que o título do container tenha um display block na versão tablet, precisamos especificar isso separadamente, mesmo que a classe já tenha sido definida no @media screen.
Espero ter ajudado a esclarecer suas dúvidas. Qualquer outra pergunta, é só perguntar! Bons estudos!