Initial commit

2026-01-14 14:37:01 +02:00
commit 55a74476bc
48 changed files with 2248 additions and 0 deletions
--- a/src/components/Services.js
+++ b/src/components/Services.js
@@ -0,0 +1,131 @@
+import React from 'react';
+import { motion, useReducedMotion } from 'framer-motion';
+import { Users, Target, Zap, Search, Shield, GraduationCap } from 'lucide-react';
+
+const fadeUpPreset = (delay = 0, duration = 1.2) => ({
+  initial: { opacity: 0, y: 20 },
+  whileInView: { opacity: 1, y: 0 },
+  viewport: { once: true, amount: 0.2 },
+  transition: { delay, duration, ease: "easeOut" }
+});
+
+function Services() {
+  const shouldReduce = useReducedMotion();
+
+  const services = [
+    {
+      icon: Users,
+      title: "DEVELOPMENT",
+      description: "Achieve your goals faster with Nest experts on your team tackling challenging issues right by your side."
+    },
+    {
+      icon: Target,
+      title: "TECHNICAL GUIDANCE",
+      description: "Enable your team to get the most out of the technology. Ensure your solutions are secure and reliable."
+    },
+    {
+      icon: Zap,
+      title: "MIGRATION ASSISTANCE",
+      description: "We provide a comprehensive migration assistance, ensuring you are using the latest and greatest."
+    },
+    {
+      icon: Search,
+      title: "IN-DEPTH CODE REVIEWS",
+      description: "Frequent code reviews can eliminate potentially hazardous bugs and issues at an early stage while enforcing best practices."
+    },
+    {
+      icon: Shield,
+      title: "LONG-TERM SUPPORT (LTS)",
+      description: "Have peace of mind with Nest long-term support (LTS), priority fixes, upgrade assistance, and live troubleshooting."
+    },
+    {
+      icon: GraduationCap,
+      title: "TEAM TRAININGS",
+      description: "Level-up your team by having expert-led Nest trainings or workshops. Get everyone up-to-speed quickly."
+    }
+  ];
+
+  if (shouldReduce) {
+    return (
+      <section className="section-padding bg-gray-50">
+        <div className="container-custom">
+          <div className="text-center mb-16">
+            <h2 className="text-4xl md:text-5xl font-bold text-gray-900 mb-6">
+              How can we help you be successful?
+            </h2>
+            <p className="text-lg text-gray-600 max-w-3xl mx-auto">
+              Nest Enterprise Consulting includes a broad range of services to empower your team. 
+              We help you grow your business even long after our commitment is done.
+            </p>
+          </div>
+          
+          <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
+            {services.map((service, index) => {
+              const IconComponent = service.icon;
+              return (
+                <div key={index} className="text-center p-6">
+                  <div className="w-16 h-16 bg-brand-red rounded-full flex items-center justify-center mx-auto mb-6">
+                    <IconComponent className="w-8 h-8 text-white" />
+                  </div>
+                  <h3 className="text-lg font-bold text-gray-900 mb-4">
+                    {service.title}
+                  </h3>
+                  <p className="text-gray-600 leading-relaxed">
+                    {service.description}
+                  </p>
+                </div>
+              );
+            })}
+          </div>
+        </div>
+      </section>
+    );
+  }
+
+  return (
+    <motion.section 
+      {...fadeUpPreset(0.1, 1.0)}
+      className="section-padding bg-gray-50"
+    >
+      <div className="container-custom">
+        <motion.div 
+          {...fadeUpPreset(0.2, 1.0)}
+          className="text-center mb-16"
+        >
+          <h2 className="text-4xl md:text-5xl font-bold text-gray-900 mb-6">
+            How can we help you be successful?
+          </h2>
+          <p className="text-lg text-gray-600 max-w-3xl mx-auto">
+            Nest Enterprise Consulting includes a broad range of services to empower your team. 
+            We help you grow your business even long after our commitment is done.
+          </p>
+        </motion.div>
+        
+        <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
+          {services.map((service, index) => {
+            const IconComponent = service.icon;
+            return (
+              <motion.div 
+                key={index}
+                {...fadeUpPreset(0.3 + index * 0.1, 0.8)}
+                className="text-center p-6"
+              >
+                <div className="w-16 h-16 bg-brand-red rounded-full flex items-center justify-center mx-auto mb-6">
+                  <IconComponent className="w-8 h-8 text-white" />
+                </div>
+                <h3 className="text-lg font-bold text-gray-900 mb-4">
+                  {service.title}
+                </h3>
+                <p className="text-gray-600 leading-relaxed">
+                  {service.description}
+                </p>
+              </motion.div>
+            );
+          })}
+        </div>
+      </div>
+    </motion.section>
+  );
+}
+
+export default Services;