Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -2,17 +2,17 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactCenter from '@/components/sections/contact/ContactCenter';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
-import FaqBase from '@/components/sections/faq/FaqBase';
+import FaqSplitText from '@/components/sections/faq/FaqSplitText';
-import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
+import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
-import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
-import HeroSplit from '@/components/sections/hero/HeroSplit';
+import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
-import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
+import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
-import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
+import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
-import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import ProductCardThree from '@/components/sections/product/ProductCardThree';
+import ProductCardFour from '@/components/sections/product/ProductCardFour';
-import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
+import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
-import { Award, Star, Users } from "lucide-react";
+import { Sparkles } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -30,364 +30,134 @@ export default function LandingPage() {
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
-      <NavbarStyleCentered
+      <NavbarStyleFullscreen
       navItems={[
-        {
+        { name: "Início", id: "hero" },
-          name: "Início",
+        { name: "Serviços", id: "servicos" },
-          id: "hero",
+        { name: "Diferenciais", id: "diferenciais" },
-        },
+        { name: "Depoimentos", id: "depoimentos" },
-        {
+        { name: "Contato", id: "contato" }
-          name: "Serviços",
-          id: "servicos",
-        },
-        {
-          name: "Diferenciais",
-          id: "diferenciais",
-        },
-        {
-          name: "Depoimentos",
-          id: "depoimentos",
-        },
-        {
-          name: "Contato",
-          id: "contato",
-        },
       ]}
-      button={{
+      brandName="Pet Feliz"
-        text: "Agendar via WhatsApp",
+      button={{ text: "Agendar via WhatsApp", href: "https://wa.me/5583999999999" }}
-        href: "https://wa.me/5583988767413",
-      }}
-      brandName="Kathyenne Morais"
     />
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroSplit
+      <HeroLogoBillboard
-      background={{
+      logoText="Pet Feliz Campina Grande"
-        variant: "gradient-bars",
+      description="Cuidado premium para o seu melhor amigo. Oferecemos banho, tosa e tratamentos especializados com todo o amor que eles merecem."
-      }}
+      buttons={[{ text: "Agendar Banho e Tosa", href: "https://wa.me/5583999999999" }]}
-      title="Realce sua beleza natural com segurança e excelência."
+      background={{ variant: "sparkles-gradient" }}
-      description="Na Kathyenne Morais Estética Avançada, unimos tecnologia de ponta e cuidado personalizado para transformar sua autoestima em Campina Grande/PB."
+      imageSrc="http://img.b2bpic.net/free-photo/dog-grooming-salon_23-2149174697.jpg?_wi=1"
-      buttons={[
-        {
-          text: "Agendar Consulta via WhatsApp",
-          href: "https://wa.me/5583988767413",
-        },
-      ]}
-      imageSrc="http://img.b2bpic.net/free-photo/cosmetologist-applying-mask-face-client-beauty-salon_1303-16780.jpg?_wi=1"
-      imageAlt="Clínica de Estética em Campina Grande"
-      mediaAnimation="slide-up"
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/cosmetologist-applying-mask-face-client-beauty-salon_1303-16786.jpg",
-          alt: "Cliente feliz 1",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/beautician-spa-beauty-salon-applies-cream-client-s-face-girl-lies-cosmetology-table_343596-4278.jpg",
-          alt: "Cliente feliz 2",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/young-beautiful-woman-getting-face-skin-treatment-spa_23-2148825379.jpg",
-          alt: "Cliente feliz 3",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/cosmetologist-applying-mask-face-client-beauty-salon_1303-16756.jpg",
-          alt: "Cliente feliz 4",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/cosmetologist-applying-mask-face-client-beauty-salon_1303-16783.jpg",
-          alt: "Cliente feliz 5",
-        },
-      ]}
-      avatarText="Mais de 1000 transformações realizadas"
-      marqueeItems={[
-        {
-          type: "text",
-          text: "Bioestimuladores",
-        },
-        {
-          type: "text",
-          text: "Preenchimento Labial",
-        },
-        {
-          type: "text",
-          text: "Toxina Botulínica",
-        },
-        {
-          type: "text",
-          text: "Peeling Profundo",
-        },
-        {
-          type: "text",
-          text: "Harmonização Facial",
-        },
-      ]}
     />
   </div>
 
   <div id="servicos" data-section="servicos">
-      <InlineImageSplitTextAbout
+      <TestimonialAboutCard
+      tag="Nossa Missão"
+      icon={Sparkles}
+      title="Amor e Dedicação ao Seu Pet"
+      description="Na Pet Feliz, entendemos que seu animal de estimação é parte da família. Nossa equipe em Campina Grande é treinada para proporcionar um ambiente tranquilo e higiênico."
+      subdescription="Desde 2015 transformando a experiência de cuidado pet com profissionalismo e carinho."
+      imageSrc="http://img.b2bpic.net/free-photo/groomer-trimming-dog-hair_23-2149174706.jpg"
       useInvertedBackground={false}
-      heading={[
-        {
-          type: "text",
-          content: "Sobre a Kathyenne Morais",
-        },
-        {
-          type: "image",
-          src: "http://img.b2bpic.net/free-photo/side-view-asian-doctor-with-lab-coat_23-2149870311.jpg",
-          alt: "Clínica de Estética",
-        },
-        {
-          type: "text",
-          content: "Nossa missão é oferecer tratamentos de alta performance, focados na harmonia facial e corporal. Atendemos no coração de Campina Grande com a qualidade que você merece.",
-        },
-      ]}
     />
   </div>
 
   <div id="diferenciais" data-section="diferenciais">
-      <FeatureCardSeven
+      <FeatureCardMedia
       animationType="slide-up"
-      textboxLayout="split"
+      title="Por que a Pet Feliz?"
+      description="O cuidado que seu pet merece, perto de você."
+      textboxLayout="default"
       useInvertedBackground={false}
       features={[
-        {
+        { id: "1", title: "Ambiente sem Estresse", description: "Espaços projetados para o conforto e calma do seu pet.", tag: "Bem-estar", imageSrc: "http://img.b2bpic.net/free-photo/dog-getting-grooming-service_23-2149174688.jpg" },
-          title: "Tecnologia de Ponta",
+        { id: "2", title: "Equipe Qualificada", description: "Profissionais experientes em diversas raças e temperamentos.", tag: "Expertise", imageSrc: "http://img.b2bpic.net/free-photo/professional-groomer-working-with-dog_23-2149174712.jpg" },
-          description: "Tratamentos modernos com segurança máxima.",
+        { id: "3", title: "Localização Central", description: "Estamos no coração de Campina Grande para facilitar o seu dia.", tag: "Praticidade", imageSrc: "http://img.b2bpic.net/free-photo/dog-on-grooming-table_23-2149174699.jpg" }
-          imageSrc: "http://img.b2bpic.net/free-photo/male-patient-receiving-massage-from-doctor_107420-65172.jpg?_wi=1",
-        },
-        {
-          title: "Atendimento Humanizado",
-          description: "Cuidado personalizado para cada necessidade.",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-going-through-microblading-treatment_23-2149102659.jpg?_wi=1",
-        },
-        {
-          title: "Localização Privilegiada",
-          description: "No bairro Estação Velha, fácil acesso.",
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-with-doctor-cosmetology-studio_1157-33838.jpg?_wi=1",
-        },
       ]}
-      title="Por que nos escolher?"
-      description="Compromisso com resultados reais, ética e excelência clínica."
     />
   </div>
 
   <div id="servicos-catalog" data-section="servicos-catalog">
-      <ProductCardThree
+      <ProductCardFour
-      animationType="slide-up"
-      textboxLayout="split"
       gridVariant="three-columns-all-equal-width"
-      useInvertedBackground={false}
+      animationType="slide-up"
+      title="Nossos Serviços"
+      description="Conheça nossos planos e serviços especiais."
+      textboxLayout="default"
+      useInvertedBackground={true}
       products={[
-        {
+        { id: "s1", name: "Banho & Tosa Completo", price: "R$ XX", variant: "Essencial", imageSrc: "http://img.b2bpic.net/free-photo/dog-bath-time_23-2149174715.jpg" },
-          id: "p1",
+        { id: "s2", name: "Hidratação Profunda", price: "R$ XX", variant: "Premium", imageSrc: "http://img.b2bpic.net/free-photo/dog-groomer-care_23-2149174720.jpg?_wi=1" },
-          name: "Preenchimento Facial",
+        { id: "s3", name: "Tosa Higiênica", price: "R$ XX", variant: "Básico", imageSrc: "http://img.b2bpic.net/free-photo/dog-grooming-tools_23-2149174701.jpg" }
-          price: "Consulte",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-lies-beautician-s-table-receives-procedures-light-facial-massage-using-oil_343596-4184.jpg",
-        },
-        {
-          id: "p2",
-          name: "Aplicação de Toxina",
-          price: "Consulte",
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-cosmetology-studio-procedures_1157-34029.jpg",
-        },
-        {
-          id: "p3",
-          name: "Bioestimuladores",
-          price: "Consulte",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-lip-filler-procedure_23-2149315536.jpg",
-        },
-        {
-          id: "p4",
-          name: "Peeling Químico",
-          price: "Consulte",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-using-face-treatment-her-client_23-2149037158.jpg",
-        },
-        {
-          id: "p5",
-          name: "Limpeza de Pele Profunda",
-          price: "Consulte",
-          imageSrc: "http://img.b2bpic.net/free-photo/cosmetic-botox-injection-female-forehead_651396-832.jpg",
-        },
-        {
-          id: "p6",
-          name: "Harmonização Corporal",
-          price: "Consulte",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-lip-filler-procedure_23-2149315552.jpg",
-        },
       ]}
-      title="Nossos Principais Procedimentos"
-      description="Soluções completas para sua saúde e beleza."
     />
   </div>
 
   <div id="depoimentos" data-section="depoimentos">
-      <TestimonialCardFive
+      <TestimonialCardThirteen
-      textboxLayout="default"
+      animationType="slide-up"
+      showRating={true}
+      textboxLayout="split"
+      title="O que dizem os clientes"
+      description="Relatos de quem confia no nosso trabalho."
       useInvertedBackground={false}
       testimonials={[
-        {
+        { id: "t1", name: "Maria Oliveira", handle: "@maria.pet", testimonial: "Meus cachorros saem sempre lindos e cheirosos!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-woman-holding-dog_23-2149174725.jpg" },
-          id: "t1",
+        { id: "t2", name: "João Silva", handle: "@joao.dogs", testimonial: "Serviço impecável e atendimento muito carinhoso.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/man-playing-with-dog_23-2149174730.jpg" }
-          name: "Ana Silva",
-          date: "15/09/2023",
-          title: "Excelente atendimento!",
-          quote: "Melhor clínica de Campina Grande. Profissionais muito atenciosas.",
-          tag: "Nota 5/5",
-          avatarSrc: "http://img.b2bpic.net/free-photo/side-view-woman-holding-lash-curler_23-2149453530.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/cosmetologist-applying-mask-face-client-beauty-salon_1303-16780.jpg?_wi=2",
-          imageAlt: "happy woman smile after facial treatment",
-        },
-        {
-          id: "t2",
-          name: "Mariana Souza",
-          date: "10/10/2023",
-          title: "Resultados incríveis",
-          quote: "Fiz a harmonização e amei o resultado. Muito natural.",
-          tag: "Nota 5/5",
-          avatarSrc: "http://img.b2bpic.net/free-photo/young-attractive-woman-holding-hands-together-joyfully-looking-camera-modern-clothes-store_574295-2021.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/side-view-asian-doctor-with-lab-coat_23-2149870311.jpg",
-          imageAlt: "happy woman smile after facial treatment",
-        },
-        {
-          id: "t3",
-          name: "Camila Dias",
-          date: "22/11/2023",
-          title: "Confiança total",
-          quote: "Clínica muito limpa e organizada. Indico muito!",
-          tag: "Nota 5/5",
-          avatarSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-woman-applying-cream_23-2148389885.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/male-patient-receiving-massage-from-doctor_107420-65172.jpg?_wi=2",
-          imageAlt: "happy woman smile after facial treatment",
-        },
-        {
-          id: "t4",
-          name: "Fernanda Lima",
-          date: "05/12/2023",
-          title: "Atendimento nota 10",
-          quote: "A Kathyenne é uma profissional exemplar.",
-          tag: "Nota 5/5",
-          avatarSrc: "http://img.b2bpic.net/free-photo/front-view-woman-wearing-makeup-with-thick-eyebrows_23-2150512475.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-going-through-microblading-treatment_23-2149102659.jpg?_wi=2",
-          imageAlt: "happy woman smile after facial treatment",
-        },
-        {
-          id: "t5",
-          name: "Juliana Reis",
-          date: "12/01/2024",
-          title: "Recomendo muito",
-          quote: "Atendimento humanizado e resultados fantásticos.",
-          tag: "Nota 5/5",
-          avatarSrc: "http://img.b2bpic.net/free-photo/lovely-mixed-race-women-pout-lips-stretch-hands-as-going-embrace-someone-express-their-good-feeling-pose-together-against-white-wall-interracial-female-friends-indoor_273609-16476.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-with-doctor-cosmetology-studio_1157-33838.jpg?_wi=2",
-          imageAlt: "happy woman smile after facial treatment",
-        },
       ]}
-      title="Resultados Comprovados"
-      description="O que nossas clientes dizem sobre a experiência na Kathyenne Morais."
     />
   </div>
 
   <div id="metricas" data-section="metricas">
-      <MetricCardThree
+      <MetricCardEleven
       animationType="slide-up"
+      title="Números que comprovam"
+      description="Resultados sólidos de dedicação."
       textboxLayout="default"
       useInvertedBackground={false}
       metrics={[
-        {
+        { id: "m1", value: "1000+", title: "Pets atendidos", description: "Experiência acumulada.", imageSrc: "http://img.b2bpic.net/free-photo/dog-grooming-salon_23-2149174697.jpg?_wi=2" },
-          id: "m1",
+        { id: "m2", value: "5.0", title: "Avaliação média", description: "Clientes satisfeitos.", imageSrc: "http://img.b2bpic.net/free-photo/dog-groomer-care_23-2149174720.jpg?_wi=2" }
-          icon: Star,
-          title: "Nota Google",
-          value: "5.0",
-        },
-        {
-          id: "m2",
-          icon: Users,
-          title: "Avaliações Reais",
-          value: "24+",
-        },
-        {
-          id: "m3",
-          icon: Award,
-          title: "Anos de Confiança",
-          value: "Referência",
-        },
       ]}
-      title="Nossos Números"
-      description="Confiança que gera resultados."
     />
   </div>
 
   <div id="faq" data-section="faq">
-      <FaqBase
+      <FaqSplitText
-      textboxLayout="default"
+      sideTitle="Dúvidas Comuns"
+      faqsAnimation="slide-up"
       useInvertedBackground={false}
       faqs={[
-        {
+        { id: "f1", title: "Como agendar?", content: "Pelo nosso WhatsApp, direto com nossos consultores." },
-          id: "f1",
+        { id: "f2", title: "Aceitam cartão?", content: "Sim, aceitamos todas as bandeiras." }
-          title: "Como agendar?",
-          content: "Pelo nosso WhatsApp oficial (83) 98876-7413.",
-        },
-        {
-          id: "f2",
-          title: "Onde fica?",
-          content: "R. Paulo de Frontin, 55 - Estação Velha, Campina Grande.",
-        },
-        {
-          id: "f3",
-          title: "Aceitam cartões?",
-          content: "Sim, facilitamos o pagamento em diversas condições.",
-        },
       ]}
-      title="Perguntas Frequentes"
-      description="Tire suas dúvidas antes de agendar."
-      faqsAnimation="slide-up"
     />
   </div>
 
   <div id="contato" data-section="contato">
-      <ContactCenter
+      <ContactSplitForm
+      title="Agende agora"
+      description="Mande uma mensagem e garanta o horário do seu pet!"
       useInvertedBackground={false}
-      background={{
+      inputs={[
-        variant: "plain",
+        { name: "nome", type: "text", placeholder: "Seu nome" },
-      }}
+        { name: "pet", type: "text", placeholder: "Nome do seu Pet" }
-      tag="Entre em Contato"
+      ]}
-      title="Pronta para transformar sua autoestima?"
+      imageSrc="http://img.b2bpic.net/free-photo/groomer-woman-working-with-dog_23-2149174718.jpg"
-      description="Fale com nossa equipe agora mesmo e agende sua consulta."
-      buttonText="Falar no WhatsApp"
-      onSubmit={(e) => window.open('https://wa.me/5583988767413')}
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterLogoEmphasis
+      <FooterSimple
       columns={[
-        {
+        { title: "Links", items: [{ label: "Início", href: "#" }, { label: "Contato", href: "#contato" }] },
-          items: [
+        { title: "Contato", items: [{ label: "WhatsApp", href: "#" }] }
-            {
-              label: "Sobre nós",
-              href: "#servicos",
-            },
-            {
-              label: "Serviços",
-              href: "#servicos-catalog",
-            },
-          ],
-        },
-        {
-          items: [
-            {
-              label: "WhatsApp",
-              href: "https://wa.me/5583988767413",
-            },
-            {
-              label: "Localização",
-              href: "#contato",
-            },
-          ],
-        },
       ]}
-      logoText="Kathyenne Morais"
+      bottomLeftText="© 2024 Pet Feliz"
+      bottomRightText="Todos os direitos reservados"
     />
   </div>
       </ReactLenis>