@@ -12,13 +12,13 @@ interface HeroProps {
1212
1313export default function Hero ( { totalImplementations, yearsOfResearch } : HeroProps ) {
1414 return (
15- < div className = "relative min-h-screen flex items-center justify-center overflow-hidden bg-gradient-to-br from-white via-gray-100 to-cyan-50 " >
15+ < div className = "relative min-h-screen flex items-center justify-center overflow-hidden bg-gradient-to-br from-white via-gray-50 to-gray-100 " >
1616 { /* Sophisticated gradient background with layered blobs */ }
1717 { /* Large ambient blob - top left */ }
1818 < motion . div
1919 className = "absolute -top-48 -left-48 w-[900px] h-[900px]"
2020 style = { {
21- background : 'radial-gradient(circle at 50% 50%, rgba(236, 72, 153 , 0.15 ) 0%, rgba(219, 39, 119 , 0.10 ) 35%, rgba(236, 72, 153 , 0.05 ) 60%, transparent 80%)' ,
21+ background : 'radial-gradient(circle at 50% 50%, rgba(235, 8, 138 , 0.12 ) 0%, rgba(235, 8, 138 , 0.08 ) 35%, rgba(235, 8, 138 , 0.04 ) 60%, transparent 80%)' ,
2222 filter : 'blur(60px)' ,
2323 borderRadius : '63% 37% 54% 46% / 55% 48% 52% 45%' ,
2424 } }
@@ -44,7 +44,7 @@ export default function Hero({ totalImplementations, yearsOfResearch }: HeroProp
4444 < motion . div
4545 className = "absolute -bottom-32 -right-32 w-[800px] h-[800px]"
4646 style = { {
47- background : 'radial-gradient(circle at 50% 50%, rgba(236, 72, 153 , 0.12 ) 0%, rgba(236, 72, 153 , 0.08 ) 35%, rgba(219, 39, 119 , 0.04 ) 60%, transparent 80%)' ,
47+ background : 'radial-gradient(circle at 50% 50%, rgba(49, 60, 255 , 0.10 ) 0%, rgba(49, 60, 255 , 0.06 ) 35%, rgba(49, 60, 255 , 0.03 ) 60%, transparent 80%)' ,
4848 filter : 'blur(65px)' ,
4949 borderRadius : '45% 55% 52% 48% / 48% 55% 45% 52%' ,
5050 } }
@@ -71,7 +71,7 @@ export default function Hero({ totalImplementations, yearsOfResearch }: HeroProp
7171 < motion . div
7272 className = "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[750px] h-[750px]"
7373 style = { {
74- background : 'radial-gradient(circle at 50% 50%, rgba(236, 72, 153 , 0.10 ) 0%, rgba(236, 72, 153 , 0.06) 40%, rgba(219, 39, 119 , 0.03) 60%, transparent 80%)' ,
74+ background : 'radial-gradient(circle at 50% 50%, rgba(235, 8, 138 , 0.08 ) 0%, rgba(49, 60, 255 , 0.06) 40%, rgba(235, 8, 138 , 0.03) 60%, transparent 80%)' ,
7575 filter : 'blur(70px)' ,
7676 borderRadius : '52% 48% 45% 55% / 55% 45% 55% 45%' ,
7777 } }
@@ -96,7 +96,7 @@ export default function Hero({ totalImplementations, yearsOfResearch }: HeroProp
9696 < motion . div
9797 className = "absolute top-1/4 right-1/4 w-[500px] h-[500px]"
9898 style = { {
99- background : 'radial-gradient(circle at 50% 50%, rgba(236, 72, 153 , 0.08) 0%, rgba(236, 72, 153 , 0.04) 50%, transparent 75%)' ,
99+ background : 'radial-gradient(circle at 50% 50%, rgba(49, 60, 255 , 0.08) 0%, rgba(49, 60, 255 , 0.04) 50%, transparent 75%)' ,
100100 filter : 'blur(50px)' ,
101101 borderRadius : '58% 42% 48% 52% / 52% 55% 45% 48%' ,
102102 } }
@@ -141,17 +141,17 @@ export default function Hero({ totalImplementations, yearsOfResearch }: HeroProp
141141 initial = { { opacity : 0 , y : 20 } }
142142 animate = { { opacity : 1 , y : 0 } }
143143 transition = { { duration : 0.6 , delay : 0.2 } }
144- className = "text-5xl md:text-7xl font-bold mb-6 bg-gradient-to-r from- gray-900 via-vector-dark to-vector-teal bg-clip-text text-transparent leading-tight"
144+ className = "text-5xl md:text-7xl font-bold mb-6 text- gray-900 leading-tight"
145145 >
146- Implementation Catalog
146+ Implementation < span className = "bg-gradient-to-r from-vector-magenta to-vector-cobalt bg-clip-text text-transparent" > Catalog</ span >
147147 </ motion . h1 >
148148
149149 { /* Subtitle */ }
150150 < motion . p
151151 initial = { { opacity : 0 , y : 20 } }
152152 animate = { { opacity : 1 , y : 0 } }
153153 transition = { { duration : 0.6 , delay : 0.4 } }
154- className = "text-lg md:text-xl mb-12 text-gray-700 max-w-3xl mx-auto leading-relaxed"
154+ className = "text-lg md:text-xl mb-12 text-gray-800 max-w-3xl mx-auto leading-relaxed font-medium "
155155 >
156156 Explore cutting-edge AI implementations from Vector Institute researchers and engineers
157157 </ motion . p >
@@ -164,21 +164,21 @@ export default function Hero({ totalImplementations, yearsOfResearch }: HeroProp
164164 className = "flex flex-wrap justify-center gap-8 md:gap-16 mb-12"
165165 >
166166 < div className = "flex items-center gap-3" >
167- < div className = "p-3 bg-vector-teal /10 rounded-xl border border-vector-teal /30" >
168- < Layers className = "w-6 h-6 text-vector-teal " />
167+ < div className = "p-3 bg-vector-magenta /10 rounded-xl border border-vector-magenta /30" >
168+ < Layers className = "w-6 h-6 text-vector-magenta " />
169169 </ div >
170170 < div className = "text-left" >
171171 < div className = "text-3xl md:text-4xl font-bold text-gray-900" > { totalImplementations } </ div >
172- < div className = "text-sm text-gray-600 uppercase tracking-wide" > Implementations</ div >
172+ < div className = "text-sm text-gray-700 uppercase tracking-wide font-semibold " > Implementations</ div >
173173 </ div >
174174 </ div >
175175 < div className = "flex items-center gap-3" >
176- < div className = "p-3 bg-purple-500 /10 rounded-xl border border-purple-500 /30" >
177- < TrendingUp className = "w-6 h-6 text-purple-600 " />
176+ < div className = "p-3 bg-vector-cobalt /10 rounded-xl border border-vector-cobalt /30" >
177+ < TrendingUp className = "w-6 h-6 text-vector-cobalt " />
178178 </ div >
179179 < div className = "text-left" >
180180 < div className = "text-3xl md:text-4xl font-bold text-gray-900" > { yearsOfResearch } </ div >
181- < div className = "text-sm text-gray-600 uppercase tracking-wide" > Years of Research</ div >
181+ < div className = "text-sm text-gray-700 uppercase tracking-wide font-semibold " > Years of Research</ div >
182182 </ div >
183183 </ div >
184184 </ motion . div >
@@ -191,7 +191,7 @@ export default function Hero({ totalImplementations, yearsOfResearch }: HeroProp
191191 transition = { { duration : 0.6 , delay : 0.8 } }
192192 whileHover = { { scale : 1.05 } }
193193 whileTap = { { scale : 0.95 } }
194- className = "inline-flex items-center gap-2 bg-gradient-to-r from-vector-teal to-cyan-400 hover:from-vector-teal /90 hover:to-cyan-400 /90 text-white px-10 py-4 rounded-full font-semibold text-lg shadow-lg shadow-vector-teal /25 transition-all mb-8"
194+ className = "inline-flex items-center gap-2 bg-gradient-to-r from-vector-magenta to-vector-cobalt hover:from-vector-magenta /90 hover:to-vector-cobalt /90 text-white px-10 py-4 rounded-full font-semibold text-lg shadow-lg shadow-vector-magenta /25 transition-all mb-8"
195195 >
196196 Browse Implementations
197197 < ArrowDown className = "w-5 h-5 animate-bounce" />
0 commit comments