botao desalinhado

nao entendi o pq do meus ultimos botao estarem desalinhado, sendo que as classes sao as mesmas...

 <main class="receitas">
        <figure class="receita">
            <img alt="Tigela de abacate" class="receita__imagem" src="./assets/img/receitas/tigela-de-abacate.jpg" />
            <figcaption class="receita__conteudo">
                <h4 class="receita__titulo">Tigela de abacate</h4>
                <p class="receita__descricao">Receita refrescante e cheia de vitaminas para seu café da manhã.</p>
                <button class="receita__botao">Ver receita</button>
            </figcaption>
        </figure>
        <figure class="receita">
            <img alt="Salada de kiwi" class="receita__imagem" src="./assets/img/receitas/salada-de-kiwi.jpg" />
            <figcaption class="receita__conteudo">
                <h4 class="receita__titulo">Salada de kiwi</h4>
                <p class="receita__descricao">Receita refrescante e cheia de vitaminas para seu café da manhã.</p>
                <button class="receita__botao">Ver receita</button>
            </figcaption>
        </figure>
        <figure class="receita">
            <img alt="Mix de vegetais" class="receita__imagem" src="./assets/img/receitas/mix-de-vegetais.jpg" />
            <figcaption class="receita__conteudo">
                <h4 class="receita__titulo">Mix de vegetais</h4>
                <p class="receita__descricao">Receita refrescante e cheia de vitaminas para seu café da manhã.</p>
                <button class="receita__botao">Ver receita</button>
            </figcaption>
        </figure>
        <figure class="receita">
            <img alt="Pimentões à Juliana" class="receita__imagem" src="./assets/img/receitas/pimentoes-a-juliana.jpg" />
            <figcaption class="receita__conteudo">
                <h4 class="receita__titulo">Pimentões à Juliana</h4>
                <p class="receita__descricao">Receita refrescante e cheia de vitaminas para seu café da manhã.</p>
                <button class="receita__botao">Ver receita</button>
            </figcaption>
        </figure>
        <figure class="receita">
            <img alt="Prato oriental" class="receita__imagem" src="./assets/img/receitas/prato-oriental.jpg" />
            <figcaption class="receita__conteudo">
                <h4 class="receita__titulo">Prato oriental</h4>
                <p class="receita__descricao">Receita refrescante e cheia de vitaminas para seu café da manhã.</p>
                <button class="receita__botao">Ver receita</button>
            </figcaption>
        </figure>
        <figure class="receita">
            <img alt="Beterrabas assadas" class="receita__imagem" src="./assets/img/receitas/beterrabas-assadas.jpg" />
            <figcaption class="receita__conteudo">
                <h4 class="receita__titulo">Beterrabas assadas</h4>
                <p class="receita__descricao">Receita refrescante e cheia de vitaminas para seu café da manhã.</p>
                <button class="receita__botao">Ver receita</button>
            </figcaption>
        </figure>
    </main>    
</body>

.receitas{
    background: #e5e5e5;
    display: flex;
    flex-wrap: wrap;
    padding: 5rem 0 0 5rem;

}

.receita{
    background: #fdfdfd;
    display: flex;
    flex-direction: column;
    margin-bottom: 5rem;
    margin-right: 5rem;
    width: calc(25% - 5rem);

}

.receita__imagem{
    height: 180px;
}

.receita__conteudo{
    padding: 1rem;

}

.receita__titulo {
    text-align: center;
    padding-top: 0.5rem;
    font-size: 1.44rem;
}

.receita__descricao{
    line-height: 1.5rem;
}

.receita__botao{
    width: 100%;
    border: none;
    background: #8d0606;
    color: #fdfdfd;
    padding: 1rem;
    border-radius: 5px;
    transition: all , 1s ease-in-out;
}

.receita__botao:hover{
    cursor: pointer;
    background: #620404;

}

Boa Tarde Douglas,

Coloca seu arquivos dentro do github para podemos ver ele por completo. Fica mais fácil de testar e indicar as modificações. Depois posta aqui o link.

Para resolver esse problema é bem simples, eu tive o mesmo problema e quebrei a cabeça para resolve-lo. A questão é que o font-size do 'receita -titulo' se passar dos 1.40rem ele quebra o código e acaba adicionando um padding impossível de se retirar sem alterar os valores das divs.

.receita__titulo {
    text-align: center;
    padding-top: 0.5rem;
    font-size: 1.44rem;  /*Tente colocar aqui um valor de 1.40rem ou menos*/
}

Enfim, foi assim que resolvi o meu problema. Espero ter ajudado. Um abraço.

Breno, tu foi monstro agora irmão, muito obrigado pela dica, deu certinho!!!

nao sei usar o git hub ainda marcelo, agradeço a intenção.