Add premium configurator with split-screen layout

- Redesigned configurator page with split-screen interface
- Left: Large visual preview with sticky positioning
- Right: Premium white controls container with form steps
- Added complete configurator wizard (5 steps)
- Updated hero CTA to "Zelf ontwerpen"
- Configured Shadcn UI with Slate theme
- Added layout components (Navbar, Footer)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

components/home/craftsmanship-section.tsx

@@ -0,0 +1,63 @@
+import Image from "next/image";
+import Link from "next/link";
+import { ArrowRight } from "lucide-react";
+
+export function CraftsmanshipSection() {
+  return (
+    <section className="relative bg-white">
+      <div className="mx-auto grid max-w-7xl grid-cols-1 lg:grid-cols-2">
+        {/* Left Column - Image */}
+        <div className="relative z-10 min-h-[450px] overflow-hidden rounded-r-[2.5rem] lg:min-h-[560px]">
+          <Image
+            src="/images/proinn-spuiten.png"
+            alt="Vakmanschap bij Proinn - spuitwerk in de fabriek"
+            fill
+            className="object-cover"
+            sizes="(max-width: 1024px) 100vw, 50vw"
+          />
+        </div>
+
+        {/* Right Column - Dark Content */}
+        <div className="flex flex-col justify-center bg-[#1A2E2E] px-8 py-16 lg:px-16 lg:py-20">
+          {/* Label */}
+          <div className="mb-6 flex items-center gap-3">
+            <div className="h-5 w-1 rounded-full bg-[#C4D668]" />
+            <span className="text-sm font-medium tracking-wide text-[#C4D668]">
+              Waarom Proinn
+            </span>
+          </div>
+
+          {/* Heading */}
+          <h2 className="mb-5 text-3xl font-bold leading-tight text-white lg:text-4xl">
+            Vakmanschap op
+            <br />
+            ieder niveau
+          </h2>
+
+          {/* Text */}
+          <p className="mb-10 max-w-md text-sm leading-relaxed text-gray-300">
+            Bij Proinn draait alles om kwaliteit en vakmanschap. Van het eerste
+            ontwerp tot de laatste afwerking — elk detail wordt met zorg
+            behandeld in onze eigen fabriek. Wij combineren ambachtelijke
+            technieken met moderne technologie om stalen deuren en wanden te
+            maken die perfect passen bij jouw ruimte.
+          </p>
+
+          {/* Input Group */}
+          <div className="flex max-w-md items-center gap-3">
+            <div className="flex-1 rounded-md bg-[#263e3e] px-4 py-3 text-sm text-gray-400">
+              Meer weten?
+            </div>
+            <Link
+              href="/over-ons"
+              className="inline-flex items-center gap-2 rounded-md bg-[#C4D668] px-5 py-3 text-sm font-semibold text-black transition-colors hover:bg-[#b5c75a]"
+            >
+              Over ons
+              <ArrowRight className="size-4" />
+            </Link>
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+}