diff --git a/.env b/.env
new file mode 100644
index 0000000..14fb927
--- /dev/null
+++ b/.env
@@ -0,0 +1,5 @@
+SUPABASE_PUBLISHABLE_KEY="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6InNtc2FybWdvaXJsY2VkbXF2ZGdjIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzY0MzczNjAsImV4cCI6MjA5MjAxMzM2MH0.AjMSQOn3BtzV-fJ2x9SWoM2ozjLyPD6g3dmTSeCT9II"
+SUPABASE_URL="https://smsarmgoirlcedmqvdgc.supabase.co"
+VITE_SUPABASE_PROJECT_ID="smsarmgoirlcedmqvdgc"
+VITE_SUPABASE_PUBLISHABLE_KEY="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6InNtc2FybWdvaXJsY2VkbXF2ZGdjIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzY0MzczNjAsImV4cCI6MjA5MjAxMzM2MH0.AjMSQOn3BtzV-fJ2x9SWoM2ozjLyPD6g3dmTSeCT9II"
+VITE_SUPABASE_URL="https://smsarmgoirlcedmqvdgc.supabase.co"
diff --git a/bun.lockb b/bun.lockb
index fd9327d..4d5c249 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/package.json b/package.json
index edd0f95..c5445e7 100644
--- a/package.json
+++ b/package.json
@@ -40,8 +40,9 @@
"@radix-ui/react-toggle": "^1.1.10",
"@radix-ui/react-toggle-group": "^1.1.11",
"@radix-ui/react-tooltip": "^1.2.8",
+ "@supabase/supabase-js": "^2.103.3",
"@tailwindcss/vite": "^4.2.1",
- "@tanstack/react-query": "^5.83.0",
+ "@tanstack/react-query": "^5.99.0",
"@tanstack/react-router": "^1.168.0",
"@tanstack/react-start": "^1.167.14",
"@tanstack/router-plugin": "^1.167.10",
@@ -50,12 +51,14 @@
"cmdk": "^1.1.1",
"date-fns": "^4.1.0",
"embla-carousel-react": "^8.6.0",
+ "framer-motion": "^12.38.0",
"input-otp": "^1.4.2",
"lucide-react": "^0.575.0",
"react": "^19.2.0",
"react-day-picker": "^9.14.0",
"react-dom": "^19.2.0",
- "react-hook-form": "^7.71.2",
+ "react-hook-form": "^7.72.1",
+ "react-imask": "^7.6.1",
"react-resizable-panels": "^4.6.5",
"recharts": "^2.15.4",
"sonner": "^2.0.7",
@@ -64,7 +67,7 @@
"tw-animate-css": "^1.3.4",
"vaul": "^1.1.2",
"vite-tsconfig-paths": "^6.0.2",
- "zod": "^3.24.2"
+ "zod": "^4.3.6"
},
"devDependencies": {
"@eslint/js": "^9.32.0",
diff --git a/public/favicon.svg b/public/favicon.svg
new file mode 100644
index 0000000..27dbdc5
--- /dev/null
+++ b/public/favicon.svg
@@ -0,0 +1,5 @@
+
diff --git a/public/og.svg b/public/og.svg
new file mode 100644
index 0000000..6d155cf
--- /dev/null
+++ b/public/og.svg
@@ -0,0 +1,20 @@
+
diff --git a/src/components/mika/EnterpriseLeadForm.tsx b/src/components/mika/EnterpriseLeadForm.tsx
new file mode 100644
index 0000000..dd86d4f
--- /dev/null
+++ b/src/components/mika/EnterpriseLeadForm.tsx
@@ -0,0 +1,119 @@
+"use client";
+
+import { useState } from "react";
+import { useForm } from "react-hook-form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { z } from "zod";
+import { IMaskInput } from "react-imask";
+import { toast } from "sonner";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Textarea } from "@/components/ui/textarea";
+import { Label } from "@/components/ui/label";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
+import { Loader2 } from "lucide-react";
+
+const schema = z.object({
+ company_name: z.string().min(2, "Informe o nome da empresa").max(120),
+ contact_name: z.string().min(2, "Informe seu nome").max(120),
+ email: z.string().email("Formato de e-mail inválido."),
+ phone: z.string().min(14, "Telefone inválido").max(20),
+ team_size: z.enum(["1-10", "11-50", "51-200", "200+"], { message: "Selecione o tamanho da equipe" }),
+ message: z.string().max(1000).optional(),
+});
+
+type FormValues = z.infer;
+
+export function EnterpriseLeadForm() {
+ const [submitting, setSubmitting] = useState(false);
+ const {
+ register,
+ handleSubmit,
+ setValue,
+ watch,
+ reset,
+ formState: { errors },
+ } = useForm({ resolver: zodResolver(schema) });
+
+ const onSubmit = async (data: FormValues) => {
+ setSubmitting(true);
+ try {
+ // Etapa 2: gravar em enterprise_leads via supabase.from(...).insert(...)
+ // Por ora: feedback otimista para o usuário.
+ await new Promise((r) => setTimeout(r, 700));
+ toast.success("Recebemos seu contato! Falamos com você em até 1 dia útil.");
+ reset();
+ } catch {
+ toast.error("Algo deu errado do nosso lado. Já estamos investigando.");
+ } finally {
+ setSubmitting(false);
+ }
+ };
+
+ const phone = watch("phone") || "";
+
+ return (
+
+ );
+}
diff --git a/src/components/mika/FaqSection.tsx b/src/components/mika/FaqSection.tsx
new file mode 100644
index 0000000..aefd37c
--- /dev/null
+++ b/src/components/mika/FaqSection.tsx
@@ -0,0 +1,58 @@
+import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "@/components/ui/accordion";
+
+const faqs = [
+ {
+ q: "O que é o Mika?",
+ a: "Mika é uma plataforma brasileira que entrega para você um agente de IA pessoal hospedado em VPS gerenciada, acessível direto pelo Telegram. Ele aprende com você, lembra de contexto e executa tarefas com integrações reais.",
+ },
+ {
+ q: "Como funciona o Telegram?",
+ a: "Após assinar, você recebe um QR code para conectar seu agente Mika ao seu Telegram. A partir daí, basta conversar com ele como faria com um assistente humano — ele responde direto no chat.",
+ },
+ {
+ q: "Posso cancelar quando quiser?",
+ a: "Sim, a qualquer momento, sem multa. O acesso continua até o fim do período já pago e não há cobranças adicionais depois disso.",
+ },
+ {
+ q: "Meus dados ficam seguros?",
+ a: "Seu agente roda em uma VPS gerenciada exclusivamente para você, com criptografia em trânsito e em repouso. Nunca usamos seus dados para treinar modelos. Estamos em conformidade com a LGPD.",
+ },
+ {
+ q: "Qual a diferença entre os planos?",
+ a: "Os planos diferem em capacidade de memória, número de skills, performance da VPS, modelos de IA disponíveis e nível de suporte. O Professional inclui VPS dedicada e modelos premium; o Enterprise inclui múltiplos agentes, SSO e SLA.",
+ },
+ {
+ q: "Como funciona o Skill Studio?",
+ a: "É onde você cria automações personalizadas em linguagem natural — basta descrever o que quer e o Mika gera a skill. Sem código.",
+ },
+ {
+ q: "O Mika funciona em grupo do Telegram?",
+ a: "Sim. Você pode adicionar o Mika a grupos e mencioná-lo para receber respostas, mantendo a privacidade das outras conversas.",
+ },
+ {
+ q: "Tem trial grátis?",
+ a: "Não oferecemos trial, mas garantimos reembolso integral nos primeiros 7 dias caso o produto não atenda suas expectativas.",
+ },
+];
+
+export function FaqSection() {
+ return (
+
+
+
+ );
+}
diff --git a/src/components/mika/HeroSection.tsx b/src/components/mika/HeroSection.tsx
new file mode 100644
index 0000000..65c784f
--- /dev/null
+++ b/src/components/mika/HeroSection.tsx
@@ -0,0 +1,148 @@
+"use client";
+
+import { motion } from "framer-motion";
+import { Link } from "@tanstack/react-router";
+import { ArrowRight, Send } from "lucide-react";
+import { Button } from "@/components/ui/button";
+
+const messages = [
+ { who: "user", text: "Resuma meus e-mails de hoje" },
+ {
+ who: "bot",
+ text: "Você tem 3 e-mails importantes:",
+ bullets: [
+ "📅 Carla — confirmar reunião de quinta às 15h",
+ "💰 Financeiro — fatura do servidor vence amanhã",
+ "📝 Time — feedback no documento do Q2",
+ ],
+ },
+ { who: "user", text: "Marca a reunião com a Carla" },
+ { who: "bot", text: "Pronto ✅ — agendado para quinta, 15h. Calendário atualizado." },
+];
+
+export function HeroSection() {
+ return (
+
+
+
+ {/* Left: copy */}
+
+
+ 🇧🇷 Feito no Brasil · Suporte em português
+
+
+
+ Seu assistente pessoal de IA, sempre disponível no{" "}
+ Telegram
+
+
+
+ O Mika entrega um agente de IA próprio que aprende com você, gerencia sua agenda,
+ seus e-mails e suas tarefas — tudo em português e conversando direto no Telegram.
+
+
+
+
+
+
+