From 9bbe263701198ca33a91107fa72335c6e148c511 Mon Sep 17 00:00:00 2001
From: kudinDmitriyUp <kudin.dmitriy.up@gmail.com>
Date: Thu, 16 Apr 2026 05:40:37 +0000
Subject: [PATCH] Bob AI: Apply CSS styles to the buttons in the hero section
 to give

---
 src/components/sections/hero/HeroAnimated.tsx |  4 ++--
 src/index.css                                 | 10 ++++++++++
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/components/sections/hero/HeroAnimated.tsx b/src/components/sections/hero/HeroAnimated.tsx
index ce162a1..172378c 100644
--- a/src/components/sections/hero/HeroAnimated.tsx
+++ b/src/components/sections/hero/HeroAnimated.tsx
@@ -54,8 +54,8 @@ const HeroAnimated = ({
             className="max-w-8/10 text-lg md:text-xl leading-tight text-center"
           />
           <div className="flex flex-wrap justify-center gap-3 mt-2">
-            <Button text={primaryButton.text} href={primaryButton.href} variant="primary" animate />
-            <Button text={secondaryButton.text} href={secondaryButton.href} variant="secondary" animate delay={0.1} />
+            <Button text={primaryButton.text} href={primaryButton.href} variant="primary" animate className="btn-3d" />
+            <Button text={secondaryButton.text} href={secondaryButton.href} variant="secondary" animate delay={0.1} className="btn-3d" />
           </div>
         </div>
       </div>
diff --git a/src/index.css b/src/index.css
index 55745eb..af63c5c 100644
--- a/src/index.css
+++ b/src/index.css
@@ -194,3 +194,13 @@ h6 {
     2.10837px 3.16256px 9.48767px color-mix(in srgb, var(--color-accent) 10%, transparent);
   border: 1px solid var(--color-secondary-cta);
 }
+
+.btn-3d {
+  transition: transform 0.1s ease-out, border-bottom-width 0.1s ease-out;
+  border-bottom: 4px solid rgba(0, 0, 0, 0.25);
+}
+
+.btn-3d:active {
+  transform: translateY(2px);
+  border-bottom-width: 2px;
+}