professional-website/src/app/(frontend)/writing/page.tsx

import { SiteHeader } from "@/components/SiteHeader";
import { SiteFooter } from "@/components/SiteFooter";

export const metadata = { title: "Writing" };

export default function WritingIndexPage() {
  return (
    <>
      <SiteHeader />
      <main className="mx-auto max-w-7xl px-6 py-24">
        <span className="mb-6 block font-label text-xs uppercase tracking-[0.4em] text-secondary">
          04 // WRITING
        </span>
        <h1 className="mb-8 font-headline text-5xl font-bold tracking-tighter md:text-7xl">
          Signal
        </h1>
        <p className="max-w-3xl font-body text-xl text-on-surface-variant">
          Long-form from the Payload{" "}
          <code className="font-label text-primary">posts</code> collection.
        </p>
      </main>
      <SiteFooter />
    </>
  );
}