import { createFileRoute, Link } from "@tanstack/react-router"; import { useEffect, useState } from "react"; import { toast } from "sonner"; import { supabase } from "@/integrations/supabase/client"; import logo from "@/assets/logo-ponto.png"; import { niches } from "@/lib/niches"; import { captureUtmFromUrl, getStoredUtm, trackEvent } from "@/lib/tracking"; import { buildWhatsAppHref, loadWhatsAppSettings, type WhatsAppSettings } from "@/lib/whatsapp"; const HOME_NICHE = "Home"; export const Route = createFileRoute("/")({ component: Index, head: () => ({ meta: [ { title: ".PONTO — Sua empresa no digital | Tráfego pago" }, { name: "description", content: "Agência de tráfego pago especializada em climatização, restaurantes, telefonia, estética e marketing digital. Mais leads, mais vendas, menos achismo.", }, ], }), }); const cards = [ { ...niches.climatizacao, tagline: "Orçamentos qualificados para HVAC, PMOC e refrigeração.", }, { ...niches.restaurantes, tagline: "Mesas cheias e delivery próprio para o seu restaurante.", }, { ...niches.telefonia, tagline: "Volume de venda de aparelhos, planos e acessórios.", }, { ...niches.estetica, tagline: "Agenda cheia de pacientes qualificados para sua clínica.", }, { ...niches.marketing, tagline: "Gestão completa de redes sociais, branding e conteúdo.", }, { ...niches.processoComercial, tagline: "Consultoria de processo comercial para escalar vendas.", }, ]; const beneficios = [ { icon: "📈", title: "Mais reconhecimento na sua cidade", desc: "Equipe especializada em estratégias de marketing digital e gestão de mídias sociais para colocar sua marca no mapa.", }, { icon: "🏰", title: "Marca mais forte", desc: "Sua marca presente de forma consistente nas mídias sociais, criando uma imagem forte e reconhecível.", }, { icon: "📊", title: "Menos trabalho para você", desc: "Análises detalhadas de desempenho para tomar decisões certas e replicar o que dá certo.", }, { icon: "💼", title: "Profissionalismo nas redes", desc: "Acompanhamos as trends e oferecemos ideias novas e criativas para engajar sua audiência.", }, ]; const faqHome = [ { q: "O que é o método de trabalho da .PONTO?", a: "Nosso método é um funil de marketing digital de 4 etapas: Atração (trazer pessoas certas), Atenção (conquistar interesse), Fechamento (transformar em cliente) e Retenção (fazer comprar de novo). Cada etapa é otimizada para tráfego pago de performance.", }, { q: "Como funciona o tráfego pago na prática?", a: "Criamos campanhas no Google Ads, Meta Ads e outras plataformas direcionadas ao seu público ideal. Cada real investido é rastreado até a venda, com relatórios semanais claros de CPL, ROI e fechamento.", }, { q: "Em quanto tempo vejo resultados?", a: "Na maioria dos casos, os primeiros leads qualificados começam a chegar em até 72 horas após o início das campanhas. Resultados consistentes de crescimento costumam aparecer entre 30 e 60 dias.", }, { q: "Quanto preciso investir em mídia?", a: "Recomendamos um investimento mínimo de R$ 2.000 a R$ 3.000 por mês em mídia, dependendo do nicho e da região. Esse valor é separado da taxa de gestão e é 100% direcionado aos anúncios.", }, { q: "O que é a etapa de Atração?", a: "É a primeira fase do funil. Usamos Google Ads, Meta Ads e outras fontes de tráfego para levar pessoas realmente interessadas até seus canais de venda — site, landing page ou WhatsApp.", }, { q: "O que é a etapa de Atenção?", a: "Depois de atrair, precisamos conquistar o interesse. Criamos copy persuasiva, criativos de impacto e páginas otimizadas para que o visitante entenda o valor da sua oferta e queira saber mais.", }, { q: "Como funciona o Fechamento?", a: "Consolidamos sua equipe de vendas com scripts comerciais, automações de WhatsApp e qualificação de leads. O objetivo é transformar quem demonstrou interesse em cliente pagante de forma previsível.", }, { q: "Por que a Retenção é importante?", a: "Vender uma vez é bom, mas vender de novo é o que escala o negócio. Trabalhamos estratégias de remarketing, recorrência e fidelização para aumentar o LTV (Lifetime Value) de cada cliente.", }, { q: "Funciona para qualquer segmento?", a: "Sim, nosso método é adaptável. Já atuamos com climatização, restaurantes, telefonia, estética, marketing e processos comerciais. Customizamos cada etapa para a realidade do seu negócio.", }, { q: "Tem contrato de fidelidade?", a: "Não. Trabalhamos com contrato mensal, sem multa de cancelamento. Você fica pelo resultado e pela confiança, não por obrigação contratual.", }, ]; const metodo = [ { icon: "🧲", title: "ATRAÇÃO", desc: "A primeira etapa do processo de Marketing Digital. Atrair pessoas para seus canais de vendas é indispensável para gerar novas vendas, usando as principais fontes de tráfego.", }, { icon: "⚠️", title: "ATENÇÃO", desc: "Após atrair as pessoas até seus canais, você precisa fazer com que elas se interessem pelo que você tem a oferecer. Conquistar a atenção é o próximo caminho para gerar vendas.", }, { icon: "🏷️", title: "FECHAMENTO", desc: "Com a atenção da audiência, o próximo passo é transformá-la em clientes. Consolidamos sua equipe de vendas e criamos scripts comerciais que convertem.", }, { icon: "❤️", title: "RETENÇÃO", desc: "Após a conversão, começa a jornada para fazer este cliente comprar novamente, ampliando seu LTV. Reter é tão importante quanto fechar novas vendas.", }, ]; function Index() { const [leadInfo, setLeadInfo] = useState({ nome: "", cidade: "" }); const [waSettings, setWaSettings] = useState(null); useEffect(() => { captureUtmFromUrl(); loadWhatsAppSettings().then(setWaSettings); }, []); return (
Agência de tráfego pago de performance

Sua empresa no{" "} digital ,
no .PONTO certo.

Mais leads, mais vendas, menos achismo. Especialistas em climatização, restaurantes, telefonia, estética e marketing digital.

Escolha seu nicho

Landing pages especialistas

{cards.map((c) => (
{c.heroImage ? ( {c.niche} ) : (
)}

{c.niche}

{c.tagline}

Ver landing page →
))}
{/* O que você ganha */}

O que você ganha ao contratar nossos serviços

{beneficios.map((b) => (
{b.icon}

{b.title}

{b.desc}

))}
{/* Nosso método de trabalho */}
Nosso método de trabalho

Conteúdo adaptado às{" "} diferentes plataformas

{metodo.map((m, i) => (
{m.icon}
Etapa 0{i + 1}

{m.title}

{m.desc}

))}
{/* FAQ — Nosso método de trabalho e tráfego pago */}
Tire suas dúvidas

Perguntas sobre nosso{" "} método e tráfego pago

© {new Date().getFullYear()} .PONTO — Sua empresa no digital.
); } function WhatsAppFab({ settings, leadInfo, }: { settings: WhatsAppSettings | null; leadInfo: { nome: string; cidade: string }; }) { const number = settings?.number ?? "5511999999999"; const template = settings?.template ?? "Olá! Meu nome é {nome}, sou de {cidade} e vim pela página de {nicho}. Quero saber mais sobre tráfego pago."; const href = buildWhatsAppHref({ number, template, nome: leadInfo.nome, cidade: leadInfo.cidade, nicho: HOME_NICHE, }); const handleClick = () => { trackEvent("whatsapp_click", { nicho: HOME_NICHE, location: "fab_home", has_lead_info: Boolean(leadInfo.nome || leadInfo.cidade), }); }; return ( WhatsApp ); } function HomeForm({ onLeadInfoChange }: { onLeadInfoChange?: (v: { nome: string; cidade: string }) => void }) { const [sent, setSent] = useState(false); const [loading, setLoading] = useState(false); const [form, setForm] = useState({ nome: "", email: "", telefone: "", cidade: "" }); const update = (k: keyof typeof form) => (e: React.ChangeEvent) => { const value = e.target.value; setForm((s) => { const next = { ...s, [k]: value }; if ((k === "nome" || k === "cidade") && onLeadInfoChange) { onLeadInfoChange({ nome: next.nome, cidade: next.cidade }); } return next; }); }; const handleSubmit = async (e: React.FormEvent) => { e.preventDefault(); const nome = form.nome.trim(); const email = form.email.trim(); const telefone = form.telefone.trim(); const cidade = form.cidade.trim(); if (!nome || nome.length > 120) return toast.error("Informe seu nome."); if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email) || email.length > 255) return toast.error("E-mail inválido."); if (telefone.length < 6 || telefone.length > 40) return toast.error("Telefone inválido."); if (!cidade || cidade.length > 120) return toast.error("Informe sua cidade."); setLoading(true); const utm = getStoredUtm(); const { error } = await supabase.from("leads").insert({ nome, email, telefone, cidade, nicho: HOME_NICHE, variant: null, utm_source: utm.utm_source ?? null, utm_medium: utm.utm_medium ?? null, utm_campaign: utm.utm_campaign ?? null, utm_term: utm.utm_term ?? null, utm_content: utm.utm_content ?? null, referrer: utm.referrer ?? null, landing_path: utm.landing_path ?? (typeof window !== "undefined" ? window.location.pathname : null), }); setLoading(false); if (error) { console.error(error); toast.error("Não foi possível enviar. Tente novamente."); return; } trackEvent("lead_generated", { nicho: HOME_NICHE, location: "home_form" }); setForm({ nome: "", email: "", telefone: "", cidade: "" }); onLeadInfoChange?.({ nome: "", cidade: "" }); setSent(true); }; return (
Fale com a gente

Pronto para colocar sua empresa no{" "} .PONTO certo?

Preencha o formulário e um especialista entra em contato em até 5 minutos no horário comercial. Sem compromisso, sem enrolação.

🔒 Seus dados ficam protegidos. Não enviamos spam, não vendemos lista.
{sent ? (
✅

Recebemos seu contato!

Um especialista falará com você em breve.

) : (

Fale com um especialista

Resposta em até 5 minutos no horário comercial.

Ao enviar, você concorda em receber contato da .PONTO.

)}
); } function FaqAccordion({ items }: { items: { q: string; a: string }[] }) { const [open, setOpen] = useState(null); return (
{items.map((item, i) => { const isOpen = open === i; return (

{item.a}

); })}
); }