diff --git a/.dev.vars.example b/.dev.vars.example
new file mode 100644
index 0000000..77ec167
--- /dev/null
+++ b/.dev.vars.example
@@ -0,0 +1,18 @@
+# Cloudflare Pages Function secrets for /api/contact
+# Local default (smtp4dev)
+SMTP_HOST=127.0.0.1
+SMTP_PORT=2525
+SMTP_SECURE=false
+SMTP_USER=
+SMTP_PASS=
+MAIL_FROM_EMAIL=noreply@ultraviolet.rs
+TEAM_CONTACT_EMAIL=info@ultraviolet.rs
+
+# Production example (Google SMTP / Gmail Workspace)
+# SMTP_HOST=smtp.gmail.com
+# SMTP_PORT=465
+# SMTP_SECURE=true
+# SMTP_USER=your-production-email@yourdomain.com
+# SMTP_PASS=your-google-app-password
+# MAIL_FROM_EMAIL=your-production-email@yourdomain.com
+# TEAM_CONTACT_EMAIL=info@ultraviolet.rs
diff --git a/.gitignore b/.gitignore
index 16d54bb..a68bfb1 100644
--- a/.gitignore
+++ b/.gitignore
@@ -22,3 +22,13 @@ pnpm-debug.log*
 
 # jetbrains setting folder
 .idea/
+
+*.test
+node_modules
+.astro
+dist
+.env*
+# wrangler files
+.wrangler
+.dev.vars*
+!.dev.vars.example
diff --git a/astro.config.mjs b/astro.config.mjs
index 12a8fac..6cd4982 100644
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -24,4 +24,10 @@ export default defineConfig({
   ],
 
   adapter: cloudflare(),
+
+  vite: {
+    ssr: {
+      external: ['nodemailer'],
+    },
+  },
 });
diff --git a/package.json b/package.json
index f483cf8..0fa0c7a 100644
--- a/package.json
+++ b/package.json
@@ -20,7 +20,9 @@
     "@astrojs/cloudflare": "^12",
     "@astrojs/sitemap": "^3.7.2",
     "@astrojs/tailwind": "^6.0.2",
-    "astro": "^5.17.1"
+    "astro": "^5.17.1",
+    "node": "^25.6.1",
+    "nodemailer": "^8.0.4"
   },
   "devDependencies": {
     "@astrojs/check": "^0.9.6",
@@ -29,6 +31,7 @@
     "@eslint/json": "^1.1.0",
     "@eslint/markdown": "^7.5.1",
     "@tailwindcss/typography": "^0.5.19",
+    "@types/nodemailer": "^7.0.11",
     "@typescript-eslint/eslint-plugin": "^8.28.0",
     "@typescript-eslint/parser": "^8.28.0",
     "eslint": "^9.39.4",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index a542ea8..cb7fa67 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -20,6 +20,12 @@ importers:
       astro:
         specifier: ^5.17.1
         version: 5.17.2(@types/node@24.12.0)(jiti@2.6.1)(rollup@4.57.1)(typescript@5.9.3)(yaml@2.8.2)
+      node:
+        specifier: ^25.6.1
+        version: 25.8.2
+      nodemailer:
+        specifier: ^8.0.4
+        version: 8.0.4
     devDependencies:
       '@astrojs/check':
         specifier: ^0.9.6
@@ -39,6 +45,9 @@ importers:
       '@tailwindcss/typography':
         specifier: ^0.5.19
         version: 0.5.19(tailwindcss@3.4.19(yaml@2.8.2))
+      '@types/nodemailer':
+        specifier: ^7.0.11
+        version: 7.0.11
       '@typescript-eslint/eslint-plugin':
         specifier: ^8.28.0
         version: 8.57.0(@typescript-eslint/parser@8.57.0(eslint@9.39.4(jiti@2.6.1))(typescript@5.9.3))(eslint@9.39.4(jiti@2.6.1))(typescript@5.9.3)
@@ -1205,6 +1214,9 @@ packages:
   '@types/node@24.12.0':
     resolution: {integrity: sha512-GYDxsZi3ChgmckRT9HPU0WEhKLP08ev/Yfcq2AstjrDASOYCSXeyjDsHg4v5t4jOj7cyDX3vmprafKlWIG9MXQ==}
 
+  '@types/nodemailer@7.0.11':
+    resolution: {integrity: sha512-E+U4RzR2dKrx+u3N4DlsmLaDC6mMZOM/TPROxA0UAPiTgI0y4CEFBmZE+coGWTjakDriRsXG368lNk1u9Q0a2g==}
+
   '@types/sax@1.2.7':
     resolution: {integrity: sha512-rO73L89PJxeYM3s3pPPjiPgVVcymqU490g0YO5n5By0k2Erzj6tay/4lr1CHAAU4JyOWd1rpQ8bCf6cZfHU96A==}
 
@@ -2265,6 +2277,9 @@ packages:
   nlcst-to-string@4.0.0:
     resolution: {integrity: sha512-YKLBCcUYKAg0FNlOBT6aI91qFmSiFKiluk655WzPF+DDMA02qIyy8uiRqI8QXtcFpEvll12LpL5MXqEmAZ+dcA==}
 
+  node-bin-setup@1.1.4:
+    resolution: {integrity: sha512-vWNHOne0ZUavArqPP5LJta50+S8R261Fr5SvGul37HbEDcowvLjwdvd0ZeSr0r2lTSrPxl6okq9QUw8BFGiAxA==}
+
   node-fetch-native@1.6.7:
     resolution: {integrity: sha512-g9yhqoedzIUm0nTnTqAQvueMPVOuIY16bqgAJJC8XOOubYFNwz6IER9qs0Gq2Xd0+CecCKFjtdDTMA4u4xG06Q==}
 
@@ -2274,6 +2289,15 @@ packages:
   node-releases@2.0.27:
     resolution: {integrity: sha512-nmh3lCkYZ3grZvqcCH+fjmQ7X+H0OeZgP40OierEaAptX4XofMh5kwNbWh7lBduUzCcV/8kZ+NDLCwm2iorIlA==}
 
+  node@25.8.2:
+    resolution: {integrity: sha512-ooLo0DWtJsL1qq7mv+bIn4HRjUou8PgFr8DqfXuXQOi/yRYrXX5+j82r4Pa6FJYXMBRmRql8Yjv+lVDdz268bQ==}
+    engines: {npm: '>=5.0.0'}
+    hasBin: true
+
+  nodemailer@8.0.4:
+    resolution: {integrity: sha512-k+jf6N8PfQJ0Fe8ZhJlgqU5qJU44Lpvp2yvidH3vp1lPnVQMgi4yEEMPXg5eJS1gFIJTVq1NHBk7Ia9ARdSBdQ==}
+    engines: {node: '>=6.0.0'}
+
   normalize-path@3.0.0:
     resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
     engines: {node: '>=0.10.0'}
@@ -4047,6 +4071,10 @@ snapshots:
     dependencies:
       undici-types: 7.16.0
 
+  '@types/nodemailer@7.0.11':
+    dependencies:
+      '@types/node': 24.12.0
+
   '@types/sax@1.2.7':
     dependencies:
       '@types/node': 24.12.0
@@ -5526,12 +5554,20 @@ snapshots:
     dependencies:
       '@types/nlcst': 2.0.3
 
+  node-bin-setup@1.1.4: {}
+
   node-fetch-native@1.6.7: {}
 
   node-mock-http@1.0.4: {}
 
   node-releases@2.0.27: {}
 
+  node@25.8.2:
+    dependencies:
+      node-bin-setup: 1.1.4
+
+  nodemailer@8.0.4: {}
+
   normalize-path@3.0.0: {}
 
   nth-check@2.1.1:
diff --git a/src/assets/mockups/cube_dashboard.png b/src/assets/mockups/cube_dashboard.png
index d953d57..b941dd2 100644
Binary files a/src/assets/mockups/cube_dashboard.png and b/src/assets/mockups/cube_dashboard.png differ
diff --git a/src/assets/mockups/prism_dashboard.png b/src/assets/mockups/prism_dashboard.png
index 50afd39..652aaae 100644
Binary files a/src/assets/mockups/prism_dashboard.png and b/src/assets/mockups/prism_dashboard.png differ
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index a2412f5..1181b1b 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -5,7 +5,7 @@ const currentYear = new Date().getFullYear();
 <footer class="bg-background text-text-main border-b border-border transition-colors duration-300">
   <hr class="border-border" />
   <div class="w-full px-4 sm:px-6 lg:px-12 py-12">
-    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-12 reveal">
+    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-[1fr_auto_auto] gap-x-16 gap-y-12 reveal">
       
       <div>
         <a href="/" aria-label="Home" class="flex items-center gap-2 group mb-6">
diff --git a/src/components/Header.astro b/src/components/Header.astro
index fdd0301..9c46c69 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -12,53 +12,39 @@
 
       <nav class="hidden md:flex space-x-8 items-center">
         <div class="relative group">
-          <button class="text-text-main hover:text-primary font-medium inline-flex items-center space-x-1 transition-colors font-heading" aria-label="Products Menu">
+          <button class="text-text-main hover:text-primary-dark font-medium inline-flex items-center space-x-1 transition-colors font-heading" aria-label="Products Menu">
             <span>PRODUCTS</span>
             <svg class="w-4 h-4 ml-1 transition-transform group-hover:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg>
           </button>
           <div class="absolute left-0 mt-2 w-56 rounded-xl shadow-xl bg-white/90 dark:bg-zinc-800/90 backdrop-blur-xl ring-1 ring-black ring-opacity-5 opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-200 transform origin-top-left z-50 translate-y-2 group-hover:translate-y-0 text-left">
             <div class="py-2">
-              <a href="https://prism.ultraviolet.rs" target="_blank" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary transition-colors font-heading" role="menuitem" aria-label="Prism AI">PRISM AI</a>
-              <a href="https://cocos.ai" target="_blank" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary transition-colors font-heading" role="menuitem" aria-label="Cocos AI">COCOS AI</a>
-              <a href="https://cube.ultraviolet.rs" target="_blank" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary transition-colors font-heading" role="menuitem" aria-label="Cube AI">CUBE AI</a>
+              <a href="https://prism.ultraviolet.rs" target="_blank" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary-dark transition-colors font-heading" role="menuitem" aria-label="Prism AI">PRISM AI</a>
+              <a href="https://cocos.ai" target="_blank" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary-dark transition-colors font-heading" role="menuitem" aria-label="Cocos AI">COCOS AI</a>
+              <a href="https://cube.ultraviolet.rs" target="_blank" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary-dark transition-colors font-heading" role="menuitem" aria-label="Cube AI">CUBE AI</a>
               <div class="border-t border-border my-1"></div>
-              <a href="/products" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary transition-colors font-heading" role="menuitem">All Products</a>
+              <a href="/products" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary-dark transition-colors font-heading" role="menuitem">All Products</a>
             </div>
           </div>
         </div>
 
         <div class="relative group">
-          <button class="text-text-main hover:text-primary font-medium inline-flex items-center space-x-1 transition-colors font-heading" aria-label="Documentation Menu">
-            <span>DOCUMENTATION</span>
-            <svg class="w-4 h-4 ml-1 transition-transform group-hover:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg>
-          </button>
-           <div class="absolute left-0 mt-2 w-56 rounded-xl shadow-xl bg-white/90 dark:bg-zinc-800/90 backdrop-blur-xl ring-1 ring-black ring-opacity-5 opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-200 transform origin-top-left z-50 translate-y-2 group-hover:translate-y-0 text-left">
-            <div class="py-2">
-              <a href="https://docs.prism.ultraviolet.rs/" target="_blank" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary transition-colors font-heading" aria-label="Prism AI Documentation">PRISM AI</a>
-              <a href="https://docs.cocos.ultraviolet.rs/" target="_blank" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary transition-colors font-heading" aria-label="Cocos AI Documentation">COCOS AI</a>
-              <a href="https://docs.cube.ultraviolet.rs/" target="_blank" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary transition-colors font-heading" aria-label="Cube AI Documentation">CUBE AI</a>
-            </div>
-          </div>
-        </div>
-
-        <div class="relative group">
-          <button class="text-text-main hover:text-primary font-medium inline-flex items-center space-x-1 transition-colors font-heading" aria-label="Projects Menu">
+          <button class="text-text-main hover:text-primary-dark font-medium inline-flex items-center space-x-1 transition-colors font-heading" aria-label="Projects Menu">
             <span>PROJECTS</span>
              <svg class="w-4 h-4 ml-1 transition-transform group-hover:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg>
           </button>
            <div class="absolute left-0 mt-2 w-56 rounded-xl shadow-xl bg-white/90 dark:bg-zinc-800/90 backdrop-blur-xl ring-1 ring-black ring-opacity-5 opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-200 transform origin-top-left z-50 translate-y-2 group-hover:translate-y-0 text-left">
             <div class="py-2">
-              <a href="/projects/confidential6g" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary transition-colors font-heading" aria-label="Confidential 6G">CONFIDENTIAL6G</a>
-              <a href="/projects/elastic" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary transition-colors font-heading" aria-label="Elastic">ELASTIC</a>
-               <a href="/projects/titan" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary transition-colors font-heading" aria-label="Titan">TITAN</a>
+              <a href="/projects/confidential6g" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary-dark transition-colors font-heading" aria-label="Confidential 6G">CONFIDENTIAL6G</a>
+              <a href="/projects/elastic" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary-dark transition-colors font-heading" aria-label="Elastic">ELASTIC</a>
+               <a href="/projects/titan" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary-dark transition-colors font-heading" aria-label="Titan">TITAN</a>
               <div class="border-t border-border my-1"></div>
-              <a href="/projects" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary font-bold transition-colors font-heading" aria-label="All Projects">All Projects</a>
+              <a href="/projects" class="block px-4 py-2 text-sm text-text-main hover:bg-surface-hover hover:text-primary-dark font-bold transition-colors font-heading" aria-label="All Projects">All Projects</a>
             </div>
           </div>
         </div>
 
         <div class="relative group">
-          <button class="text-text-main hover:text-primary font-medium inline-flex items-center space-x-1 transition-colors font-heading" aria-label="Company Menu">
+          <button class="text-text-main hover:text-primary-dark font-medium inline-flex items-center space-x-1 transition-colors font-heading" aria-label="Company Menu">
             <span>COMPANY</span>
              <svg class="w-4 h-4 ml-1 transition-transform group-hover:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg>
           </button>
@@ -68,16 +54,16 @@
                     <div>
                         <h3 class="text-xs font-bold text-text-muted uppercase tracking-widest font-heading mb-4" aria-label="Company">Company</h3>
                         <div class="space-y-3">
-                             <a href="/company" class="block text-sm text-text-main hover:text-primary transition-colors font-heading" aria-label="About Us">About Us</a>
-                             <a href="/careers" class="block text-sm text-text-main hover:text-primary transition-colors font-heading" aria-label="Careers">Careers</a>
-                             <a href="/blog" class="block text-sm text-text-main hover:text-primary transition-colors font-heading" aria-label="Blog">Blog</a>
-                             <a href="/contact" class="block text-sm text-text-main hover:text-primary transition-colors font-heading" aria-label="Contact and Press">Contact & Press</a>
+                             <a href="/company" class="block text-sm text-text-main hover:text-primary-dark transition-colors font-heading" aria-label="About Us">About Us</a>
+                             <a href="/careers" class="block text-sm text-text-main hover:text-primary-dark transition-colors font-heading" aria-label="Careers">Careers</a>
+                             <a href="/blog" class="block text-sm text-text-main hover:text-primary-dark transition-colors font-heading" aria-label="Blog">Blog</a>
+                             <a href="/contact" class="block text-sm text-text-main hover:text-primary-dark transition-colors font-heading" aria-label="Contact and Press">Contact & Press</a>
                         </div>
                     </div>
                     <div>
                         <h3 class="text-xs font-bold text-text-muted uppercase tracking-widest font-heading mb-4" aria-label="Community">Community</h3>
                          <div class="space-y-3">
-                             <a href="https://github.com/ultravioletrs" target="_blank" class="block text-sm text-text-main hover:text-primary transition-colors font-heading" aria-label="GitHub">GitHub</a>
+                             <a href="https://github.com/ultravioletrs" target="_blank" class="block text-sm text-text-main hover:text-primary-dark transition-colors font-heading" aria-label="GitHub">GitHub</a>
                         </div>
                     </div>
                 </div>
@@ -91,7 +77,7 @@
             </div>
           </div>
         </div>
-        <a href="/blog" class="text-text-main hover:text-primary font-medium font-heading transition-colors" aria-label="Blog">BLOG</a>
+        <a href="/blog" class="text-text-main hover:text-primary-dark font-medium font-heading transition-colors" aria-label="Blog">BLOG</a>
 
         <div class="flex items-center space-x-4 ml-4 border-l border-border pl-4">
              <a href="https://github.com/ultravioletrs" target="_blank" class="text-text-muted hover:text-text-main transition-colors">
@@ -131,44 +117,35 @@
       
       <div class="space-y-4">
         <h3 class="text-xs font-bold text-text-muted uppercase tracking-widest font-heading border-b border-border pb-2">Products</h3>
-        <a href="/products" class="block text-3xl font-bold text-text-main hover:text-primary transition-colors font-heading" aria-label="View All Products">
+        <a href="/products" class="block text-3xl font-bold text-text-main hover:text-primary-dark transition-colors font-heading" aria-label="View All Products">
           All Products
         </a>
         <div class="space-y-3 pl-2">
-            <a href="https://prism.ultraviolet.rs" class="flex items-center justify-between text-xl font-medium text-text-muted hover:text-primary transition-colors group font-heading" aria-label="Prism AI Product">
+            <a href="https://prism.ultraviolet.rs" class="flex items-center justify-between text-xl font-medium text-text-muted hover:text-primary-dark transition-colors group font-heading" aria-label="Prism AI Product">
                 <span>Prism AI</span>
                 <span class="opacity-0 group-hover:opacity-100 transition-opacity">→</span>
             </a>
-            <a href="https://cocos.ai" target="_blank" class="flex items-center justify-between text-xl font-medium text-text-muted hover:text-primary transition-colors group font-heading" aria-label="Cocos AI Product">
+            <a href="https://cocos.ai" target="_blank" class="flex items-center justify-between text-xl font-medium text-text-muted hover:text-primary-dark transition-colors group font-heading" aria-label="Cocos AI Product">
                 <span>Cocos AI</span>
                 <span class="opacity-0 group-hover:opacity-100 transition-opacity">→</span>
             </a>
-            <a href="https://cube.ultraviolet.rs" target="_blank" class="flex items-center justify-between text-xl font-medium text-text-muted hover:text-primary transition-colors group font-heading" aria-label="Cube AI Product">
+            <a href="https://cube.ultraviolet.rs" target="_blank" class="flex items-center justify-between text-xl font-medium text-text-muted hover:text-primary-dark transition-colors group font-heading" aria-label="Cube AI Product">
                 <span>Cube AI</span>
                 <span class="opacity-0 group-hover:opacity-100 transition-opacity">→</span>
             </a>
         </div>
       </div>
 
-      <div class="space-y-4">
-        <h3 class="text-xs font-bold text-text-muted uppercase tracking-widest font-heading border-b border-border pb-2">Documentation</h3>
-         <div class="grid grid-cols-1 gap-3 pl-2">
-            <a href="https://docs.prism.ultraviolet.rs/" class="block text-lg font-medium text-text-muted hover:text-primary transition-colors font-heading" aria-label="Prism AI Documentation">Prism AI Docs</a>
-            <a href="https://docs.cocos.ultraviolet.rs/" class="block text-lg font-medium text-text-muted hover:text-primary transition-colors font-heading" aria-label="Cocos AI Documentation">Cocos AI Docs</a>
-            <a href="https://docs.cube.ultraviolet.rs/" class="block text-lg font-medium text-text-muted hover:text-primary transition-colors font-heading" aria-label="Cube AI Documentation">Cube AI Docs</a>
-         </div>
-       </div>
-
       <div class="space-y-4">
         <h3 class="text-xs font-bold text-text-muted uppercase tracking-widest font-heading border-b border-border pb-2">Projects</h3>
-        <a href="/projects" class="block text-3xl font-bold text-text-main hover:text-primary transition-colors font-heading" aria-label="View All Projects">All Projects</a>
+        <a href="/projects" class="block text-3xl font-bold text-text-main hover:text-primary-dark transition-colors font-heading" aria-label="View All Projects">All Projects</a>
       </div>
 
       <div class="pt-8 mt-4 border-t border-border grid grid-cols-2 gap-y-6 gap-x-4">
-          <a href="/company" class="text-xl font-medium text-text-main hover:text-primary transition-colors font-heading" aria-label="Company Page">Company</a>
-          <a href="/careers" class="text-xl font-medium text-text-main hover:text-primary transition-colors font-heading" aria-label="Careers Page">Careers</a>
-          <a href="/contact" class="text-xl font-medium text-text-main hover:text-primary transition-colors font-heading" aria-label="Contact Page">Contact</a>
-          <a href="/blog" class="text-xl font-medium text-text-main hover:text-primary transition-colors font-heading" aria-label="Blog Page">Blog</a>
+          <a href="/company" class="text-xl font-medium text-text-main hover:text-primary-dark transition-colors font-heading" aria-label="Company Page">Company</a>
+          <a href="/careers" class="text-xl font-medium text-text-main hover:text-primary-dark transition-colors font-heading" aria-label="Careers Page">Careers</a>
+          <a href="/contact" class="text-xl font-medium text-text-main hover:text-primary-dark transition-colors font-heading" aria-label="Contact Page">Contact</a>
+          <a href="/blog" class="text-xl font-medium text-text-main hover:text-primary-dark transition-colors font-heading" aria-label="Blog Page">Blog</a>
       </div>
     </div>
   </div>
diff --git a/src/pages/api/contact.js b/src/pages/api/contact.js
new file mode 100644
index 0000000..2693fa1
--- /dev/null
+++ b/src/pages/api/contact.js
@@ -0,0 +1,317 @@
+import nodemailer from "nodemailer";
+
+export const prerender = false;
+
+const EMAIL_REGEX = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+
+const NAME_MIN_LENGTH = 2;
+const NAME_MAX_LENGTH = 120;
+const MESSAGE_MIN_LENGTH = 10;
+const MESSAGE_MAX_LENGTH = 5000;
+
+const ERROR_MESSAGES = {
+  invalidPayload: "Invalid request payload.",
+  invalidName: `Please provide your name (${NAME_MIN_LENGTH} to ${NAME_MAX_LENGTH} characters).`,
+  invalidEmail: "Please provide a valid email address.",
+  invalidMessage: `Please provide a message between ${MESSAGE_MIN_LENGTH} and ${MESSAGE_MAX_LENGTH} characters.`,
+  notConfigured:
+    "Contact form is not configured yet. Please use direct email for now.",
+  sendFailed:
+    "Unable to send your message right now. Please try again or use direct email.",
+};
+
+const json = (payload, status = 200, extraHeaders = {}) =>
+  new Response(JSON.stringify(payload), {
+    status,
+    headers: {
+      "content-type": "application/json; charset=utf-8",
+      "cache-control": "no-store",
+      ...extraHeaders,
+    },
+  });
+
+const getString = (value) => (typeof value === "string" ? value.trim() : "");
+
+const escapeHtml = (value) =>
+  value
+    .replaceAll("&", "&amp;")
+    .replaceAll("<", "&lt;")
+    .replaceAll(">", "&gt;")
+    .replaceAll('"', "&quot;")
+    .replaceAll("'", "&#39;");
+
+const parseBoolean = (value) => value.toLowerCase() === "true";
+
+const parseRequestBody = async (request) => {
+  const contentType = request.headers.get("content-type") || "";
+
+  if (contentType.includes("application/json")) {
+    const body = await request.json();
+    return body && typeof body === "object" ? body : {};
+  }
+
+  const formData = await request.formData();
+  return {
+    name: formData.get("name"),
+    email: formData.get("email"),
+    message: formData.get("message"),
+    company: formData.get("company"),
+  };
+};
+
+const normalizeInput = (payload) => ({
+  name: getString(payload.name),
+  email: getString(payload.email).toLowerCase(),
+  message: getString(payload.message),
+  company: getString(payload.company),
+});
+
+const getTeamContactEmail = (env) =>
+  getString(env?.TEAM_CONTACT_EMAIL || env?.CONTACT_TO_EMAIL);
+
+const getMailFromEmail = (env) =>
+  getString(env?.MAIL_FROM_EMAIL || env?.NO_REPLY_EMAIL || env?.CONTACT_FROM_EMAIL);
+
+const validateInput = ({ name, email, message }) => {
+  if (name.length < NAME_MIN_LENGTH || name.length > NAME_MAX_LENGTH) {
+    return ERROR_MESSAGES.invalidName;
+  }
+
+  if (!EMAIL_REGEX.test(email) || email.length > 254) {
+    return ERROR_MESSAGES.invalidEmail;
+  }
+
+  if (
+    message.length < MESSAGE_MIN_LENGTH ||
+    message.length > MESSAGE_MAX_LENGTH
+  ) {
+    return ERROR_MESSAGES.invalidMessage;
+  }
+
+  return null;
+};
+
+const createTransporter = (env) => {
+  const host = getString(env?.SMTP_HOST);
+  const rawPort = getString(env?.SMTP_PORT);
+  const port = Number.parseInt(rawPort, 10);
+  const rawSecure = getString(env?.SMTP_SECURE);
+  const secure = parseBoolean(rawSecure);
+
+  const user = getString(env?.SMTP_USER);
+  const pass = getString(env?.SMTP_PASS);
+  const hasUser = user.length > 0;
+  const hasPass = pass.length > 0;
+
+  if (
+    !host ||
+    !Number.isFinite(port) ||
+    port <= 0 ||
+    rawSecure === "" ||
+    hasUser !== hasPass
+  ) {
+    return { ok: false, transporter: null };
+  }
+
+  const transportConfig = { host, port, secure };
+  if (hasUser && hasPass) {
+    transportConfig.auth = { user, pass };
+  }
+
+  return {
+    ok: true,
+    transporter: nodemailer.createTransport(transportConfig),
+  };
+};
+
+const sendEmail = async ({
+  transporter,
+  from,
+  to,
+  subject,
+  html,
+  text,
+  replyTo,
+}) => {
+  await transporter.sendMail({
+    from,
+    to,
+    subject,
+    html,
+    text,
+    replyTo,
+  });
+};
+
+const buildInquiryEmail = ({ name, email, message, ip, userAgent }) => {
+  const safeName = escapeHtml(name);
+  const safeEmail = escapeHtml(email);
+  const safeMessage = escapeHtml(message).replaceAll("\n", "<br />");
+  const safeIp = escapeHtml(ip || "unknown");
+  const safeUserAgent = escapeHtml(userAgent || "unknown");
+
+  return {
+    subject: `New contact request from ${name}`,
+    html: `
+      <h2>New website inquiry</h2>
+      <p><strong>Name:</strong> ${safeName}</p>
+      <p><strong>Email:</strong> ${safeEmail}</p>
+      <p><strong>Message:</strong><br />${safeMessage}</p>
+      <hr />
+      <p><strong>IP:</strong> ${safeIp}</p>
+      <p><strong>User-Agent:</strong> ${safeUserAgent}</p>
+    `,
+    text: [
+      "New website inquiry",
+      `Name: ${name}`,
+      `Email: ${email}`,
+      "",
+      "Message:",
+      message,
+      "",
+      `IP: ${ip || "unknown"}`,
+      `User-Agent: ${userAgent || "unknown"}`,
+    ].join("\n"),
+  };
+};
+
+const buildConfirmationEmail = ({ name, message }) => {
+  const safeName = escapeHtml(name);
+  const safeMessage = escapeHtml(message).replaceAll("\n", "<br />");
+
+  return {
+    subject: "We received your message - Ultraviolet",
+    html: `
+      <p>Hi ${safeName},</p>
+      <p>Thanks for contacting Ultraviolet. This is a confirmation copy of your submission.</p>
+      <p><strong>Your message:</strong><br />${safeMessage}</p>
+      <p>Our team typically responds within 1-2 business days.</p>
+      <p>Best regards,<br />Ultraviolet</p>
+    `,
+    text: [
+      `Hi ${name},`,
+      "",
+      "Thanks for contacting Ultraviolet. This is a confirmation copy of your submission.",
+      "",
+      "Your message:",
+      message,
+      "",
+      "Our team typically responds within 1-2 business days.",
+      "",
+      "Best regards,",
+      "Ultraviolet",
+    ].join("\n"),
+  };
+};
+
+const getRuntimeEnv = (locals) =>
+  locals?.runtime?.env ?? globalThis.process?.env ?? {};
+
+const getClientIp = (request) => {
+  const cfIp = request.headers.get("cf-connecting-ip");
+  if (cfIp) return cfIp;
+
+  const forwardedFor = request.headers.get("x-forwarded-for");
+  if (!forwardedFor) return "unknown";
+
+  return forwardedFor.split(",")[0]?.trim() || "unknown";
+};
+
+const handlePost = async ({ request, locals }) => {
+  const env = getRuntimeEnv(locals);
+
+  let payload;
+  try {
+    payload = await parseRequestBody(request);
+  } catch {
+    return json({ ok: false, error: ERROR_MESSAGES.invalidPayload }, 400);
+  }
+
+  const { name, email, message, company } = normalizeInput(payload);
+
+  // Honeypot check - if company field is filled, it's likely a bot
+  if (company) {
+    return json({ ok: true, message: "Message sent." });
+  }
+
+  const validationError = validateInput({ name, email, message });
+  if (validationError) {
+    return json({ ok: false, error: validationError }, 400);
+  }
+
+  const mailFromEmail = getMailFromEmail(env);
+  const teamContactEmail = getTeamContactEmail(env);
+  const transport = createTransporter(env);
+
+  if (!transport.ok || !mailFromEmail || !teamContactEmail) {
+    return json({ ok: false, error: ERROR_MESSAGES.notConfigured }, 503);
+  }
+
+  const inquiry = buildInquiryEmail({
+    name,
+    email,
+    message,
+    ip: getClientIp(request),
+    userAgent: request.headers.get("user-agent") || "unknown",
+  });
+
+  try {
+    await sendEmail({
+      transporter: transport.transporter,
+      from: mailFromEmail,
+      to: teamContactEmail,
+      subject: inquiry.subject,
+      html: inquiry.html,
+      text: inquiry.text,
+      replyTo: email,
+    });
+  } catch (error) {
+    console.error("Contact form delivery failed", error);
+    return json({ ok: false, error: ERROR_MESSAGES.sendFailed }, 502);
+  }
+
+  const confirmation = buildConfirmationEmail({ name, message });
+
+  try {
+    await sendEmail({
+      transporter: transport.transporter,
+      from: mailFromEmail,
+      to: email,
+      subject: confirmation.subject,
+      html: confirmation.html,
+      text: confirmation.text,
+      replyTo: teamContactEmail,
+    });
+  } catch (error) {
+    console.error("Contact form confirmation delivery failed", error);
+    return json({
+      ok: true,
+      message:
+        "Thanks. Your message has been sent, but we could not send the confirmation copy.",
+    });
+  }
+
+  return json({ ok: true, message: "Thanks. Your message has been sent." });
+};
+
+const methodNotAllowed = () =>
+  json(
+    { ok: false, error: "Method not allowed." },
+    405,
+    { Allow: "POST, OPTIONS" },
+  );
+
+export const OPTIONS = async () =>
+  new Response(null, {
+    status: 204,
+    headers: {
+      Allow: "POST, OPTIONS",
+      "cache-control": "no-store",
+    },
+  });
+
+export const POST = handlePost;
+export const GET = methodNotAllowed;
+export const PUT = methodNotAllowed;
+export const PATCH = methodNotAllowed;
+export const DELETE = methodNotAllowed;
\ No newline at end of file
diff --git a/src/pages/contact.astro b/src/pages/contact.astro
index c74b95a..21cdc05 100644
--- a/src/pages/contact.astro
+++ b/src/pages/contact.astro
@@ -2,10 +2,15 @@
 import Layout from '../layouts/Layout.astro';
 import Header from '../components/Header.astro';
 import Footer from '../components/Footer.astro';
-import Newsletter from '../components/Newsletter.astro';
 
 const title = "Contact Ultraviolet - Get in Touch for Secure AI Solutions";
 const description = "Contact Ultraviolet for inquiries about confidential computing, secure collaborative AI, and TEE solutions.";
+
+const email = "info@ultraviolet.rs";
+const githubOrg = "https://github.com/ultravioletrs";
+const linkedin = "https://www.linkedin.com/company/ultravioletrs";
+const twitter = "https://twitter.com/ultravioletrs";
+const contactApiEndpoint = "/api/contact";
 ---
 
 <Layout title={title} description={description}>
@@ -13,46 +18,178 @@ const description = "Contact Ultraviolet for inquiries about confidential comput
 
     <section id="header" class="pt-20">
         <div class="w-full relative">
-            <div class="flex items-center justify-center h-[300px] overflow-hidden border-b border-border bg-background">
+            <div class="flex items-center justify-center h-[300px] overflow-hidden bg-background">
                 <img src="/img/header.avif" alt="pattern-white" class="w-full h-full object-cover object-top" loading="lazy" />
             </div>
         </div>
     </section>
 
-    <section id="contact" class="py-16 bg-background border-b border-border">
+    <section class="py-16 bg-background">
         <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-            <div class="grid grid-cols-1 md:grid-cols-2 gap-12">
-                <div class="bg-background p-8 border border-border reveal-left">
-                     <h2 class="text-2xl font-heading mb-6 font-medium text-text-main">Get In Touch</h2>
-                     <p class="mb-4 text-lg font-body">
-                        <i class="fas fa-envelope mr-3 text-primary-text"></i><a href="mailto:info@ultraviolet.rs" class="text-text-muted hover:text-primary transition-colors">info@ultraviolet.rs</a>
-                     </p>
-                     <p class="mb-4 text-lg font-body">
-                        <i class="fab fa-gitter mr-3 text-primary-text"></i><a href="https://app.gitter.im/#/room/#Ultraviolet_community:gitter.im"
-                        target="_blank" class="text-text-muted hover:text-primary transition-colors">Chat on Gitter</a>
-                     </p>
+            <div class="grid grid-cols-1 lg:grid-cols-2 gap-12 items-start">
+                <div class="reveal-left">
+                    <p class="text-sm font-bold text-primary uppercase tracking-widest mb-4">Contact</p>
+                    <h1 class="text-4xl lg:text-5xl font-heading mb-6 text-text-main font-medium">Talk to our team</h1>
+                    <p class="text-xl text-text-muted font-body mb-8">
+                        Whether you're exploring confidential computing solutions or deploying secure AI infrastructure, reach out. We reply quickly.
+                    </p>
+                    <div class="flex flex-wrap gap-4">
+                        <a href={`mailto:${email}`} class="inline-flex items-center px-8 py-3 bg-primary text-black font-medium border border-primary hover:bg-primary-dark transition-colors uppercase tracking-wide">
+                            Email Us
+                        </a>
+                        <a href={linkedin} target="_blank" class="inline-flex items-center px-8 py-3 bg-transparent text-text-main font-medium border border-border hover:bg-surface transition-colors uppercase tracking-wide">
+                            Connect on LinkedIn
+                        </a>
+                    </div>
                 </div>
-                <div class="bg-background p-8 border border-border reveal-right">
-                    <h2 class="text-2xl font-heading mb-6 font-medium text-text-main">Follow Us</h2>
-                    <ul class="flex flex-col space-y-4 list-none p-0 m-0 font-body">
-                        <li>
-                             <a href="https://twitter.com/ultravioletrs" target="_blank" class="flex items-center text-text-muted hover:text-primary transition-colors text-lg">
-                                <i class="fab fa-twitter text-2xl mr-4 w-8 text-center text-primary-text"></i>Twitter
+
+                <div class="bg-surface p-8 border border-border reveal-right">
+                    <div>
+                        <p class="text-sm font-bold text-text-muted uppercase tracking-widest mb-2">Primary contact</p>
+                        <a href={`mailto:${email}`} class="text-xl font-semibold text-primary hover:text-primary-dark transition-colors">
+                            {email}
+                        </a>
+                        <p class="mt-2 text-sm text-text-muted">
+                            Best for architecture reviews, production deployments, and security discussions.
+                        </p>
+                    </div>
+
+                    <div class="my-6 border-t border-border"></div>
+
+                    <div class="space-y-3 text-sm">
+                        <div class="flex items-center justify-between">
+                            <span class="text-text-muted">GitHub</span>
+                            <a href={githubOrg} target="_blank" rel="noopener noreferrer" class="font-medium text-text-main hover:text-primary transition-colors">
+                                github.com/ultravioletrs
                             </a>
-                        </li>
-                        <li>
-                            <a href="https://www.linkedin.com/company/ultravioletrs" target="_blank" class="flex items-center text-text-muted hover:text-primary transition-colors text-lg">
-                                <i class="fab fa-linkedin text-2xl mr-4 w-8 text-center text-primary-text"></i>LinkedIn
+                        </div>
+
+                        <div class="flex items-center justify-between">
+                            <span class="text-text-muted">LinkedIn</span>
+                            <a href={linkedin} target="_blank" rel="noopener noreferrer" class="font-medium text-text-main hover:text-primary transition-colors">
+                                Ultraviolet
                             </a>
-                        </li>
-                        <li>
-                             <a href="https://github.com/ultravioletrs" target="_blank" class="flex items-center text-text-muted hover:text-primary transition-colors text-lg">
-                                <i class="fab fa-github text-2xl mr-4 w-8 text-center text-primary-text"></i>GitHub
+                        </div>
+
+                        <div class="flex items-center justify-between">
+                            <span class="text-text-muted">Twitter</span>
+                            <a href={twitter} target="_blank" rel="noopener noreferrer" class="font-medium text-text-main hover:text-primary transition-colors">
+                                @ultravioletrs
                             </a>
-                        </li>
-                    </ul>
+                        </div>
+                    </div>
+
+                    <p class="mt-6 text-xs text-text-muted">
+                        We typically respond within 1–2 business days.
+                    </p>
                 </div>
             </div>
+            <hr class="border-border mt-16" />
+        </div>
+    </section>
+
+    <section class="py-16 bg-background">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="text-center mb-12 reveal">
+                <h2 class="text-3xl font-heading mb-4 text-text-main font-medium">Choose the fastest path</h2>
+                <p class="text-lg text-text-muted font-body">Email works best for technical discussions. GitHub is ideal for issues and PRs.</p>
+            </div>
+
+            <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
+                <a href={`mailto:${email}`} class="bg-surface p-8 border border-border hover:border-primary transition-all group reveal reveal-delay-1">
+                    <p class="text-sm font-bold text-text-muted uppercase tracking-widest mb-2">Email</p>
+                    <h3 class="text-xl font-heading mb-4 text-text-main font-medium">Production & Deployments</h3>
+                    <p class="text-text-muted font-body mb-6">
+                        Architecture questions, rollout plans, security reviews, and enterprise deployments.
+                    </p>
+                    <p class="font-medium text-primary group-hover:text-primary-dark transition-colors">Email us →</p>
+                </a>
+
+                <a href={githubOrg} target="_blank" rel="noopener noreferrer" class="bg-surface p-8 border border-border hover:border-primary transition-all group reveal reveal-delay-2">
+                    <p class="text-sm font-bold text-text-muted uppercase tracking-widest mb-2">GitHub</p>
+                    <h3 class="text-xl font-heading mb-4 text-text-main font-medium">Open-source Support</h3>
+                    <p class="text-text-muted font-body mb-6">
+                        Bugs, feature requests, roadmap discussions, and contributions.
+                    </p>
+                    <p class="font-medium text-primary group-hover:text-primary-dark transition-colors">Open GitHub →</p>
+                </a>
+
+                <a href={linkedin} target="_blank" rel="noopener noreferrer" class="bg-surface p-8 border border-border hover:border-primary transition-all group reveal reveal-delay-3">
+                    <p class="text-sm font-bold text-text-muted uppercase tracking-widest mb-2">LinkedIn</p>
+                    <h3 class="text-xl font-heading mb-4 text-text-main font-medium">Partnerships</h3>
+                    <p class="text-text-muted font-body mb-6">
+                        Research collaboration, ecosystem partnerships, and business inquiries.
+                    </p>
+                    <p class="font-medium text-primary group-hover:text-primary-dark transition-colors">Visit LinkedIn →</p>
+                </a>
+            </div>
+            <hr class="border-border mt-16" />
+        </div>
+    </section>
+
+    <section class="py-16 bg-background">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="text-center mb-12 reveal">
+                <h2 class="text-3xl font-heading mb-4 text-text-main font-medium">Send a message</h2>
+                <p class="text-lg text-text-muted font-body">Send details directly from the form. If delivery fails, use email fallback.</p>
+            </div>
+
+            <form class="space-y-6 reveal" method="post" action={contactApiEndpoint} data-contact-form>
+                <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
+                    <label class="flex flex-col gap-2">
+                        <span class="text-sm text-text-muted font-medium">Name</span>
+                        <input
+                            class="w-full px-4 py-3 bg-surface border border-border text-text-main placeholder-text-muted focus:outline-none focus:border-primary transition-colors"
+                            name="name"
+                            autocomplete="name"
+                            required
+                        />
+                    </label>
+
+                    <label class="flex flex-col gap-2">
+                        <span class="text-sm text-text-muted font-medium">Email</span>
+                        <input
+                            class="w-full px-4 py-3 bg-surface border border-border text-text-main placeholder-text-muted focus:outline-none focus:border-primary transition-colors"
+                            name="email"
+                            type="email"
+                            autocomplete="email"
+                            required
+                        />
+                    </label>
+                </div>
+
+                <label class="flex flex-col gap-2">
+                    <span class="text-sm text-text-muted font-medium">Message</span>
+                    <textarea
+                        class="w-full px-4 py-3 bg-surface border border-border text-text-main placeholder-text-muted focus:outline-none focus:border-primary transition-colors min-h-[160px]"
+                        name="message"
+                        required
+                        placeholder="What are you building? What do you need help with? Any security or compliance requirements?"
+                    ></textarea>
+                </label>
+
+                <div class="hidden" aria-hidden="true">
+                    <label for="company">Company</label>
+                    <input id="company" name="company" tabindex="-1" autocomplete="off" />
+                </div>
+
+                <div class="flex flex-wrap items-center gap-4">
+                    <button class="inline-flex items-center px-8 py-3 bg-primary text-black font-medium border border-primary hover:bg-primary-dark transition-colors uppercase tracking-wide" type="submit" data-contact-submit>
+                        Send Message
+                    </button>
+
+                    <a class="inline-flex items-center px-8 py-3 bg-transparent text-text-main font-medium border border-border hover:bg-surface transition-colors uppercase tracking-wide" href={`mailto:${email}?subject=${encodeURIComponent("Ultraviolet — Inquiry")}`}>
+                        Send via Email
+                    </a>
+                </div>
+
+                <p class="text-sm text-text-muted">
+                    Prefer GitHub? Open an issue in our <a href={githubOrg} target="_blank" rel="noopener noreferrer" class="font-semibold text-primary hover:text-primary-dark transition-colors">repositories</a>.
+                </p>
+
+                <p class="min-h-6 text-sm text-text-muted" role="status" aria-live="polite" data-contact-status></p>
+            </form>
+            <hr class="border-border mt-16" />
         </div>
     </section>
 
@@ -76,7 +213,82 @@ const description = "Contact Ultraviolet for inquiries about confidential comput
         </div>
     </section>
 
-    <Newsletter />
-
     <Footer slot="footer" />
 </Layout>
+
+<script is:inline>
+(() => {
+    const form = document.querySelector("[data-contact-form]");
+    if (!(form instanceof HTMLFormElement)) return;
+
+    const statusEl = document.querySelector("[data-contact-status]");
+    const submitButton = form.querySelector("[data-contact-submit]");
+    if (!(statusEl instanceof HTMLElement)) return;
+    if (!(submitButton instanceof HTMLButtonElement)) return;
+
+    const defaultLabel = submitButton.textContent?.trim() || "Send Message";
+
+    const setStatus = (text, tone = "muted") => {
+        statusEl.textContent = text;
+        statusEl.classList.remove("text-text-muted", "text-red-500", "text-green-500");
+        if (tone === "success") {
+            statusEl.classList.add("text-green-500");
+            return;
+        }
+        if (tone === "error") {
+            statusEl.classList.add("text-red-500");
+            return;
+        }
+        statusEl.classList.add("text-text-muted");
+    };
+
+    form.addEventListener("submit", async (event) => {
+        event.preventDefault();
+        submitButton.disabled = true;
+        submitButton.setAttribute("aria-busy", "true");
+        submitButton.textContent = "Sending...";
+        setStatus("Sending your message...");
+
+        try {
+            const response = await fetch(form.action, {
+                method: "POST",
+                body: new FormData(form),
+                headers: {
+                    Accept: "application/json",
+                },
+            });
+
+            let payload = null;
+            try {
+                payload = await response.json();
+            } catch {
+                payload = null;
+            }
+
+            if (!response.ok || !payload?.ok) {
+                throw new Error(
+                    payload?.error ||
+                    "Unable to send your message. Please use direct email."
+                );
+            }
+
+            form.reset();
+            setStatus(
+                payload?.message || "Thanks! Your message has been sent.",
+                "success"
+            );
+        } catch (error) {
+            setStatus(
+                error instanceof Error
+                    ? error.message
+                    : "Unable to send your message. Please use direct email.",
+                "error"
+            );
+        } finally {
+            submitButton.disabled = false;
+            submitButton.removeAttribute("aria-busy");
+            submitButton.textContent = defaultLabel;
+        }
+    });
+})();
+</script>
\ No newline at end of file
diff --git a/src/pages/index.astro b/src/pages/index.astro
index c1bcfa1..b78aa72 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -27,23 +27,72 @@ import imdeaLogo from '../assets/logos/imdea.svg';
 import lfLogo from '../assets/logos/lf.png';
 import cccLogo from '../assets/logos/ccc.png';
 
+import tucLogo from '../assets/logos/TUC.png';
+import imecLogo from '../assets/logos/IMEC.png';
+import aalLogo from '../assets/logos/AAL.png';
+import lundLogo from '../assets/logos/LUND.png';
+import zenLogo from '../assets/logos/zen.png';
+import politoLogo from '../assets/logos/POLITO.png';
+import amaLogo from '../assets/logos/AMA.png';
+import wingsLogo from '../assets/logos/wings-logo.png';
+import nokia1Logo from '../assets/logos/nokia-1.png';
+import nokiaBellLabsLogo from '../assets/logos/nokia-bellLabs.png';
+import tuGratzLogo from '../assets/logos/tu-gratz.png';
+import ucdLogo from '../assets/logos/ucd-1.png';
+import tuwLogo from '../assets/logos/tuw.png';
+import murciaLogo from '../assets/logos/Universidad-de-Murcia.png';
+import canarybitLogo from '../assets/logos/canarybit.png';
+import f6sLogo from '../assets/logos/f6s.png';
+import easternLogo from '../assets/logos/universityofeastern.png';
+import odysseusLogo from '../assets/logos/odysseus.png';
+import trilateralLogo from '../assets/logos/Trilateral-Research.png';
+import chariteLogo from '../assets/logos/charite.png';
+import sargaLogo from '../assets/logos/SARGA.png';
+import venetoLogo from '../assets/logos/regione-del-veneto.png';
+import koblenzLogo from '../assets/logos/university-of-koblenz.png';
+import itaLogo from '../assets/logos/ITA.png';
+
 const title = "Open Source Confidential Computing & Secure AI Platform | Ultraviolet";
 
 const clientLogos = [
-    { src: ifLogo, alt: "IF", class: "h-10" },
-    { src: etfLogo, alt: "ETF", class: "h-14" },
-    { src: euLogo, alt: "EU", class: "h-10" },
-    { src: telefonicaLogo, alt: "Telefonica", class: "h-8" },
-    { src: vttLogo, alt: "VTT", class: "h-8" },
-    { src: fujitsuLogo, alt: "Fujitsu", class: "h-8" },
-    { src: fraunhoferLogo, alt: "Fraunhofer", class: "h-6" },
-    { src: tnoLogo, alt: "TNO", class: "h-8" },
-    { src: ericssonLogo, alt: "Ericsson", class: "h-16" },
-    { src: nokiaLogo, alt: "Nokia", class: "h-16" },
-    { src: insermLogo, alt: "Inserm", class: "h-14" },
-    { src: tueLogo, alt: "TUE", class: "h-8" },
-    { src: thalesLogo, alt: "Thales", class: "h-20" },
-    { src: imdeaLogo, alt: "Imdea", class: "h-10" }
+    { src: ifLogo, alt: "IF" },
+    { src: etfLogo, alt: "ETF" },
+    { src: euLogo, alt: "EU" },
+    { src: telefonicaLogo, alt: "Telefonica" },
+    { src: vttLogo, alt: "VTT" },
+    { src: fujitsuLogo, alt: "Fujitsu" },
+    { src: fraunhoferLogo, alt: "Fraunhofer" },
+    { src: tnoLogo, alt: "TNO" },
+    { src: ericssonLogo, alt: "Ericsson" },
+    { src: nokiaLogo, alt: "Nokia" },
+    { src: insermLogo, alt: "Inserm" },
+    { src: tueLogo, alt: "TU Eindhoven" },
+    { src: thalesLogo, alt: "Thales" },
+    { src: imdeaLogo, alt: "IMDEA" },
+    { src: tucLogo, alt: "Technical University of Crete" },
+    { src: imecLogo, alt: "IMEC" },
+    { src: aalLogo, alt: "Aalto University" },
+    { src: lundLogo, alt: "Lund University" },
+    { src: zenLogo, alt: "Zentrix Labs" },
+    { src: politoLogo, alt: "Politecnico di Torino" },
+    { src: amaLogo, alt: "AMA" },
+    { src: wingsLogo, alt: "Wings" },
+    { src: nokia1Logo, alt: "Nokia" },
+    { src: nokiaBellLabsLogo, alt: "Nokia Bell Labs" },
+    { src: tuGratzLogo, alt: "TU Graz" },
+    { src: ucdLogo, alt: "UCD" },
+    { src: tuwLogo, alt: "TU Wien" },
+    { src: murciaLogo, alt: "Universidad de Murcia" },
+    { src: canarybitLogo, alt: "Canarybit" },
+    { src: f6sLogo, alt: "F6S" },
+    { src: easternLogo, alt: "University of Eastern Finland" },
+    { src: odysseusLogo, alt: "Odysseus Data Services" },
+    { src: trilateralLogo, alt: "Trilateral Research" },
+    { src: chariteLogo, alt: "Charité University Hospital" },
+    { src: sargaLogo, alt: "SARGA" },
+    { src: venetoLogo, alt: "Regione del Veneto" },
+    { src: koblenzLogo, alt: "University of Koblenz" },
+    { src: itaLogo, alt: "ITA" },
 ];
 ---
 
@@ -61,12 +110,12 @@ const clientLogos = [
 	<section class="border-b border-border py-12">
 		<div class="px-4 text-center reveal">
       <h2 class="text-sm font-body text-text-muted mb-8 tracking-widest uppercase">Our Memberships</h2>
-			<div class="flex justify-center flex-wrap gap-12 items-center opacity-80 hover:opacity-100 transition-opacity">
-				<a href="https://www.linuxfoundation.org/" target="_blank">
-                    <Image src={lfLogo} alt="Linux Foundation" class="h-10 w-auto object-contain grayscale hover:grayscale-0 transition-all dark:invert" loading="eager" />
+			<div class="flex justify-center flex-wrap gap-12 items-center transition-opacity">
+				<a href="https://www.linuxfoundation.org/" target="_blank" class="bg-white px-4 py-3">
+                    <Image src={lfLogo} alt="Linux Foundation" class="h-14 w-auto object-contain transition-all" loading="eager" />
                 </a>
-                <a href="https://confidentialcomputing.io/" target="_blank">
-                    <Image src={cccLogo} alt="Confidential Computing Consortium" class="h-10 w-auto object-contain grayscale hover:grayscale-0 transition-all dark:invert" loading="eager" />
+                <a href="https://confidentialcomputing.io/" target="_blank" class="bg-white px-4 py-3">
+                    <Image src={cccLogo} alt="Confidential Computing Consortium" class="h-14 w-auto object-contain transition-all" loading="eager" />
                 </a>
 			</div>
 		</div>
@@ -86,7 +135,9 @@ const clientLogos = [
                             class="clients-marquee-item flex justify-center items-center px-10 py-6"
                             aria-hidden={isDuplicate ? 'true' : undefined}
                         >
-                            <Image src={logo.src} alt={logo.alt} class={`${logo.class} w-auto object-contain grayscale opacity-60 hover:grayscale-0 hover:opacity-100 transition-all dark:invert`} loading="lazy" />
+                            <div class="bg-white px-4 py-3">
+                                <Image src={logo.src} alt={logo.alt} class="h-14 w-auto object-contain transition-all" loading="lazy" />
+                            </div>
                         </div>
                     );
                 })}
@@ -95,9 +146,9 @@ const clientLogos = [
     </section>
 
     <section id="cube-ai" class="py-24 border-b border-border bg-background">
-        <div class="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8">
-            <div class="lg:grid lg:grid-cols-12 lg:gap-12 xl:gap-16 lg:items-center">
-                <div class="mb-12 lg:mb-0 lg:col-span-5 reveal-left">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="lg:grid lg:grid-cols-5 lg:gap-12 xl:gap-16 lg:items-center">
+                <div class="lg:col-span-2 mb-12 lg:mb-0 reveal-left">
                     <div class="mb-6 flex items-center text-sm font-bold text-primary-text uppercase tracking-wider">
                         <span class="w-2 h-1 bg-primary-text mr-3 inline-block"></span> Cube AI <span class="w-2 h-1 bg-primary-text ml-3 inline-block"></span>
                     </div>
@@ -126,17 +177,17 @@ const clientLogos = [
                         Explore Cube
                     </a>
                 </div>
-                <div class="flex justify-center items-center lg:col-span-7 reveal-right">
-                     <Image class="w-full h-auto border border-border" src={ccImage} alt="Cube AI Dashboard" loading="lazy" />
+                <div class="lg:col-span-3 flex justify-center items-center reveal-right">
+                     <Image class="w-full h-auto rounded-lg border-2 border-gray-500" src={ccImage} alt="Cube AI Dashboard" loading="lazy" />
                 </div>
             </div>
         </div>
     </section>
 
     <section id="prism-ai" class="py-24 border-b border-border bg-background">
-        <div class="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8">
-            <div class="lg:grid lg:grid-cols-12 lg:gap-12 xl:gap-16 lg:items-center">
-                <div class="mb-12 lg:mb-0 lg:col-span-5 reveal-left">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="lg:grid lg:grid-cols-5 lg:gap-12 xl:gap-16 lg:items-center">
+                <div class="lg:col-span-2 mb-12 lg:mb-0 reveal-left">
                     <div class="mb-6 flex items-center text-sm font-bold text-primary-text uppercase tracking-wider">
                         <span class="w-2 h-1 bg-primary-text mr-3 inline-block"></span> Prism AI <span class="w-2 h-1 bg-primary-text ml-3 inline-block"></span>
                     </div>
@@ -168,17 +219,17 @@ const clientLogos = [
                         Explore Prism
                     </a>
                 </div>
-                <div class="flex justify-center items-center lg:col-span-7 reveal-right">
-                     <Image class="w-full h-auto border border-border" src={prismConceptImage} alt="Prism AI Dashboard" loading="lazy" />
+                <div class="lg:col-span-3 flex justify-center items-center reveal-right">
+                     <Image class="w-full h-auto rounded-lg border-2 border-gray-500" src={prismConceptImage} alt="Prism AI Dashboard" loading="lazy" />
                 </div>
             </div>
         </div>
     </section>
 
     <section id="cocos-ai" class="py-24 border-b border-border bg-background">
-        <div class="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8">
-            <div class="lg:grid lg:grid-cols-2 lg:gap-24 lg:items-center">
-                <div class="mb-10 lg:mb-0 reveal-left">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="lg:grid lg:grid-cols-5 lg:gap-16 lg:items-center">
+                <div class="lg:col-span-2 mb-10 lg:mb-0 reveal-left">
                     <div class="mb-6 flex items-center text-sm font-bold text-primary-text uppercase tracking-wider">
                         <span class="w-2 h-1 bg-primary-text mr-3 inline-block"></span> Cocos AI <span class="w-2 h-1 bg-primary-text ml-3 inline-block"></span>
                     </div>
@@ -193,8 +244,8 @@ const clientLogos = [
                         Explore Cocos
                     </a>
                 </div>
-                <div class="flex justify-center items-center reveal-right">
-                     <Image class="w-full h-auto border border-border opacity-80" src={openSourceImage} alt="Cocos AI architecture diagram" loading="lazy" />
+                <div class="lg:col-span-3 flex justify-center items-center reveal-right">
+                     <Image class="w-full h-auto rounded-lg border-2 border-gray-500 opacity-80" src={openSourceImage} alt="Cocos AI architecture diagram" loading="lazy" />
                 </div>
             </div>
         </div>
@@ -205,8 +256,8 @@ const clientLogos = [
             <h2 class="text-4xl md:text-5xl font-heading mb-10 leading-tight">
                 Ready to build secure AI workflows with confidential computing?
             </h2>
-            <a href="/products" class="inline-block bg-primary text-black font-semibold py-4 px-10 hover:bg-primary-dark transition-colors">
-                Explore Our Products
+            <a href="/contact" class="inline-block bg-primary text-black font-semibold py-4 px-10 hover:bg-primary-dark transition-colors">
+                Contact Us
             </a>
         </div>
     </section>
diff --git a/src/pages/projects/confidential6g.astro b/src/pages/projects/confidential6g.astro
index 837caa7..63b6cd9 100644
--- a/src/pages/projects/confidential6g.astro
+++ b/src/pages/projects/confidential6g.astro
@@ -53,7 +53,9 @@ const description = "CONFIDENTIAL6G is an EU-funded project developing quantum-r
 
     <section id="project-title" class="project-page-section">
         <div class="project-page-container text-center reveal-scale">
-            <img src="/img/c6g.png" alt="CONFIDENTIAL6G Logo" class="mb-8 mx-auto dark:invert" style="max-height: 120px" />
+            <div class="bg-white px-6 py-4 inline-block mb-8">
+                <img src="/img/c6g.png" alt="CONFIDENTIAL6G Logo" class="mx-auto" style="max-height: 120px" />
+            </div>
             <h1 class="text-3xl lg:text-4xl font-heading mb-6 text-text-main font-medium">CONFIDENTIAL6G</h1>
             <p class="text-xl text-text-muted font-body">
                 Quantum-resistant cryptographic protocols and security frameworks for 6G confidential computing
@@ -346,7 +348,9 @@ const description = "CONFIDENTIAL6G is an EU-funded project developing quantum-r
 
                     return (
                         <div class="clients-marquee-item flex justify-center items-center px-10 py-6" aria-hidden={isDuplicate ? 'true' : undefined}>
-                            <img src={logo.src} alt={logo.alt} class="h-10 w-auto object-contain grayscale opacity-60 hover:grayscale-0 hover:opacity-100 transition-all dark:invert" loading="lazy" />
+                            <div class="bg-white px-4 py-3">
+                                <img src={logo.src} alt={logo.alt} class="h-14 w-auto object-contain transition-all" loading="lazy" />
+                            </div>
                         </div>
                     );
                 })}
diff --git a/src/pages/projects/elastic.astro b/src/pages/projects/elastic.astro
index 86d0340..c27a87a 100644
--- a/src/pages/projects/elastic.astro
+++ b/src/pages/projects/elastic.astro
@@ -66,7 +66,9 @@ const description = "ELASTIC is an EU-funded project pioneering next-gen network
     <section id="project-title" class="project-page-section">
         <div class="project-page-container text-center reveal-scale">
             <div class="mb-8">
-                 <Image src={elasticLogo} alt="ELASTIC Logo" class="mx-auto block dark:invert" style="max-height: 120px" loading="eager" />
+                <div class="bg-gray-800 px-6 py-4 inline-block">
+                    <Image src={elasticLogo} alt="ELASTIC Logo" class="mx-auto block" style="max-height: 120px" loading="eager" />
+                </div>
             </div>
             <h1 class="text-3xl lg:text-4xl font-heading mb-6 text-text-main font-medium">ELASTIC</h1>
             <p class="text-xl text-text-muted font-body">
@@ -322,7 +324,9 @@ const description = "ELASTIC is an EU-funded project pioneering next-gen network
 
                     return (
                         <div class="clients-marquee-item flex justify-center items-center px-10 py-6" aria-hidden={isDuplicate ? 'true' : undefined}>
-                            <Image src={logo.src} alt={logo.alt} class="h-10 w-auto object-contain grayscale opacity-60 hover:grayscale-0 hover:opacity-100 transition-all dark:invert" loading="lazy" />
+                            <div class="bg-white px-4 py-3">
+                                <Image src={logo.src} alt={logo.alt} class="h-14 w-auto object-contain transition-all" loading="lazy" />
+                            </div>
                         </div>
                     );
                 })}
diff --git a/src/pages/projects/index.astro b/src/pages/projects/index.astro
index 227b4f4..e91fc73 100644
--- a/src/pages/projects/index.astro
+++ b/src/pages/projects/index.astro
@@ -18,7 +18,7 @@ const projects = [
         description: "A software architecture for extreme-scale analytics. ELASTIC redefines service orchestration within 6G networks, integrating technologies like WebAssembly and Confidential Computing.",
         image: "/img/logos/elastic.png",
         link: "/projects/elastic",
-        logoStyle: "max-height: 60px; background: #323232; border-radius: 5px; padding: 5px;"
+        logoStyle: "max-height: 60px;"
     },
     {
         name: "TITAN",
@@ -93,7 +93,9 @@ const description = "Explore Ultraviolet's research projects in confidential com
                     <div class={`flex flex-col h-full ${index !== projects.length - 1 ? 'md:border-r border-border' : ''} border-b md:border-b-0 border-border reveal reveal-delay-${index + 1}`}>
                         <div class="p-8 lg:p-12 hover:bg-surface transition-colors h-full flex flex-col items-center text-center">
                             <div class="mb-8 h-[120px] flex items-center justify-center">
-                                <img src={project.image} alt={`${project.name} Logo`} style={project.logoStyle} class="max-w-full dark:invert" />
+                                <div class:list={[project.name === 'ELASTIC' ? 'bg-gray-800' : 'bg-white', 'px-6 py-4']}>
+                                    <img src={project.image} alt={`${project.name} Logo`} style={project.logoStyle} class="max-w-full" />
+                                </div>
                             </div>
                             <h3 class="text-xl font-heading mb-4 text-text-main font-medium">{project.name}</h3>
                             <p class="text-text-muted font-body mb-8 flex-grow">
diff --git a/src/pages/projects/titan.astro b/src/pages/projects/titan.astro
index 9d3dd95..8193e2e 100644
--- a/src/pages/projects/titan.astro
+++ b/src/pages/projects/titan.astro
@@ -75,7 +75,9 @@ const description = "TITAN is an EU-funded project building trusted AI systems u
 
     <section id="project-title" class="project-page-section">
         <div class="project-page-container text-center reveal-scale">
-            <Image src={titanLogo} alt="TITAN Logo" class="mb-8 mx-auto dark:invert" style="max-height: 120px" loading="eager" />
+            <div class="bg-white px-6 py-4 inline-block mb-8">
+                <Image src={titanLogo} alt="TITAN Logo" class="mx-auto" style="max-height: 120px" loading="eager" />
+            </div>
             <h1 class="text-3xl lg:text-4xl font-heading mb-6 text-text-main font-medium">TITAN</h1>
             <p class="text-xl text-text-muted font-body">
                 Trusted AI systems through confidential computing and privacy-preserving technologies
@@ -264,7 +266,9 @@ const description = "TITAN is an EU-funded project building trusted AI systems u
 
                     return (
                         <div class="clients-marquee-item flex justify-center items-center px-10 py-6" aria-hidden={isDuplicate ? 'true' : undefined}>
-                            <Image src={logo.src} alt={logo.alt} class="h-10 w-auto object-contain grayscale opacity-60 hover:grayscale-0 hover:opacity-100 transition-all dark:invert" loading="lazy" />
+                            <div class="bg-white px-4 py-3">
+                                <Image src={logo.src} alt={logo.alt} class="h-14 w-auto object-contain transition-all" loading="lazy" />
+                            </div>
                         </div>
                     );
                 })}
diff --git a/src/pages/rss.xml.ts b/src/pages/rss.xml.ts
new file mode 100644
index 0000000..6d66737
--- /dev/null
+++ b/src/pages/rss.xml.ts
@@ -0,0 +1,30 @@
+import rss from "@astrojs/rss";
+import type { APIContext } from "astro";
+import { getCollection } from "astro:content";
+
+const DEFAULT_SITE = "https://www.ultraviolet.rs";
+
+export async function GET(context: APIContext) {
+  const posts = await getCollection("blog", ({ data }) => !data.draft);
+
+  return rss({
+    title: "Ultraviolet Blog",
+    description:
+      "Technical articles, product updates, and engineering deep dives from the Ultraviolet team.",
+    site: context.site ?? DEFAULT_SITE,
+    customData: `<language>en-us</language>`,
+    items: posts
+      .map((post) => {
+        const slug = post.data.slug ?? post.slug;
+        return {
+          title: post.data.title,
+          pubDate: post.data.date,
+          description: post.data.description,
+          link: `/blog/${slug}/`,
+          categories: post.data.tags ?? [],
+          author: post.data.author?.name,
+        };
+      })
+      .sort((a, b) => (b.pubDate?.getTime() ?? 0) - (a.pubDate?.getTime() ?? 0)),
+  });
+}
diff --git a/src/styles/global.css b/src/styles/global.css
index ce36e7b..1244cdf 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -57,7 +57,7 @@
   }
 
   .clients-marquee-track {
-    animation: clients-marquee-rtl 36s linear infinite;
+    animation: clients-marquee-rtl 60s linear infinite;
     will-change: transform;
   }