From 2f60dbd7f06a851552fb50cf8080c856ff9d00de Mon Sep 17 00:00:00 2001
From: kudinDmitriyUp <kudin.dmitriy.up@gmail.com>
Date: Mon, 22 Jun 2026 19:29:42 +0000
Subject: [PATCH] Bob AI: Add pricing page

---
 src/App.tsx               |   2 +
 src/components/Layout.tsx |   4 +-
 src/pages/PricingPage.tsx | 104 ++++++++++++++++++++++++++++++++++++++
 src/routes.ts             |   1 +
 4 files changed, 110 insertions(+), 1 deletion(-)
 create mode 100644 src/pages/PricingPage.tsx

diff --git a/src/App.tsx b/src/App.tsx
index 33d15f9..9c6a8f8 100644
--- a/src/App.tsx
+++ b/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>
   );
diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx
index e945f5a..71731e9 100644
--- a/src/components/Layout.tsx
+++ b/src/components/Layout.tsx
@@ -34,7 +34,9 @@ export default function Layout() {
   {
     "name": "Faq",
     "href": "#faq"
-  }
+  },
+  { name: "Pricing", href: "/pricing" },
+
 ];
 
   return (
diff --git a/src/pages/PricingPage.tsx b/src/pages/PricingPage.tsx
new file mode 100644
index 0000000..ec9b439
--- /dev/null
+++ b/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>
+  );
+}
\ No newline at end of file
diff --git a/src/routes.ts b/src/routes.ts
index 362ecb5..ae18b1d 100644
--- a/src/routes.ts
+++ b/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' },
 ];