CTA 01

import { BentoCard, BentoLight } from "@/components/ui/bento-grid"
import { Button } from "@/components/ui/button"

export default function Cta01() {
  return (
    <section className="bg-background px-4 py-24 sm:px-6 md:py-32">
      <BentoCard className="mx-auto max-w-6xl items-center px-6 py-16 text-center sm:px-12 sm:py-24">
        <BentoLight />

        <div className="flex max-w-2xl flex-col items-center gap-4">
          <h2 className="text-4xl font-semibold tracking-tight text-balance">
            Page the right person. Let everyone else sleep.
          </h2>
          <p className="max-w-xl text-pretty text-muted-foreground">
            Connect your alerts, import on-call rotations from a spreadsheet and
            route your first incident in under ten minutes.
          </p>

          <div className="mt-6 flex w-full flex-col gap-3 sm:w-auto sm:flex-row">
            <Button size="lg">Start free trial</Button>
            <Button size="lg" variant="outline">
              Talk to an engineer
            </Button>
          </div>

          <p className="text-sm text-muted-foreground">
            Free for 14 days. No credit card. Up to 5 responders free forever.
          </p>
        </div>
      </BentoCard>
    </section>
  )
}