puffin-app/app/how-it-works/page.tsx

import type { Metadata } from 'next';
import { HowItWorksClient } from '../../components/HowItWorksClient';

export const metadata: Metadata = {
  title: 'How It Works',
  description: 'Learn how Puffin Offset makes carbon offsetting simple: calculate your yacht\'s emissions, select verified offset projects, and track your environmental impact. Start your sustainability journey today.',
  keywords: ['carbon calculator', 'emissions tracking', 'yacht carbon footprint', 'offset projects', 'environmental impact tracking'],
  openGraph: {
    title: 'How Puffin Offset Works - Simple Carbon Offsetting Process',
    description: 'Calculate, offset, and track your yacht\'s carbon footprint in three easy steps with verified projects.',
    type: 'website',
    url: 'https://puffinoffset.com/how-it-works',
  },
};

export default function HowItWorksPage() {
  return <HowItWorksClient />;
}