feat(marketing): add contacts section and improve checkbox UI

This commit introduces a new "Contacts" section to the marketing page, which is now the fifth step in the page's flow.

Additionally, the Checkbox component has been enhanced with a smooth transition effect on state change. This provides better visual feedback and a more polished user experience.

src/app/marketing/page.tsx

@@ -6,11 +6,12 @@ import { useState } from "react";
 import { ShowcaseSection } from "../../components/Layouts/showcase-section";
 import ChallengesStep from "./_components/ChallengesStep";
 import ChartStep from "./_components/ChartStep";
+import ContactsStep from "./_components/ContactsStep";
 import FeaturesStep from "./_components/FeaturesStep";
 import HeroStep from "./_components/HeroStep";
 
 const Marketing = () => {
-  const [step, setStep] = useState(0);
+  const [step, setStep] = useState(5);
   const breadcrumbItems: BreadcrumbItem[] = [
     {
       href: "/",
@@ -47,6 +48,11 @@ const Marketing = () => {
       description: "create benefits section",
       content: <ChallengesStep />,
     },
+    {
+      title: "Contacts",
+      description: "Create contacts section",
+      content: <ContactsStep />,
+    },
   ];
   return (
     <>