feat(website): visually enhance website

- Update UI with refined rose-themed styling throughout the site
- Add mobile-responsive improvements to header and hero sections
- Create new 'Recently Added Icons' component with animated cards
- Improve icon details view with better visual hierarchy and theme indicators
- Implement better hover effects and transitions for interactive elements
- Add mobile menu for better navigation on smaller screens
- Update license notice wording
- Remove grid background in favor of refined blur effects

web/src/components/header-nav.tsx

@@ -9,17 +9,23 @@ export function HeaderNav() {
 	const isIconsActive = pathname === "/icons" || pathname.startsWith("/icons/")
 
 	return (
-		<nav className="flex items-center gap-2 md:gap-6">
+		<nav className="flex md:flex-row flex-col md:items-center items-start gap-4 md:gap-6">
 			<Link
 				href="/"
-				className={cn("text-sm font-medium transition-colors hover:text-primary", pathname === "/" && "text-primary font-semibold")}
+				className={cn(
+					"text-sm font-medium transition-colors hover:text-rose-600 dark:hover:text-rose-400 cursor-pointer",
+					pathname === "/" && "text-primary font-semibold",
+				)}
 			>
 				Home
 			</Link>
 			<Link
 				prefetch
 				href="/icons"
-				className={cn("text-sm font-medium transition-colors hover:text-primary", isIconsActive && "text-primary font-semibold")}
+				className={cn(
+					"text-sm font-medium transition-colors hover:text-rose-600 dark:hover:text-rose-400 cursor-pointer",
+					isIconsActive && "text-primary font-semibold",
+				)}
 			>
 				Icons
 			</Link>