import { createFileRoute } from "@tanstack/react-router";
import { VehiclePage } from "@/components/vehicle-page";
import { mindLadder, vehicles } from "@/lib/content";

export const Route = createFileRoute("/mind")({ component: Mind });

function Mind() {
  return (
    <VehiclePage vehicle={vehicles.mind}>
      <section className="bg-bg px-6 py-20 sm:px-12 lg:px-20">
        <p className="font-display text-kicker uppercase tracking-wide text-muted">
          In plain words
        </p>
        <h2 className="mt-2 max-w-3xl font-display text-hero font-semibold uppercase">
          AI. Then AGI. Then superintelligence.
        </h2>
        <div className="mt-12 grid gap-10 lg:grid-cols-3">
          {mindLadder.map((step) => (
            <div key={step.name} className="border-t border-line pt-6">
              <p className="font-display text-xs uppercase tracking-wide text-muted">
                {step.kicker}
              </p>
              <h3 className="mt-2 font-display text-3xl font-semibold uppercase">
                {step.name}
              </h3>
              <p className="mt-3 text-sm leading-body text-muted">{step.body}</p>
            </div>
          ))}
        </div>
        <p className="mt-12 max-w-2xl text-sm text-muted">
          Lasers can write data into glass for thousands of years. That is a
          real lab result, not a metaphor. Continuation of a mind in a more
          durable shell is a research question with licensed partners — not an
          immortality garage. People and machines can share made air in a
          closed room. Machines do not grow lungs.
        </p>
      </section>
    </VehiclePage>
  );
}