Olá Ester!
Analisando seu código, obtive o seguinte resultado:
Para reparar essas diferenças podemos adicionar as seguintes classe ao seu código:
.lista__link a{
text-decoration: none;
color: var(--branco-principal);
margin-left: 1em;
}
Seu código completo fica assim:
.lista__item{
font-size: 32px;
color: var(--branco-principal)
}
.rodape__lista {
display: flex;
justify-content: center;
margin: 5em 0;
list-style-type:none;
}
.rodape {
text-align: center;
}
.lista__link{
font-size: 20px;
color:var(--cinza-segundario);
}
.lista__link a{
text-decoration: none;
color: var(--branco-principal);
margin-left: 1em;
}
.lista{
height: 24px;
font-size: 16px;
font-weight: 400;
color: var(--cinza-segundario);
width: 51px;
text-decoration: none;
margin: 2em 0.3em ;
}
.rodape__texto{
color: var(--cinza-segundario);
font-weight: 400;
font-size: 14px;
line-height: 21px;
margin: 2%;
}
Acredito que agora o resultado esteja mais satisfatório. Se essa não era a sua dúvida em relação ao código, por favor compartilhe mais detalhes. Me baseei no título "escrevi uma classe", que não teve maiores contextos além do código.
De toda forma espero ter ajudado e reforço que em casos de dúvidas, conte sempre com o fórum da comunidade Alura! Bons estudos!
Sucesso ✨
Um grande abraço e até mais!
Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!