import type { Metadata } from 'next';
import { Navbar, PageHero, Pricing, EstimateCalculator, CtaBand, Footer } from '@/components/landing';

export const metadata: Metadata = {
  title: 'Pricing — Qtrial',
  description: 'Qtrial packages for pharmaceutical organisations: Starter, Growth and Enterprise. Instant quote estimator included.',
};

export default function PricingPage() {
  return (
    <div>
      <a href="#pricing-main" className="skip-link">Skip to content</a>
      <Navbar />
      <main id="pricing-main" tabIndex={-1} className="outline-none">
        <PageHero kicker="Packages" title="Plans that scale with your plant"
          sub="Pick a package, estimate your quote instantly, or ask for a tailored proposal." />
        <Pricing />
        <EstimateCalculator />
        <section aria-labelledby="limits-h" className="py-16">
          <div className="max-w-6xl mx-auto px-4">
            <div className="card space-y-3 p-6">
              <h2 id="limits-h" className="font-semibold text-lg">How limits work</h2>
              <p className="hint">Each plan caps stakeholders, employees and deviations per organisation. Admins see live usage on the Organisations page, and the API returns a clear message when a limit is reached — upgrades never lose data.</p>
              <p className="text-sm"><a href="/contact" className="link">Need a custom mix? Talk to us →</a></p>
            </div>
          </div>
        </section>
        <CtaBand />
      </main>
      <Footer />
    </div>
  );
}