Create

src/components/Marquee.tsx

@@ -0,0 +1,22 @@
+import { site } from "@/data/site";
+
+/** Continuous gold band separating the intro from the project work. */
+export function Marquee() {
+  const items = Array.from({ length: 8 });
+
+  return (
+    <div className="overflow-hidden border-y border-line bg-sand py-6" aria-hidden="true">
+      {/* Rendered twice so the 50% translation loops seamlessly. */}
+      <div className="animate-marquee flex w-max items-center gap-14 whitespace-nowrap">
+        {items.concat(items).map((_, i) => (
+          <span key={i} className="flex items-center gap-14">
+            <span className="latin text-sm tracking-[0.42em] text-ink/45">
+              {site.taglineLatin}
+            </span>
+            <span className="h-1.5 w-1.5 rotate-45 bg-gold" />
+          </span>
+        ))}
+      </div>
+    </div>
+  );
+}