feat: implement minimalist corporate design (Horizontal Bohrung & Graben-Trace)

Former-commit-id: 7f7c3d20bd6c746ef19140c532a64c518a31802b

components/ui/decorations/TrenchLines.tsx

@@ -0,0 +1,56 @@
+'use client';
+
+import React, { useEffect, useState } from 'react';
+import { motion, useScroll, useSpring, useTransform } from 'framer-motion';
+
+export function TrenchLines() {
+  const { scrollYProgress } = useScroll();
+  
+  // Apply a spring to make the scroll movement feel heavier, industrial
+  const smoothProgress = useSpring(scrollYProgress, {
+    stiffness: 100,
+    damping: 30,
+    restDelta: 0.001
+  });
+
+  // Map progress to vertical position
+  const yPosition = useTransform(smoothProgress, [0, 1], ['0%', '100%']);
+
+  const [mounted, setMounted] = useState(false);
+
+  useEffect(() => {
+    setMounted(true);
+  }, []);
+
+  if (!mounted) return null;
+
+  return (
+    <div className="fixed inset-0 pointer-events-none z-0 overflow-hidden hidden sm:block">
+      {/* Left Trench Line */}
+      <div className="absolute top-0 bottom-0 left-6 lg:left-12 w-[1px] bg-white/[0.03]">
+        <motion.div 
+          className="absolute top-0 left-[-1px] w-[3px] h-[15vh] bg-gradient-to-b from-transparent via-primary to-transparent shadow-[0_0_15px_rgba(var(--color-primary),0.8)]"
+          style={{ y: useTransform(smoothProgress, [0, 1], ['-15vh', '100vh']) }}
+        />
+        {/* Subtle digging pulse marker */}
+        <motion.div
+          className="absolute left-[-2px] w-[5px] h-[5px] bg-white rounded-full shadow-[0_0_10px_rgba(255,255,255,1)]"
+          style={{ y: useTransform(smoothProgress, [0, 1], ['-15vh', '100vh']), marginTop: '7.5vh' }}
+        />
+      </div>
+
+      {/* Right Trench Line */}
+      <div className="absolute top-0 bottom-0 right-6 lg:right-12 w-[1px] bg-white/[0.03]">
+        <motion.div 
+          className="absolute top-0 right-[-1px] w-[3px] h-[15vh] bg-gradient-to-b from-transparent via-primary to-transparent shadow-[0_0_15px_rgba(var(--color-primary),0.8)]"
+          style={{ y: useTransform(smoothProgress, [0, 1], ['-15vh', '100vh']) }}
+        />
+        {/* Subtle digging pulse marker */}
+        <motion.div
+          className="absolute right-[-2px] w-[5px] h-[5px] bg-white rounded-full shadow-[0_0_10px_rgba(255,255,255,1)]"
+          style={{ y: useTransform(smoothProgress, [0, 1], ['-15vh', '100vh']), marginTop: '7.5vh' }}
+        />
+      </div>
+    </div>
+  );
+}