Add logo icon to components and update branding assets

- Integrated `logo-icon.svg` into headers, footer, and development layout for consistent branding.
- Updated `logo.svg` and `logo-icon.svg` with improved gradient and filter naming for clarity.
- Enhanced `README.md` and branding documentation with logo visuals and descriptions.
- Refined visual identity details in docs to emphasize the branding hierarchy and usage.

frontend/src/components/layout/Header.tsx

@@ -83,6 +83,7 @@ export function Header() {
         {/* Logo */}
         <div className="flex items-center space-x-8">
           <Link href="/" className="flex items-center space-x-2">
+            <img src="/logo-icon.svg" alt="PragmaStack Logo" className="h-8 w-8" />
             <span className="text-xl font-bold text-foreground">PragmaStack</span>
           </Link>