fix: globalize nebula background, refine positioning and mute animations

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

@@ -6,9 +6,8 @@ import { FaMapMarkerAlt, FaPhone, FaBuilding, FaExternalLinkAlt } from "react-ic
 
 export default function AboutPage() {
   return (
-    <main className="relative min-h-screen flex flex-col items-center bg-background text-foreground overflow-hidden">
-      <DynamicBackground />
-
+    <main className="relative flex flex-col items-center overflow-hidden">
+      
       <header className="z-50 w-full max-w-7xl mx-auto flex justify-between items-center p-6 bg-background/50 backdrop-blur-sm sticky top-0">
         <div className="flex items-center gap-6">
           <Link href="/" className="text-2xl font-bold tracking-tighter">Such Software</Link>

apps/web/src/app/layout.tsx

@@ -3,13 +3,11 @@ import { Inter } from "next/font/google";
 import "./globals.css";
 import { ThemeProvider } from "@/components/theme-provider";
 import { Footer } from "@/components/layout/footer";
+import { DynamicBackground } from "@/components/landing/dynamic-background";
 
 const inter = Inter({ subsets: ["latin"] });
 
-export const metadata: Metadata = {
-  title: "Such Software LLC",
-  description: "Next-Generation Monorepo Platform",
-};
+// ... (metadata omitted)
 
 export default function RootLayout({
   children,
@@ -25,8 +23,11 @@ export default function RootLayout({
             enableSystem
             disableTransitionOnChange
           >
-            {children}
-            <Footer />
+            <DynamicBackground />
+            <div className="relative z-10 flex flex-col min-h-screen">
+               {children}
+               <Footer />
+            </div>
           </ThemeProvider>
       </body>
     </html>

apps/web/src/app/page.tsx

@@ -9,11 +9,9 @@ import { Button } from "@repo/ui/components/button";
 
 export default function Home() {
   return (
-    <main className="relative min-h-screen flex flex-col items-center justify-between overflow-hidden bg-background text-foreground transition-colors duration-500">
+    <main className="relative flex flex-col items-center justify-between overflow-hidden">
       
-      <DynamicBackground />
-
-      <header className="z-50 w-full max-w-7xl mx-auto flex justify-between items-center p-6">
+      <header className="z-50 w-full max-w-7xl mx-auto flex justify-between items-center p-6 pb-2">
         <div className="flex items-center gap-6">
           <h1 className="text-2xl font-bold tracking-tighter">Such Software</h1>
           <nav className="hidden md:flex gap-4 text-sm font-medium">