Olá pessoal, já estou bastante tempo tentando resolver esse problema mas não encontro solução, já terminei os 4 módulos do curso de html e css e estou tentando aplicar os elementos de responsividade do media do css para as outras telas, no caso de produtos e contato, mas simplesmente não funciona, as outras telas não aceitam qualquer elemento que se coloque no media. O ponto inicial que já deveria funcionar são os elementos h1 e nav que funcionam apenas na tela home que é o arquivo index, mas nas telas de produto e contato não funcionam e perde-se a funcionalidade do media.
Para que fique mais claro segue as imagens em sequência.
-Primeiro inspecionando o elemento h1 na tela home é possível verificar claramente o elemento aplicado do media: https://ibb.co/nC7pCDd
-Depois ao ir na tela de produtos e inspecionar novamente o elemento h1 é possível verificar que o não existe mais o media e nenhum elemento h1 aplicado: https://ibb.co/mHCQBhs
-Da mesma forma vale ao inspecionar o elemento nav na tela home, também é possível verificar o elemento aplicado do media: https://ibb.co/yNJVLMs
-Já na tela de produtos ao inspecionar o elemento nav, não existe mais o media e é aplicado apenas o elemento nav normal do css e não do media: https://ibb.co/M7Q6wjp
Assim também vale para a tela de contato, que também não são aplicados os elementos do media. Nenhum elemento é aplicado para essas telas, qualquer elemento que se coloque não é aplicado. Alguém saberia explicar o motivo e conseguir resolver esse problema?
Segue o código usado até o momento: https://codepen.io/fanig01/pen/OJRewde
