QR code component (html + css)

👾Fala Luciano, tudo bem? Parabéns pelo desafio!

Olhei seu código e deixei algumas sugestoes pra vc:

Pra deixar o container responsivo junto com a image vc tem que remover os width e min-width e usar somente o max-width: 285px pro container escalar

Aqui as mudancas que fiz pro seu codigo:

main {
    max-width: 285px;
    background-color: hsl(0, 0%, 100%);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    /* max-width: 21%; */
    padding: 15px;
    border-radius: 20px;
}

O melhor jeito de usar a image aqui seria inserindo ela dentro do html com <img>, pelo background-image vc tem mto pouco controle, pra deixar ela responsiva use display: block e max-width: 100%

.code {
    display: block;
    max-width: 100%;
    /* background-image: url(images/image-qr-code.png); */
    /* background-size: cover; */
}

👋 Espero ter ajudado e continue no foco!