Bob AI: Add pricing page

src/App.tsx

@@ -2,11 +2,13 @@ import { Routes, Route } from 'react-router-dom';
 import Layout from './components/Layout';
 import HomePage from './pages/HomePage';
 
+import PricingPage from "@/pages/PricingPage";
 export default function App() {
   return (
     <Routes>
       <Route element={<Layout />}>
         <Route path="/" element={<HomePage />} />
+        <Route path="/pricing" element={<PricingPage />} />
       </Route>
     </Routes>
   );

src/components/Layout.tsx

@@ -34,7 +34,9 @@ export default function Layout() {
   {
     "name": "Faq",
     "href": "#faq"
-  }
+  },
+  { name: "Pricing", href: "/pricing" },
+
 ];
 
   return (

src/pages/PricingPage.tsx

@@ -0,0 +1,104 @@
+import React from 'react';
+import { routes } from '@/routes';
+import NavbarCentered from '@/components/ui/NavbarCentered';
+import HeroBrand from '@/components/sections/hero/HeroBrand';
+import PricingHighlightedCards from '@/components/sections/pricing/PricingHighlightedCards';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+
+export default function PricingPage() {
+  return (
+    <div className="min-h-screen bg-background text-foreground flex flex-col">
+      <NavbarCentered
+        logo="Webild"
+        navItems={routes.map((r) => ({ name: r.label, href: r.path }))}
+        ctaButton={{ text: "Começar", href: "/contact" }}
+      />
+      
+      <main className="flex-grow">
+        <HeroBrand
+          brand="Planos Transparentes"
+          description="Escolha o plano ideal para o seu negócio. Sem taxas ocultas, cancele quando quiser e escale conforme a sua necessidade."
+          primaryButton={{ text: "Ver Planos", href: "#planos" }}
+          secondaryButton={{ text: "Falar com Vendas", href: "/contact" }}
+        />
+        
+        <div id="planos">
+          <PricingHighlightedCards
+            tag="PREÇOS"
+            title="Investimento que cabe no seu bolso"
+            description="Nossos planos foram desenhados para escalar junto com a sua empresa. Comece pequeno e cresça sem limites."
+            plans={[
+              {
+                tag: "Básico",
+                price: "R$ 49/mês",
+                description: "Ideal para freelancers e pequenos projetos que estão dando os primeiros passos.",
+                features: [
+                  "1 Usuário",
+                  "Suporte por email",
+                  "Recursos essenciais",
+                  "Relatórios básicos"
+                ],
+                buttonText: "Assinar Básico",
+                buttonHref: "#"
+              },
+              {
+                tag: "Profissional",
+                price: "R$ 149/mês",
+                description: "A escolha perfeita para equipes em crescimento que precisam de mais poder e agilidade.",
+                features: [
+                  "Até 10 Usuários",
+                  "Suporte prioritário 24/7",
+                  "Recursos avançados",
+                  "Integrações premium",
+                  "API de acesso"
+                ],
+                highlighted: true,
+                buttonText: "Começar Teste Grátis",
+                buttonHref: "#"
+              },
+              {
+                tag: "Empresarial",
+                price: "Personalizado",
+                description: "Soluções sob medida para grandes operações com necessidades complexas e alta demanda.",
+                features: [
+                  "Usuários ilimitados",
+                  "Gerente de conta dedicado",
+                  "SLA de 99.9% garantido",
+                  "Treinamento in-loco",
+                  "Auditoria de segurança"
+                ],
+                buttonText: "Falar com Vendas",
+                buttonHref: "/contact"
+              }
+            ]}
+          />
+        </div>
+      </main>
+
+      <FooterSimple
+        brand="Webild"
+        copyright="© 2024 Webild. Todos os direitos reservados."
+        columns={[
+          { 
+            title: "Produto", 
+            items: [
+              { label: "Recursos", href: "#" }, 
+              { label: "Preços", href: "/pricing" }
+            ] 
+          },
+          { 
+            title: "Empresa", 
+            items: [
+              { label: "Sobre", href: "/about" }, 
+              { label: "Contato", href: "/contact" }
+            ] 
+          }
+        ]}
+        links={[
+          { label: "Termos de Uso", href: "#" },
+          { label: "Privacidade", href: "#" }
+        ]}
+      />
+    </div>
+  );
+}

src/routes.ts

@@ -6,4 +6,5 @@ export interface Route {
 
 export const routes: Route[] = [
   { path: '/', label: 'Home', pageFile: 'HomePage' },
+  { path: '/pricing', label: 'Pricing', pageFile: 'PricingPage' },
 ];