Pricing Section

import PricingSection from "@/components/ui/pricing-tiers";

export default function DemoOne() {
  const pricingData = {
    title: "Simple, transparent pricing",
    subtitle: "Get the features you need, without the clutter. Choose the plan that's right for you.",
    plans: [
      {
        id: 'free',
        name: 'Free',
        price: '$0',
        frequency: '/ month',
        description: 'For individuals just getting started.',
        features: [
          'Track 3 habits',
          'Basic progress reports',
          'Community access'
        ],
        buttonText: 'Get started for free',
        buttonLink: '#free',
        isFeatured: false
      },
      {
        id: 'pro',
        name: 'Pro',
        price: '$9',
        frequency: '/ month',
        description: 'For power users who want more.',
        features: [
          'Track unlimited habits',
          'Detailed analytics',
          'Priority support',
          'Data export'
        ],
        buttonText: 'Start your trial',
        buttonLink: '#pro',
        isFeatured: true
      },
      {
        id: 'team',
        name: 'Team',
        price: '$25',
        frequency: '/ user / month',
        description: 'For teams to collaborate.',
        features: [
          'All Pro features',
          'Team dashboards',
          'Shared habit tracking',
          'Admin controls'
        ],
        buttonText: 'Contact sales',
        buttonLink: '#team',
        isFeatured: false
      }
    ]
  };

  return (
    <div className="app-wrapper">
      <PricingSection data={pricingData} />
    </div>
  );
}