Problema no padding x margin

Oi Thais, tudo bem?

Eu não realizei o curso, então não sei ao certo como está sendo desenvolvido o projeto. Tratando somente sobre o seu desejo em adicionar o aspecto de coluna no display flex, você tentou adicionar ao elemento pai que possui a classe "apresentacao__conteudo__1skill" a propriedade "flex-direction: column-reverse"?

Pelo que notei, este elemento recebe dois filhos, a section com o título h1 e também a imagem. Ao aplicar display flex eles ficariam lado a lado, para transformar em coluna apenas a propriedade "flex-direction: column" seria suficiente. Note, no entanto, que a organização seguiria a ordem em que os elementos surgem no HTML, sendo o título seguido da imagem. Para invertermos, utilizamos o valor "column-reverse".

Fiz isso na própria dev tools do navegador e consegui o resultado esperado. No código, teria que colocar dentro de uma media query com o tamanho de quebra desejado.

Oi Alexandre! Tudo bem sim, obrigada. E você, como está?

Agradeço pelo seu tempo!

Essa parte do projeto é livre, logo, é um esboço de desenvolvimento meu.

Sobre sua resposta, eu tentei todos os flex no @media, mas não adianta colocar em column-reverse, se o problema que citei na minha duvida se trata do padding sobre a margin, logo, o titulo fica com o texto quebrado, conforme imagem da tela. Preciso que o titulo não esteja apresentando esse problema para que ambos, sua padding fique 100% livre sobre a margem, o nome do titulo não apresente quebra de texto, imagem e titulo fiquem centralizados.

Para entender melhor, posicione o mouse no raio de disposição dos elementos lá em inspecionar e verá que a padding desses elementos não está correto.

Desde já, obrigada!