import type { Metadata } from "next";
import Link from "next/link";
import { pageSeo } from "@/content/page-seo";
import { createPageMetadata } from "@/lib/seo";
import {
  partnersIntro,
  sponsorSections,
  exhibitorSections,
  supporterSections,
  mediaPartnerSections,
} from "@/content/partners";
import { Section } from "@/components/layout/Section";
import { PartnerSectionBlock } from "@/components/partners/PartnerSectionBlock";
import { PartnershipCtaBand } from "@/components/partners/PartnershipCtaBand";
import { Button } from "@/components/ui/button";
import { ChampionStartupModal } from "@/components/partners/ChampionStartupModal";

export const metadata: Metadata = createPageMetadata(pageSeo.partners);

export default function PartnersPage() {
  return (
    <>
      <Section className="pt-24">
        <p className="text-xs font-semibold uppercase tracking-widest text-[#ffb300]">
          {partnersIntro.eyebrow}
        </p>
        <h1 className="mt-3 max-w-4xl text-4xl font-bold md:text-5xl">
          {partnersIntro.headline}
        </h1>
        <p className="mt-4 max-w-3xl text-lg text-muted-foreground leading-relaxed">
          {partnersIntro.subheadline}
        </p>
        <div className="mt-8 flex flex-wrap gap-3">
          <Button className="rounded-full bg-[#ffb300] text-[#0f0404] hover:bg-[#ffb300]/90" asChild>
            <Link href="#partnership-form">Become a partner</Link>
          </Button>
          <ChampionStartupModal />
        </div>
      </Section>

      <Section variant="muted" riftPattern="whisper">
        <div className="space-y-16">
          {sponsorSections.map((section, index) => (
            <PartnerSectionBlock
              key={section.id}
              section={section}
              showTitle={index === 0}
            />
          ))}
        </div>
      </Section>

      <Section riftPattern="vein-right">
        <div className="space-y-16">
          {exhibitorSections.map((section) => (
            <PartnerSectionBlock key={section.id} section={section} />
          ))}
        </div>
      </Section>

      <Section variant="muted" riftPattern="arc-bottom">
        <div className="space-y-16">
          {supporterSections.map((section) => (
            <PartnerSectionBlock key={section.id} section={section} />
          ))}
          {mediaPartnerSections.map((section) => (
            <PartnerSectionBlock key={section.id} section={section} />
          ))}
        </div>
      </Section>

      <PartnershipCtaBand />
    </>
  );
}