Harden onion boot flow and deepen site surfaces

Add persistent onion key backup and restore, improve startup resilience, and flesh out the major site verticals with richer navigation, search coverage, and operator documentation.

Made-with: Cursor

app/checkout/page.tsx

@@ -0,0 +1,60 @@
+import Navbar from "@/components/Navbar";
+import ParticleBackground from "@/components/ParticleBackground";
+import CheckoutFlow from "@/components/CheckoutFlow";
+import Link from "next/link";
+
+export default function CheckoutPage() {
+  return (
+    <>
+      <ParticleBackground />
+      <Navbar />
+      <main className="container mx-auto px-4 py-24">
+        <div className="mb-12 text-center">
+          <Link
+            href="/"
+            className="inline-flex items-center gap-2 text-neon-cyan hover:text-neon-purple"
+          >
+            ← Back to Sanctuary
+          </Link>
+          <h1 className="mt-6 font-orbitron text-5xl font-bold md:text-6xl">
+            CHECKOUT <span className="text-neon-cyan">RITUAL</span>
+          </h1>
+          <p className="mx-auto mt-4 max-w-2xl text-foreground/70">
+            Each step is designed to feel like a ceremonial unlocking. Your data is encrypted in real‑time, and your payment is transformed into a visual experience.
+          </p>
+        </div>
+        <CheckoutFlow />
+        <div className="mt-16 grid grid-cols-1 gap-8 md:grid-cols-3">
+          <div className="glass rounded-2xl border border-white/10 p-6">
+            <div className="mb-4 text-3xl">🔐</div>
+            <h3 className="mb-2 font-bold">End‑to‑End Encryption</h3>
+            <p className="text-sm text-foreground/60">
+              Your payment details never touch our servers. They are encrypted client‑side before transmission.
+            </p>
+          </div>
+          <div className="glass rounded-2xl border border-white/10 p-6">
+            <div className="mb-4 text-3xl">⚡</div>
+            <h3 className="mb-2 font-bold">Instant Crypto Conversion</h3>
+            <p className="text-sm text-foreground/60">
+              Real‑time exchange rates ensure you pay the exact amount, with no hidden fees.
+            </p>
+          </div>
+          <div className="glass rounded-2xl border border-white/10 p-6">
+            <div className="mb-4 text-3xl">🎨</div>
+            <h3 className="mb-2 font-bold">Digital Art Receipt</h3>
+            <p className="text-sm text-foreground/60">
+              Each completed order generates a unique piece of generative art stored in your vault.
+            </p>
+          </div>
+        </div>
+      </main>
+      <footer className="glass border-t border-white/10 px-4 py-8 text-center text-sm text-foreground/40">
+        <p>
+          Crypto checkout uses your <strong>USD balance</strong> after a Bitcoin payment is{" "}
+          <strong>verified on-chain</strong>. Configure your receiving address in{" "}
+          <code className="rounded bg-white/10 px-1">.env.local</code>. Guest/card paths are demo-only.
+        </p>
+      </footer>
+    </>
+  );
+}