media query não funciona da forma correta.

Oi kaah.fernandess o correto não seria assim , você tá esquecendo de fechar as chaves e encadeando tudo como fazemos com linguagens de programação, estamos no css precisamos escrever os estilos assim:

header {
    border-top: 5px solid $cor-padrao;
    background: rgba($cor-auxiliar, 0.8);
    height: 90px;
    width: 100%;
    position: absolute;
}
    @media (max-width: 980px) {
seletorquevocê queraplicaresseheightperdido {
        height: auto;
}
        h1 {
            max-width: 50%;
            margin: 0 auto;
}
            img {
                max-width: 100%;
                margin: .5em auto;
                display: block;
            }

Acredito que você engoliu umas chaves, sugiro a você fazer os cursos 3 e 4 de html e css antes de aprender o saas que é um framework vai ajudar no seu aprendizado, espero ter ajudado e bons estudos

Na aula ele ensina a fazer dessa forma.. Eis o código que foi passado na aula

header {
  border-top: 5px solid $cor-padrao;
  background: rgba($cor-auxiliar, 0.8);
  height: 90px;
  width: 100%;
  position: absolute;

  @media (max-width: 980px) {
      height: auto;

      h1 {
        max-width: 50%;
        margin: 0 auto;

        img {
          max-width: 100%;
          margin: .5em auto;
          display: block;
        } // fim do img
      } // fim do h1
    } // fim do media querie
} // fim do header

Opa kaah está correto, se trata de uma funcionalidade do framework SAAS mesmo, desculpe o equivoco, você consegue testar a media querie além de 980px e aquem do 980px ai no seu monitor qual o resultado ?

No caso de até 980px verifique se aplica o estilo do h1 e do img de dentro do header.E depois verifique pelo console do navegador e em um monitor com essa resolução além de 980px.

Verifique se mostra algum erro no console quando compila o saas também e cola aqui por favor.