feat: replace literal decorations with AbstractBore and AbstractTrench

Former-commit-id: 4f7c5fcc7203aa4a36aabd8ffc13cf9f28a0f77a

components/ui/decorations/AbstractTrench.tsx

@@ -0,0 +1,70 @@
+'use client';
+
+import { motion } from 'framer-motion';
+
+interface AbstractTrenchProps {
+  className?: string;
+  invert?: boolean;
+}
+
+/**
+ * AbstractTrench
+ * 
+ * Visualizes open trench construction (Offene Bauweise / Graben).
+ * A sharp, geometric profile representing a cut into the earth.
+ * A beam of energy flows through the trench, hugging the sharp corners,
+ * fading in and out at the horizontal edges.
+ * Purely abstract, architectural styling.
+ */
+export function AbstractTrench({ className = '', invert = false }: AbstractTrenchProps) {
+  const color = invert ? 'rgba(10, 61, 40, 0.6)' : 'rgba(14, 122, 92, 0.6)';
+  const glowColor = invert ? 'rgba(10, 61, 40, 1)' : 'rgba(20, 184, 138, 1)';
+  
+  // Geometric trench path: straight, 45-deg drop, straight bottom, 45-deg rise, straight
+  const pathD = "M -100 50 L 300 50 L 350 200 L 650 200 L 700 50 L 1100 50";
+  // Length of this polyline is approx 1260
+  const pathLength = 1260;
+  const beamLength = 250;
+
+  return (
+    <svg 
+      viewBox="0 0 1000 300" 
+      preserveAspectRatio="none"
+      className={`absolute pointer-events-none select-none w-full ${className}`}
+      aria-hidden="true"
+    >
+      {/* Subtle track background */}
+      <path 
+        d={pathD} 
+        stroke={color} 
+        strokeWidth="1" 
+        fill="none" 
+        strokeLinejoin="round"
+        opacity={0.15} 
+      />
+      
+      {/* Moving Energy Beam */}
+      <motion.path
+        d={pathD}
+        stroke={glowColor}
+        strokeWidth="2"
+        fill="none"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        // Dasharray: beam length, then gap for the rest of the path
+        strokeDasharray={`${beamLength} ${pathLength}`}
+        animate={{
+          strokeDashoffset: [pathLength, -beamLength],
+          opacity: [0, 1, 1, 0]
+        }}
+        transition={{
+          duration: 7.5,
+          ease: "linear",
+          repeat: Infinity,
+          times: [0, 0.15, 0.85, 1], // Syncs with the offset to fade exactly at edges
+          delay: 1.5 // Offset from AbstractBore if used together
+        }}
+      />
+    </svg>
+  );
+}