Vou analisar a logo e aplicar as cores dela no site. A logo mostra um cérebro geométrico/poligonal com estas cores: ciano/azul claro, azul profundo/navy, vermelho/carmesim, branco e preto (fundo). Vou construir toda a landing page com essa paleta.
Agora vou gerar a inspiração de design baseada nas cores da logo (ciano, azul profundo, vermelho, preto, branco) e construir a landing page completa.
Agora vou construir a landing page completa. Primeiro, vou salvar a logo no projeto e depois criar todos os componentes.
Agora vou atualizar o tema com as cores da logo e o layout:
Agora vou criar os componentes do Navbar e Hero:
Agora vou criar os componentes restantes: Autoridade (contadores), Problema, Servicos, Inteligencia Comercial, Prova Social, Impacto e CTA Final.
Agora vou montar a pagina principal:
A landing page da Escale - Inteligencia Comercial esta pronta, usando exclusivamente as cores extraidas da logo: ciano (#00BCD4) como cor primaria, azul profundo (#0D47A1) como secundaria, vermelho carmesim (#E53935) como cor de destaque/alerta, tudo sobre fundo preto premium (#050508) com texto branco (#F0F4F8). A pagina inclui hero section com CTA para WhatsApp, contadores animados, secoes de problemas, servicos, inteligencia comercial com grafico animado, prova social, comparativo de impacto e CTA final -- tudo responsivo e com efeitos hover e glow nas cores da logo.
Vou redesenhar tudo do zero com muito mais impacto visual, animacoes fluidas e um design premium. Deixa comigo.
Perfeito. Agora vou ler todos os arquivos atuais para reescrever tudo com um design ultra-premium e dinamico.
Agora vou reescrever tudo com um design ultra-premium, com animacoes scroll-triggered, particulas flutuantes, grid background sutil, tipografia impactante e efeitos de glow refinados. Vou adicionar framer-motion para animacoes fluidas.
Vou agora adicionar framer-motion e reescrever todos os componentes do zero com um design muito mais bonito e dinamico:
Agora vou reescrever o globals.css com animacoes mais ricas:
Agora vou criar o hook de animacao scroll e reescrever todos os componentes:
Agora vou criar o componente de particulas flutuantes e reescrever tudo:
Agora vou criar a marquee de logos/trust e adicionar o componente de particulas no page:
Agora vou atualizar o page.tsx com a nova estrutura:
A landing page foi completamente reescrita com um design ultra-premium inspirado em sites como Vercel e Linear. As principais melhorias incluem: particulas flutuantes interconectadas em canvas, animacoes scroll-triggered com Framer Motion em todas as secoes, um dashboard de metricas animado com barras de progresso e grafico de barras, efeitos de glow/shimmer nos cards, tipografia mais impactante (ate 8xl no hero), marquee infinito de segmentos, e uma paleta escura profunda com ciano e vermelho da logo como acentos.