import type { Metadata } from "next";

import Link from "next/link";

import { Card, PageHeader, SectionHeader } from "@/components/ui";

export const metadata: Metadata = {

  title: "Who pays",

  description:

    "Ownership and funding of Docket. A trust surface - public, factual, no adjectives.",

};

export default function WhoPaysPage() {

  return (

    <div

      className="mx-auto w-full max-w-[860px] px-6 sm:px-8"

      style={{

        paddingTop: "clamp(32px, 6vw, 56px)",

        paddingBottom: "clamp(48px, 8vw, 80px)",

      }}

    >

      <Link

        href="/"

        className="focus-ring tap no-underline hover:underline"

        style={{

          display: "inline-flex",

          alignItems: "center",

          gap: "8px",

          fontFamily: "var(--font-mono), ui-monospace, monospace",

          fontSize: "13px",

          letterSpacing: "0.08em",

          color: "var(--dk-signal)",

          marginBottom: "32px",

        }}

      >

        ← Home

      </Link>

      <PageHeader

        eyebrow="Trust · ownership"

        title="Who pays for this"

        lead="Docket is a trust product. The funding and ownership model is stated here in fact, and updated when it changes."

      />

      <div className="mt-10 grid gap-4 sm:grid-cols-3">

        <Card className="p-5">

          <p className="label mb-2">Ownership</p>

          <p className="font-mono text-[13px] text-paper">Independent</p>

          <p className="label mt-2 text-ash-2">No parent company on file</p>

        </Card>

        <Card className="p-5">

          <p className="label mb-2">Revenue</p>

          <p className="font-mono text-[13px] text-paper">None at present</p>

          <p className="label mt-2 text-ash-2">No ads, no paid placement</p>

        </Card>

        <Card className="p-5">

          <p className="label mb-2">Costs</p>

          <p className="font-mono text-[13px] text-paper">Self-funded</p>

          <p className="label mt-2 text-ash-2">Primary data is free; compute is the main cost</p>

        </Card>

      </div>

      <div className="mt-10">

        <SectionHeader

          eyebrow="Data"

          title="Where the records come from"

          description="All primary data is free and official. The one paid source is OpenStates for state coverage."

        />

        <Card className="p-5">

          <ul className="grid gap-2 font-mono text-[12px] text-ash sm:grid-cols-2">

            <li>· Congress.gov -bills, actions, members, votes</li>

            <li>· GovInfo -full bill text, Congressional Record, public laws</li>

            <li>· USAspending.gov -awards and outlays</li>

            <li>· Treasury Fiscal Data -debt, deficit, cash flows</li>

            <li>· House Clerk and Senate -roll-call votes (XML)</li>

            <li>· CBO -cost estimates</li>

            <li>· OpenStates -50-state + DC/PR coverage (paid tier)</li>

          </ul>

        </Card>

      </div>

      <div className="mt-10">

        <SectionHeader eyebrow="Guardrails" title="What we will not take" />

        <Card className="p-5">

          <ul className="grid gap-2 font-mono text-[12px] text-ash">

            <li>· Political-campaign or advocacy advertising, of any party.</li>

            <li>· Paid placement in the register.</li>

            <li>· Funding conditioned on surfacing or suppressing an item.</li>

          </ul>

        </Card>

      </div>

      <div className="mt-10">

        <SectionHeader

          eyebrow="Governance"

          title="Review"

          description="A bipartisan advisory board and a published neutrality audit are tracked as standing work."

        />

      </div>

    </div>

  );

}