1
resposta

Não consegui estilizar o conteúdo do footer do jeito que o projeto pede.

.apresentacao__creditos {
    padding: 24px;
     color: #000000;
    background-color:aqua;
    text-align: center;
    font-family: "montserrat" , sans-serif;
    font-size: 24px;
    font-weight: 400;
}

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

1 resposta

OiA boa notícia é que você já tem quase tudo pronto — só faltam alguns detalhes de semântica, variáveis e reset de estilos que costumam “travar” o visual.

1. Use uma tag semântica

Troque o container atual pelo elemento <footer>:

<footer class="rodape">
   <p class="rodape__creditos">
      Os dados desse site são de autoria de Hiago Viana. Contato: (84) 98103-1614
   </p>
</footer>

Isso ajuda na acessibilidade e no SEO.

2. Centralize o texto sem margens escondidas

O parágrafo <p> vem com margin-block: 1em por padrão, e isso pode “empurrar” o bloco no layout.

.rodape__creditos {
    margin: 0;                /* zera margens internas do <p> */
}

3. Estilo definitivo do rodapé

.rodape {
    width: 100%;
    background-color: var(--cor-terciaria);
    display: flex;                  /* mantém tudo centralizado */
    justify-content: center;
    align-items: center;
    padding-block: 24px;            /* padding acima/abaixo     */
}

.rodape__creditos {
    color: var(--cor-secundaria);
    font-family: var(--fonte-secundaria);
    font-size: 1.5rem;              /* 24 px ≈ 1.5 rem          */
    font-weight: 400;
}
  1. Reset global simples (caso ainda não tenha)
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body {
    font-family: var(--fonte-primaria);
    background-color: var(--cor-primaria);
}

Isso garante que o rodapé grude na lateral esquerda/direita sem “sobras” de margem.

Bomtrabalho.