5 Commits

Author SHA1 Message Date
7793fac595 Update src/app/page.tsx 2026-05-09 02:46:43 +00:00
dd3cf48e1e Update src/app/styles/variables.css 2026-05-09 02:46:16 +00:00
77e4a54e1e Update src/app/page.tsx 2026-05-09 02:46:15 +00:00
3a2eb906cf Merge version_1 into main
Merge version_1 into main
2026-05-09 02:39:55 +00:00
6ad02bd72a Merge version_1 into main
Merge version_1 into main
2026-05-09 02:39:28 +00:00
2 changed files with 66 additions and 144 deletions

View File

@@ -3,205 +3,127 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import TextAbout from '@/components/sections/about/TextAbout';
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
borderRadius="soft"
contentWidth="mediumLarge"
sizing="largeSmallSizeMediumTitles"
background="circleGradient"
cardStyle="soft-shadow"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="glass"
sizing="largeSizeMediumTitles"
background="none"
cardStyle="outline"
primaryButtonStyle="flat"
secondaryButtonStyle="solid"
headingFontWeight="semibold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "Início", id: "hero"},
{
name: "Funcionalidades", id: "capabilities"},
{
name: "FAQ", id: "faq"},
{ name: "Início", id: "hero" },
{ name: "Sobre", id: "about" },
{ name: "IA & Operação", id: "capabilities" },
{ name: "FAQ", id: "faq" },
]}
brandName="Brique Art"
button={{
text: "Entrar na Whitelist", href: "#contact"}}
button={{ text: "Whitelist", href: "#contact" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitKpi
background={{
variant: "plain"}}
title="Faça do Brique um negócio, não um improviso."
description="A camada operacional profissional para quem leva flipping a sério. Descubra, classifique e gerencie suas oportunidades com o suporte da nossa IA."
kpis={[
{
value: "100%", label: "Operação Profissional"},
{
value: "IA", label: "Assistência Especializada"},
{
value: "BR", label: "Focado no Mercado Local"},
]}
enableKpiAnimation={true}
buttons={[
{
text: "Entrar na Whitelist", href: "#contact"},
]}
imageSrc="http://img.b2bpic.net/free-photo/remote-woman-working-modern-house-giving-voice-command-tablet-with-smart-home-application-lights-turning_482257-2265.jpg"
mediaAnimation="slide-up"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/portrait-fashionable-well-dressed-man-with-beard-posing-outdoors_1328-3267.jpg", alt: "Entrepreneur profile 1"},
{
src: "http://img.b2bpic.net/free-photo/positive-confident-businessman-posing-outside_74855-1183.jpg", alt: "Entrepreneur profile 2"},
{
src: "http://img.b2bpic.net/free-photo/portrait-fashionable-well-dressed-man-with-beard-posing-outdoors_1328-3268.jpg", alt: "Entrepreneur profile 3"},
{
src: "http://img.b2bpic.net/free-photo/portrait-young-confident-woman-startup-manager-office-posing-with-confidence-looking_1258-195341.jpg", alt: "Entrepreneur profile 4"},
{
src: "http://img.b2bpic.net/free-photo/startup-worker-uses-laptop-open-space-reviewing-project-data-documents-workstation-executive-assistant-working-marketing-strategy-business-development-ai-developer_482257-65810.jpg", alt: "Entrepreneur profile 5"},
]}
avatarText="Junte-se a +500 operadores"
marqueeItems={[
{
type: "text", text: "Mercado Livre"},
{
type: "text", text: "OLX"},
{
type: "text", text: "Facebook Marketplace"},
{
type: "text", text: "Shopee"},
{
type: "text", text: "Amazon"},
<HeroCarouselLogo
logoText="Brique Art"
description="A camada operacional profissional para transformar flipping em um negócio sólido e previsível. Gestão de dados, IA de negociação e escala."
buttons={[{ text: "Quero fazer parte", href: "#contact" }]}
slides={[
{ imageSrc: "https://img.b2bpic.net/free-photo/modern-office-business-strategy_482257-2265.jpg", imageAlt: "Profissional em ambiente de trabalho" }
]}
/>
</div>
<div id="about" data-section="about">
<TextSplitAbout
<TextAbout
useInvertedBackground={false}
title="Sua nova camada operacional"
description={[
"O Brique Art nasceu para eliminar a incerteza e o caos do flipping. Deixe de operar com prints e anotações e adote um método profissional para escalar seus resultados."]}
title="Faça do Brique um negócio, não um improviso."
tag="O Fim do Caos"
buttons={[{ text: "Entenda o Método", href: "#capabilities" }]}
/>
</div>
<div id="capabilities" data-section="capabilities">
<FeatureCardNine
<FeatureCardThree
gridVariant="bento-grid"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
textboxLayout="split"
title="IA e Operações Precisas"
description="Uma suíte completa para quem não brinca em serviço no mercado de revenda."
useInvertedBackground={false}
features={[
{
title: "IA Assistiva de Compra", description: "Receba recomendações baseadas em dados sobre quais oportunidades valem a pena e estratégias de negociação.", phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/empty-startup-office-displays-statistics_482257-119484.jpg", imageAlt: "AI Analysis"},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/customer-relationship-management-concept_23-2150038414.jpg", imageAlt: "Recommendation Panel"}
},
{
title: "Gestão Simples de Flips", description: "Registre suas operações em um fluxo simples e eficaz, acompanhando cada margem e status em tempo real.", phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/man-typing-laptop-working-from-home-with-automation-lighting-system-using-voice-controlled-app-tablet-switching-light_482257-2270.jpg", imageAlt: "Tracking UI"},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-vector/task-management-application_23-2148628459.jpg", imageAlt: "Manage Flips"}
},
{
title: "Criação de Anúncios", description: "Utilize nossa IA para redigir descrições e títulos que convertem, elevando a percepção de valor do seu produto.", phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/businessman-studying-infographics-performance-metrics_482257-122632.jpg", imageAlt: "AI Ad Generation"},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/modern-equipped-computer-lab_23-2149241207.jpg", imageAlt: "Ad Preview"}
}
{ title: "Motor de Busca", description: "IA que rastreia e filtra oportunidades reais.", imageSrc: "https://img.b2bpic.net/free-photo/search-data-analytics.jpg" },
{ title: "Score Personalizado", description: "Classificação automática para decisões de compra rápidas.", imageSrc: "https://img.b2bpic.net/free-photo/score-system.jpg" },
{ title: "Gestão de Flips", description: "Acompanhe cada margem de lucro sem planilhas confusas.", imageSrc: "https://img.b2bpic.net/free-photo/dashboard-flips.jpg" },
{ title: "IA de Negociação", description: "Compra e venda otimizadas com suporte assistido.", imageSrc: "https://img.b2bpic.net/free-photo/ai-negotiation.jpg" },
{ title: "IA de Criação de Anúncios", description: "Gere descrições profissionais para vender rápido.", imageSrc: "https://img.b2bpic.net/free-photo/ad-creation.jpg" }
]}
showStepNumbers={true}
title="Recursos feitos para o seu lucro"
description="Ferramentas que guiam desde a descoberta do anúncio até a negociação da venda, com clareza operacional total."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSix
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
<TestimonialCardFive
title="Resultados de quem migrou para o profissional"
description="Profissionais que deixaram o amadorismo e agora operam com métodos validados."
testimonials={[
{
id: "1", name: "Ian Lucas", handle: "@ian", testimonial: "Finalmente uma ferramenta que entende que flipping é um negócio real e não apenas renda extra.", imageSrc: "http://img.b2bpic.net/free-photo/businessman-wearing-coat_1098-3778.jpg"},
{
id: "2", name: "Mariana Souza", handle: "@mari", testimonial: "O suporte da IA na negociação de compra está mudando como vejo minhas margens.", imageSrc: "http://img.b2bpic.net/free-photo/thoughtful-businessman-sweater-intently-looking-window-work-laptop-city-cafe_574295-4322.jpg"},
{
id: "3", name: "Ricardo Gomes", handle: "@ric", testimonial: "A clareza operacional que faltava para parar de desperdiçar tempo com anúncios ruins.", imageSrc: "http://img.b2bpic.net/free-photo/business-man-cheerful-walking-concept_53876-42819.jpg"},
{
id: "4", name: "Beatriz Lima", handle: "@bia", testimonial: "O registro manual dos flips é perfeito: simples e direto ao ponto.", imageSrc: "http://img.b2bpic.net/free-photo/caucasian-male-entrepreneur-holds-clipboard_482257-121175.jpg"},
{
id: "5", name: "Carlos Silva", handle: "@carlos", testimonial: "Um método profissional que eu precisava para crescer meu volume de vendas localmente.", imageSrc: "http://img.b2bpic.net/free-photo/business-woman-green-suit-using-phone-outside-street_1303-29546.jpg"},
{ id: "1", name: "Ian L.", date: "Fev 2026", title: "Operador", quote: "O Brique Art profissionalizou meu método.", tag: "SaaS", avatarSrc: "https://img.b2bpic.net/free-photo/portrait-1.jpg" }
]}
title="Para quem leva o flipping a sério"
description="Veja o que profissionais que buscam mais método e consistência esperam da Brique Art."
textboxLayout="split"
useInvertedBackground={true}
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
textboxLayout="split"
useInvertedBackground={true}
<FaqBase
faqs={[
{
id: "1", title: "Quando poderei acessar o Brique Art?", content: "Estamos refinando o MVP para garantir a melhor experiência possível. Entre na whitelist e seja um dos primeiros a ser notificado."},
{
id: "2", title: "O Brique Art funciona apenas para Facebook Marketplace?", content: "No MVP, sim. Mas nossa infraestrutura foi projetada para que possamos adicionar novas fontes de anúncios no futuro."},
{
id: "3", title: "Eu preciso conectar minha conta do Facebook?", content: "Não. Nós usamos contas internas próprias para a coleta de dados, garantindo sua privacidade e segurança."},
{
id: "4", title: "O serviço será pago?", content: "Sim, o Brique Art é uma ferramenta profissional SaaS. Estamos definindo o modelo de precificação com base em valor real entregue aos operadores."},
{ id: "1", title: "O Brique Art substitui meu trabalho manual?", content: "Ele automatiza a parte pesada e analítica, deixando a estratégia final com você." },
{ id: "2", title: "Como entro na whitelist?", content: "Preencha o formulário abaixo e aguarde nosso contato exclusivo." }
]}
title="Perguntas Frequentes"
description="Tudo o que você precisa saber sobre o lançamento do Brique Art."
title="Dúvidas Comuns"
description="Respostas para as perguntas que você pode ter sobre o todo."
faqsAnimation="slide-up"
imageSrc="http://img.b2bpic.net/free-photo/computer-dark-room-with-graphs-screen_169016-57447.jpg"
mediaAnimation="slide-up"
textboxLayout="split"
useInvertedBackground={false}
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
useInvertedBackground={false}
title="Garanta seu lugar no lançamento"
description="Estamos selecionando os primeiros usuários para a versão beta do Brique Art. Entre na lista de espera agora."
title="Faça do Brique um negócio, não um improviso."
description="Inscreva-se na whitelist para ter acesso antecipado à nossa plataforma de gestão de flipping profissional."
inputs={[
{
name: "name", type: "text", placeholder: "Seu nome", required: true,
},
{
name: "email", type: "email", placeholder: "Seu e-mail profissional", required: true,
},
{ name: "name", type: "text", placeholder: "Nome Completo", required: true },
{ name: "email", type: "email", placeholder: "E-mail", required: true }
]}
imageSrc="http://img.b2bpic.net/free-photo/abstract-low-poly-background-with-connecting-dots_1048-8571.jpg"
useInvertedBackground={false}
imageSrc="https://img.b2bpic.net/free-photo/business-laptop-orange-accent.jpg"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Brique Art"
leftLink={{
text: "© 2026 Brique Art", href: "#"}}
rightLink={{
text: "Contato", href: "#contact"}}
leftLink={{ text: "© 2026 Brique Art", href: "#" }}
rightLink={{ text: "Contato", href: "#contact" }}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}
}

View File

@@ -10,15 +10,15 @@
--accent: #ffffff;
--background-accent: #ffffff; */
--background: #000000;
--card: #0c0c0c;
--foreground: #ffffff;
--primary-cta: #106EFB;
--background: #ffffff;
--card: #f9f9f9;
--foreground: #120a00e6;
--primary-cta: #E34400;
--primary-cta-text: #ffffff;
--secondary-cta: #000000;
--secondary-cta: #f9f9f9;
--secondary-cta-text: #ffffff;
--accent: #535353;
--background-accent: #106EFB;
--accent: #e2e2e2;
--background-accent: #E34400;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);