import { Syne, DM_Sans, Playfair_Display } from "next/font/google";
import { RiftPageFlow } from "@/components/brand/RiftPageFlow";
import { JsonLd } from "@/components/seo/JsonLd";
import { SiteHeader } from "@/components/layout/SiteHeader";
import { SiteEntryPrompt } from "@/components/layout/SiteEntryPrompt";
import { SiteFooter } from "@/components/layout/SiteFooter";
import { rootMetadata } from "@/lib/seo";
import "./globals.css";

export const metadata = rootMetadata;

const display = Syne({
  subsets: ["latin"],
  variable: "--font-display",
  weight: ["600", "700", "800"],
});

const body = DM_Sans({
  subsets: ["latin"],
  variable: "--font-body",
});

/** Monumental serif for hero / display moments */
const playfair = Playfair_Display({
  subsets: ["latin"],
  variable: "--font-hero-serif",
  weight: ["600", "700", "800"],
});

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  return (
    <html lang="en" className={`${display.variable} ${body.variable} ${playfair.variable}`}>
      <body className="min-h-screen flex flex-col">
        <JsonLd />
        <SiteHeader />
        <main className="relative flex-1">
          <RiftPageFlow />
          <div className="relative z-10">{children}</div>
        </main>
        <SiteFooter />
        <SiteEntryPrompt />
      </body>
    </html>
  );
}
