Product Preview Card Component

Things I have learned from this challenge was:

1. how to use <picture> element to offer alternate versions of an image for different display/device scenarios. good article here (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/picture)

2. How to write good markup tags for HTML. ( great article related to this assignment https://fedmentor.dev/posts/html-plan-product-preview/)

3. How to write code for screen readers for hidden content, crossed out content, or market content using ::before and ::after pseudo-elements. article on it: https://adrianroselli.com/2017/12/tweaking-text-level-styles.html video refresher for psudo-element: https://www.youtube.com/watch?v=djbtPnNmc0I

Any feedback is appreciated, Thank you.