Responsive QR code using CSS Flexbox

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

Ultimately I think I did pretty well at getting the size of the elements to match up with the design reference, though feel like I used too much hard-coding on the sizes for my preference.

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

I learned about clamp. I didn't end up using it since the research rabbit hole I was falling into on that topic seemed too time-consuming and excessive for what I needed to accomplish in this case, but learning new things is always a plus.

So anyway, I just ended up using my best guestimates to adjust sizes in pixels, which gets the job done if nothing else.

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

What do you think, was using pixel measurements and hard-coding width/height a fine call here or was there a better solution that could work here? I definitely feel like designing things with responsiveness in mind is one of the trickier things for me to wrap my head around at the moment.

Updated: After updating the CSS, I've now utilized rem units and max-height/width to provide better responsiveness on especially small screen sizes, courtesy of advice from @weldu0.