Two-tier grid layout with hover effects

This component uses Tailwind CSS to create a responsive two-tier grid layout for product cards. The top tier is a heading with a link to view all products. The bottom tier is a grid with product thumbnail images, titles, prices, and category text. Each product card has a hidden overlay that appears on hover with a "View Product" call-to-action.