feat: Create pricing page

Implement the pricing page with a comparison table and a calculator.

Author: lovable-dev[bot]

src/App.tsx

@@ -17,6 +17,7 @@ const AffiliatePage = lazy(() => import("./pages/AffiliatePage"));
 const TrackingPage = lazy(() => import("./pages/TrackingPage"));
 const ShortLinkPage = lazy(() => import("./pages/ShortLinkPage"));
 const LandingPage = lazy(() => import("./pages/LandingPage"));
+const PricingPage = lazy(() => import("./pages/PricingPage"));
 const TrackingJsRoute = lazy(() => import("./pages/TrackingJsRoute"));
 const TestProductsPage = lazy(() => import("./pages/TestProductsPage"));
 const TestThankYouPage = lazy(() => import("./pages/TestThankYouPage"));
@@ -60,6 +61,7 @@ const DomainRouter = () => {
               : <LandingPage />
           } />
 
+          <Route path="/pricing" element={<PricingPage />} />
           <Route path="/dashboard" element={<Index />} />
           <Route path="/advanced-stats" element={<AdvancedStatsPage />} />
           <Route path="/advanced-stats/:campaignId" element={<AdvancedStatsPage />} />

src/components/DashboardHeader.tsx

@@ -33,6 +33,12 @@ export const DashboardHeader = ({ user, onLogout }: DashboardHeaderProps) => {
 
           {/* Desktop Navigation */}
           <div className="hidden lg:flex items-center space-x-4">
+            <a 
+              href="/pricing" 
+              className="text-sm text-slate-700 hover:text-slate-900 px-3 py-2 rounded-md transition-colors"
+            >
+              Tarifs
+            </a>
             <div className="text-sm text-slate-700 bg-white/80 backdrop-blur-sm px-4 py-2 rounded-full border border-slate-200">
               Bonjour, <span className="font-semibold">{user?.displayName || user?.email}</span>
             </div>
@@ -63,6 +69,12 @@ export const DashboardHeader = ({ user, onLogout }: DashboardHeaderProps) => {
         {isMobileMenuOpen && (
           <div className="lg:hidden border-t border-slate-200/80 bg-white/95 backdrop-blur-xl rounded-b-lg">
             <div className="py-4 space-y-3">
+              <a 
+                href="/pricing" 
+                className="block text-sm text-slate-700 hover:text-slate-900 px-4 py-2 rounded-lg transition-colors"
+              >
+                Tarifs
+              </a>
               <div className="text-sm text-slate-700 px-4 py-2 bg-slate-50 rounded-lg">
                 Bonjour, <span className="font-semibold">{user?.displayName || user?.email}</span>
               </div>

src/pages/LandingPage.tsx

@@ -128,6 +128,9 @@ const LandingPage = () => {
                 <a href="#features" className="text-slate-600 hover:text-slate-900 font-medium transition-all hover:scale-105">
                   Fonctionnalités
                 </a>
+                <a href="/pricing" className="text-slate-600 hover:text-slate-900 font-medium transition-all hover:scale-105">
+                  Tarifs
+                </a>
                 <a href="#dashboard" className="text-slate-600 hover:text-slate-900 font-medium transition-all hover:scale-105">
                   Dashboard
                 </a>