Update src/app/programare-vtp/page.tsx

src/app/programare-vtp/page.tsx

@@ -3,12 +3,13 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import AboutMetric from '@/components/sections/about/AboutMetric';
-import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
+import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
 import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
+import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
 import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
-import { CalendarCheck, Gauge, Timer } from "lucide-react";
+import { Calendar, DollarSign, MessageSquare, Users, Wrench } from "lucide-react";
 
-export default function LandingPage() {
+export default function ProgramareVTPPage() {
   return (
     <ThemeProvider
         defaultButtonVariant="directional-hover"
@@ -26,97 +27,91 @@ export default function LandingPage() {
         <div id="nav" data-section="nav">
           <NavbarLayoutFloatingInline
             navItems={[
-        {
+              { name: "Acasă", id: "/" },
-          name: "Acasă",          id: "/"},
+              { name: "Programare VTP", id: "/programare-vtp" },
-        {
+              { name: "Intervenții", id: "/interventii" },
-          name: "Programare VTP",          id: "/programare-vtp"},
+              { name: "Centrale Termice", id: "/centrale-termice" },
-        {
+              { name: "ENA CONFORT", id: "/ena-confort" },
-          name: "Intervenții",          id: "/interventii"},
+              { name: "Contact", id: "/#contact" }
-        {
-          name: "Centrale Termice",          id: "/centrale-termice"},
-        {
-          name: "ENA CONFORT",          id: "/ena-confort"},
-        {
-          name: "Contact",          id: "/#contact"},
             ]}
-      brandName="ENA INSTAL"
+            logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ex8KOdTiKTo6wVU9IBbBzQFXCf/uploaded-1781109072417-wp3t2fav.jpg"
-      button={{
+            logoAlt="ENA INSTAL Logo"
-        text: "Login Admin",        href: "/admin"}}
+            button={{ text: "Login Admin", href: "/admin" }}
             animateOnLoad={true}
           />
         </div>
 
-  <div id="vtp-intro" data-section="vtp-intro">
+        <div id="hero" data-section="hero">
+          <HeroSplitKpi
+            title="Programează Verificarea Tehnică Periodică (VTP)"
+            description="Asigură siguranța și eficiența centralei tale termice cu o programare rapidă și simplă."
+            background={{ variant: "radial-gradient" }}
+            kpis={[
+              { value: "Rapid", label: "Programare Online" },
+              { value: "Sigur", label: "Tehnicieni Certificați" },
+              { value: "Eficient", label: "Servicii Complete" }
+            ]}
+            enableKpiAnimation={true}
+            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ex8KOdTiKTo6wVU9IBbBzQFXCf/uploaded-1781109156637-p7l2y77k.png"
+            imageAlt="Tehnician verificând o centrală termică"
+            mediaAnimation="slide-up"
+            buttons={[
+              { text: "Programează Acum", href: "/programare-vtp#formular" },
+              { text: "Află Mai Multe", href: "/#about" }
+            ]}
+            tag="VTP Esențial"
+          />
+        </div>
+
+        <div id="feature" data-section="feature">
+          <FeatureCardNineteen
+            textboxLayout="default"
+            useInvertedBackground={false}
+            title="Beneficiile Verificării Periodice"
+            description="De ce este important să-ți verifici centrala termică anual."
+            features={[
+              {
+                tag: "Siguranță",                title: "Prevenirea Accidentelor",                subtitle: "Evită riscurile",                description: "Verificările periodice identifică și remediază potențialele defecțiuni care pot duce la scurgeri de gaze sau intoxicații cu monoxid de carbon.",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ex8KOdTiKTo6wVU9IBbBzQFXCf/uploaded-1781109156637-p7l2y77k.png",                imageAlt: "Prevenirea Accidentelor"
+              },
+              {
+                tag: "Economie",                title: "Reducerea Costurilor",                subtitle: "Eficiență energetică sporită",                description: "O centrală bine întreținută consumă mai puțin gaz, reducând facturile lunare și prelungind durata de viață a echipamentului.",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ex8KOdTiKTo6wVU9IBbBzQFXCf/uploaded-1781109156637-p7l2y77k.png",                imageAlt: "Reducerea Costurilor"
+              },
+              {
+                tag: "Conformitate",                title: "Respectarea Legislației",                subtitle: "Obligatoriu legal",                description: "Legea impune verificarea tehnică periodică la fiecare 2 ani pentru siguranța ta și a celor din jur.",                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ex8KOdTiKTo6wVU9IBbBzQFXCf/uploaded-1781109156637-p7l2y77k.png",                imageAlt: "Respectarea Legislației"
+              }
+            ]}
+          />
+        </div>
+
+        <div id="about" data-section="about">
           <AboutMetric
             useInvertedBackground={false}
-      title="Programare Verificare Tehnică Periodică (VTP)"
+            title="Ce Include Verificarea VTP?"
             metrics={[
               {
-          icon: Gauge,
+                icon: Wrench,
-          label: "Siguranță",          value: "Maximizată"},
+                label: "Verificarea Componentelor",                value: "Detalii"},
               {
-          icon: Timer,
+                icon: DollarSign,
-          label: "Timp Răspuns",          value: "Rapid"},
+                label: "Testare Etanșeitate",                value: "Test"},
               {
-          icon: CalendarCheck,
+                icon: Users,
-          label: "Ușor de Programat",          value: "Online"},
+                label: "Analiza Gazelor Arse",                value: "Analiză"},
+              {
+                icon: MessageSquare,
+                label: "Reglaje Optime",                value: "Reglaj"},
             ]}
             metricsAnimation="slide-up"
           />
         </div>
 
-  <div id="vtp-form" data-section="vtp-form">
-      <ContactSplitForm
-      useInvertedBackground={false}
-      title="Completează Detaliile Programării"
-      description="Un tehnician ENA INSTAL te va contacta în cel mai scurt timp pentru a confirma programarea."
-      inputs={[
-        {
-          name: "nume",          type: "text",          placeholder: "Nume",          required: true,
-        },
-        {
-          name: "prenume",          type: "text",          placeholder: "Prenume",          required: true,
-        },
-        {
-          name: "telefon",          type: "tel",          placeholder: "Telefon",          required: true,
-        },
-        {
-          name: "email",          type: "email",          placeholder: "Email",          required: true,
-        },
-        {
-          name: "adresa",          type: "text",          placeholder: "Adresă completă",          required: true,
-        },
-        {
-          name: "localitate",          type: "text",          placeholder: "Localitate",          required: true,
-        },
-        {
-          name: "tipCentrala",          type: "text",          placeholder: "Tip Centrală (ex: Condensare)",          required: true,
-        },
-        {
-          name: "marca",          type: "text",          placeholder: "Marcă Centrală (ex: Ariston)",          required: true,
-        },
-        {
-          name: "dataProgramare",          type: "date",          placeholder: "Data dorită",          required: true,
-        },
-      ]}
-      textarea={{
-        name: "observatii",        placeholder: "Observații (detalii suplimentare)",        rows: 3,
-        required: false,
-      }}
-      buttonText="Trimite Programarea"
-      onSubmit={(data) => console.log('VTP programare submitted:', { ...data, status: 'Nou', createdAt: new Date().toISOString() })}
-      imageSrc="http://img.b2bpic.net/free-photo/service-man-adjusting-house-heating-system_1303-26529.jpg"
-      imageAlt="Service man adjusting house heating system"
-    />
-  </div>
-
         <div id="footer" data-section="footer">
           <FooterLogoReveal
+            logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ex8KOdTiKTo6wVU9IBbBzQFXCf/uploaded-1781109072417-wp3t2fav.jpg"
+            logoAlt="ENA INSTAL Logo"
             logoText="ENA INSTAL"
-      leftLink={{
+            leftLink={{ text: "Confidentialitate", href: "#" }}
-        text: "Confidentialitate",        href: "#"}}
+            rightLink={{ text: "Termeni și Condiții", href: "#" }}
-      rightLink={{
-        text: "Termeni și Condiții",        href: "#"}}
           />
         </div>
       </ReactLenis>