import type { ReactNode } from "react";
import { GlobalHeader } from "@/components/headers/global-header";
import { FullFooter } from "@/components/footers/full-footer";
import { FooterParticleWordmark } from "@/components/footer-particle-wordmark";
import { ScrollProgress } from "@/components/motion";

// (marketing): GlobalHeader (transparent→pill) + FullFooter (§6.1)
export default function MarketingLayout({ children }: { children: ReactNode }) {
  return (
    <div className="flex min-h-dvh flex-col">
      <ScrollProgress />
      <GlobalHeader />
      {/* Main container starts at top: 0 so page hero gradients flow behind the fixed header */}
      <main id="main" tabIndex={-1} className="flex-1">
        {children}
      </main>
      <FullFooter />
      <FooterParticleWordmark />
    </div>
  );
}