Solucionado
Boa tarde,
Eu achei que o padding não mexia na largura do elemento, e que realmente espreme o conteúdo gerando o espaçamento interno. Ainda continuo a pensar que quando adiciono o padding a largura do elemento não muda. Pode me ajudar a ter claro este ponto por favor?
hoje, com a Alura e o Google Gemini
O padding, margin e border não são considerados no width e height do elemento ao ter a propriedade box-sizing com o valor content-box, o qual é o valor padrão desta.
Ao ter o valor como border-box, o padding/margin/border serão levados em conta.
Por exemplo:
Com content-box (padrão)
Temos uma caixa com width 350px, ao ter um padding/ border laterias de 10px, o navegador irá atribuir ao elemento um width de 370px
Com border-box
Temos a mesma caixa, porém com o box-sizing definido com o valor box-sizing, o navegador irá atribuir ao elemento um width de 350px, contando com os valores de padding.
Espero ter ajudado, qualquer dúvida, não hesite em perguntar!
Agora ficou mais claro! Muito obrigado Levi.