Initial commit

src/pages/technology/components/TechnologyHero.tsx

@@ -0,0 +1,38 @@
+import { motion } from 'framer-motion';
+import { PrimaryButton } from '../../../components/ui/PrimaryButton';
+
+export const TechnologyHero = () => {
+  return (
+    <section className="relative overflow-hidden rounded-3xl text-white">
+      <img
+        src="/images/hometech.jpg"
+        alt=""
+        className="absolute inset-0 h-full w-full object-cover"
+      />
+      <div className="absolute inset-0 bg-gradient-to-br from-[#0f172a]/80 via-[#1e1b4b]/70 to-[#312e81]/75" />
+      <motion.div
+        initial={{ opacity: 0, y: 32 }}
+        whileInView={{ opacity: 1, y: 0 }}
+        viewport={{ once: true, amount: 0.3 }}
+        transition={{ duration: 0.6, ease: 'easeOut' }}
+        className="relative z-10 px-6 py-20 sm:px-10 lg:px-16 lg:py-24"
+      >
+        <p className="text-xs font-semibold uppercase tracking-[0.35em] text-white/70">
+          Technology
+        </p>
+        <h1 className="mt-6 text-3xl font-semibold leading-tight sm:text-4xl lg:text-5xl">
+          The Foundation of the Next-Generation Datacenter
+        </h1>
+        <p className="mt-6 max-w-3xl text-base text-white/75 sm:text-lg">
+          GeoMind combines hardware and revolutionary software to deliver secure, scalable, and
+          sovereign cloud and AI infrastructure. Built for efficiency, sustainability, and
+          profitability, it empowers organizations to run workloads, scale globally, and monetize
+          excess capacity.
+        </p>
+        <div className="mt-10">
+          <PrimaryButton to="/usecases">Use Cases</PrimaryButton>
+        </div>
+      </motion.div>
+    </section>
+  );
+};