Responsive Profile Card using CSS Flexbox

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

I was able to load local static fonts using @font-face property

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

1. Had difficulty in measuring the spacing in design files without Figma files. Used Chrome extensions 'Dimensions' and 'PerfectPixel' to get the measurements, still it took a lot of trial and error to get the look as close as possible
2. Found another resource to compute clamp() function values

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

1. I changed background & text colors as I didn't like the colors in design file. I hope the color contrast is acceptable
2. I'm still not sure that I'm naming the classes and custom properties right way. I appreciate if anybody could help me with that
3. I used clamp() for changing padding. Is this function can also be used for spacing in addition to change font-size?