Olá, Resolvi fazer uma alteração na marcação HTML do projecto para aproveitar um recurso disponível no SASS que é o Nesting e o seletor aninhado & (Foi abordado no curso).

BEM (Block Element Modifier) é uma metodologia de nomenclatura de classes CSS que ajuda a criar estilos mais escaláveis e reutilizáveis em projetos web. A ideia principal do BEM é que cada classe CSS deve ter um significado claro e bem definido, para que seja fácil de entender e modificar o estilo do elemento.

HTML

Alteração da class inner-banner parabanner__inner

<section class="banner">
       <div class="banner__inner">
            <h1>Alura SPA</h1>
            <h2>Venha viver o seu melhor dia!</h2>
       </div>
</section>

SASS

.banner {
  @include center;
  background: url(../imagens/banner.jpeg) 27% center no-repeat;
  min-height: 350px;
  background-size: cover;
  opacity: .9;

  &__inner {
    padding: 3rem;
    background-color: $tertiary;
    border-radius: 45px;
    opacity: .9;
    text-align: center;
  }

  &__tile  {
    color: $primary;
    font-size: $text-size;
    font-weight: bold;
  }

  &__subtitle {
    font-size: math.div($tamanho-do-texto, 2);
    color: $secondary;
  }
}

APRESENTAÇÃO