From e7aaa9d932ae10cc9571ef15b2417f929224dd06 Mon Sep 17 00:00:00 2001
From: holkexyz <holke.brammer@gmail.com>
Date: Tue, 7 Apr 2026 09:14:06 -1000
Subject: [PATCH 1/2] =?UTF-8?q?feat:=20fix=20GEO=20audit=20issues=20?=
 =?UTF-8?q?=E2=80=94=20SSR=20landing=20page,=20structured=20data,=20crawl?=
 =?UTF-8?q?=20infra,=20about=20page?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Fix critical SSR bailout: split HomeClient into server-rendered LandingPage
  with client islands (FAQ accordion, CTA/hero sign-in buttons) so AI crawlers
  see actual content instead of a blank loading spinner
- Add JSON-LD structured data: Organization (Hypercerts Foundation with sameAs),
  WebSite, SoftwareApplication, and FAQPage schemas
- Add robots.ts, sitemap.ts, and public/llms.txt for crawler discovery
- Add OG/Twitter Card meta tags, canonical URLs, and page-specific metadata
  to all public pages (terms, privacy, dsa, about)
- Add security headers (X-Content-Type-Options, X-Frame-Options,
  Referrer-Policy, Permissions-Policy) via next.config.ts
- Create /about page (~800 words) with AT Protocol explainer, Hypercerts
  Foundation background, and social links
- Add About link to both landing and global footers
- Add hero description paragraph for AI citability

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 next.config.ts                                |  16 ++
 public/llms.txt                               |  26 ++
 src/app/about/page.tsx                        | 235 ++++++++++++++++++
 src/app/dsa/page.tsx                          |  15 ++
 src/app/globals.css                           |  12 +
 src/app/layout.tsx                            |  79 +++++-
 src/app/page.tsx                              |  87 ++++++-
 src/app/privacy/page.tsx                      |  15 ++
 src/app/robots.ts                             |  13 +
 src/app/sitemap.ts                            |  36 +++
 src/app/terms/page.tsx                        |  15 ++
 src/components/landing/hero-signin-button.tsx |  15 ++
 src/components/landing/home-client.tsx        |  83 ++-----
 src/components/landing/landing-page.tsx       |  71 ++++++
 .../landing/sections/faq-accordion.tsx        |  45 ++++
 .../landing/sections/faq-content.tsx          |  43 ++++
 .../landing/sections/ready-cta-button.tsx     |  15 ++
 .../landing/sections/ready-cta-content.tsx    |  24 ++
 src/components/layout/footer.tsx              |   1 +
 19 files changed, 776 insertions(+), 70 deletions(-)
 create mode 100644 public/llms.txt
 create mode 100644 src/app/about/page.tsx
 create mode 100644 src/app/robots.ts
 create mode 100644 src/app/sitemap.ts
 create mode 100644 src/components/landing/hero-signin-button.tsx
 create mode 100644 src/components/landing/landing-page.tsx
 create mode 100644 src/components/landing/sections/faq-accordion.tsx
 create mode 100644 src/components/landing/sections/faq-content.tsx
 create mode 100644 src/components/landing/sections/ready-cta-button.tsx
 create mode 100644 src/components/landing/sections/ready-cta-content.tsx

diff --git a/next.config.ts b/next.config.ts
index 769064fa..364eb096 100644
--- a/next.config.ts
+++ b/next.config.ts
@@ -10,6 +10,22 @@ const nextConfig: NextConfig = {
       },
     ],
   },
+  async headers() {
+    return [
+      {
+        source: "/(.*)",
+        headers: [
+          { key: "X-Content-Type-Options", value: "nosniff" },
+          { key: "Referrer-Policy", value: "strict-origin-when-cross-origin" },
+          { key: "X-Frame-Options", value: "DENY" },
+          {
+            key: "Permissions-Policy",
+            value: "camera=(), microphone=(), geolocation=()",
+          },
+        ],
+      },
+    ];
+  },
   async redirects() {
     return [
       {
diff --git a/public/llms.txt b/public/llms.txt
new file mode 100644
index 00000000..55d052f7
--- /dev/null
+++ b/public/llms.txt
@@ -0,0 +1,26 @@
+# Certified
+
+> Certified is a passwordless identity platform built on AT Protocol, operated by the Hypercerts Foundation. It lets users create a single account that works across partner applications with full data portability and no vendor lock-in.
+
+## Main
+
+- [Home](https://certified.app): Create your Certified identity and use one account across partner apps
+- [About](https://certified.app/about): About Certified and the Hypercerts Foundation
+- [Terms of Service](https://certified.app/terms): Service terms for Certified and certified.one infrastructure
+- [Privacy Policy](https://certified.app/privacy): Data processing practices, GDPR compliance, cookie policy
+- [DSA Compliance](https://certified.app/dsa): Digital Services Act compliance information
+
+## About
+
+- [Hypercerts Foundation](https://hypercerts.org): Parent organization building open-source protocols for impact funding
+- [GitHub](https://github.com/hypercerts-org): Open source repositories for Certified and related projects
+- [Twitter](https://x.com/hypercerts): Hypercerts on X/Twitter
+- [LinkedIn](https://www.linkedin.com/company/hypercerts): Hypercerts on LinkedIn
+- [Bluesky](https://bsky.app/profile/hypercerts.org): Hypercerts on Bluesky
+
+## Partner Apps
+
+- [Ma Earth](https://maearth.com): Collective funding for regenerating Earth
+- [GainForest](https://gainforest.earth): AI-powered forest monitoring and conservation rewards
+- [Simocracy](https://simocracy.org): Democratic governance with verifiable identity
+- [Hyperboards](https://hyperboards.org): Visual leaderboards for impact contributions
diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
new file mode 100644
index 00000000..5eb065fb
--- /dev/null
+++ b/src/app/about/page.tsx
@@ -0,0 +1,235 @@
+import type { Metadata } from "next";
+import Link from "next/link";
+
+export const metadata: Metadata = {
+  title: "About",
+  description:
+    "Certified is a passwordless identity platform built on AT Protocol, operated by the Hypercerts Foundation. Learn how Certified works, who builds it, and why portable identity matters.",
+  alternates: { canonical: "https://certified.app/about" },
+  openGraph: {
+    title: "About — Certified",
+    description:
+      "Certified is a passwordless identity platform built on AT Protocol, operated by the Hypercerts Foundation.",
+    url: "https://certified.app/about",
+  },
+};
+
+export default function AboutPage() {
+  return (
+    <div className="app-page">
+      <div className="app-page__inner max-w-3xl">
+        <h1 className="font-mono text-h1 text-navy tracking-tight mb-8">
+          About Certified
+        </h1>
+
+        <div className="prose prose-navy max-w-none space-y-8">
+          <section>
+            <h2 className="font-mono text-xl text-navy mb-4">What is Certified?</h2>
+            <p>
+              Certified is a passwordless identity platform built on{" "}
+              <a
+                href="https://atproto.com"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="text-blue-600 underline hover:text-blue-800"
+              >
+                AT Protocol
+              </a>
+              , the open standard behind Bluesky and a growing ecosystem of decentralized
+              applications. It lets you create a single account that works across every partner
+              app — no passwords, no vendor lock-in, and full control over your data.
+            </p>
+            <p className="mt-4">
+              When you sign up for Certified, you get an AT Protocol identity and a Personal Data
+              Server (PDS) hosted at <strong>certified.one</strong>. Your profile, preferences,
+              and activity travel with you to every app that supports Certified — currently
+              including Ma Earth, GainForest, Simocracy, and Hyperboards.
+            </p>
+          </section>
+
+          <section>
+            <h2 className="font-mono text-xl text-navy mb-4">How does it work?</h2>
+            <p>
+              Sign-in is passwordless: you enter your email, receive a one-time code, and
+              you&apos;re in. Behind the scenes, Certified issues an AT Protocol identity tied to
+              your account. That identity is cryptographically verifiable and portable — it works
+              the same whether you&apos;re on certified.app, a partner application, or any future
+              service that speaks AT Protocol.
+            </p>
+            <p className="mt-4">
+              Your data lives on your Personal Data Server. Applications read from it with your
+              permission. If you ever want to leave, you can export everything or migrate your
+              identity to a different PDS provider — no data is locked inside Certified.
+            </p>
+          </section>
+
+          <section>
+            <h2 className="font-mono text-xl text-navy mb-4">What is AT Protocol?</h2>
+            <p>
+              AT Protocol (Authenticated Transfer Protocol) is an open, federated protocol for
+              building social and identity applications. Unlike centralized platforms where one
+              company controls your account, AT Protocol separates identity from the application
+              layer. Your identity is yours — verifiable, portable, and independent of any single
+              service.
+            </p>
+            <p className="mt-4">
+              Certified builds on AT Protocol to provide a managed, user-friendly entry point: you
+              get the benefits of decentralized identity without needing to understand the
+              underlying protocol or run your own infrastructure.
+            </p>
+          </section>
+
+          <section>
+            <h2 className="font-mono text-xl text-navy mb-4">
+              Who operates Certified?
+            </h2>
+            <p>
+              Certified is operated by the{" "}
+              <a
+                href="https://hypercerts.org"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="text-blue-600 underline hover:text-blue-800"
+              >
+                Hypercerts Foundation
+              </a>
+              , a Delaware nonstock corporation founded in February 2023. The Foundation develops
+              open infrastructure for the hypercerts ecosystem — tools and protocols that help
+              track, fund, and reward positive impact.
+            </p>
+            <p className="mt-4">
+              Certified was created because the hypercerts ecosystem needed a portable identity
+              layer: a way for users to move between applications while keeping their profile,
+              contributions, and reputation intact. Rather than build a proprietary login system,
+              the Foundation chose AT Protocol as the foundation — making Certified interoperable
+              with a growing network of decentralized applications.
+            </p>
+          </section>
+
+          <section>
+            <h2 className="font-mono text-xl text-navy mb-4">
+              How is Certified different from &quot;Sign in with Google&quot;?
+            </h2>
+            <p>
+              Both Certified and &quot;Sign in with Google&quot; let you use one account across
+              multiple apps. The key difference is ownership and portability:
+            </p>
+            <ul className="list-disc pl-6 mt-4 space-y-2">
+              <li>
+                <strong>With Google:</strong> Google controls your identity. If Google suspends
+                your account or changes their terms, you lose access to every app you signed into.
+                Your data stays with each individual app.
+              </li>
+              <li>
+                <strong>With Certified:</strong> Your identity is an AT Protocol identity — it&apos;s
+                cryptographically yours. You can export your data, migrate to another provider, or
+                even self-host. No single company can revoke your identity.
+              </li>
+            </ul>
+          </section>
+
+          <section>
+            <h2 className="font-mono text-xl text-navy mb-4">Open source</h2>
+            <p>
+              Every component of Certified is open source. The application code, the PDS
+              infrastructure, and the protocol it builds on are all publicly auditable. You can
+              review the source on{" "}
+              <a
+                href="https://github.com/hypercerts-org"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="text-blue-600 underline hover:text-blue-800"
+              >
+                GitHub
+              </a>
+              .
+            </p>
+            <p className="mt-4">
+              Security through transparency, not obscurity. If you find an issue, you can report
+              it directly or submit a fix.
+            </p>
+          </section>
+
+          <section>
+            <h2 className="font-mono text-xl text-navy mb-4">Infrastructure</h2>
+            <p>
+              The Personal Data Servers operated by Certified are hosted on cloud infrastructure
+              located within the European Union. The service is designed to comply with GDPR and
+              the Digital Services Act.
+            </p>
+            <p className="mt-4">
+              For more details, see our{" "}
+              <Link href="/privacy" className="text-blue-600 underline hover:text-blue-800">
+                Privacy Policy
+              </Link>{" "}
+              and{" "}
+              <Link href="/dsa" className="text-blue-600 underline hover:text-blue-800">
+                DSA Compliance
+              </Link>{" "}
+              page.
+            </p>
+          </section>
+
+          <section>
+            <h2 className="font-mono text-xl text-navy mb-4">Contact</h2>
+            <p>
+              <strong>Hypercerts Foundation</strong>
+              <br />
+              1209 Orange St.
+              <br />
+              Wilmington, DE 19801
+              <br />
+              United States
+            </p>
+            <p className="mt-4">
+              Email:{" "}
+              <a
+                href="mailto:support@hypercerts.org"
+                className="text-blue-600 underline hover:text-blue-800"
+              >
+                support@hypercerts.org
+              </a>
+            </p>
+            <p className="mt-4">
+              <a
+                href="https://x.com/hypercerts"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="text-blue-600 underline hover:text-blue-800"
+              >
+                Twitter/X
+              </a>
+              {" · "}
+              <a
+                href="https://www.linkedin.com/company/hypercerts"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="text-blue-600 underline hover:text-blue-800"
+              >
+                LinkedIn
+              </a>
+              {" · "}
+              <a
+                href="https://bsky.app/profile/hypercerts.org"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="text-blue-600 underline hover:text-blue-800"
+              >
+                Bluesky
+              </a>
+              {" · "}
+              <a
+                href="https://github.com/hypercerts-org"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="text-blue-600 underline hover:text-blue-800"
+              >
+                GitHub
+              </a>
+            </p>
+          </section>
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/src/app/dsa/page.tsx b/src/app/dsa/page.tsx
index 7093a92b..665e5f31 100644
--- a/src/app/dsa/page.tsx
+++ b/src/app/dsa/page.tsx
@@ -1,3 +1,18 @@
+import type { Metadata } from "next";
+
+export const metadata: Metadata = {
+  title: "Digital Services Act — Compliance Information",
+  description:
+    "DSA compliance information for Certified, operated by the Hypercerts Foundation. Includes notice-and-action procedures and contact information.",
+  alternates: { canonical: "https://certified.app/dsa" },
+  openGraph: {
+    title: "DSA Compliance — Certified",
+    description:
+      "Digital Services Act compliance information for Certified, operated by the Hypercerts Foundation.",
+    url: "https://certified.app/dsa",
+  },
+};
+
 export default function DsaPage() {
   return (
     <div className="app-page">
diff --git a/src/app/globals.css b/src/app/globals.css
index 1c6f4aaf..a9c3cf69 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -427,6 +427,18 @@ h1, h2, h3, h4, h5, h6 {
   margin-bottom: 48px;
 }
 
+.hero__description {
+  color: var(--color-dark-gray);
+  font-size: 0.95rem;
+  line-height: 1.7;
+  font-weight: 400;
+  max-width: 560px;
+  margin-left: auto;
+  margin-right: auto;
+  margin-bottom: 32px;
+  opacity: 0.7;
+}
+
 .hero__actions {
   display: flex;
   gap: 24px;
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 9fbbadfb..64862f32 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -32,8 +32,75 @@ const instrumentSerif = Instrument_Serif({
 });
 
 export const metadata: Metadata = {
-  title: "Certified",
+  title: {
+    default: "Certified",
+    template: "%s — Certified",
+  },
   description: "Your identity, everywhere.",
+  metadataBase: new URL("https://certified.app"),
+  openGraph: {
+    siteName: "Certified",
+    locale: "en_US",
+    type: "website",
+    images: [
+      {
+        url: "/assets/certified-hero-1200x630.png",
+        width: 1200,
+        height: 630,
+        alt: "Certified — One account, any app",
+      },
+    ],
+  },
+  twitter: {
+    card: "summary_large_image",
+    images: ["/assets/certified-hero-1200x630.png"],
+  },
+};
+
+const organizationJsonLd = {
+  "@context": "https://schema.org",
+  "@type": "Organization",
+  name: "Hypercerts Foundation",
+  legalName: "Hypercerts Foundation",
+  url: "https://hypercerts.org",
+  logo: "https://certified.app/assets/certified_brandmark_black.png",
+  description:
+    "A Delaware nonstock corporation that develops open infrastructure for the hypercerts ecosystem, operating the Certified identity platform.",
+  foundingDate: "2023-02-03",
+  address: {
+    "@type": "PostalAddress",
+    streetAddress: "1209 Orange St.",
+    addressLocality: "Wilmington",
+    addressRegion: "DE",
+    postalCode: "19801",
+    addressCountry: "US",
+  },
+  contactPoint: {
+    "@type": "ContactPoint",
+    email: "legal@hypercerts.org",
+    contactType: "legal",
+  },
+  sameAs: [
+    "https://github.com/hypercerts-org",
+    "https://x.com/hypercerts",
+    "https://www.linkedin.com/company/hypercerts",
+    "https://bsky.app/profile/hypercerts.org",
+  ],
+};
+
+const websiteJsonLd = {
+  "@context": "https://schema.org",
+  "@type": "WebSite",
+  name: "Certified",
+  url: "https://certified.app",
+  description:
+    "Create your Certified identity and use one account across partner apps. No passwords, no lock-in.",
+  publisher: {
+    "@type": "Organization",
+    name: "Hypercerts Foundation",
+    url: "https://hypercerts.org",
+  },
+  inLanguage: "en",
 };
 
 export default function RootLayout({
@@ -43,6 +110,16 @@ export default function RootLayout({
 }>) {
   return (
     <html lang="en">
+      <head>
+        <script
+          type="application/ld+json"
+          dangerouslySetInnerHTML={{ __html: JSON.stringify(organizationJsonLd) }}
+        />
+        <script
+          type="application/ld+json"
+          dangerouslySetInnerHTML={{ __html: JSON.stringify(websiteJsonLd) }}
+        />
+      </head>
       <body className={`${inter.variable} ${notoSerif.variable} ${instrumentSerif.variable} min-h-screen flex flex-col`}>
         <Providers>
           <AuthProvider>
diff --git a/src/app/page.tsx b/src/app/page.tsx
index c37f460e..5af29149 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,11 +1,94 @@
 import { Metadata } from "next";
+import LandingPage from "@/components/landing/landing-page";
 import HomeClient from "@/components/landing/home-client";
+import { FAQ_ITEMS } from "@/components/landing/sections/faq-content";
 
 export const metadata: Metadata = {
   title: "Certified — One account, any app",
-  description: "Create your Certified identity and use one account across partner apps. No passwords, no lock-in.",
+  description:
+    "Certified is a passwordless identity platform built on AT Protocol, operated by the Hypercerts Foundation. Create a single account that works across partner apps with full data portability and no vendor lock-in.",
+  alternates: {
+    canonical: "https://certified.app",
+  },
+  openGraph: {
+    title: "Certified — One account, any app",
+    description:
+      "Create your Certified identity and use one account across partner apps. No passwords, no lock-in.",
+    url: "https://certified.app",
+    siteName: "Certified",
+    images: [
+      {
+        url: "https://certified.app/assets/certified-hero-1200x630.png",
+        width: 1200,
+        height: 630,
+        alt: "Certified — One account, any app",
+      },
+    ],
+    locale: "en_US",
+    type: "website",
+  },
+  twitter: {
+    card: "summary_large_image",
+    title: "Certified — One account, any app",
+    description:
+      "Create your Certified identity and use one account across partner apps. No passwords, no lock-in.",
+    images: ["https://certified.app/assets/certified-hero-1200x630.png"],
+  },
+};
+
+// JSON-LD for the homepage: SoftwareApplication + FAQPage
+const softwareAppJsonLd = {
+  "@context": "https://schema.org",
+  "@type": "SoftwareApplication",
+  name: "Certified",
+  url: "https://certified.app",
+  applicationCategory: "SecurityApplication",
+  operatingSystem: "Web",
+  description:
+    "Certified is a passwordless identity platform built on AT Protocol, operated by the Hypercerts Foundation. Create a single account that works across partner apps with full data portability and no vendor lock-in.",
+  offers: {
+    "@type": "Offer",
+    price: "0",
+    priceCurrency: "USD",
+  },
+  creator: {
+    "@type": "Organization",
+    name: "Hypercerts Foundation",
+    url: "https://hypercerts.org",
+  },
+  isAccessibleForFree: true,
+};
+
+const faqJsonLd = {
+  "@context": "https://schema.org",
+  "@type": "FAQPage",
+  mainEntity: FAQ_ITEMS.map((item) => ({
+    "@type": "Question",
+    name: item.question,
+    acceptedAnswer: {
+      "@type": "Answer",
+      text: item.answer,
+    },
+  })),
 };
 
 export default function Home() {
-  return <HomeClient />;
+  return (
+    <>
+      <script
+        type="application/ld+json"
+        dangerouslySetInnerHTML={{ __html: JSON.stringify(softwareAppJsonLd) }}
+      />
+      <script
+        type="application/ld+json"
+        dangerouslySetInnerHTML={{ __html: JSON.stringify(faqJsonLd) }}
+      />
+      {/* Server-rendered landing page — visible to all crawlers */}
+      <div className="landing-ssr">
+        <LandingPage />
+      </div>
+      {/* Client component handles auth state: hides landing & shows dashboard when authenticated */}
+      <HomeClient />
+    </>
+  );
 }
diff --git a/src/app/privacy/page.tsx b/src/app/privacy/page.tsx
index 10bd63fa..9a070bad 100644
--- a/src/app/privacy/page.tsx
+++ b/src/app/privacy/page.tsx
@@ -1,3 +1,18 @@
+import type { Metadata } from "next";
+
+export const metadata: Metadata = {
+  title: "Privacy Policy",
+  description:
+    "Privacy Policy for Certified, the identity platform operated by the Hypercerts Foundation. Covers data processing, GDPR compliance, cookies, and your rights.",
+  alternates: { canonical: "https://certified.app/privacy" },
+  openGraph: {
+    title: "Privacy Policy — Certified",
+    description:
+      "Privacy Policy for Certified, the identity platform operated by the Hypercerts Foundation.",
+    url: "https://certified.app/privacy",
+  },
+};
+
 export default function PrivacyPage() {
   return (
     <div className="app-page">
diff --git a/src/app/robots.ts b/src/app/robots.ts
new file mode 100644
index 00000000..6f16b077
--- /dev/null
+++ b/src/app/robots.ts
@@ -0,0 +1,13 @@
+import type { MetadataRoute } from "next";
+
+export default function robots(): MetadataRoute.Robots {
+  return {
+    rules: [
+      {
+        userAgent: "*",
+        allow: "/",
+      },
+    ],
+    sitemap: "https://certified.app/sitemap.xml",
+  };
+}
diff --git a/src/app/sitemap.ts b/src/app/sitemap.ts
new file mode 100644
index 00000000..f05203d0
--- /dev/null
+++ b/src/app/sitemap.ts
@@ -0,0 +1,36 @@
+import type { MetadataRoute } from "next";
+
+export default function sitemap(): MetadataRoute.Sitemap {
+  return [
+    {
+      url: "https://certified.app",
+      lastModified: new Date(),
+      changeFrequency: "weekly",
+      priority: 1,
+    },
+    {
+      url: "https://certified.app/about",
+      lastModified: new Date(),
+      changeFrequency: "monthly",
+      priority: 0.8,
+    },
+    {
+      url: "https://certified.app/terms",
+      lastModified: new Date("2026-04-01"),
+      changeFrequency: "monthly",
+      priority: 0.5,
+    },
+    {
+      url: "https://certified.app/privacy",
+      lastModified: new Date("2026-04-01"),
+      changeFrequency: "monthly",
+      priority: 0.5,
+    },
+    {
+      url: "https://certified.app/dsa",
+      lastModified: new Date("2026-03-15"),
+      changeFrequency: "monthly",
+      priority: 0.3,
+    },
+  ];
+}
diff --git a/src/app/terms/page.tsx b/src/app/terms/page.tsx
index 718bb56a..a162ff1a 100644
--- a/src/app/terms/page.tsx
+++ b/src/app/terms/page.tsx
@@ -1,3 +1,18 @@
+import type { Metadata } from "next";
+
+export const metadata: Metadata = {
+  title: "Terms of Service",
+  description:
+    "Terms of Service for Certified, the identity platform operated by the Hypercerts Foundation. Covers account usage, data ownership, AT Protocol identity, and acceptable use.",
+  alternates: { canonical: "https://certified.app/terms" },
+  openGraph: {
+    title: "Terms of Service — Certified",
+    description:
+      "Terms of Service for Certified, the identity platform operated by the Hypercerts Foundation.",
+    url: "https://certified.app/terms",
+  },
+};
+
 export default function TermsPage() {
   return (
     <div className="app-page">
diff --git a/src/components/landing/hero-signin-button.tsx b/src/components/landing/hero-signin-button.tsx
new file mode 100644
index 00000000..713c3107
--- /dev/null
+++ b/src/components/landing/hero-signin-button.tsx
@@ -0,0 +1,15 @@
+"use client";
+
+import { useAuth } from "@/lib/auth/auth-context";
+
+export default function HeroSignInButton() {
+  const { openSignIn } = useAuth();
+
+  return (
+    <div className="hero__actions">
+      <button className="hero__btn-signin" onClick={openSignIn}>
+        <img src="/assets/sign_in_with_certified_black.svg" alt="Sign in with Certified" className="hero__btn-signin-img" />
+      </button>
+    </div>
+  );
+}
diff --git a/src/components/landing/home-client.tsx b/src/components/landing/home-client.tsx
index 62773d74..e682986c 100644
--- a/src/components/landing/home-client.tsx
+++ b/src/components/landing/home-client.tsx
@@ -2,7 +2,6 @@
 
 import { useEffect } from "react";
 import Link from "next/link";
-import dynamic from "next/dynamic";
 import { Pencil } from "lucide-react";
 import { useAuth } from "@/lib/auth/auth-context";
 import { useNavbarVariant } from "@/lib/navbar-context";
@@ -14,14 +13,6 @@ import Avatar from "@/components/ui/avatar";
 import { getInitials } from "@/lib/utils/initials";
 import Button from "@/components/ui/button";
 
-// Landing sections — only loaded for unauthenticated users
-const WhatYouGet = dynamic(() => import("@/components/landing/sections/what-you-get"));
-const HowItWorks = dynamic(() => import("@/components/landing/sections/how-it-works"));
-const PartnerApps = dynamic(() => import("@/components/landing/sections/partner-apps"));
-const BuiltForTrust = dynamic(() => import("@/components/landing/sections/built-for-trust"));
-const Faq = dynamic(() => import("@/components/landing/sections/faq"));
-const ReadyCta = dynamic(() => import("@/components/landing/sections/ready-cta"));
-
 export default function HomeClient() {
   const { isLoading, isAuthenticated, did, openSignIn } = useAuth();
   const { profile, avatarUrl, bannerUrl, isFallback } = useProfile();
@@ -39,6 +30,20 @@ export default function HomeClient() {
     };
   }, [isAuthenticated, isLoading, setVariant]);
 
+  // Hide or show the server-rendered landing page based on auth state
+  useEffect(() => {
+    const landingSsr = document.querySelector(".landing-ssr") as HTMLElement | null;
+    if (!landingSsr) return;
+
+    if (isLoading) {
+      landingSsr.style.display = "none";
+    } else if (isAuthenticated) {
+      landingSsr.style.display = "none";
+    } else {
+      landingSsr.style.display = "";
+    }
+  }, [isLoading, isAuthenticated]);
+
   const initials = getInitials(profile?.displayName, did);
 
   if (isLoading) {
@@ -184,62 +189,6 @@ export default function HomeClient() {
     );
   }
 
-  // Not authenticated - Landing page
-  return (
-    <>
-      <section className="hero hero--landing">
-        {/* Line-art pattern background */}
-        <div className="hero__pattern" aria-hidden="true">
-          <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg">
-            <defs>
-              <pattern id="grid" width="100" height="100" patternUnits="userSpaceOnUse">
-                <path d="M 100 0 L 0 0 0 100" fill="none" stroke="currentColor" strokeWidth="0.5" />
-              </pattern>
-            </defs>
-            <rect width="100%" height="100%" fill="url(#grid)" />
-            <circle cx="50%" cy="50%" r="300" fill="none" stroke="currentColor" strokeWidth="0.3" />
-            <circle cx="50%" cy="50%" r="400" fill="none" stroke="currentColor" strokeWidth="0.15" />
-            <line x1="0%" y1="0%" x2="100%" y2="100%" stroke="currentColor" strokeWidth="0.15" />
-            <line x1="100%" y1="0%" x2="0%" y2="100%" stroke="currentColor" strokeWidth="0.15" />
-          </svg>
-        </div>
-
-        <div className="hero__inner">
-          <span className="hero__label">Built on AT Protocol</span>
-          <h1 className="hero__title hero-reveal">
-            One account.<br />
-            <span className="hero__title-accent">Any app.</span>
-          </h1>
-          <p className="hero__subtitle hero-reveal">
-            Your identity and data — everywhere you go.
-          </p>
-          <div className="hero-reveal">
-            <div className="hero__actions">
-              <button className="hero__btn-signin" onClick={openSignIn}>
-                <img src="/assets/sign_in_with_certified_black.svg" alt="Sign in with Certified" className="hero__btn-signin-img" />
-              </button>
-            </div>
-          </div>
-        </div>
-      </section>
-      <WhatYouGet />
-      <HowItWorks />
-      <PartnerApps />
-      <BuiltForTrust />
-      <Faq />
-      <ReadyCta />
-      <footer className="landing-footer">
-        <div className="landing-footer__bar">
-          <div className="landing-footer__left">
-            <img src="/assets/certified_wordmark_black_green.png" alt="Certified" className="landing-footer__logo-img" />
-            <span className="landing-footer__copy">&copy; 2026 Hypercerts Foundation</span>
-          </div>
-          <div className="landing-footer__links">
-            <Link href="/terms">Terms</Link>
-            <Link href="/privacy">Privacy</Link>
-          </div>
-        </div>
-      </footer>
-    </>
-  );
+  // Not authenticated — landing page is server-rendered, just return null
+  return null;
 }
diff --git a/src/components/landing/landing-page.tsx b/src/components/landing/landing-page.tsx
new file mode 100644
index 00000000..29f8bac5
--- /dev/null
+++ b/src/components/landing/landing-page.tsx
@@ -0,0 +1,71 @@
+import Link from "next/link";
+import WhatYouGet from "@/components/landing/sections/what-you-get";
+import HowItWorks from "@/components/landing/sections/how-it-works";
+import PartnerApps from "@/components/landing/sections/partner-apps";
+import BuiltForTrust from "@/components/landing/sections/built-for-trust";
+import FaqSection from "@/components/landing/sections/faq-content";
+import ReadyCtaSection from "@/components/landing/sections/ready-cta-content";
+import HeroSignInButton from "@/components/landing/hero-signin-button";
+
+export default function LandingPage() {
+  return (
+    <>
+      <section className="hero hero--landing">
+        {/* Line-art pattern background */}
+        <div className="hero__pattern" aria-hidden="true">
+          <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg">
+            <defs>
+              <pattern id="grid" width="100" height="100" patternUnits="userSpaceOnUse">
+                <path d="M 100 0 L 0 0 0 100" fill="none" stroke="currentColor" strokeWidth="0.5" />
+              </pattern>
+            </defs>
+            <rect width="100%" height="100%" fill="url(#grid)" />
+            <circle cx="50%" cy="50%" r="300" fill="none" stroke="currentColor" strokeWidth="0.3" />
+            <circle cx="50%" cy="50%" r="400" fill="none" stroke="currentColor" strokeWidth="0.15" />
+            <line x1="0%" y1="0%" x2="100%" y2="100%" stroke="currentColor" strokeWidth="0.15" />
+            <line x1="100%" y1="0%" x2="0%" y2="100%" stroke="currentColor" strokeWidth="0.15" />
+          </svg>
+        </div>
+
+        <div className="hero__inner">
+          <span className="hero__label">Built on AT Protocol</span>
+          <h1 className="hero__title hero-reveal">
+            One account.<br />
+            <span className="hero__title-accent">Any app.</span>
+          </h1>
+          <p className="hero__subtitle hero-reveal">
+            Your identity and data — everywhere you go.
+          </p>
+          <p className="hero__description hero-reveal">
+            Certified is a passwordless identity platform built on AT Protocol, operated by the
+            Hypercerts Foundation. Create a single account that works across partner applications
+            like Ma Earth, GainForest, Simocracy, and Hyperboards — with full data portability
+            and no vendor lock-in.
+          </p>
+          <div className="hero-reveal">
+            <HeroSignInButton />
+          </div>
+        </div>
+      </section>
+      <WhatYouGet />
+      <HowItWorks />
+      <PartnerApps />
+      <BuiltForTrust />
+      <FaqSection />
+      <ReadyCtaSection />
+      <footer className="landing-footer">
+        <div className="landing-footer__bar">
+          <div className="landing-footer__left">
+            <img src="/assets/certified_wordmark_black_green.png" alt="Certified" className="landing-footer__logo-img" />
+            <span className="landing-footer__copy">&copy; 2026 Hypercerts Foundation</span>
+          </div>
+          <div className="landing-footer__links">
+            <Link href="/about">About</Link>
+            <Link href="/terms">Terms</Link>
+            <Link href="/privacy">Privacy</Link>
+          </div>
+        </div>
+      </footer>
+    </>
+  );
+}
diff --git a/src/components/landing/sections/faq-accordion.tsx b/src/components/landing/sections/faq-accordion.tsx
new file mode 100644
index 00000000..5ca2fee1
--- /dev/null
+++ b/src/components/landing/sections/faq-accordion.tsx
@@ -0,0 +1,45 @@
+"use client";
+
+import { useState } from "react";
+import { Plus } from "lucide-react";
+
+interface FaqItem {
+  question: string;
+  answer: string;
+}
+
+export default function FaqAccordion({ items }: { items: FaqItem[] }) {
+  const [openFaq, setOpenFaq] = useState<number | null>(null);
+
+  return (
+    <div className="landing-faq">
+      {items.map((item, index) => {
+        const isOpen = openFaq === index;
+        const answerId = `faq-answer-${index}`;
+        const questionId = `faq-q-${index}`;
+        return (
+          <div key={index} className="landing-faq-item">
+            <button
+              id={questionId}
+              className="landing-faq-btn"
+              aria-expanded={isOpen}
+              aria-controls={answerId}
+              onClick={() => setOpenFaq(isOpen ? null : index)}
+            >
+              {item.question}
+              <Plus className={`landing-faq-icon${isOpen ? " landing-faq-icon--open" : ""}`} />
+            </button>
+            <div
+              id={answerId}
+              role="region"
+              aria-labelledby={questionId}
+              className={`landing-faq-answer${isOpen ? " landing-faq-answer--open" : ""}`}
+            >
+              <p>{item.answer}</p>
+            </div>
+          </div>
+        );
+      })}
+    </div>
+  );
+}
diff --git a/src/components/landing/sections/faq-content.tsx b/src/components/landing/sections/faq-content.tsx
new file mode 100644
index 00000000..12729fca
--- /dev/null
+++ b/src/components/landing/sections/faq-content.tsx
@@ -0,0 +1,43 @@
+import FaqAccordion from "./faq-accordion";
+
+export const FAQ_ITEMS = [
+  {
+    question: "Is this like 'Sign in with Google'?",
+    answer:
+      "Similar idea: one account across apps. The difference is that Certified is designed so you're not locked into one company or one app.",
+  },
+  {
+    question: "Do I need crypto or a wallet?",
+    answer:
+      "No. Certified works with just your email. No crypto, no wallet, no technical setup required.",
+  },
+  {
+    question: "What if I already have an account on a partner app?",
+    answer:
+      "On supported platforms, you can connect Certified to an existing account.",
+  },
+  {
+    question: "Can I stop using Certified later?",
+    answer:
+      "Yes. Your data is portable — you can export it or simply stop using the service at any time.",
+  },
+  {
+    question: "What apps support Certified?",
+    answer:
+      "Currently Ma Earth, GainForest, Simocracy, and Hyperboards. More apps are joining over time.",
+  },
+];
+
+export default function FaqSection() {
+  return (
+    <section id="faq" className="landing-section landing-section--subtle">
+      <div className="landing-section__inner">
+        <div className="landing-section__header landing-section__header--center">
+          <span className="landing-label">Common Questions</span>
+          <h2>Frequently asked questions</h2>
+        </div>
+        <FaqAccordion items={FAQ_ITEMS} />
+      </div>
+    </section>
+  );
+}
diff --git a/src/components/landing/sections/ready-cta-button.tsx b/src/components/landing/sections/ready-cta-button.tsx
new file mode 100644
index 00000000..a6c3e90f
--- /dev/null
+++ b/src/components/landing/sections/ready-cta-button.tsx
@@ -0,0 +1,15 @@
+"use client";
+
+import { useAuth } from "@/lib/auth/auth-context";
+
+export default function ReadyCtaButton() {
+  const { openSignIn } = useAuth();
+
+  return (
+    <div className="landing-cta__actions">
+      <button className="hero__btn-signin" onClick={openSignIn}>
+        <img src="/assets/sign_in_with_certified_black.svg" alt="Sign in with Certified" className="hero__btn-signin-img" />
+      </button>
+    </div>
+  );
+}
diff --git a/src/components/landing/sections/ready-cta-content.tsx b/src/components/landing/sections/ready-cta-content.tsx
new file mode 100644
index 00000000..d96d32e7
--- /dev/null
+++ b/src/components/landing/sections/ready-cta-content.tsx
@@ -0,0 +1,24 @@
+import ReadyCtaButton from "./ready-cta-button";
+
+export default function ReadyCtaSection() {
+  return (
+    <section id="ready-cta" className="landing-section landing-section--light landing-section--pattern">
+      <div className="landing-section__pattern landing-section__pattern--dark" aria-hidden="true">
+        <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg">
+          <defs>
+            <pattern id="grid-cta" width="100" height="100" patternUnits="userSpaceOnUse">
+              <path d="M 100 0 L 0 0 0 100" fill="none" stroke="currentColor" strokeWidth="0.5" />
+            </pattern>
+          </defs>
+          <rect width="100%" height="100%" fill="url(#grid-cta)" />
+        </svg>
+      </div>
+      <div className="landing-section__inner landing-cta">
+        <span className="landing-label">Get Started</span>
+        <h2>Ready to get started?</h2>
+        <p>Create your account in under a minute.</p>
+        <ReadyCtaButton />
+      </div>
+    </section>
+  );
+}
diff --git a/src/components/layout/footer.tsx b/src/components/layout/footer.tsx
index 7ba30456..be080801 100644
--- a/src/components/layout/footer.tsx
+++ b/src/components/layout/footer.tsx
@@ -21,6 +21,7 @@ const Footer: React.FC = () => {
           <span className="landing-footer__copy">&copy; 2026 Hypercerts Foundation</span>
         </div>
         <div className="landing-footer__links">
+          <Link href="/about">About</Link>
           <Link href="/terms">Terms</Link>
           <Link href="/privacy">Privacy</Link>
         </div>

From f10b9dce7d70aced465dc23f391cede0264fe12f Mon Sep 17 00:00:00 2001
From: holkexyz <holke.brammer@gmail.com>
Date: Tue, 7 Apr 2026 09:29:14 -1000
Subject: [PATCH 2/2] fix: remove visible landing page changes, refine about
 page copy

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/app/about/page.tsx                  | 20 ++++++++++----------
 src/app/globals.css                     | 12 ------------
 src/components/landing/landing-page.tsx |  6 ------
 3 files changed, 10 insertions(+), 28 deletions(-)

diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
index 5eb065fb..4d637490 100644
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -42,8 +42,9 @@ export default function AboutPage() {
             <p className="mt-4">
               When you sign up for Certified, you get an AT Protocol identity and a Personal Data
               Server (PDS) hosted at <strong>certified.one</strong>. Your profile, preferences,
-              and activity travel with you to every app that supports Certified — currently
-              including Ma Earth, GainForest, Simocracy, and Hyperboards.
+              and activity travel with you to every app that supports AT Protocol — and
+              if the app supports Certified directly, you can sign in with just your email,
+              no password needed.
             </p>
           </section>
 
@@ -57,8 +58,7 @@ export default function AboutPage() {
               service that speaks AT Protocol.
             </p>
             <p className="mt-4">
-              Your data lives on your Personal Data Server. Applications read from it with your
-              permission. If you ever want to leave, you can export everything or migrate your
+              Your data lives on your Personal Data Server. If you ever want to leave, you can export everything or migrate your
               identity to a different PDS provider — no data is locked inside Certified.
             </p>
           </section>
@@ -192,30 +192,30 @@ export default function AboutPage() {
             </p>
             <p className="mt-4">
               <a
-                href="https://x.com/hypercerts"
+                href="https://bsky.app/profile/hypercerts.org"
                 target="_blank"
                 rel="noopener noreferrer"
                 className="text-blue-600 underline hover:text-blue-800"
               >
-                Twitter/X
+                Bluesky
               </a>
               {" · "}
               <a
-                href="https://www.linkedin.com/company/hypercerts"
+                href="https://x.com/hypercerts"
                 target="_blank"
                 rel="noopener noreferrer"
                 className="text-blue-600 underline hover:text-blue-800"
               >
-                LinkedIn
+                Twitter/X
               </a>
               {" · "}
               <a
-                href="https://bsky.app/profile/hypercerts.org"
+                href="https://www.linkedin.com/company/hypercerts"
                 target="_blank"
                 rel="noopener noreferrer"
                 className="text-blue-600 underline hover:text-blue-800"
               >
-                Bluesky
+                LinkedIn
               </a>
               {" · "}
               <a
diff --git a/src/app/globals.css b/src/app/globals.css
index a9c3cf69..1c6f4aaf 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -427,18 +427,6 @@ h1, h2, h3, h4, h5, h6 {
   margin-bottom: 48px;
 }
 
-.hero__description {
-  color: var(--color-dark-gray);
-  font-size: 0.95rem;
-  line-height: 1.7;
-  font-weight: 400;
-  max-width: 560px;
-  margin-left: auto;
-  margin-right: auto;
-  margin-bottom: 32px;
-  opacity: 0.7;
-}
-
 .hero__actions {
   display: flex;
   gap: 24px;
diff --git a/src/components/landing/landing-page.tsx b/src/components/landing/landing-page.tsx
index 29f8bac5..897085c1 100644
--- a/src/components/landing/landing-page.tsx
+++ b/src/components/landing/landing-page.tsx
@@ -36,12 +36,6 @@ export default function LandingPage() {
           <p className="hero__subtitle hero-reveal">
             Your identity and data — everywhere you go.
           </p>
-          <p className="hero__description hero-reveal">
-            Certified is a passwordless identity platform built on AT Protocol, operated by the
-            Hypercerts Foundation. Create a single account that works across partner applications
-            like Ma Earth, GainForest, Simocracy, and Hyperboards — with full data portability
-            and no vendor lock-in.
-          </p>
           <div className="hero-reveal">
             <HeroSignInButton />
           </div>