diff --git a/backend/app/database/weaviate/client.py b/backend/app/database/weaviate/client.py
index 5ed11ede..09cf0a23 100644
--- a/backend/app/database/weaviate/client.py
+++ b/backend/app/database/weaviate/client.py
@@ -6,6 +6,7 @@
 logger = logging.getLogger(__name__)
 
 _client = None
+_connected = False
 
 
 def get_client():
@@ -15,18 +16,42 @@ def get_client():
         _client = weaviate.use_async_with_local()
     return _client
 
+
+async def ensure_connected():
+    """Ensure the client is connected. Reuses existing connection if available."""
+    global _client, _connected
+    client = get_client()
+    
+    if not _connected or not client.is_connected():
+        await client.connect()
+        _connected = True
+        logger.info("Weaviate client connected")
+    
+    return client
+
+
 @asynccontextmanager
 async def get_weaviate_client() -> AsyncGenerator[weaviate.WeaviateClient, None]:
-    """Async context manager for Weaviate client."""
-    client = get_client()
+    """Async context manager for Weaviate client with persistent connection."""
     try:
-        await client.connect()
+        client = await ensure_connected()
         yield client
     except Exception as e:
-        logger.error(f"Weaviate client error: {str(e)}")
+        logger.error("Weaviate client error: %s", e)
         raise
-    finally:
+
+
+async def close_weaviate_client():
+    """Close the Weaviate client. Call this on application shutdown."""
+    global _client, _connected
+    
+    if _client is not None and _connected:
         try:
-            await client.close()
+            await _client.close()
+            _connected = False
+            logger.info("Weaviate client closed")
         except Exception as e:
-            logger.warning(f"Error closing Weaviate client: {str(e)}")
+            logger.warning("Error closing Weaviate client: %s", e)
+        finally:
+            _client = None
+            _connected = False
\ No newline at end of file
diff --git a/backend/main.py b/backend/main.py
index b7ad80a6..ad8bb0bf 100644
--- a/backend/main.py
+++ b/backend/main.py
@@ -2,6 +2,7 @@
 import logging
 import sys
 from contextlib import asynccontextmanager
+from app.database.weaviate.client import close_weaviate_client
 
 import uvicorn
 from fastapi import FastAPI, Response
@@ -99,6 +100,7 @@ async def lifespan(app: FastAPI):
     app.state.app_instance = app_instance
     await app_instance.start_background_tasks()
     yield
+    await close_weaviate_client()
     await app_instance.stop_background_tasks()
 
 
diff --git a/landing/package-lock.json b/landing/package-lock.json
index 7c4191de..0d9cc634 100644
--- a/landing/package-lock.json
+++ b/landing/package-lock.json
@@ -8,6 +8,9 @@
             "name": "devrai-landing",
             "version": "0.1.0",
             "dependencies": {
+                "@emotion/react": "^11.14.0",
+                "@emotion/styled": "^11.14.1",
+                "@mui/material": "^7.3.7",
                 "@studio-freight/lenis": "^1.0.42",
                 "framer-motion": "^10.16.4",
                 "lucide-react": "^0.344.0",
@@ -63,7 +66,6 @@
             "version": "7.26.2",
             "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.26.2.tgz",
             "integrity": "sha512-RJlIHRueQgwWitWgF8OdFYGZX328Ax5BCemNGlqHfplnRT9ESi8JkFlvaVYbS+UubVY6dpv87Fs2u5M29iNFVQ==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "@babel/helper-validator-identifier": "^7.25.9",
@@ -119,7 +121,6 @@
             "version": "7.27.0",
             "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.27.0.tgz",
             "integrity": "sha512-VybsKvpiN1gU1sdMZIp7FcqphVVKEwcuj02x73uvcHE0PTihx1nlBcowYWhDwjpoAXRv43+gDzyggGnn1XZhVw==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "@babel/parser": "^7.27.0",
@@ -153,7 +154,6 @@
             "version": "7.25.9",
             "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.25.9.tgz",
             "integrity": "sha512-tnUA4RsrmflIM6W6RFTLFSXITtl0wKjgpnLgXyowocVPrbYrLUXSBXDgTs8BlbmIzIdlBySRQjINYs2BAkiLtw==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "@babel/traverse": "^7.25.9",
@@ -195,7 +195,6 @@
             "version": "7.25.9",
             "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.25.9.tgz",
             "integrity": "sha512-4A/SCr/2KLd5jrtOMFzaKjVtAei3+2r/NChoBNoZ3EyP/+GlhoaEGoWOZUmFmoITP7zOJyHIMm+DYRd8o3PvHA==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">=6.9.0"
@@ -205,7 +204,6 @@
             "version": "7.25.9",
             "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.25.9.tgz",
             "integrity": "sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">=6.9.0"
@@ -239,7 +237,6 @@
             "version": "7.27.0",
             "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.27.0.tgz",
             "integrity": "sha512-iaepho73/2Pz7w2eMS0Q5f83+0RKI7i4xmiYeBmDzfRVbQtTOG7Ts0S4HzJVsTMGI9keU8rNfuZr8DKfSt7Yyg==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "@babel/types": "^7.27.0"
@@ -283,11 +280,19 @@
                 "@babel/core": "^7.0.0-0"
             }
         },
+        "node_modules/@babel/runtime": {
+            "version": "7.28.4",
+            "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.28.4.tgz",
+            "integrity": "sha512-Q/N6JNWvIvPnLDvjlE1OUBLPQHH6l3CltCEsHIujp45zQUSSh8K+gHnaEX45yAT1nyngnINhvWtzN+Nb9D8RAQ==",
+            "license": "MIT",
+            "engines": {
+                "node": ">=6.9.0"
+            }
+        },
         "node_modules/@babel/template": {
             "version": "7.27.0",
             "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.27.0.tgz",
             "integrity": "sha512-2ncevenBqXI6qRMukPlXwHKHchC7RyMuu4xv5JBXRfOGVcTy1mXCD12qrp7Jsoxll1EV3+9sE4GugBVRjT2jFA==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "@babel/code-frame": "^7.26.2",
@@ -302,7 +307,6 @@
             "version": "7.27.0",
             "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.27.0.tgz",
             "integrity": "sha512-19lYZFzYVQkkHkl4Cy4WrAVcqBkgvV2YM2TU3xG6DIwO7O3ecbDPfW3yM3bjAGcqcQHi+CCtjMR3dIEHxsd6bA==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "@babel/code-frame": "^7.26.2",
@@ -321,7 +325,6 @@
             "version": "11.12.0",
             "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
             "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">=4"
@@ -331,7 +334,6 @@
             "version": "7.27.0",
             "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.27.0.tgz",
             "integrity": "sha512-H45s8fVLYjbhFH62dIJ3WtmJ6RSPt/3DRO0ZcT2SUiYiQyz3BLVb9ADEnLl91m74aQPS3AzzeajZHYOalWe3bg==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "@babel/helper-string-parser": "^7.25.9",
@@ -341,6 +343,62 @@
                 "node": ">=6.9.0"
             }
         },
+        "node_modules/@emotion/babel-plugin": {
+            "version": "11.13.5",
+            "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.13.5.tgz",
+            "integrity": "sha512-pxHCpT2ex+0q+HH91/zsdHkw/lXd468DIN2zvfvLtPKLLMo6gQj7oLObq8PhkrxOZb/gGCq03S3Z7PDhS8pduQ==",
+            "license": "MIT",
+            "dependencies": {
+                "@babel/helper-module-imports": "^7.16.7",
+                "@babel/runtime": "^7.18.3",
+                "@emotion/hash": "^0.9.2",
+                "@emotion/memoize": "^0.9.0",
+                "@emotion/serialize": "^1.3.3",
+                "babel-plugin-macros": "^3.1.0",
+                "convert-source-map": "^1.5.0",
+                "escape-string-regexp": "^4.0.0",
+                "find-root": "^1.1.0",
+                "source-map": "^0.5.7",
+                "stylis": "4.2.0"
+            }
+        },
+        "node_modules/@emotion/babel-plugin/node_modules/@emotion/memoize": {
+            "version": "0.9.0",
+            "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.9.0.tgz",
+            "integrity": "sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==",
+            "license": "MIT"
+        },
+        "node_modules/@emotion/babel-plugin/node_modules/convert-source-map": {
+            "version": "1.9.0",
+            "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.9.0.tgz",
+            "integrity": "sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==",
+            "license": "MIT"
+        },
+        "node_modules/@emotion/cache": {
+            "version": "11.14.0",
+            "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.14.0.tgz",
+            "integrity": "sha512-L/B1lc/TViYk4DcpGxtAVbx0ZyiKM5ktoIyafGkH6zg/tj+mA+NE//aPYKG0k8kCHSHVJrpLpcAlOBEXQ3SavA==",
+            "license": "MIT",
+            "dependencies": {
+                "@emotion/memoize": "^0.9.0",
+                "@emotion/sheet": "^1.4.0",
+                "@emotion/utils": "^1.4.2",
+                "@emotion/weak-memoize": "^0.4.0",
+                "stylis": "4.2.0"
+            }
+        },
+        "node_modules/@emotion/cache/node_modules/@emotion/memoize": {
+            "version": "0.9.0",
+            "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.9.0.tgz",
+            "integrity": "sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==",
+            "license": "MIT"
+        },
+        "node_modules/@emotion/hash": {
+            "version": "0.9.2",
+            "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.2.tgz",
+            "integrity": "sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g==",
+            "license": "MIT"
+        },
         "node_modules/@emotion/is-prop-valid": {
             "version": "0.8.8",
             "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz",
@@ -358,6 +416,120 @@
             "license": "MIT",
             "optional": true
         },
+        "node_modules/@emotion/react": {
+            "version": "11.14.0",
+            "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.14.0.tgz",
+            "integrity": "sha512-O000MLDBDdk/EohJPFUqvnp4qnHeYkVP5B0xEG0D/L7cOKP9kefu2DXn8dj74cQfsEzUqh+sr1RzFqiL1o+PpA==",
+            "license": "MIT",
+            "dependencies": {
+                "@babel/runtime": "^7.18.3",
+                "@emotion/babel-plugin": "^11.13.5",
+                "@emotion/cache": "^11.14.0",
+                "@emotion/serialize": "^1.3.3",
+                "@emotion/use-insertion-effect-with-fallbacks": "^1.2.0",
+                "@emotion/utils": "^1.4.2",
+                "@emotion/weak-memoize": "^0.4.0",
+                "hoist-non-react-statics": "^3.3.1"
+            },
+            "peerDependencies": {
+                "react": ">=16.8.0"
+            },
+            "peerDependenciesMeta": {
+                "@types/react": {
+                    "optional": true
+                }
+            }
+        },
+        "node_modules/@emotion/serialize": {
+            "version": "1.3.3",
+            "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.3.3.tgz",
+            "integrity": "sha512-EISGqt7sSNWHGI76hC7x1CksiXPahbxEOrC5RjmFRJTqLyEK9/9hZvBbiYn70dw4wuwMKiEMCUlR6ZXTSWQqxA==",
+            "license": "MIT",
+            "dependencies": {
+                "@emotion/hash": "^0.9.2",
+                "@emotion/memoize": "^0.9.0",
+                "@emotion/unitless": "^0.10.0",
+                "@emotion/utils": "^1.4.2",
+                "csstype": "^3.0.2"
+            }
+        },
+        "node_modules/@emotion/serialize/node_modules/@emotion/memoize": {
+            "version": "0.9.0",
+            "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.9.0.tgz",
+            "integrity": "sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==",
+            "license": "MIT"
+        },
+        "node_modules/@emotion/sheet": {
+            "version": "1.4.0",
+            "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.4.0.tgz",
+            "integrity": "sha512-fTBW9/8r2w3dXWYM4HCB1Rdp8NLibOw2+XELH5m5+AkWiL/KqYX6dc0kKYlaYyKjrQ6ds33MCdMPEwgs2z1rqg==",
+            "license": "MIT"
+        },
+        "node_modules/@emotion/styled": {
+            "version": "11.14.1",
+            "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.14.1.tgz",
+            "integrity": "sha512-qEEJt42DuToa3gurlH4Qqc1kVpNq8wO8cJtDzU46TjlzWjDlsVyevtYCRijVq3SrHsROS+gVQ8Fnea108GnKzw==",
+            "license": "MIT",
+            "dependencies": {
+                "@babel/runtime": "^7.18.3",
+                "@emotion/babel-plugin": "^11.13.5",
+                "@emotion/is-prop-valid": "^1.3.0",
+                "@emotion/serialize": "^1.3.3",
+                "@emotion/use-insertion-effect-with-fallbacks": "^1.2.0",
+                "@emotion/utils": "^1.4.2"
+            },
+            "peerDependencies": {
+                "@emotion/react": "^11.0.0-rc.0",
+                "react": ">=16.8.0"
+            },
+            "peerDependenciesMeta": {
+                "@types/react": {
+                    "optional": true
+                }
+            }
+        },
+        "node_modules/@emotion/styled/node_modules/@emotion/is-prop-valid": {
+            "version": "1.4.0",
+            "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.4.0.tgz",
+            "integrity": "sha512-QgD4fyscGcbbKwJmqNvUMSE02OsHUa+lAWKdEUIJKgqe5IwRSKd7+KhibEWdaKwgjLj0DRSHA9biAIqGBk05lw==",
+            "license": "MIT",
+            "dependencies": {
+                "@emotion/memoize": "^0.9.0"
+            }
+        },
+        "node_modules/@emotion/styled/node_modules/@emotion/memoize": {
+            "version": "0.9.0",
+            "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.9.0.tgz",
+            "integrity": "sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==",
+            "license": "MIT"
+        },
+        "node_modules/@emotion/unitless": {
+            "version": "0.10.0",
+            "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.10.0.tgz",
+            "integrity": "sha512-dFoMUuQA20zvtVTuxZww6OHoJYgrzfKM1t52mVySDJnMSEa08ruEvdYQbhvyu6soU+NeLVd3yKfTfT0NeV6qGg==",
+            "license": "MIT"
+        },
+        "node_modules/@emotion/use-insertion-effect-with-fallbacks": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.2.0.tgz",
+            "integrity": "sha512-yJMtVdH59sxi/aVJBpk9FQq+OR8ll5GT8oWd57UpeaKEVGab41JWaCFA7FRLoMLloOZF/c/wsPoe+bfGmRKgDg==",
+            "license": "MIT",
+            "peerDependencies": {
+                "react": ">=16.8.0"
+            }
+        },
+        "node_modules/@emotion/utils": {
+            "version": "1.4.2",
+            "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.4.2.tgz",
+            "integrity": "sha512-3vLclRofFziIa3J2wDh9jjbkUz9qk5Vi3IZ/FSTKViB0k+ef0fPV7dYrUIugbgupYDx7v9ud/SjrtEP8Y4xLoA==",
+            "license": "MIT"
+        },
+        "node_modules/@emotion/weak-memoize": {
+            "version": "0.4.0",
+            "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.4.0.tgz",
+            "integrity": "sha512-snKqtPW01tN0ui7yu9rGv69aJXr/a/Ywvl11sUjNtEcRc+ng/mQriFL0wLXMef74iHa/EkftbDzU9F8iFbH+zg==",
+            "license": "MIT"
+        },
         "node_modules/@esbuild/android-arm": {
             "version": "0.18.20",
             "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.18.20.tgz",
@@ -897,7 +1069,6 @@
             "version": "0.3.8",
             "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.8.tgz",
             "integrity": "sha512-imAbBGkb+ebQyxKgzv5Hu2nmROxoDOXHh80evxdoXNOrvAnVx7zimzc1Oo5h9RlfV4vPXaE2iM5pOFbvOCClWA==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "@jridgewell/set-array": "^1.2.1",
@@ -912,7 +1083,6 @@
             "version": "3.1.2",
             "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
             "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">=6.0.0"
@@ -922,7 +1092,6 @@
             "version": "1.2.1",
             "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz",
             "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">=6.0.0"
@@ -932,20 +1101,225 @@
             "version": "1.5.0",
             "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz",
             "integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==",
-            "dev": true,
             "license": "MIT"
         },
         "node_modules/@jridgewell/trace-mapping": {
             "version": "0.3.25",
             "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz",
             "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "@jridgewell/resolve-uri": "^3.1.0",
                 "@jridgewell/sourcemap-codec": "^1.4.14"
             }
         },
+        "node_modules/@mui/core-downloads-tracker": {
+            "version": "7.3.7",
+            "resolved": "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-7.3.7.tgz",
+            "integrity": "sha512-8jWwS6FweMkpyRkrJooamUGe1CQfO1yJ+lM43IyUJbrhHW/ObES+6ry4vfGi8EKaldHL3t3BG1bcLcERuJPcjg==",
+            "license": "MIT",
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/mui-org"
+            }
+        },
+        "node_modules/@mui/material": {
+            "version": "7.3.7",
+            "resolved": "https://registry.npmjs.org/@mui/material/-/material-7.3.7.tgz",
+            "integrity": "sha512-6bdIxqzeOtBAj2wAsfhWCYyMKPLkRO9u/2o5yexcL0C3APqyy91iGSWgT3H7hg+zR2XgE61+WAu12wXPON8b6A==",
+            "license": "MIT",
+            "dependencies": {
+                "@babel/runtime": "^7.28.4",
+                "@mui/core-downloads-tracker": "^7.3.7",
+                "@mui/system": "^7.3.7",
+                "@mui/types": "^7.4.10",
+                "@mui/utils": "^7.3.7",
+                "@popperjs/core": "^2.11.8",
+                "@types/react-transition-group": "^4.4.12",
+                "clsx": "^2.1.1",
+                "csstype": "^3.2.3",
+                "prop-types": "^15.8.1",
+                "react-is": "^19.2.3",
+                "react-transition-group": "^4.4.5"
+            },
+            "engines": {
+                "node": ">=14.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/mui-org"
+            },
+            "peerDependencies": {
+                "@emotion/react": "^11.5.0",
+                "@emotion/styled": "^11.3.0",
+                "@mui/material-pigment-css": "^7.3.7",
+                "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0",
+                "react": "^17.0.0 || ^18.0.0 || ^19.0.0",
+                "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
+            },
+            "peerDependenciesMeta": {
+                "@emotion/react": {
+                    "optional": true
+                },
+                "@emotion/styled": {
+                    "optional": true
+                },
+                "@mui/material-pigment-css": {
+                    "optional": true
+                },
+                "@types/react": {
+                    "optional": true
+                }
+            }
+        },
+        "node_modules/@mui/private-theming": {
+            "version": "7.3.7",
+            "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-7.3.7.tgz",
+            "integrity": "sha512-w7r1+CYhG0syCAQUWAuV5zSaU2/67WA9JXUderdb7DzCIJdp/5RmJv6L85wRjgKCMsxFF0Kfn0kPgPbPgw/jdw==",
+            "license": "MIT",
+            "dependencies": {
+                "@babel/runtime": "^7.28.4",
+                "@mui/utils": "^7.3.7",
+                "prop-types": "^15.8.1"
+            },
+            "engines": {
+                "node": ">=14.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/mui-org"
+            },
+            "peerDependencies": {
+                "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0",
+                "react": "^17.0.0 || ^18.0.0 || ^19.0.0"
+            },
+            "peerDependenciesMeta": {
+                "@types/react": {
+                    "optional": true
+                }
+            }
+        },
+        "node_modules/@mui/styled-engine": {
+            "version": "7.3.7",
+            "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-7.3.7.tgz",
+            "integrity": "sha512-y/QkNXv6cF6dZ5APztd/dFWfQ6LHKPx3skyYO38YhQD4+Cxd6sFAL3Z38WMSSC8LQz145Mpp3CcLrSCLKPwYAg==",
+            "license": "MIT",
+            "dependencies": {
+                "@babel/runtime": "^7.28.4",
+                "@emotion/cache": "^11.14.0",
+                "@emotion/serialize": "^1.3.3",
+                "@emotion/sheet": "^1.4.0",
+                "csstype": "^3.2.3",
+                "prop-types": "^15.8.1"
+            },
+            "engines": {
+                "node": ">=14.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/mui-org"
+            },
+            "peerDependencies": {
+                "@emotion/react": "^11.4.1",
+                "@emotion/styled": "^11.3.0",
+                "react": "^17.0.0 || ^18.0.0 || ^19.0.0"
+            },
+            "peerDependenciesMeta": {
+                "@emotion/react": {
+                    "optional": true
+                },
+                "@emotion/styled": {
+                    "optional": true
+                }
+            }
+        },
+        "node_modules/@mui/system": {
+            "version": "7.3.7",
+            "resolved": "https://registry.npmjs.org/@mui/system/-/system-7.3.7.tgz",
+            "integrity": "sha512-DovL3k+FBRKnhmatzUMyO5bKkhMLlQ9L7Qw5qHrre3m8zCZmE+31NDVBFfqrbrA7sq681qaEIHdkWD5nmiAjyQ==",
+            "license": "MIT",
+            "dependencies": {
+                "@babel/runtime": "^7.28.4",
+                "@mui/private-theming": "^7.3.7",
+                "@mui/styled-engine": "^7.3.7",
+                "@mui/types": "^7.4.10",
+                "@mui/utils": "^7.3.7",
+                "clsx": "^2.1.1",
+                "csstype": "^3.2.3",
+                "prop-types": "^15.8.1"
+            },
+            "engines": {
+                "node": ">=14.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/mui-org"
+            },
+            "peerDependencies": {
+                "@emotion/react": "^11.5.0",
+                "@emotion/styled": "^11.3.0",
+                "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0",
+                "react": "^17.0.0 || ^18.0.0 || ^19.0.0"
+            },
+            "peerDependenciesMeta": {
+                "@emotion/react": {
+                    "optional": true
+                },
+                "@emotion/styled": {
+                    "optional": true
+                },
+                "@types/react": {
+                    "optional": true
+                }
+            }
+        },
+        "node_modules/@mui/types": {
+            "version": "7.4.10",
+            "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.4.10.tgz",
+            "integrity": "sha512-0+4mSjknSu218GW3isRqoxKRTOrTLd/vHi/7UC4+wZcUrOAqD9kRk7UQRL1mcrzqRoe7s3UT6rsRpbLkW5mHpQ==",
+            "license": "MIT",
+            "dependencies": {
+                "@babel/runtime": "^7.28.4"
+            },
+            "peerDependencies": {
+                "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0"
+            },
+            "peerDependenciesMeta": {
+                "@types/react": {
+                    "optional": true
+                }
+            }
+        },
+        "node_modules/@mui/utils": {
+            "version": "7.3.7",
+            "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-7.3.7.tgz",
+            "integrity": "sha512-+YjnjMRnyeTkWnspzoxRdiSOgkrcpTikhNPoxOZW0APXx+urHtUoXJ9lbtCZRCA5a4dg5gSbd19alL1DvRs5fg==",
+            "license": "MIT",
+            "dependencies": {
+                "@babel/runtime": "^7.28.4",
+                "@mui/types": "^7.4.10",
+                "@types/prop-types": "^15.7.15",
+                "clsx": "^2.1.1",
+                "prop-types": "^15.8.1",
+                "react-is": "^19.2.3"
+            },
+            "engines": {
+                "node": ">=14.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/mui-org"
+            },
+            "peerDependencies": {
+                "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0",
+                "react": "^17.0.0 || ^18.0.0 || ^19.0.0"
+            },
+            "peerDependenciesMeta": {
+                "@types/react": {
+                    "optional": true
+                }
+            }
+        },
         "node_modules/@nodelib/fs.scandir": {
             "version": "2.1.5",
             "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -995,6 +1369,16 @@
                 "node": ">=14"
             }
         },
+        "node_modules/@popperjs/core": {
+            "version": "2.11.8",
+            "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz",
+            "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==",
+            "license": "MIT",
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/popperjs"
+            }
+        },
         "node_modules/@studio-freight/lenis": {
             "version": "1.0.42",
             "resolved": "https://registry.npmjs.org/@studio-freight/lenis/-/lenis-1.0.42.tgz",
@@ -1060,18 +1444,22 @@
             "dev": true,
             "license": "MIT"
         },
+        "node_modules/@types/parse-json": {
+            "version": "4.0.2",
+            "resolved": "https://registry.npmjs.org/@types/parse-json/-/parse-json-4.0.2.tgz",
+            "integrity": "sha512-dISoDXWWQwUquiKsyZ4Ng+HX2KsPL7LyHKHQwgGFEA3IaKac4Obd+h2a/a6waisAoepJlBcx9paWqjA8/HVjCw==",
+            "license": "MIT"
+        },
         "node_modules/@types/prop-types": {
-            "version": "15.7.14",
-            "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.14.tgz",
-            "integrity": "sha512-gNMvNH49DJ7OJYv+KAKn0Xp45p8PLl6zo2YnvDIbTd4J6MER2BmWN49TG7n9LvkyihINxeKW8+3bfS2yDC9dzQ==",
-            "dev": true,
+            "version": "15.7.15",
+            "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.15.tgz",
+            "integrity": "sha512-F6bEyamV9jKGAFBEmlQnesRPGOQqS2+Uwi0Em15xenOxHaf2hv6L8YCVn3rPdPJOiJfPiCnLIRyvwVaqMY3MIw==",
             "license": "MIT"
         },
         "node_modules/@types/react": {
             "version": "18.3.20",
             "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.20.tgz",
             "integrity": "sha512-IPaCZN7PShZK/3t6Q87pfTkRm6oLTd4vztyoj+cbHUF1g3FfVb2tFIL79uCRKEfv16AhqDMBywP2VW3KIZUvcg==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "@types/prop-types": "*",
@@ -1088,6 +1476,15 @@
                 "@types/react": "^18.0.0"
             }
         },
+        "node_modules/@types/react-transition-group": {
+            "version": "4.4.12",
+            "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.12.tgz",
+            "integrity": "sha512-8TV6R3h2j7a91c+1DXdJi3Syo69zzIZbz7Lg5tORM5LEJG7X/E6a1V3drRyBRZq7/utz7A+c4OgYLiLcYGHG6w==",
+            "license": "MIT",
+            "peerDependencies": {
+                "@types/react": "*"
+            }
+        },
         "node_modules/@types/semver": {
             "version": "7.7.0",
             "resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.7.0.tgz",
@@ -1848,6 +2245,21 @@
                 "postcss": "^8.1.0"
             }
         },
+        "node_modules/babel-plugin-macros": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-3.1.0.tgz",
+            "integrity": "sha512-Cg7TFGpIr01vOQNODXOOaGz2NpCU5gl8x1qJFbb6hbZxR7XrcE2vtbAsTAbJ7/xwJtUuJEw8K8Zr/AE0LHlesg==",
+            "license": "MIT",
+            "dependencies": {
+                "@babel/runtime": "^7.12.5",
+                "cosmiconfig": "^7.0.0",
+                "resolve": "^1.19.0"
+            },
+            "engines": {
+                "node": ">=10",
+                "npm": ">=6"
+            }
+        },
         "node_modules/balanced-match": {
             "version": "1.0.2",
             "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
@@ -1929,7 +2341,6 @@
             "version": "3.1.0",
             "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
             "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">=6"
@@ -2021,6 +2432,15 @@
                 "node": ">= 6"
             }
         },
+        "node_modules/clsx": {
+            "version": "2.1.1",
+            "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz",
+            "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==",
+            "license": "MIT",
+            "engines": {
+                "node": ">=6"
+            }
+        },
         "node_modules/color-convert": {
             "version": "2.0.1",
             "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
@@ -2074,6 +2494,31 @@
                 "node": ">=18"
             }
         },
+        "node_modules/cosmiconfig": {
+            "version": "7.1.0",
+            "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-7.1.0.tgz",
+            "integrity": "sha512-AdmX6xUzdNASswsFtmwSt7Vj8po9IuqXm0UXz7QKPuEUmPB4XyjGfaAr2PSuELMwkRMVH1EpIkX5bTZGRB3eCA==",
+            "license": "MIT",
+            "dependencies": {
+                "@types/parse-json": "^4.0.0",
+                "import-fresh": "^3.2.1",
+                "parse-json": "^5.0.0",
+                "path-type": "^4.0.0",
+                "yaml": "^1.10.0"
+            },
+            "engines": {
+                "node": ">=10"
+            }
+        },
+        "node_modules/cosmiconfig/node_modules/yaml": {
+            "version": "1.10.2",
+            "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz",
+            "integrity": "sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==",
+            "license": "ISC",
+            "engines": {
+                "node": ">= 6"
+            }
+        },
         "node_modules/cross-spawn": {
             "version": "7.0.6",
             "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
@@ -2103,16 +2548,15 @@
             }
         },
         "node_modules/csstype": {
-            "version": "3.1.3",
-            "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
-            "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
+            "version": "3.2.3",
+            "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.2.3.tgz",
+            "integrity": "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==",
             "license": "MIT"
         },
         "node_modules/debug": {
             "version": "4.4.0",
             "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.0.tgz",
             "integrity": "sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "ms": "^2.1.3"
@@ -2173,6 +2617,16 @@
                 "node": ">=6.0.0"
             }
         },
+        "node_modules/dom-helpers": {
+            "version": "5.2.1",
+            "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz",
+            "integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==",
+            "license": "MIT",
+            "dependencies": {
+                "@babel/runtime": "^7.8.7",
+                "csstype": "^3.0.2"
+            }
+        },
         "node_modules/eastasianwidth": {
             "version": "0.2.0",
             "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
@@ -2194,6 +2648,15 @@
             "dev": true,
             "license": "MIT"
         },
+        "node_modules/error-ex": {
+            "version": "1.3.4",
+            "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.4.tgz",
+            "integrity": "sha512-sqQamAnR14VgCr1A618A3sGrygcpK+HEbenA/HiEAkkUwcZIIB/tgWqHFxWgOyDh4nB4JCRimh79dR5Ywc9MDQ==",
+            "license": "MIT",
+            "dependencies": {
+                "is-arrayish": "^0.2.1"
+            }
+        },
         "node_modules/esbuild": {
             "version": "0.18.20",
             "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.18.20.tgz",
@@ -2246,7 +2709,6 @@
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz",
             "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">=10"
@@ -2529,6 +2991,12 @@
                 "node": ">=8"
             }
         },
+        "node_modules/find-root": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz",
+            "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==",
+            "license": "MIT"
+        },
         "node_modules/find-up": {
             "version": "5.0.0",
             "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz",
@@ -2649,7 +3117,6 @@
             "version": "1.1.2",
             "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
             "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
-            "dev": true,
             "license": "MIT",
             "funding": {
                 "url": "https://github.com/sponsors/ljharb"
@@ -2767,7 +3234,6 @@
             "version": "2.0.2",
             "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
             "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "function-bind": "^1.1.2"
@@ -2776,6 +3242,21 @@
                 "node": ">= 0.4"
             }
         },
+        "node_modules/hoist-non-react-statics": {
+            "version": "3.3.2",
+            "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
+            "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
+            "license": "BSD-3-Clause",
+            "dependencies": {
+                "react-is": "^16.7.0"
+            }
+        },
+        "node_modules/hoist-non-react-statics/node_modules/react-is": {
+            "version": "16.13.1",
+            "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
+            "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
+            "license": "MIT"
+        },
         "node_modules/ignore": {
             "version": "5.3.2",
             "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
@@ -2790,7 +3271,6 @@
             "version": "3.3.1",
             "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz",
             "integrity": "sha512-TR3KfrTZTYLPB6jUjfx6MF9WcWrHL9su5TObK4ZkYgBdWKPOFoSoQIdEuTuR82pmtxH2spWG9h6etwfr1pLBqQ==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "parent-module": "^1.0.0",
@@ -2832,6 +3312,12 @@
             "dev": true,
             "license": "ISC"
         },
+        "node_modules/is-arrayish": {
+            "version": "0.2.1",
+            "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
+            "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==",
+            "license": "MIT"
+        },
         "node_modules/is-binary-path": {
             "version": "2.1.0",
             "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
@@ -2849,7 +3335,6 @@
             "version": "2.16.1",
             "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.16.1.tgz",
             "integrity": "sha512-UfoeMA6fIJ8wTYFEUjelnaGI67v6+N7qXJEvQuIGa99l4xsCruSYOVSQ0uPANn4dAzm8lkYPaKLrrijLq7x23w==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "hasown": "^2.0.2"
@@ -2970,7 +3455,6 @@
             "version": "3.1.0",
             "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.1.0.tgz",
             "integrity": "sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==",
-            "dev": true,
             "license": "MIT",
             "bin": {
                 "jsesc": "bin/jsesc"
@@ -2986,6 +3470,12 @@
             "dev": true,
             "license": "MIT"
         },
+        "node_modules/json-parse-even-better-errors": {
+            "version": "2.3.1",
+            "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
+            "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==",
+            "license": "MIT"
+        },
         "node_modules/json-schema-traverse": {
             "version": "0.4.1",
             "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
@@ -3054,7 +3544,6 @@
             "version": "1.2.4",
             "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
             "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==",
-            "dev": true,
             "license": "MIT"
         },
         "node_modules/locate-path": {
@@ -3162,7 +3651,6 @@
             "version": "2.1.3",
             "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
             "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
-            "dev": true,
             "license": "MIT"
         },
         "node_modules/mz": {
@@ -3234,7 +3722,6 @@
             "version": "4.1.1",
             "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
             "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">=0.10.0"
@@ -3321,7 +3808,6 @@
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
             "integrity": "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "callsites": "^3.0.0"
@@ -3330,6 +3816,24 @@
                 "node": ">=6"
             }
         },
+        "node_modules/parse-json": {
+            "version": "5.2.0",
+            "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz",
+            "integrity": "sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==",
+            "license": "MIT",
+            "dependencies": {
+                "@babel/code-frame": "^7.0.0",
+                "error-ex": "^1.3.1",
+                "json-parse-even-better-errors": "^2.3.0",
+                "lines-and-columns": "^1.1.6"
+            },
+            "engines": {
+                "node": ">=8"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/sindresorhus"
+            }
+        },
         "node_modules/path-exists": {
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -3364,7 +3868,6 @@
             "version": "1.0.7",
             "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
             "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
-            "dev": true,
             "license": "MIT"
         },
         "node_modules/path-scurry": {
@@ -3395,7 +3898,6 @@
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
             "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">=8"
@@ -3405,7 +3907,6 @@
             "version": "1.1.1",
             "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
             "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
-            "dev": true,
             "license": "ISC"
         },
         "node_modules/picomatch": {
@@ -3601,6 +4102,23 @@
                 "node": ">= 0.8.0"
             }
         },
+        "node_modules/prop-types": {
+            "version": "15.8.1",
+            "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
+            "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
+            "license": "MIT",
+            "dependencies": {
+                "loose-envify": "^1.4.0",
+                "object-assign": "^4.1.1",
+                "react-is": "^16.13.1"
+            }
+        },
+        "node_modules/prop-types/node_modules/react-is": {
+            "version": "16.13.1",
+            "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
+            "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
+            "license": "MIT"
+        },
         "node_modules/punycode": {
             "version": "2.3.1",
             "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
@@ -3674,6 +4192,12 @@
                 "react-dom": ">=16"
             }
         },
+        "node_modules/react-is": {
+            "version": "19.2.3",
+            "resolved": "https://registry.npmjs.org/react-is/-/react-is-19.2.3.tgz",
+            "integrity": "sha512-qJNJfu81ByyabuG7hPFEbXqNcWSU3+eVus+KJs+0ncpGfMyYdvSmxiJxbWR65lYi1I+/0HBcliO029gc4F+PnA==",
+            "license": "MIT"
+        },
         "node_modules/react-refresh": {
             "version": "0.14.2",
             "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.2.tgz",
@@ -3724,6 +4248,22 @@
                 "react-dom": ">=18"
             }
         },
+        "node_modules/react-transition-group": {
+            "version": "4.4.5",
+            "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz",
+            "integrity": "sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==",
+            "license": "BSD-3-Clause",
+            "dependencies": {
+                "@babel/runtime": "^7.5.5",
+                "dom-helpers": "^5.0.1",
+                "loose-envify": "^1.4.0",
+                "prop-types": "^15.6.2"
+            },
+            "peerDependencies": {
+                "react": ">=16.6.0",
+                "react-dom": ">=16.6.0"
+            }
+        },
         "node_modules/read-cache": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
@@ -3751,7 +4291,6 @@
             "version": "1.22.10",
             "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.10.tgz",
             "integrity": "sha512-NPRy+/ncIMeDlTAsuqwKIiferiawhefFJtkNSW0qZJEqMEb+qBt/77B/jGeeek+F0uOeN05CDa6HXbbIgtVX4w==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "is-core-module": "^2.16.0",
@@ -3772,7 +4311,6 @@
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
             "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">=4"
@@ -3918,6 +4456,15 @@
                 "node": ">=8"
             }
         },
+        "node_modules/source-map": {
+            "version": "0.5.7",
+            "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+            "integrity": "sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==",
+            "license": "BSD-3-Clause",
+            "engines": {
+                "node": ">=0.10.0"
+            }
+        },
         "node_modules/source-map-js": {
             "version": "1.2.1",
             "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
@@ -4038,6 +4585,12 @@
                 "url": "https://github.com/sponsors/sindresorhus"
             }
         },
+        "node_modules/stylis": {
+            "version": "4.2.0",
+            "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.2.0.tgz",
+            "integrity": "sha512-Orov6g6BB1sDfYgzWfTHDOxamtX1bE/zo104Dh9e6fqJ3PooipYyfJ0pUmrZO2wAvO8YbEyeFrkV91XTsGMSrw==",
+            "license": "MIT"
+        },
         "node_modules/sucrase": {
             "version": "3.35.0",
             "resolved": "https://registry.npmjs.org/sucrase/-/sucrase-3.35.0.tgz",
@@ -4125,7 +4678,6 @@
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz",
             "integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">= 0.4"
diff --git a/landing/package.json b/landing/package.json
index 239c29b0..b5cb0156 100644
--- a/landing/package.json
+++ b/landing/package.json
@@ -10,6 +10,9 @@
         "preview": "vite preview"
     },
     "dependencies": {
+        "@emotion/react": "^11.14.0",
+        "@emotion/styled": "^11.14.1",
+        "@mui/material": "^7.3.7",
         "@studio-freight/lenis": "^1.0.42",
         "framer-motion": "^10.16.4",
         "lucide-react": "^0.344.0",
diff --git a/landing/src/components/layout/Footer.tsx b/landing/src/components/layout/Footer.tsx
index 4d54c4d1..13e92b8e 100644
--- a/landing/src/components/layout/Footer.tsx
+++ b/landing/src/components/layout/Footer.tsx
@@ -1,5 +1,6 @@
 import React from 'react';
-import { Github, Twitter, Linkedin } from 'lucide-react';
+import { motion } from 'framer-motion';
+import { Github, Twitter, Linkedin, Mail, ArrowUp } from 'lucide-react';
 import { useLocation, Link } from 'react-router-dom';
 
 const Footer: React.FC = () => {
@@ -7,68 +8,157 @@ const Footer: React.FC = () => {
     const location = useLocation();
     const isHomePage = location.pathname === '/';
 
+    const scrollToTop = () => {
+        window.scrollTo({ top: 0, behavior: 'smooth' });
+    };
+
+    const containerVariants = {
+        hidden: { opacity: 0 },
+        visible: {
+            opacity: 1,
+            transition: {
+                staggerChildren: 0.1,
+                delayChildren: 0.2,
+            },
+        },
+    };
+
+    const itemVariants = {
+        hidden: { opacity: 0, y: 20 },
+        visible: { opacity: 1, y: 0 },
+    };
+
+    const socialLinks = [
+        {
+            icon: Github,
+            href: 'https://github.com/AOSSIE-Org/Devr.AI/',
+            label: 'GitHub',
+            color: 'hover:text-green-400'
+        },
+        {
+            icon: Twitter,
+            href: 'https://x.com/aossie_org?lang=en',
+            label: 'Twitter',
+            color: 'hover:text-cyan-400'
+        },
+        {
+            icon: Linkedin,
+            href: 'https://www.linkedin.com/company/aossie/?originalSubdomain=au',
+            label: 'LinkedIn',
+            color: 'hover:text-green-400'
+        },
+    ];
+
     return (
-        <footer className="relative bg-gradient-to-br from-dark via-dark-lighter to-gray-900 py-12 overflow-hidden">
-            {/* Background gradient overlays */}
+        <footer className="relative bg-gradient-to-br from-dark via-dark-lighter to-gray-900 py-16 overflow-hidden border-t border-gray-800">
+            {/* Enhanced Background Effects */}
             <div className="absolute inset-0 pointer-events-none">
-                <div className="absolute top-0 left-0 w-96 h-96 rounded-full bg-green-500/5 blur-2xl -translate-x-1/2 -translate-y-1/2"></div>
-                <div className="absolute bottom-0 right-0 w-96 h-96 rounded-full bg-blue-500/4 blur-3xl translate-x-1/2 translate-y-1/2"></div>
-                <div className="absolute inset-0 bg-gradient-to-t from-transparent via-green-500/5 to-transparent opacity-50"></div>
+                <div className="absolute top-0 left-0 w-96 h-96 rounded-full bg-green-500/5 blur-3xl -translate-x-1/2 -translate-y-1/2"></div>
+                <div className="absolute bottom-0 right-0 w-96 h-96 rounded-full bg-cyan-500/5 blur-3xl translate-x-1/2 translate-y-1/2"></div>
+                <div className="absolute inset-0 bg-grid-pattern opacity-20"></div>
             </div>
 
             <div className="container mx-auto px-6 relative z-10">
-                <div className="flex flex-col md:flex-row justify-between items-start mb-8">
-                    <div className="mb-6 md:mb-0">
-                        <h3 className="text-2xl font-bold gradient-text mb-2">Devr.AI</h3>
-                        <p className="text-gray-300 text-sm max-w-xs leading-relaxed">
+                <motion.div
+                    variants={containerVariants}
+                    initial="hidden"
+                    whileInView="visible"
+                    viewport={{ once: true }}
+                    className="grid grid-cols-1 md:grid-cols-4 gap-12 mb-12"
+                >
+                    {/* Brand Section */}
+                    <motion.div variants={itemVariants} className="md:col-span-2">
+                        <h3 className="text-3xl font-bold gradient-text mb-4">Devr.AI</h3>
+                        <p className="text-gray-400 text-base max-w-md leading-relaxed mb-6">
                             Revolutionizing developer relations with AI-powered community management.
+                            Automate engagement, streamline onboarding, and deliver real-time updates.
                         </p>
-                    </div>
-                    <div className="flex flex-row gap-12">
-                        <div>
-                            <h4 className="font-semibold mb-4 text-white bg-gradient-to-r from-green-400 to-blue-500 bg-clip-text text-transparent">Links</h4>
-                            <ul className="space-y-3">
-                                <li><a href={isHomePage ? "#features" : "/#features"} className="text-gray-300 hover:text-transparent hover:bg-gradient-to-r hover:from-green-400 hover:to-blue-500 hover:bg-clip-text text-sm transition-all duration-300 ease-in-out">Features</a></li>
-                                <li><a href={isHomePage ? "#how-it-works" : "/#how-it-works"} className="text-gray-300 hover:text-transparent hover:bg-gradient-to-r hover:from-green-400 hover:to-blue-500 hover:bg-clip-text text-sm transition-all duration-300 ease-in-out">How It Works</a></li>
-                                <li><a href={isHomePage ? "#integrations" : "/#integrations"} className="text-gray-300 hover:text-transparent hover:bg-gradient-to-r hover:from-green-400 hover:to-blue-500 hover:bg-clip-text text-sm transition-all duration-300 ease-in-out">Integrations</a></li>
-                                <li><a href={isHomePage ? "#waitlist" : "/#waitlist"} className="text-gray-300 hover:text-transparent hover:bg-gradient-to-r hover:from-green-400 hover:to-blue-500 hover:bg-clip-text text-sm transition-all duration-300 ease-in-out">Join Waitlist</a></li>
-                            </ul>
+                        <div className="flex gap-4">
+                            {socialLinks.map((social) => (
+                                <motion.a
+                                    key={social.label}
+                                    href={social.href}
+                                    target="_blank"
+                                    rel="noreferrer"
+                                    className={`text-gray-400 ${social.color} transition-colors duration-300 p-3 rounded-xl bg-gray-800/50 hover:bg-gray-800 border border-gray-700 hover:border-gray-600`}
+                                    whileHover={{ scale: 1.1, y: -2 }}
+                                    whileTap={{ scale: 0.95 }}
+                                    aria-label={social.label}
+                                >
+                                    <social.icon size={20} />
+                                </motion.a>
+                            ))}
                         </div>
-                        <div>
-                            <h4 className="font-semibold mb-4 text-white bg-gradient-to-r from-green-400 to-blue-500 bg-clip-text text-transparent">Legal</h4>
-                            <ul className="space-y-3">
-                                <li><Link to="/privacy-policy" className="text-gray-300 hover:text-transparent hover:bg-gradient-to-r hover:from-green-400 hover:to-blue-500 hover:bg-clip-text text-sm transition-all duration-300 ease-in-out">Privacy Policy</Link></li>
-                                <li><Link to="/terms-of-service" className="text-gray-300 hover:text-transparent hover:bg-gradient-to-r hover:from-green-400 hover:to-blue-500 hover:bg-clip-text text-sm transition-all duration-300 ease-in-out">Terms of Service</Link></li>
-                            </ul>
-                        </div>
-                    </div>
-                </div>
+                    </motion.div>
+
+                    {/* Links Section */}
+                    <motion.div variants={itemVariants}>
+                        <h4 className="font-bold mb-4 text-white text-lg">Quick Links</h4>
+                        <ul className="space-y-3">
+                            {[
+                                { label: 'Features', href: '#features' },
+                                { label: 'How It Works', href: '#how-it-works' },
+                                { label: 'Integrations', href: '#integrations' },
+                                { label: 'Join Waitlist', href: '#waitlist' },
+                            ].map((link) => (
+                                <li key={link.label}>
+                                    <a
+                                        href={isHomePage ? link.href : `/${link.href}`}
+                                        className="text-gray-400 hover:text-green-400 text-sm transition-colors duration-300 inline-flex items-center gap-2 group"
+                                    >
+                                        <span className="w-0 h-0.5 bg-gradient-to-r from-green-400 to-cyan-400 group-hover:w-4 transition-all duration-300"></span>
+                                        {link.label}
+                                    </a>
+                                </li>
+                            ))}
+                        </ul>
+                    </motion.div>
 
-                <div className="border-t border-gradient-to-r from-green-500/20 via-blue-500/20 to-green-500/20 pt-8 flex flex-col md:flex-row justify-between items-center" style={{borderImage: 'linear-gradient(90deg, rgba(34, 197, 94, 0.2), rgba(59, 130, 246, 0.2), rgba(34, 197, 94, 0.2)) 1'}}>
-                    <p className="text-gray-400 text-sm mb-4 md:mb-0">
-                        &copy; {currentYear} Devr.AI. All rights reserved.
+                    {/* Legal Section */}
+                    <motion.div variants={itemVariants}>
+                        <h4 className="font-bold mb-4 text-white text-lg">Legal</h4>
+                        <ul className="space-y-3">
+                            {[
+                                { label: 'Privacy Policy', to: '/privacy-policy' },
+                                { label: 'Terms of Service', to: '/terms-of-service' },
+                            ].map((link) => (
+                                <li key={link.label}>
+                                    <Link
+                                        to={link.to}
+                                        className="text-gray-400 hover:text-cyan-400 text-sm transition-colors duration-300 inline-flex items-center gap-2 group"
+                                    >
+                                        <span className="w-0 h-0.5 bg-gradient-to-r from-cyan-400 to-green-400 group-hover:w-4 transition-all duration-300"></span>
+                                        {link.label}
+                                    </Link>
+                                </li>
+                            ))}
+                        </ul>
+                    </motion.div>
+                </motion.div>
+
+                {/* Bottom Bar */}
+                <motion.div
+                    variants={itemVariants}
+                    initial="hidden"
+                    whileInView="visible"
+                    viewport={{ once: true }}
+                    className="pt-8 border-t border-gray-800 flex flex-col md:flex-row justify-between items-center gap-4"
+                >
+                    <p className="text-gray-500 text-sm">
+                        © {currentYear} Devr.AI. All rights reserved.
                     </p>
-                    <div className="flex space-x-6">
-                        <a href="https://github.com/AOSSIE-Org/Devr.AI/" 
-                           className="text-gray-300 hover:text-white hover:scale-110 transition-all duration-300 ease-in-out p-2 rounded-lg hover:bg-gradient-to-r hover:from-green-500/10 hover:to-blue-500/10 hover:shadow-lg hover:shadow-green-500/20" 
-                           target='_blank' 
-                           rel="noreferrer">
-                            <Github size={20} />
-                        </a>
-                        <a href="https://x.com/aossie_org?lang=en" 
-                           className="text-gray-300 hover:text-white hover:scale-110 transition-all duration-300 ease-in-out p-2 rounded-lg hover:bg-gradient-to-r hover:from-green-500/10 hover:to-blue-500/10 hover:shadow-lg hover:shadow-blue-500/20" 
-                           target='_blank'
-                           rel="noreferrer">
-                            <Twitter size={20} />
-                        </a>
-                        <a href="https://www.linkedin.com/company/aossie/?originalSubdomain=au" 
-                           className="text-gray-300 hover:text-white hover:scale-110 transition-all duration-300 ease-in-out p-2 rounded-lg hover:bg-gradient-to-r hover:from-green-500/10 hover:to-blue-500/10 hover:shadow-lg hover:shadow-green-500/20" 
-                           target='_blank'
-                           rel="noreferrer">
-                            <Linkedin size={20} />
-                        </a>
-                    </div>
-                </div>
+
+                    {/* Scroll to Top Button */}
+                    <motion.button
+                        onClick={scrollToTop}
+                        className="flex items-center gap-2 text-gray-400 hover:text-green-400 text-sm transition-colors duration-300 group"
+                        whileHover={{ y: -2 }}
+                        whileTap={{ scale: 0.95 }}
+                    >
+                        <span>Back to top</span>
+                        <ArrowUp size={16} className="group-hover:translate-y-[-2px] transition-transform duration-300" />
+                    </motion.button>
+                </motion.div>
             </div>
         </footer>
     );
diff --git a/landing/src/components/layout/Navbar.tsx b/landing/src/components/layout/Navbar.tsx
index 42a0a744..b7e4efbf 100644
--- a/landing/src/components/layout/Navbar.tsx
+++ b/landing/src/components/layout/Navbar.tsx
@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import { Menu, X, Github } from 'lucide-react';
+import { Menu, X} from 'lucide-react';
 import { motion } from 'framer-motion';
 import { Link, useLocation } from 'react-router-dom';
 
diff --git a/landing/src/components/sections/Hero.tsx b/landing/src/components/sections/Hero.tsx
index 42a120c7..46a65939 100644
--- a/landing/src/components/sections/Hero.tsx
+++ b/landing/src/components/sections/Hero.tsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import { motion } from 'framer-motion';
 import { Users } from 'lucide-react';
+import Button from '../ui/Button';
 
 const Hero: React.FC = () => {
     const container = {
@@ -19,74 +20,95 @@ const Hero: React.FC = () => {
     };
 
     return (
-        <section className="relative min-h-screen flex items-center justify-center pt-24 pb-0 overflow-hidden">
-            {/* Background elements */}
-            <div className="absolute inset-0 pointer-events-none hidden md:block">
-                <div className="absolute inset-0 bg-gradient-to-br from-dark via-dark to-gray-900 opacity-90"></div>
+        <section className="relative min-h-screen flex items-center justify-center pt-32 pb-20 overflow-hidden">
+            {/* Simplified Background - Modern & Clean */}
+            <div className="absolute inset-0 pointer-events-none">
+                {/* Base gradient */}
+                <div className="absolute inset-0 bg-gradient-to-br from-dark via-dark to-gray-900"></div>
 
-                <div className="absolute top-0 left-0 w-[1500px] h-[1500px] rounded-full bg-green-600/5 blur-[100px] -translate-x-1/3 -translate-y-1/3"></div>
-                <div className="absolute bottom-0 right-0 w-[1200px] h-[1200px] rounded-full bg-blue-600/5 blur-[100px] translate-x-1/4 translate-y-1/4"></div>
-                <div className="absolute top-1/2 right-1/4 w-[1000px] h-[1000px] rounded-full bg-purple-600/5 blur-[80px] -translate-y-1/2"></div>
+                {/* Subtle accent gradients */}
+                <div className="absolute top-0 left-0 w-[800px] h-[800px] rounded-full bg-green-600/10 blur-[120px] -translate-x-1/2 -translate-y-1/2"></div>
+                <div className="absolute bottom-0 right-0 w-[600px] h-[600px] rounded-full bg-green-500/5 blur-[100px] translate-x-1/3 translate-y-1/3"></div>
 
-                <div className="absolute inset-0 bg-[url('/grid-pattern.svg')] bg-center opacity-[0.15]"></div>
+                {/* Grid pattern for texture */}
+                <div className="absolute inset-0 bg-grid-pattern opacity-40"></div>
 
-                <div className="absolute top-0 inset-x-0 h-40 bg-gradient-to-b from-green-500/10 to-transparent"></div>
-
-                <div className="absolute inset-0 bg-radial-gradient"></div>
+                {/* Top gradient fade */}
+                <div className="absolute top-0 inset-x-0 h-32 bg-gradient-to-b from-green-500/5 to-transparent"></div>
             </div>
 
-            <div className="absolute bottom-0 left-0 right-0 h-48 bg-gradient-to-b from-transparent to-dark pointer-events-none"></div>
+            {/* Bottom fade for smooth transition */}
+            <div className="absolute bottom-0 left-0 right-0 h-40 bg-gradient-to-b from-transparent to-dark pointer-events-none"></div>
 
             <div className="container mx-auto px-6 z-10">
                 <motion.div
                     variants={container}
                     initial="hidden"
                     animate="show"
-                    className="max-w-5xl mx-auto text-center"
+                    className="max-w-6xl mx-auto text-center"
                 >
-                    <motion.div variants={item} className="mb-6">
-                        <span className="px-5 py-2.5 rounded-full bg-green-500/10 text-green-500 text-base font-medium">
+                    {/* Badge */}
+                    <motion.div variants={item} className="mb-8">
+                        <span className="inline-block px-6 py-3 rounded-full bg-green-500/10 text-green-400 text-base font-semibold border border-green-500/20">
                             Developer Experience Reimagined
                         </span>
                     </motion.div>
+
+                    {/* Hero Heading - Larger, Bolder */}
                     <motion.h1
                         variants={item}
-                        className="text-5xl md:text-7xl font-bold mb-8"
+                        className="text-6xl md:text-7xl lg:text-8xl font-extrabold mb-8 tracking-tight"
                     >
                         AI-Powered <span className="gradient-text">Developer Relations</span> Assistant
                     </motion.h1>
 
+                    {/* Description - Better spacing and readability */}
                     <motion.p
                         variants={item}
-                        className="text-xl md:text-2xl text-gray-400 mb-6 max-w-4xl mx-auto"
+                        className="text-lg md:text-xl lg:text-2xl text-gray-300 mb-10 max-w-4xl mx-auto leading-relaxed"
                     >
                         Devr.AI revolutionizes open-source community management by automating engagement,
                         streamlining onboarding, and delivering real-time project updates across Discord,
-                        Slack, GitHub, CLI, Web Widget, and more. <br />
-                        <span className="text-primary font-semibold">Personalized, multi-platform, and analytics-driven.</span>
+                        Slack, GitHub, CLI, Web Widget, and more.
+                        <br />
+                        <span className="text-primary font-semibold mt-2 inline-block">Personalized, multi-platform, and analytics-driven.</span>
                     </motion.p>
+
+                    {/* CTAs - Enhanced styling */}
                     <motion.div
                         variants={item}
-                        className="flex flex-col sm:flex-row gap-5 justify-center mb-6"
+                        className="flex flex-col sm:flex-row gap-6 justify-center mb-16"
                     >
-                        <a href="#waitlist" className="btn-primary flex items-center justify-center gap-2 text-lg py-4 px-8">
-                            <Users size={20} />
+                        <Button
+                            variant="primary"
+                            href="#waitlist"
+                            startIcon={<Users size={22} />}
+                        >
                             Join the Waitlist
-                        </a>
-                        <a href="#features" className="btn-secondary text-lg py-4 px-8">
+                        </Button>
+                        <Button
+                            variant="secondary"
+                            href="#features"
+                        >
                             Explore Features
-                        </a>
+                        </Button>
                     </motion.div>
 
+                    {/* Dashboard Preview - Enhanced presentation */}
                     <motion.div
                         variants={item}
                         className="max-w-6xl mx-auto"
                     >
-                        <div className="relative rounded-xl overflow-hidden border border-gray-800 shadow-2xl">
-                            <div className="absolute inset-0 bg-gradient-to-b from-transparent via-transparent to-dark z-10"></div>
+                        <div className="relative rounded-2xl overflow-hidden border border-gray-700 shadow-2xl elevation-xl interactive-lift">
+                            {/* Subtle glow effect */}
+                            <div className="absolute inset-0 bg-gradient-to-t from-green-500/5 via-transparent to-transparent pointer-events-none"></div>
+
+                            {/* Bottom fade */}
+                            <div className="absolute inset-x-0 bottom-0 h-32 bg-gradient-to-t from-dark via-dark/50 to-transparent z-10"></div>
+
                             <img
                                 src="/dashboard_preview.png"
-                                alt="Devr.AI Dashboard"
+                                alt="Devr.AI Dashboard Preview"
                                 className="w-full h-auto"
                             />
                         </div>
diff --git a/landing/src/components/sections/Waitlist.tsx b/landing/src/components/sections/Waitlist.tsx
index 5bf3f2b7..5ef68447 100644
--- a/landing/src/components/sections/Waitlist.tsx
+++ b/landing/src/components/sections/Waitlist.tsx
@@ -67,13 +67,13 @@ const Waitlist: React.FC = () => {
 
       setSubmitted(true);
       toast.success('You have been added to the waitlist!');
-      
+
       setEmail('');
       setName('');
       setOrganization('');
       setRole('');
       setSuggestions('');
-      
+
     } catch (err) {
       const errorMessage = err instanceof Error ? err.message : 'An unexpected error occurred';
       setError(errorMessage);
@@ -88,7 +88,7 @@ const Waitlist: React.FC = () => {
       {/* Background decoration */}
       <div className="absolute inset-0 bg-gradient-to-br from-primary/5 via-transparent to-secondary/5 blur-3xl" />
       <div className="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 w-96 h-96 bg-gradient-to-r from-primary/10 to-secondary/10 rounded-full blur-3xl" />
-      
+
       <div className="container mx-auto px-6 relative z-10">
         <div className="max-w-4xl mx-auto">
           {/* Gradient border container */}
@@ -259,31 +259,70 @@ const Waitlist: React.FC = () => {
                   </div>
 
                   <div className="flex flex-col items-center space-y-4 pt-4">
-                    <div className="relative group">
-                      <div className="absolute inset-0 bg-gradient-to-r from-primary to-secondary rounded-xl blur-lg opacity-75 group-hover:opacity-100 transition-opacity duration-300" />
-                      <button
-                        type="submit"
-                        disabled={submitting}
-                        className="relative w-full md:w-auto bg-gradient-to-r from-black via-green-500 to-black hover:from-black hover:via-green-400 hover:to-black text-white font-bold py-4 px-8 rounded-xl flex items-center justify-center gap-3 min-w-[250px] transition-all duration-500 ease-in-out transform hover:scale-105 hover:shadow-2xl hover:shadow-green-500/25 disabled:opacity-50 disabled:cursor-not-allowed disabled:transform-none shadow-lg active:scale-95"
-                      >
-                        {submitting ? (
-                          <>
-                            <motion.div
-                              animate={{ rotate: 360 }}
-                              transition={{ duration: 1, repeat: Infinity, ease: "linear" }}
-                              className="w-5 h-5 border-2 border-white border-t-transparent rounded-full"
-                            />
-                            <span>Joining Waitlist...</span>
-                          </>
-                        ) : (
-                          <>
-                            <Send size={20} />
-                            <span>Join Waitlist</span>
-                          </>
-                        )}
-                      </button>
-                    </div>
-                    
+                    {/* Enhanced Button with Premium Design */}
+                    <motion.div
+                      className="relative group w-full md:w-auto"
+                      whileHover={{ scale: 1.02 }}
+                      whileTap={{ scale: 0.98 }}
+                    >
+                      {/* Animated gradient border */}
+                      <div className="absolute -inset-0.5 bg-gradient-to-r from-primary via-secondary to-primary rounded-xl blur opacity-75 group-hover:opacity-100 transition duration-300 group-hover:duration-200 animate-gradient-xy" />
+
+                      {/* Glow effect on hover */}
+                      <div className="absolute -inset-1 bg-gradient-to-r from-primary/50 to-secondary/50 rounded-xl blur-xl opacity-0 group-hover:opacity-70 transition-opacity duration-500" />
+
+                      {/* Button container with glassmorphism */}
+                      <div className="relative">
+                        <button
+                          type="submit"
+                          disabled={submitting}
+                          className="relative w-full md:w-auto bg-gradient-to-r from-primary via-secondary to-primary bg-[length:200%_auto] hover:bg-right-bottom text-white font-bold py-4 px-10 rounded-xl flex items-center justify-center gap-3 min-w-[280px] transition-all duration-500 ease-out shadow-2xl shadow-primary/25 disabled:opacity-50 disabled:cursor-not-allowed disabled:grayscale overflow-hidden group/btn"
+                        >
+                          {/* Shimmer effect overlay */}
+                          <div className="absolute inset-0 -translate-x-full group-hover/btn:translate-x-full transition-transform duration-1000 bg-gradient-to-r from-transparent via-white/20 to-transparent" />
+
+                          {/* Glass reflection effect */}
+                          <div className="absolute inset-0 bg-gradient-to-b from-white/10 to-transparent opacity-0 group-hover/btn:opacity-100 transition-opacity duration-300" />
+
+                          {/* Button content */}
+                          <div className="relative flex items-center gap-3">
+                            {submitting ? (
+                              <>
+                                <motion.div
+                                  animate={{ rotate: 360 }}
+                                  transition={{ duration: 1, repeat: Infinity, ease: "linear" }}
+                                  className="w-5 h-5 border-2 border-white border-t-transparent rounded-full"
+                                />
+                                <span className="text-base tracking-wide">Joining Waitlist...</span>
+                              </>
+                            ) : (
+                              <>
+                                <motion.div
+                                  whileHover={{ x: 3 }}
+                                  transition={{ type: "spring", stiffness: 400, damping: 10 }}
+                                >
+                                  <Send size={20} className="drop-shadow-lg" />
+                                </motion.div>
+                                <span className="text-base tracking-wide font-semibold">Join Waitlist</span>
+                                <motion.div
+                                  className="opacity-0 group-hover/btn:opacity-100 transition-opacity duration-300 ml-1"
+                                  initial={{ scale: 0.8 }}
+                                  whileHover={{ scale: 1 }}
+                                >
+                                  <Sparkles size={16} className="text-white/80" />
+                                </motion.div>
+                              </>
+                            )}
+                          </div>
+
+                          {/* Ripple effect container */}
+                          <span className="absolute inset-0 rounded-xl overflow-hidden">
+                            <span className="absolute inset-0 rounded-xl bg-white/20 scale-0 group-active/btn:scale-100 transition-transform duration-500 ease-out" />
+                          </span>
+                        </button>
+                      </div>
+                    </motion.div>
+
                     <div className="text-center space-y-2">
                       <p className="text-sm text-gray-400">
                         🚀 We'll notify you when early access becomes available
diff --git a/landing/src/components/ui/Button.tsx b/landing/src/components/ui/Button.tsx
new file mode 100644
index 00000000..50d4f840
--- /dev/null
+++ b/landing/src/components/ui/Button.tsx
@@ -0,0 +1,132 @@
+import React from 'react';
+import { motion } from 'framer-motion';
+
+interface ButtonProps {
+    children: React.ReactNode;
+    variant?: 'primary' | 'secondary';
+    href?: string;
+    onClick?: () => void;
+    type?: 'button' | 'submit' | 'reset';
+    disabled?: boolean;
+    className?: string;
+    startIcon?: React.ReactNode;
+    endIcon?: React.ReactNode;
+    fullWidth?: boolean;
+}
+
+const Button: React.FC<ButtonProps> = ({
+    children,
+    variant = 'primary',
+    href,
+    onClick,
+    type = 'button',
+    disabled = false,
+    className = '',
+    startIcon,
+    endIcon,
+    fullWidth = false,
+}) => {
+    const baseStyles = `
+    relative overflow-hidden
+    px-8 py-4 rounded-xl
+    font-semibold text-lg
+    inline-flex items-center justify-center gap-3
+    transition-all duration-500 ease-out
+    ${fullWidth ? 'w-full' : ''}
+    ${disabled ? 'opacity-50 cursor-not-allowed' : 'cursor-pointer'}
+    ${className}
+  `;
+
+    const variantStyles = {
+        primary: `
+      bg-gradient-to-br from-green-500 to-green-600
+      text-white
+      border border-green-500/40
+      shadow-[0_4px_14px_0_rgba(34,197,94,0.3),0_1px_3px_0_rgba(0,0,0,0.1)]
+      hover:shadow-[0_12px_32px_0_rgba(34,197,94,0.45),0_6px_16px_0_rgba(34,197,94,0.3)]
+      hover:border-green-500/60
+      active:shadow-[0_4px_12px_0_rgba(34,197,94,0.3)]
+    `,
+        secondary: `
+      bg-gradient-to-br from-gray-800 to-gray-900
+      text-white
+      border border-gray-700
+      shadow-[0_2px_8px_0_rgba(0,0,0,0.15),inset_0_1px_0_0_rgba(255,255,255,0.05)]
+      hover:shadow-[0_6px_20px_0_rgba(0,0,0,0.25),inset_0_1px_0_0_rgba(255,255,255,0.1)]
+      hover:border-gray-600
+      active:shadow-[0_2px_8px_0_rgba(0,0,0,0.15)]
+    `,
+    };
+
+    const content = (
+        <>
+            {/* Background gradient overlay */}
+            <span
+                className={`
+          absolute inset-0 opacity-0 group-hover:opacity-100 transition-opacity duration-500
+          ${variant === 'primary'
+                        ? 'bg-gradient-to-br from-green-400 to-green-500'
+                        : 'bg-gradient-to-br from-gray-700 to-gray-800'
+                    }
+        `}
+            />
+
+            {/* Shimmer effect */}
+            <span
+                className={`
+          absolute inset-0 -translate-x-full group-hover:translate-x-full
+          bg-gradient-to-r from-transparent via-white/20 to-transparent
+          transition-transform duration-700 pointer-events-none
+        `}
+            />
+
+            {/* Content */}
+            <span className="relative z-10 flex items-center gap-3">
+                {startIcon && <span>{startIcon}</span>}
+                <span>{children}</span>
+                {endIcon && <span>{endIcon}</span>}
+            </span>
+        </>
+    );
+
+    const combinedStyles = `${baseStyles} ${variantStyles[variant]}`;
+
+    const handleAnchorClick = (e: React.MouseEvent<HTMLAnchorElement>) => {
+        if (disabled) {
+            e.preventDefault();
+            return;
+        }
+        onClick?.();
+    };
+
+    if (href) {
+        return (
+            <motion.a
+                href={href}
+                onClick={handleAnchorClick}
+                className={`${combinedStyles} group`}
+                tabIndex={disabled ? -1 : undefined}
+                aria-disabled={disabled}
+                whileHover={!disabled ? { y: -3, scale: 1.02 } : {}}
+                whileTap={!disabled ? { y: -1, scale: 1 } : {}}
+            >
+                {content}
+            </motion.a>
+        );
+    }
+
+    return (
+        <motion.button
+            type={type}
+            onClick={onClick}
+            disabled={disabled}
+            className={`${combinedStyles} group`}
+            whileHover={!disabled ? { y: -3, scale: 1.02 } : {}}
+            whileTap={!disabled ? { y: -1, scale: 1 } : {}}
+        >
+            {content}
+        </motion.button>
+    );
+};
+
+export default Button;
diff --git a/landing/src/index.css b/landing/src/index.css
index 31f5e082..290c51ca 100644
--- a/landing/src/index.css
+++ b/landing/src/index.css
@@ -1,61 +1,379 @@
-@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');
 
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
 
+/* 
+   CSS CUSTOM PROPERTIES (Design Tokens)
+*/
+:root {
+  /* Colors - Primary */
+  --color-primary-400: #4ade80;
+  --color-primary-500: #22c55e;
+  --color-primary-600: #16a34a;
+  --color-primary-700: #15803d;
+  
+  /* Colors - Neutrals */
+  --color-gray-950: #09090b;
+  --color-gray-900: #18181b;
+  --color-gray-800: #27272a;
+  --color-gray-700: #3f3f46;
+  --color-gray-600: #52525b;
+  --color-gray-500: #71717a;
+  --color-gray-400: #a1a1aa;
+  --color-gray-300: #d4d4d8;
+  
+  /* Spacing */
+  --spacing-section-y: 5rem;
+  --spacing-section-x: 1.5rem;
+  
+  /* Shadows - Elevation */
+  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
+  --shadow-glow: 0 0 20px rgba(34, 197, 94, 0.25);
+  --shadow-glow-strong: 0 0 30px rgba(34, 197, 94, 0.4);
+  
+  /* Border Radius */
+  --radius-sm: 0.375rem;
+  --radius-md: 0.5rem;
+  --radius-lg: 0.75rem;
+  --radius-xl: 1rem;
+  
+  /* Transitions */
+  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
+  --transition-base: 200ms cubic-bezier(0.4, 0, 0.2, 1);
+  --transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+@media (min-width: 768px) {
+  :root {
+    --spacing-section-y: 8rem;
+    --spacing-section-x: 2rem;
+  }
+}
+
+/* ============================================
+   BASE STYLES
+   ============================================ */
 body {
-  font-family: 'Inter', sans-serif;
+  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
   @apply bg-dark text-white antialiased;
+  font-feature-settings: 'cv11', 'ss01';
+  font-variation-settings: 'opsz' 32;
+}
+
+/* ============================================
+   TYPOGRAPHY SCALE
+   ============================================ */
+h1, h2, h3, h4, h5, h6 {
+  font-weight: 700;
+  letter-spacing: -0.02em;
+  line-height: 1.2;
 }
 
+h1 {
+  @apply text-5xl md:text-6xl lg:text-7xl xl:text-8xl;
+  font-weight: 800;
+  letter-spacing: -0.03em;
+}
+
+h2 {
+  @apply text-3xl md:text-4xl lg:text-5xl;
+  font-weight: 700;
+}
+
+h3 {
+  @apply text-2xl md:text-3xl;
+  font-weight: 600;
+}
+
+h4 {
+  @apply text-xl md:text-2xl;
+  font-weight: 600;
+}
+
+h5 {
+  @apply text-lg md:text-xl;
+  font-weight: 600;
+}
+
+h6 {
+  @apply text-base md:text-lg;
+  font-weight: 600;
+}
+
+p {
+  @apply text-base md:text-lg leading-relaxed;
+}
+
+/* ============================================
+   UTILITY CLASSES
+   ============================================ */
+
+/* Gradient Text */
 .gradient-text {
-  @apply bg-gradient-to-r from-green-400 to-blue-500 bg-clip-text text-transparent;
+  @apply bg-gradient-to-r from-green-400 via-cyan-400 to-emerald-500 bg-clip-text text-transparent;
 }
 
+/* Cards */
 .card {
-  @apply bg-dark-card border border-gray-700 rounded-xl p-6 transition-all hover:border-green-500;
+  @apply bg-dark-card border border-gray-700 rounded-xl p-6 transition-all duration-300;
+  box-shadow: var(--shadow-sm);
 }
 
+.card:hover {
+  @apply border-green-500/50;
+  box-shadow: var(--shadow-md), var(--shadow-glow);
+  transform: translateY(-2px);
+}
+
+/* Buttons */
 .btn-primary {
-  @apply px-6 py-3 rounded-lg bg-primary hover:bg-primary-hover transition-all text-white font-medium;
+  @apply px-8 py-4 rounded-xl text-white font-semibold text-lg relative overflow-hidden;
+  background: linear-gradient(135deg, var(--color-primary-500) 0%, var(--color-primary-600) 100%);
+  box-shadow: 0 4px 14px 0 rgba(34, 197, 94, 0.3), 0 1px 3px 0 rgba(0, 0, 0, 0.1);
+  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
+  border: 1px solid rgba(34, 197, 94, 0.4);
+}
+
+.btn-primary::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: linear-gradient(135deg, var(--color-primary-400) 0%, var(--color-primary-500) 100%);
+  opacity: 0;
+  transition: opacity 0.4s ease;
+  z-index: -1;
+}
+
+/* Shimmer effect for primary button */
+.btn-primary::after {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: -100%;
+  width: 100%;
+  height: 100%;
+  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
+  transition: left 0.6s ease;
+  pointer-events: none;
+  z-index: 0;
+}
+
+.btn-primary:hover {
+  box-shadow: 0 12px 32px 0 rgba(34, 197, 94, 0.45), 0 6px 16px 0 rgba(34, 197, 94, 0.3);
+  transform: translateY(-3px) scale(1.02);
+  border-color: rgba(34, 197, 94, 0.6);
+}
+
+.btn-primary:hover::before {
+  opacity: 1;
+}
+
+.btn-primary:hover::after {
+  left: 100%;
+}
+
+.btn-primary:active {
+  transform: translateY(-1px) scale(1);
+  box-shadow: 0 4px 12px 0 rgba(34, 197, 94, 0.3);
+}
+
+/* Ensure button content stays on top */
+.btn-primary > *,
+.btn-primary svg,
+.btn-primary span {
+  position: relative;
+  z-index: 10;
 }
 
 .btn-secondary {
-  @apply px-6 py-3 rounded-lg bg-dark-lighter hover:bg-gray-800 transition-all text-white font-medium border border-gray-700;
+  @apply px-8 py-4 rounded-xl text-white font-semibold text-lg relative overflow-hidden;
+  background: linear-gradient(135deg, var(--color-gray-800) 0%, var(--color-gray-900) 100%);
+  border: 1px solid var(--color-gray-700);
+  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.15), inset 0 1px 0 0 rgba(255, 255, 255, 0.05);
+  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.btn-secondary::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: linear-gradient(135deg, var(--color-gray-700) 0%, var(--color-gray-800) 100%);
+  opacity: 0;
+  transition: opacity 0.4s ease;
+  z-index: -1;
+}
+
+/* Shimmer effect for secondary button */
+.btn-secondary::after {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: -100%;
+  width: 100%;
+  height: 100%;
+  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
+  transition: left 0.6s ease;
+  pointer-events: none;
+  z-index: 0;
 }
 
+.btn-secondary:hover {
+  border-color: var(--color-gray-600);
+  box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.25), inset 0 1px 0 0 rgba(255, 255, 255, 0.1);
+  transform: translateY(-3px) scale(1.02);
+}
+
+.btn-secondary:hover::before {
+  opacity: 1;
+}
+
+.btn-secondary:hover::after {
+  left: 100%;
+}
+
+.btn-secondary:active {
+  transform: translateY(-1px) scale(1);
+  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.15);
+}
+
+/* Ensure button content stays on top */
+.btn-secondary > *,
+.btn-secondary svg,
+.btn-secondary span {
+  position: relative;
+  z-index: 10;
+}
+
+
+/* Sections */
 .section {
-  @apply py-12 md:py-20;
+  padding-top: var(--spacing-section-y);
+  padding-bottom: var(--spacing-section-y);
+}
+
+/* ============================================
+   ELEVATION UTILITIES
+   ============================================ */
+.elevation-sm {
+  box-shadow: var(--shadow-sm);
+}
+
+.elevation-md {
+  box-shadow: var(--shadow-md);
+}
+
+.elevation-lg {
+  box-shadow: var(--shadow-lg);
+}
+
+.elevation-xl {
+  box-shadow: var(--shadow-xl);
+}
+
+/* ============================================
+   INTERACTION UTILITIES (CSS-only)
+   ============================================ */
+.interactive-lift {
+  transition: transform var(--transition-base), box-shadow var(--transition-base);
+}
+
+.interactive-lift:hover {
+  transform: translateY(-4px);
+}
+
+.interactive-glow {
+  transition: box-shadow var(--transition-slow);
+}
+
+.interactive-glow:hover {
+  box-shadow: var(--shadow-glow);
+}
+
+.interactive-scale {
+  transition: transform var(--transition-base);
+}
+
+.interactive-scale:hover {
+  transform: scale(1.05);
 }
 
-.hover-lift {
-  @apply transition-transform duration-300;
+.interactive-border {
+  transition: border-color var(--transition-base);
 }
 
-.hover-lift:hover {
-  transform: translateY(-5px);
+.interactive-border:hover {
+  @apply border-primary;
 }
 
-.radial-gradient-bg {
-  background: radial-gradient(circle at center, rgba(34, 197, 94, 0.15), transparent 50%);
+/* ============================================
+   FOCUS STATES (Accessibility)
+   ============================================ */
+a:focus-visible,
+button:focus-visible {
+  @apply outline-none ring-2 ring-primary ring-offset-2 ring-offset-dark;
+  border-radius: var(--radius-md);
 }
-/* Webkit Scrollbar Styling */
+
+/* ============================================
+   SCROLLBAR STYLING
+   ============================================ */
 ::-webkit-scrollbar {
   width: 10px;
   height: 10px;
 }
 
 ::-webkit-scrollbar-track {
-  background: #000; /* Optional: light background */
+  background: var(--color-gray-950);
   border-radius: 8px;
 }
 
 ::-webkit-scrollbar-thumb {
-  background: linear-gradient(to bottom, #167a16, #171787); /* Green to blue */
+  background: linear-gradient(to bottom, var(--color-primary-600), var(--color-primary-700));
   border-radius: 8px;
 }
 
 ::-webkit-scrollbar-thumb:hover {
-  background: linear-gradient(to bottom, #167a16, #171787);
+  background: linear-gradient(to bottom, var(--color-primary-500), var(--color-primary-600));
+}
+
+/* ============================================
+   BACKGROUND PATTERNS
+   ============================================ */
+.bg-radial-gradient {
+  background: radial-gradient(circle at center, rgba(34, 197, 94, 0.1), transparent 70%);
+}
+
+.bg-grid-pattern {
+  background-image: 
+    linear-gradient(to right, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
+    linear-gradient(to bottom, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
+  background-size: 40px 40px;
+}
+
+/* ============================================
+   ANIMATIONS
+   ============================================ */
+@keyframes gradient-xy {
+  0%, 100% {
+    background-position: 0% 50%;
+  }
+  50% {
+    background-position: 100% 50%;
+  }
+}
+
+.animate-gradient-xy {
+  background-size: 200% auto;
+  animation: gradient-xy 3s ease infinite;
 }
\ No newline at end of file
diff --git a/landing/tailwind.config.js b/landing/tailwind.config.js
index a77198ce..5878ff52 100644
--- a/landing/tailwind.config.js
+++ b/landing/tailwind.config.js
@@ -7,18 +7,76 @@ export default {
                 primary: {
                     DEFAULT: '#22c55e', // green-500
                     hover: '#16a34a', // green-600
+                    light: '#4ade80', // green-400
+                    dark: '#15803d', // green-700
+                },
+                secondary: {
+                    DEFAULT: '#06b6d4', // cyan-500 (turquoise)
+                    hover: '#0891b2', // cyan-600
+                    light: '#22d3ee', // cyan-400
+                    dark: '#0e7490', // cyan-700
                 },
                 dark: {
                     DEFAULT: '#09090b', // gray-950
                     lighter: '#18181b', // gray-900
                     card: '#27272a', // gray-800
                 },
+                gray: {
+                    950: '#09090b',
+                    900: '#18181b',
+                    800: '#27272a',
+                    700: '#3f3f46',
+                    600: '#52525b',
+                    500: '#71717a',
+                    400: '#a1a1aa',
+                    300: '#d4d4d8',
+                },
             },
             fontFamily: {
-                sans: ['Inter', 'system-ui', 'sans-serif'],
+                sans: [
+                    'Inter',
+                    '-apple-system',
+                    'BlinkMacSystemFont',
+                    'Segoe UI',
+                    'sans-serif',
+                ],
+            },
+            fontSize: {
+                '8xl': ['6rem', { lineHeight: '1', letterSpacing: '-0.03em' }],
+                '9xl': ['8rem', { lineHeight: '1', letterSpacing: '-0.03em' }],
+            },
+            boxShadow: {
+                sm: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
+                md: '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',
+                lg: '0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)',
+                xl: '0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)',
+                '2xl': '0 25px 50px -12px rgba(0, 0, 0, 0.25)',
+                glow: '0 0 20px rgba(34, 197, 94, 0.25)',
+                'glow-strong': '0 0 30px rgba(34, 197, 94, 0.4)',
+                'glow-lg':
+                    '0 0 40px rgba(34, 197, 94, 0.3), 0 0 80px rgba(34, 197, 94, 0.15)',
+                'glow-cyan': '0 0 20px rgba(6, 182, 212, 0.25)',
+                'glow-cyan-strong': '0 0 30px rgba(6, 182, 212, 0.4)',
+            },
+            spacing: {
+                18: '4.5rem',
+                22: '5.5rem',
+                26: '6.5rem',
+                30: '7.5rem',
+            },
+            borderRadius: {
+                '4xl': '2rem',
             },
             animation: {
                 'spin-slow': 'spin 8s linear infinite',
+                'pulse-slow': 'pulse 4s cubic-bezier(0.4, 0, 0.6, 1) infinite',
+            },
+            transitionDuration: {
+                400: '400ms',
+                600: '600ms',
+            },
+            backdropBlur: {
+                xs: '2px',
             },
         },
     },
diff --git a/poetry.lock b/poetry.lock
index 7d46dd61..e92be884 100644
--- a/poetry.lock
+++ b/poetry.lock
@@ -1396,6 +1396,8 @@ files = [
     {file = "greenlet-3.2.4-cp310-cp310-manylinux_2_24_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:c2ca18a03a8cfb5b25bc1cbe20f3d9a4c80d8c3b13ba3df49ac3961af0b1018d"},
     {file = "greenlet-3.2.4-cp310-cp310-musllinux_1_1_aarch64.whl", hash = "sha256:9fe0a28a7b952a21e2c062cd5756d34354117796c6d9215a87f55e38d15402c5"},
     {file = "greenlet-3.2.4-cp310-cp310-musllinux_1_1_x86_64.whl", hash = "sha256:8854167e06950ca75b898b104b63cc646573aa5fef1353d4508ecdd1ee76254f"},
+    {file = "greenlet-3.2.4-cp310-cp310-musllinux_1_2_aarch64.whl", hash = "sha256:f47617f698838ba98f4ff4189aef02e7343952df3a615f847bb575c3feb177a7"},
+    {file = "greenlet-3.2.4-cp310-cp310-musllinux_1_2_x86_64.whl", hash = "sha256:af41be48a4f60429d5cad9d22175217805098a9ef7c40bfef44f7669fb9d74d8"},
     {file = "greenlet-3.2.4-cp310-cp310-win_amd64.whl", hash = "sha256:73f49b5368b5359d04e18d15828eecc1806033db5233397748f4ca813ff1056c"},
     {file = "greenlet-3.2.4-cp311-cp311-macosx_11_0_universal2.whl", hash = "sha256:96378df1de302bc38e99c3a9aa311967b7dc80ced1dcc6f171e99842987882a2"},
     {file = "greenlet-3.2.4-cp311-cp311-manylinux2014_aarch64.manylinux_2_17_aarch64.whl", hash = "sha256:1ee8fae0519a337f2329cb78bd7a8e128ec0f881073d43f023c7b8d4831d5246"},
@@ -1405,6 +1407,8 @@ files = [
     {file = "greenlet-3.2.4-cp311-cp311-manylinux_2_24_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:2523e5246274f54fdadbce8494458a2ebdcdbc7b802318466ac5606d3cded1f8"},
     {file = "greenlet-3.2.4-cp311-cp311-musllinux_1_1_aarch64.whl", hash = "sha256:1987de92fec508535687fb807a5cea1560f6196285a4cde35c100b8cd632cc52"},
     {file = "greenlet-3.2.4-cp311-cp311-musllinux_1_1_x86_64.whl", hash = "sha256:55e9c5affaa6775e2c6b67659f3a71684de4c549b3dd9afca3bc773533d284fa"},
+    {file = "greenlet-3.2.4-cp311-cp311-musllinux_1_2_aarch64.whl", hash = "sha256:c9c6de1940a7d828635fbd254d69db79e54619f165ee7ce32fda763a9cb6a58c"},
+    {file = "greenlet-3.2.4-cp311-cp311-musllinux_1_2_x86_64.whl", hash = "sha256:03c5136e7be905045160b1b9fdca93dd6727b180feeafda6818e6496434ed8c5"},
     {file = "greenlet-3.2.4-cp311-cp311-win_amd64.whl", hash = "sha256:9c40adce87eaa9ddb593ccb0fa6a07caf34015a29bf8d344811665b573138db9"},
     {file = "greenlet-3.2.4-cp312-cp312-macosx_11_0_universal2.whl", hash = "sha256:3b67ca49f54cede0186854a008109d6ee71f66bd57bb36abd6d0a0267b540cdd"},
     {file = "greenlet-3.2.4-cp312-cp312-manylinux2014_aarch64.manylinux_2_17_aarch64.whl", hash = "sha256:ddf9164e7a5b08e9d22511526865780a576f19ddd00d62f8a665949327fde8bb"},
@@ -1414,6 +1418,8 @@ files = [
     {file = "greenlet-3.2.4-cp312-cp312-manylinux_2_24_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:3b3812d8d0c9579967815af437d96623f45c0f2ae5f04e366de62a12d83a8fb0"},
     {file = "greenlet-3.2.4-cp312-cp312-musllinux_1_1_aarch64.whl", hash = "sha256:abbf57b5a870d30c4675928c37278493044d7c14378350b3aa5d484fa65575f0"},
     {file = "greenlet-3.2.4-cp312-cp312-musllinux_1_1_x86_64.whl", hash = "sha256:20fb936b4652b6e307b8f347665e2c615540d4b42b3b4c8a321d8286da7e520f"},
+    {file = "greenlet-3.2.4-cp312-cp312-musllinux_1_2_aarch64.whl", hash = "sha256:ee7a6ec486883397d70eec05059353b8e83eca9168b9f3f9a361971e77e0bcd0"},
+    {file = "greenlet-3.2.4-cp312-cp312-musllinux_1_2_x86_64.whl", hash = "sha256:326d234cbf337c9c3def0676412eb7040a35a768efc92504b947b3e9cfc7543d"},
     {file = "greenlet-3.2.4-cp312-cp312-win_amd64.whl", hash = "sha256:a7d4e128405eea3814a12cc2605e0e6aedb4035bf32697f72deca74de4105e02"},
     {file = "greenlet-3.2.4-cp313-cp313-macosx_11_0_universal2.whl", hash = "sha256:1a921e542453fe531144e91e1feedf12e07351b1cf6c9e8a3325ea600a715a31"},
     {file = "greenlet-3.2.4-cp313-cp313-manylinux2014_aarch64.manylinux_2_17_aarch64.whl", hash = "sha256:cd3c8e693bff0fff6ba55f140bf390fa92c994083f838fece0f63be121334945"},
@@ -1423,6 +1429,8 @@ files = [
     {file = "greenlet-3.2.4-cp313-cp313-manylinux_2_24_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:23768528f2911bcd7e475210822ffb5254ed10d71f4028387e5a99b4c6699671"},
     {file = "greenlet-3.2.4-cp313-cp313-musllinux_1_1_aarch64.whl", hash = "sha256:00fadb3fedccc447f517ee0d3fd8fe49eae949e1cd0f6a611818f4f6fb7dc83b"},
     {file = "greenlet-3.2.4-cp313-cp313-musllinux_1_1_x86_64.whl", hash = "sha256:d25c5091190f2dc0eaa3f950252122edbbadbb682aa7b1ef2f8af0f8c0afefae"},
+    {file = "greenlet-3.2.4-cp313-cp313-musllinux_1_2_aarch64.whl", hash = "sha256:6e343822feb58ac4d0a1211bd9399de2b3a04963ddeec21530fc426cc121f19b"},
+    {file = "greenlet-3.2.4-cp313-cp313-musllinux_1_2_x86_64.whl", hash = "sha256:ca7f6f1f2649b89ce02f6f229d7c19f680a6238af656f61e0115b24857917929"},
     {file = "greenlet-3.2.4-cp313-cp313-win_amd64.whl", hash = "sha256:554b03b6e73aaabec3745364d6239e9e012d64c68ccd0b8430c64ccc14939a8b"},
     {file = "greenlet-3.2.4-cp314-cp314-macosx_11_0_universal2.whl", hash = "sha256:49a30d5fda2507ae77be16479bdb62a660fa51b1eb4928b524975b3bde77b3c0"},
     {file = "greenlet-3.2.4-cp314-cp314-manylinux2014_aarch64.manylinux_2_17_aarch64.whl", hash = "sha256:299fd615cd8fc86267b47597123e3f43ad79c9d8a22bebdce535e53550763e2f"},
@@ -1430,6 +1438,8 @@ files = [
     {file = "greenlet-3.2.4-cp314-cp314-manylinux2014_s390x.manylinux_2_17_s390x.whl", hash = "sha256:b4a1870c51720687af7fa3e7cda6d08d801dae660f75a76f3845b642b4da6ee1"},
     {file = "greenlet-3.2.4-cp314-cp314-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:061dc4cf2c34852b052a8620d40f36324554bc192be474b9e9770e8c042fd735"},
     {file = "greenlet-3.2.4-cp314-cp314-manylinux_2_24_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:44358b9bf66c8576a9f57a590d5f5d6e72fa4228b763d0e43fee6d3b06d3a337"},
+    {file = "greenlet-3.2.4-cp314-cp314-musllinux_1_2_aarch64.whl", hash = "sha256:2917bdf657f5859fbf3386b12d68ede4cf1f04c90c3a6bc1f013dd68a22e2269"},
+    {file = "greenlet-3.2.4-cp314-cp314-musllinux_1_2_x86_64.whl", hash = "sha256:015d48959d4add5d6c9f6c5210ee3803a830dce46356e3bc326d6776bde54681"},
     {file = "greenlet-3.2.4-cp314-cp314-win_amd64.whl", hash = "sha256:e37ab26028f12dbb0ff65f29a8d3d44a765c61e729647bf2ddfbbed621726f01"},
     {file = "greenlet-3.2.4-cp39-cp39-macosx_11_0_universal2.whl", hash = "sha256:b6a7c19cf0d2742d0809a4c05975db036fdff50cd294a93632d6a310bf9ac02c"},
     {file = "greenlet-3.2.4-cp39-cp39-manylinux2014_aarch64.manylinux_2_17_aarch64.whl", hash = "sha256:27890167f55d2387576d1f41d9487ef171849ea0359ce1510ca6e06c8bece11d"},
@@ -1439,6 +1449,8 @@ files = [
     {file = "greenlet-3.2.4-cp39-cp39-manylinux_2_24_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:c9913f1a30e4526f432991f89ae263459b1c64d1608c0d22a5c79c287b3c70df"},
     {file = "greenlet-3.2.4-cp39-cp39-musllinux_1_1_aarch64.whl", hash = "sha256:b90654e092f928f110e0007f572007c9727b5265f7632c2fa7415b4689351594"},
     {file = "greenlet-3.2.4-cp39-cp39-musllinux_1_1_x86_64.whl", hash = "sha256:81701fd84f26330f0d5f4944d4e92e61afe6319dcd9775e39396e39d7c3e5f98"},
+    {file = "greenlet-3.2.4-cp39-cp39-musllinux_1_2_aarch64.whl", hash = "sha256:28a3c6b7cd72a96f61b0e4b2a36f681025b60ae4779cc73c1535eb5f29560b10"},
+    {file = "greenlet-3.2.4-cp39-cp39-musllinux_1_2_x86_64.whl", hash = "sha256:52206cd642670b0b320a1fd1cbfd95bca0e043179c1d8a045f2c6109dfe973be"},
     {file = "greenlet-3.2.4-cp39-cp39-win32.whl", hash = "sha256:65458b409c1ed459ea899e939f0e1cdb14f58dbc803f2f93c5eab5694d32671b"},
     {file = "greenlet-3.2.4-cp39-cp39-win_amd64.whl", hash = "sha256:d2e685ade4dafd447ede19c31277a224a239a0a1a4eca4e6390efedf20260cfb"},
     {file = "greenlet-3.2.4.tar.gz", hash = "sha256:0dca0d95ff849f9a364385f36ab49f50065d76964944638be9691e1832e9f86d"},