Refactor code structure for improved readability and maintainability

src/components/landing/reveal.tsx

@@ -0,0 +1,38 @@
+"use client";
+
+import type { ReactNode } from "react";
+import { motion, useReducedMotion } from "motion/react";
+
+/**
+ * Landing bölümlerinin görünüme girerken yumuşakça belirmesi.
+ * Yalnızca transform/opacity animasyonu yapar; hareket azaltılmışsa
+ * kaydırma yerine sadece kısa bir belirme kalır.
+ */
+export function Reveal({
+  children,
+  delay = 0,
+  y = 28,
+  className,
+}: {
+  children: ReactNode;
+  delay?: number;
+  y?: number;
+  className?: string;
+}) {
+  const reduceMotion = useReducedMotion();
+  return (
+    <motion.div
+      className={className}
+      initial={{ opacity: 0, y: reduceMotion ? 0 : y }}
+      whileInView={{ opacity: 1, y: 0 }}
+      viewport={{ once: true, margin: "0px 0px -80px 0px" }}
+      transition={{
+        duration: reduceMotion ? 0.25 : 0.55,
+        delay,
+        ease: [0.21, 0.47, 0.32, 0.98],
+      }}
+    >
+      {children}
+    </motion.div>
+  );
+}