HTML5 semântico, CSS com metodologia BEM, Flexbox

What are you most proud of, and what would you do differently next time?

🌟 Do que me orgulho Neste projeto, conquistei dois avanços significativos:

• Semântica & Acessibilidade

Substituí <div> por <button> nos links sociais, garantindo interações acessíveis via teclado.

Apliquei a metodologia BEM nas classes CSS, melhorando a legibilidade do código.

• Efeitos visuais profissionais

Criei transições suaves com:

css .card__button:hover { background-color: hsl(75, 94%, 57%); transition: background-color 0.3s ease; /* Timing controlado */ }

🔧 O que faria diferente

• Mobile-first workflow

Usaria min-width em media queries (em vez de altura fixa height: 500px).

Testaria em resoluções extremas (ex.: 320px) desde o início.

• Criar um checklist de acessibilidade antes de começar.

What challenges did you encounter, and how did you overcome them?

Dificuldades:

Fazer o hover funcionar bem em mobile (adicionei :active).

Evitar quebra do layout em telas pequenas.

Git confundindo renomeação de arquivos (aprendi git mv).

Superação: Pesquisei na MDN, testei no DevTools e quebrei o problema em partes.

What specific areas of your project would you like help with?

Quero me aprofundar em:

Mobile-first workflow: Ainda não domino completamente a abordagem "começar pelo mobile" e pretendo estudar mais sobre media queries e unidades relativas (como rem).

Design responsivo avançado: Ajustar layouts para telas muito pequenas (ex.: 320px) e testar em dispositivos reais.