Tenho uma dúvida em ralação ao background-image

No vídeo inserindo imagens do curso "HTML e CSS: praticando HTML/CSS" a instrutora cria duas classes dentro de uma tag, e depois utiliza de duas formas diferentes no CSS. HTML:

<section class="container principal">
            <h1 class="conteudo__titulo">Com o Combo+, você pode aproveitar a Alura+ e o Alura Língua por um preço único.</h1>
            <img class="conteudo__imagem" src="/assets/Combo.png" alt="alura+aluralingua combo+">
 </section>

CSS:

.principal {
    background-image: url(/assets/Background.png);
    background-repeat: no-repeat;
    background-size: contain;
}

.container {
    height: 100vh;
}

Não entendi muito bem essa parte do .container, porque a instrutora colocou numa classe separada de .principal? e a ela não explica no vídeo, alguém poderia me explicar? obg S2