Sobre a section

Boa noite Daniel, tudo bem?

Como a tag "section" é mais voltada a semantica do que efetivamente a um elemento real voce pode usar quantas quiser dentro do main. Somente precisa fazer sentido utilizar estas tags, por exemplo, voce realmente ter 3 seções dentro do docuemnto.

Em relação ao posicionamento das imagens precisamos ver seu codigo para poder te ajudar, sem o codigo nao temos ideia do que pode estar acontecendo.

Abraço!

Boa noite, estou bem e você? Vou apresentar o código

    <main class="conteudo">

        <section class="conteudo__secoes">

            <h1 class="conteudo__secoes__titulo">Essa página é para você: Feliz Aniversário! </h1>

                <p class="conteudo__secoes__texto"> lorem lorem lorem lorem lorem loremloremlorem lorem loremlorem lorem loremloremloremloremloremloremloremloremlorem .</p>

                <div class="apresentacao__fotos__principal">
                <img  src="imagens/img4-atz.jpeg" alt="Foto nossa">
                </div>

            <h1 class="conteudo__subtitulo">Uma carta para você</h1>

                <p class="conteudo__secoes__carta"> Lorem ipsum dolor sit amet consectetur adipisicing elit. Provident consectetur dolorem dolore saepe similique enim voluptatem commodi sequi quidem quibusdam? Dolo.</p>

            <h1 class="conteudo__subtitulo">Nossas fotos</h1>

            <div class="apresentacao__fotos">
                    <img class="imagem__geral" src="imagens/img1-atz.jpeg" alt="FotoJeva">
                    <img class="imagem__geral" src="imagens/img2-atz.jpeg" alt="FotoJeva">
                    <img class="imagem__geral" src="imagens/img3-atz.jpeg" alt="FotoJeva">
                    <img class="imagem__geral" src="imagens/img5-atz.jpeg" alt="FotoJeva">
                </div>

        </section>

No entanto a imagem principal ficou abaixo do texto, em vez de ficar ao lado, o meu código ficou css:

.conteudo {
    padding: 3% 12%;
    display: flex;
    align-items: center;
    justify-content: space-between;

}

.conteudo__secoes{
    width: 700px;
    display: flex;
    flex-direction: column;
    align-content: space-between;
    gap: 35px;
}

.conteudo__secoes__titulo {
    display: flex;
    align-content: space-between;
    color: var(--cor-quartenario);
    font-size: 36px
}

.conteudo__secoes__texto {
    color: white;
    font-size: 24px;
    display: flex;
    flex-direction: column;
    margin: 0px 40px 0px 40px;
    width: 615px;
}

.apresentacao__fotos__principal {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

Eu sei que ficou meio confuso, mas não consigo deixar a imagem ao lado do texto

Cara, eu acho que a opção "column" é justamente pra deixar em formato de coluna. A alternativa seria "row"" Mas o que eu faria dentro da section seria: align-items: center; justify-content: space-between;