update logos and image strucutre

apps/web/src/app/about/page.tsx

@@ -26,8 +26,8 @@ export default function AboutPage() {
       <div id="main-content" className="z-10 w-full max-w-6xl mx-auto py-20 px-4 pb-24 md:pb-20">
         <h1 className="text-4xl md:text-5xl font-bold mb-10 text-center">About Us</h1>
 
-        <div className="section-container">
-          
+        <div className="section-container relative">
+
           <div className="prose dark:prose-invert max-w-none mb-12">
             <p className="text-xl leading-relaxed">
               Founded in 2021 by John Winter Murphy in Chester County, PA, and operating in Kennett Square since July 2025, 
@@ -94,6 +94,18 @@ export default function AboutPage() {
             <FounderSignature />
           </div>
 
+          <img
+            src="/images/animations/anim3_matrix_light.svg"
+            alt=""
+            aria-hidden="true"
+            className="absolute bottom-4 right-4 w-16 h-16 opacity-50 block dark:hidden motion-reduce:hidden"
+          />
+          <img
+            src="/images/animations/anim3_matrix.svg"
+            alt=""
+            aria-hidden="true"
+            className="absolute bottom-4 right-4 w-16 h-16 opacity-50 hidden dark:block motion-reduce:hidden"
+          />
         </div>
       </div>
       <MobileNav />

apps/web/src/app/blog/page.tsx

@@ -43,10 +43,26 @@ export default function BlogPage() {
       <Header />
       <div id="main-content" className="z-10 w-full max-w-4xl mx-auto py-20 px-4 pb-24 md:pb-20">
         <h1 className="text-4xl md:text-5xl font-bold mb-6">Blog</h1>
-        <p className="text-xl text-muted-foreground mb-12">
+        <p className="text-xl text-muted-foreground mb-8">
           News, launches, and technical notes.
         </p>
 
+        {/* Animated accent */}
+        <div className="flex justify-center mb-12 motion-reduce:hidden">
+          <img
+            src="/images/animations/anim_type_v4_light.svg"
+            alt=""
+            aria-hidden="true"
+            className="w-24 h-24 opacity-60 block dark:hidden"
+          />
+          <img
+            src="/images/animations/anim_type_v4.svg"
+            alt=""
+            aria-hidden="true"
+            className="w-24 h-24 opacity-60 hidden dark:block"
+          />
+        </div>
+
         {publishedPosts.length === 0 ? (
           <p className="text-muted-foreground">No posts yet. Check back soon.</p>
         ) : (

apps/web/src/app/blog/smirk-wallet-release/page.tsx

@@ -76,7 +76,7 @@ export default function SmirkWalletReleasePost() {
 
           <h2>Open Source</h2>
           <p>
-            Everything is open source. The extension, backend, and WASM libraries are all on GitHub:
+            The extension and WASM libraries are open source on GitHub:
           </p>
           <ul>
             <li>

apps/web/src/app/layout.tsx

@@ -15,12 +15,15 @@ export const metadata: Metadata = {
   },
   icons: {
     icon: [
-      { url: "/images/favicon.svg", type: "image/svg+xml" },
-      { url: "/images/favicon_192.png", sizes: "192x192", type: "image/png" },
+      { url: "/images/branding/favicon_dark.svg", type: "image/svg+xml", media: "(prefers-color-scheme: dark)" },
+      { url: "/images/branding/favicon_light.svg", type: "image/svg+xml", media: "(prefers-color-scheme: light)" },
+      { url: "/images/branding/favicon_dark.png", sizes: "192x192", type: "image/png", media: "(prefers-color-scheme: dark)" },
+      { url: "/images/branding/favicon_light.png", sizes: "192x192", type: "image/png", media: "(prefers-color-scheme: light)" },
     ],
-    shortcut: "/images/favicon.svg",
+    shortcut: "/images/branding/favicon_dark.svg",
     apple: [
-      { url: "/images/favicon_192.png", sizes: "192x192", type: "image/png" },
+      { url: "/images/branding/favicon_dark.png", sizes: "192x192", type: "image/png", media: "(prefers-color-scheme: dark)" },
+      { url: "/images/branding/favicon_light.png", sizes: "192x192", type: "image/png", media: "(prefers-color-scheme: light)" },
     ],
   },
   manifest: "/manifest.json",
@@ -31,7 +34,7 @@ const structuredData = {
   "@type": "Organization",
   name: "Such Software LLC",
   url: "https://such.software",
-  logo: "https://such.software/images/logo_dark.svg",
+  logo: "https://such.software/images/branding/clean_dark_w_text.svg",
   description: "Next-generation web applications engineered for scale, compliance, and performance.",
   address: {
     "@type": "PostalAddress",

apps/web/src/app/products/page.tsx

@@ -84,6 +84,21 @@ export default function ProductsPage() {
             </Link>
           ))}
         </div>
+
+        <div className="flex justify-center mt-16 motion-reduce:hidden">
+          <img
+            src="/images/animations/anim3_matrix_light.svg"
+            alt=""
+            aria-hidden="true"
+            className="w-20 h-20 opacity-40 block dark:hidden"
+          />
+          <img
+            src="/images/animations/anim3_matrix.svg"
+            alt=""
+            aria-hidden="true"
+            className="w-20 h-20 opacity-50 hidden dark:block"
+          />
+        </div>
       </div>
       <MobileNav />
     </main>

apps/web/src/app/services/page.tsx

@@ -139,6 +139,13 @@ export default function ServicesPage() {
 
         <div className="mt-20 p-16 rounded-[2.5rem] bg-gradient-to-br from-slate-900 via-slate-800 to-indigo-950 text-white text-center shadow-2xl relative overflow-hidden group border-2 border-white/5">
             <div className="absolute inset-0 bg-blue-500/10 opacity-0 group-hover:opacity-100 transition-opacity" />
+            {/* Animated pulse accent */}
+            <img
+              src="/images/animations/anim1_pulse.svg"
+              alt=""
+              aria-hidden="true"
+              className="absolute top-4 right-4 w-20 h-20 opacity-20 group-hover:opacity-40 transition-opacity motion-reduce:hidden"
+            />
             <h2 className="text-4xl font-bold mb-6 relative z-10 tracking-tight">Start building the future</h2>
             <p className="mb-10 text-slate-300 text-lg max-w-2xl mx-auto relative z-10 leading-relaxed font-medium">
                 We are currently accepting a limited number of partners for performance-based development. 

apps/web/src/components/about/founder-signature.tsx

@@ -9,14 +9,14 @@ export const FounderSignature = () => {
         <div className="flex items-center gap-6 relative z-10">
            <div className="relative w-16 h-16 flex items-center justify-center">
               <Image
-                src="/images/logo_dark.svg"
+                src="/images/branding/clean_dark.svg"
                 alt="Such Software Icon"
                 width={56}
                 height={56}
                 className="hidden dark:block object-contain"
               />
               <Image
-                src="/images/logo_light.svg"
+                src="/images/branding/clean_light.svg"
                 alt="Such Software Icon"
                 width={56}
                 height={56}

apps/web/src/components/layout/site-logo.tsx

@@ -9,7 +9,7 @@ export function SiteLogo() {
       <div className="relative w-40 h-11 lg:w-48 lg:h-12">
         {/* Dark mode logo (white text) */}
         <Image
-          src="/images/logo_dark_w_name.svg"
+          src="/images/branding/clean_dark_w_text.svg"
           alt="Such Software"
           fill
           className="object-contain hidden dark:block"
@@ -17,7 +17,7 @@ export function SiteLogo() {
         />
         {/* Light mode logo (black text) */}
         <Image
-          src="/images/logo_light_w_name.svg"
+          src="/images/branding/clean_light_w_text.svg"
           alt="Such Software"
           fill
           className="object-contain block dark:hidden"

apps/web/src/components/portfolio/bento-grid.tsx

@@ -16,7 +16,7 @@ export const PortfolioGrid = () => {
           </div>
           <div className="absolute inset-6 bottom-24 rounded-2xl overflow-hidden z-10 bg-slate-800/30">
               <Image
-                src="/images/r-cryptocurrency.png"
+                src="/images/products/r-cryptocurrency.png"
                 alt="Screenshot of r/CryptoCurrency subreddit homepage showing over 10 million subscribers, community links, and a cartoon moon mascot"
                 fill
                 className="object-contain p-4 opacity-80 transition-transform duration-1000 group-hover:scale-105"
@@ -35,7 +35,7 @@ export const PortfolioGrid = () => {
           </div>
            <div className="absolute inset-x-4 bottom-4 top-24 rounded-lg overflow-hidden z-10 bg-black/5 dark:bg-white/5 border border-indigo-500/10 shadow-inner">
                <Image
-                src="/images/moonplace.png"
+                src="/images/products/moonplace.png"
                 alt="Screenshot of MoonPlace collaborative pixel art canvas showing colorful community-created artwork"
                 fill
                 className="object-contain p-2 opacity-50 transition-transform duration-1000 group-hover:scale-110"
@@ -54,7 +54,7 @@ export const PortfolioGrid = () => {
           </div>
            <div className="absolute inset-x-4 bottom-4 top-28 rounded-lg overflow-hidden z-10 bg-black/5 dark:bg-white/5 border border-amber-500/10 shadow-inner flex items-center justify-center">
                <Image
-                src="/images/smirk-wallet.png"
+                src="/images/products/smirk-wallet.png"
                 alt="Screenshot of Smirk Wallet browser extension showing multi-currency support for BTC, LTC, XMR, WOW, and GRIN"
                 fill
                 className="object-contain p-4 opacity-60 transition-transform duration-1000 group-hover:scale-110"
@@ -76,7 +76,7 @@ export const PortfolioGrid = () => {
           </div>
            <div className="absolute inset-x-4 bottom-4 top-24 rounded-lg overflow-hidden z-10 bg-black/5 dark:bg-white/5 border border-orange-500/10 shadow-inner">
               <Image
-                src="/images/privacy-labs.png"
+                src="/images/products/privacy-labs.png"
                 alt="Screenshots of Monerogue roguelike game and Wowne.ro WebAssembly wallet interface"
                 fill
                 className="object-contain p-2 opacity-50 transition-transform duration-1000 group-hover:scale-110"
@@ -95,7 +95,7 @@ export const PortfolioGrid = () => {
           </div>
           <div className="absolute inset-4 rounded-xl overflow-hidden z-10 bg-zinc-200/50 dark:bg-zinc-800/50">
                <Image
-                src="/images/occupy-wallets.png"
+                src="/images/products/occupy-wallets.png"
                 alt="Screenshot of Occupy Wallets gallery displaying illustrated artwork with political and economic commentary"
                 fill
                 className="object-contain p-4 opacity-60 transition-transform duration-1000 group-hover:scale-105"