Oi, Vinicius, tudo bem?
Desculpe a demora em te responder!
O problema que você está enfrentando acontece, pois na classe .container__titulo do arquivo "header.css", que está fora do media-query, há a atribuição de duas propriedades display uma contendo o valor nonee outra contendo o valor block. Como a propriedade display: block está abaixo da propriedade display:none, ela permanece ativa e faz com que mesmo nas telas de dispositivos níveis (menores que 1024 px) o título "Alura Books" seja mostrado.
Para solucionar esse problema, devemos remover a propriedade display:block da classe .container__titulo que está fora do media-query e adicioná-la na classe .container__titulo que está dentro do media-query. Ficaria assim:
.container__titulo {
display: none;
}
@media screen and (min-width: 1024px) {
.container__titulo,
.container__titulo--negrito {
font-family: var(--fonte-secundaria);
font-size: 30px;
display: block;
}
Espero ter ajudado. Caso tenha dúvidas, não hesite em postar no fórum!
Abraços e bons estudos!
Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!