feat: trang liên hệ

src/app/lien-he/page.tsx

@@ -0,0 +1,55 @@
+import type { Metadata } from "next";
+import { MapPin, Mail, Phone } from "lucide-react";
+import { BackToTopButton } from "@/app/components/landing/BackToTopButton";
+import { SiteFooter } from "@/app/components/landing/SiteFooter";
+import { SiteHeader } from "@/app/components/landing/SiteHeader";
+
+export const metadata: Metadata = {
+  title: "Liên hệ | VR360 Như Quỳnh",
+  description: "Thông tin liên hệ và đầu mối cung cấp tư liệu cho dự án số hóa di sản Xã Như Quỳnh.",
+};
+
+const contacts = [
+  { icon: MapPin, label: "Địa chỉ", value: "Xã Như Quỳnh, tỉnh Hưng Yên" },
+  { icon: Phone, label: "Điện thoại", value: "Đang cập nhật" },
+  { icon: Mail, label: "Email", value: "Đang cập nhật" },
+];
+
+export default function ContactPage() {
+  return (
+    <main className="public-page min-h-[100dvh] bg-[var(--background)] text-[var(--foreground)]">
+      <SiteHeader />
+
+      <section className="mx-auto max-w-3xl px-4 py-16 sm:px-6 lg:py-24">
+        <p className="public-kicker">Liên hệ</p>
+        <h1 className="public-gradient-text public-heading-safe mt-3 text-[clamp(2.2rem,5vw,3.6rem)] font-extrabold">
+          Liên hệ & đóng góp tư liệu
+        </h1>
+        <p className="mt-5 text-base leading-8 text-[var(--foreground)]/82">
+          Người dân, tổ chức có tư liệu, hình ảnh hoặc câu chuyện về các di tích của Xã Như Quỳnh
+          vui lòng liên hệ để cùng hoàn thiện kho dữ liệu số di sản.
+        </p>
+
+        <div className="mt-10 grid gap-4">
+          {contacts.map((c) => {
+            const Icon = c.icon;
+            return (
+              <div key={c.label} className="public-panel flex items-center gap-4 rounded-[8px] p-5">
+                <span className="grid h-11 w-11 shrink-0 place-items-center rounded-full bg-[rgb(200_164_106_/_0.18)]">
+                  <Icon className="h-5 w-5 text-[var(--primary)]" strokeWidth={1.8} />
+                </span>
+                <span>
+                  <span className="block text-sm font-bold text-[var(--muted-foreground)]">{c.label}</span>
+                  <span className="block text-base font-bold text-[var(--tour-ink)]">{c.value}</span>
+                </span>
+              </div>
+            );
+          })}
+        </div>
+      </section>
+
+      <SiteFooter />
+      <BackToTopButton />
+    </main>
+  );
+}