feat: add robotics showcase components and UI enhancements

- Introduced FounderSection component to highlight leadership and vision.
- Created ServicesGrid component to display various robotics services offered.
- Developed RoboticsScrollShowcase for showcasing robots with interactive elements.
- Implemented RoboticsSplineShowcase featuring a 3D Spline scene for enhanced user experience.
- Added reusable Card component for consistent styling across sections.
- Integrated ContainerScroll for animated scrolling effects in the showcase.
- Built SplineScene component for lazy loading Spline 3D scenes.
- Added Spotlight component for interactive hover effects.
- Created utility function for class name merging to streamline styling.

src/app/robots/CatalogClient.tsx

@@ -71,7 +71,7 @@ function CatalogInner() {
       </div>
 
       <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', flexWrap: 'wrap', gap: '0.5rem' }}>
-        <span style={{ color: '#94908a', fontSize: '0.85rem' }}>
+        <span style={{ color: '#8891C7', fontSize: '0.85rem' }}>
           {filtered.length} robot{filtered.length === 1 ? '' : 's'} found
         </span>
         {(filter.brand !== 'all' || filter.category !== 'all') && (
@@ -81,7 +81,7 @@ function CatalogInner() {
             style={{
               background: 'transparent',
               border: 'none',
-              color: '#e0c896',
+              color: '#DEE0F0',
               fontSize: '0.78rem',
               letterSpacing: '0.14em',
               textTransform: 'uppercase',
@@ -95,9 +95,9 @@ function CatalogInner() {
       </div>
 
       {filtered.length === 0 ? (
-        <div className="card" style={{ padding: '2rem', textAlign: 'center', color: '#cbc4b3' }}>
+        <div className="card" style={{ padding: '2rem', textAlign: 'center', color: '#DEE0F0' }}>
           No robots match these filters yet. Try a different brand or category, or{' '}
-          <a href="/contact/" style={{ color: '#e0c896', textDecoration: 'none' }}>contact us</a> for tailored options.
+          <a href="/contact/" style={{ color: '#DEE0F0', textDecoration: 'none' }}>contact us</a> for tailored options.
         </div>
       ) : (
         <div
@@ -118,7 +118,7 @@ function CatalogInner() {
 
 export function CatalogClient() {
   return (
-    <Suspense fallback={<div className="card" style={{ padding: '2rem', color: '#cbc4b3' }}>Loading catalog…</div>}>
+    <Suspense fallback={<div className="card" style={{ padding: '2rem', color: '#DEE0F0' }}>Loading catalog…</div>}>
       <CatalogInner />
     </Suspense>
   );