From 7127d0a7127cd94233d385ea96a7dd1bef2ac99f Mon Sep 17 00:00:00 2001
From: kudinDmitriyUp <kudin.dmitriy.up@gmail.com>
Date: Thu, 7 May 2026 14:55:39 +0000
Subject: [PATCH] feat: add glassmorphic cards to hero section

---
 src/components/sections/hero/HeroOverlay.tsx | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/components/sections/hero/HeroOverlay.tsx b/src/components/sections/hero/HeroOverlay.tsx
index 6e57d49..c7a0247 100644
--- a/src/components/sections/hero/HeroOverlay.tsx
+++ b/src/components/sections/hero/HeroOverlay.tsx
@@ -36,6 +36,11 @@ const HeroOverlay = ({
         videoSrc={videoSrc}
         className="absolute inset-0 w-full h-full object-cover rounded-none"
       />
+      <div className="absolute z-10 bottom-1/4 left-1/2 -translate-x-1/2 grid grid-cols-1 md:grid-cols-3 gap-4 p-4 w-full max-w-4xl">
+        {uspData.map((usp, index) => (
+          <GlassMorphicCard key={index} title={usp.title} description={usp.description} />
+        ))}
+      </div>
 
       <div
         className="absolute z-10 w-[150vw] h-[150vw] left-0 bottom-0 -translate-x-1/2 translate-y-1/2 backdrop-blur mask-[radial-gradient(circle,black_20%,transparent_70%)]"
@@ -43,11 +48,7 @@ const HeroOverlay = ({
       />
 
       <div className="relative z-10 w-content-width mx-auto pb-10 md:pb-25">
-        <div className="absolute bottom-20 right-0 grid grid-cols-1 md:grid-cols-3 gap-4 p-4">
-          {uspData.map((usp, index) => (
-            <GlassMorphicCard key={index} title={usp.title} description={usp.description} />
-          ))}
-        </div>
+
         <div className="flex flex-col gap-3 w-full md:w-6/10 lg:w-1/2 xl:w-45/100 2xl:w-4/10">
           <span className="w-fit px-3 py-1 mb-1 text-sm card rounded">{tag}</span>