Initial commit: Negin Dental Clinic website

Next.js (App Router) clone of negindentalclinic.ir, wired to the
Meshkee Website API (blog, contact form, favicon), with on-page SEO
and a scroll-reveal animation sequence on the homepage.

See context.md for full project context.

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

components/Reveal.js

@@ -0,0 +1,63 @@
+"use client";
+
+import { useEffect, useRef, useState } from "react";
+
+/**
+ * Fades/slides a block into place once it scrolls into view (or immediately
+ * if it's already on screen at load — e.g. the hero). Pass `delay` (ms) to
+ * stage a sequence, and `from` to pick the entry direction.
+ *
+ * Pure CSS transition under the hood (`.reveal` / `.reveal--in` in
+ * globals.css) — this component only toggles the class at the right time,
+ * so it stays cheap and respects `prefers-reduced-motion` for free.
+ */
+export default function Reveal({
+  as: Tag = "div",
+  from = "up", // "up" | "down" | "left" | "right" | "scale"
+  delay = 0,
+  once = true,
+  className = "",
+  style,
+  children,
+  ...rest
+}) {
+  const ref = useRef(null);
+  const [visible, setVisible] = useState(false);
+
+  useEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+
+    if (typeof IntersectionObserver === "undefined") {
+      setVisible(true);
+      return;
+    }
+
+    const io = new IntersectionObserver(
+      (entries) => {
+        for (const entry of entries) {
+          if (entry.isIntersecting) {
+            setVisible(true);
+            if (once) io.unobserve(entry.target);
+          } else if (!once) {
+            setVisible(false);
+          }
+        }
+      },
+      { threshold: 0.18, rootMargin: "0px 0px -10% 0px" }
+    );
+    io.observe(el);
+    return () => io.disconnect();
+  }, [once]);
+
+  return (
+    <Tag
+      ref={ref}
+      className={`reveal reveal--${from} ${visible ? "reveal--in" : ""} ${className}`}
+      style={{ "--reveal-delay": `${delay}ms`, ...style }}
+      {...rest}
+    >
+      {children}
+    </Tag>
+  );
+}