feat: add SEO metadata, llms.txt, and markdown page mirrors

Centralize site metadata and social URLs for JSON-LD, expose llmstxt.org
content and per-page .md routes for LLM crawlers, and refactor blog/FAQ/events
pages with shared components.

Co-authored-by: Cursor <cursoragent@cursor.com>

frontend/app/faq/page.tsx

@@ -1,12 +1,8 @@
-"use client";
-
-import { useEffect, useState } from "react";
-import { ChevronDown } from "lucide-react";
-import { cn } from "@/lib/utils";
-import { api } from "@/lib/api";
 import { Navbar } from "@/components/public/Navbar";
 import { Footer } from "@/components/public/Footer";
-import { FaqPageJsonLd } from "@/components/public/JsonLd";
+import { FaqAccordion } from "@/components/public/FaqAccordion";
+import { FaqPageJsonLd, BreadcrumbJsonLd } from "@/components/public/JsonLd";
+import { apiUrl } from "@/lib/api-base";
 
 interface FaqItem {
   id: string;
@@ -16,25 +12,35 @@ interface FaqItem {
   showOnHomepage: boolean;
 }
 
-export default function FaqPage() {
-  const [items, setItems] = useState<FaqItem[]>([]);
-  const [openIndex, setOpenIndex] = useState<number | null>(null);
-  const [loading, setLoading] = useState(true);
+async function fetchFaqs(): Promise<FaqItem[]> {
+  try {
+    const res = await fetch(apiUrl("/faqs?all=true"), {
+      next: { revalidate: 300 },
+    });
+    if (!res.ok) return [];
+    const data = await res.json();
+    return Array.isArray(data) ? data : [];
+  } catch {
+    return [];
+  }
+}
 
-  useEffect(() => {
-    api.getFaqsAll()
-      .then((data) => {
-        if (Array.isArray(data)) setItems(data);
-      })
-      .catch(() => {})
-      .finally(() => setLoading(false));
-  }, []);
+export default async function FaqPage() {
+  const items = await fetchFaqs();
 
   return (
     <>
       {items.length > 0 && (
-        <FaqPageJsonLd items={items.map((i) => ({ question: i.question, answer: i.answer }))} />
+        <FaqPageJsonLd
+          items={items.map((i) => ({ question: i.question, answer: i.answer }))}
+        />
       )}
+      <BreadcrumbJsonLd
+        items={[
+          { name: "Home", href: "/" },
+          { name: "FAQ", href: "/faq" },
+        ]}
+      />
       <Navbar />
       <div className="min-h-screen">
         <div className="max-w-3xl mx-auto px-8 pt-16 pb-24">
@@ -43,57 +49,10 @@ export default function FaqPage() {
             Everything you need to know about the Belgian Bitcoin Embassy.
           </p>
 
-          {loading && (
-            <div className="space-y-4">
-              {[...Array(5)].map((_, i) => (
-                <div key={i} className="bg-surface-container-low rounded-xl h-[72px] animate-pulse" />
-              ))}
-            </div>
-          )}
-
-          {!loading && items.length === 0 && (
+          {items.length === 0 ? (
             <p className="text-on-surface-variant">No FAQs available yet.</p>
-          )}
-
-          {!loading && items.length > 0 && (
-            <div className="space-y-4">
-              {items.map((item, i) => {
-                const isOpen = openIndex === i;
-                return (
-                  <div
-                    key={item.id}
-                    className="bg-surface-container-low rounded-xl overflow-hidden"
-                  >
-                    <button
-                      onClick={() => setOpenIndex(isOpen ? null : i)}
-                      className="w-full flex items-center justify-between p-6 text-left"
-                    >
-                      <span className="text-lg font-bold pr-4">{item.question}</span>
-                      <ChevronDown
-                        size={20}
-                        className={cn(
-                          "shrink-0 text-primary transition-transform duration-200",
-                          isOpen && "rotate-180"
-                        )}
-                      />
-                    </button>
-
-                    <div
-                      className={cn(
-                        "grid transition-all duration-200",
-                        isOpen ? "grid-rows-[1fr]" : "grid-rows-[0fr]"
-                      )}
-                    >
-                      <div className="overflow-hidden">
-                        <p className="px-6 pb-6 text-on-surface-variant leading-relaxed">
-                          {item.answer}
-                        </p>
-                      </div>
-                    </div>
-                  </div>
-                );
-              })}
-            </div>
+          ) : (
+            <FaqAccordion items={items} />
           )}
         </div>
       </div>