diff --git a/src/app/globals.css b/src/app/globals.css
index 574eee0..5e849e2 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -10,6 +10,7 @@
   --ext-color-primary-5: #e7ccc0;
   --ext-color-primary-6: #64b3b4;
   --ext-color-primary-7: #a8dcca;
+  --ext-color-primary-8: #e3b19b;
   --background: #ffffff;
   --foreground: #171717;
 }
@@ -23,6 +24,7 @@
     --ext-color-primary-5: #e7ccc0;
     --ext-color-primary-6: #64b3b4;
     --ext-color-primary-7: #a8dcca;
+    --ext-color-primary-8: #e3b19b;
     --background: #0a0a0a;
     --foreground: #ededed;
   }
diff --git a/src/components/Blocks/BeforeFooter/index.tsx b/src/components/Blocks/BeforeFooter/index.tsx
index 9a151ae..86ba85b 100644
--- a/src/components/Blocks/BeforeFooter/index.tsx
+++ b/src/components/Blocks/BeforeFooter/index.tsx
@@ -52,7 +52,7 @@ export function BeforeFooterBlock({ title, description, buttonText, showLinier =
         <div className="pt-5">
           <Link
             href="/contact"
-            className="inline-block bg-[#2E2D51] hover:bg-[#232244] text-white py-3 px-6 rounded-full text-lg shadow-lg transition-all"
+            className="inline-block bg-extColorPrimary6 hover:bg-extColorPrimary8 text-white py-3 px-6 rounded-full text-lg shadow-lg transition-all duration-500"
           >
             {buttonText ?? placeholderButtonText} →
           </Link>
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 7578dd2..c029df4 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -18,6 +18,7 @@ export default {
         extColorPrimary5: "var(--ext-color-primary-5)",
         extColorPrimary6: "var(--ext-color-primary-6)",
         extColorPrimary7: "var(--ext-color-primary-7)",
+        extColorPrimary8: "var(--ext-color-primary-8)",
       },
     },
   },