diff --git a/front/components/home/ContentBlocks.tsx b/front/components/home/ContentBlocks.tsx
index 0446ec212a81..ea3cdd66a937 100644
--- a/front/components/home/ContentBlocks.tsx
+++ b/front/components/home/ContentBlocks.tsx
@@ -1,4 +1,4 @@
-import { ArrowRightIcon, Button, RocketIcon } from "@dust-tt/sparkle";
+import { ArrowRightIcon, Avatar, Button, RocketIcon } from "@dust-tt/sparkle";
 import Link from "next/link";
 import type { ReactNode } from "react";
 import React from "react";
@@ -171,6 +171,67 @@ export const HeaderContentBlock = ({
   </Grid>
 );
 
+interface MetricComponentProps {
+  metrics: {
+    value: string;
+    description: ReactNode;
+  }[];
+  from: string;
+  to: string;
+}
+
+export const MetricComponent = ({
+  metrics,
+  from,
+  to,
+}: MetricComponentProps) => (
+  <div
+    className={classNames(
+      "col-span-12 flex flex-col items-center py-8 text-center"
+    )}
+  >
+    <div
+      className={classNames(
+        "grid grid-cols-1 gap-x-6 gap-y-8",
+        "md:grid-cols-2 md:gap-x-12"
+      )}
+    >
+      {metrics.map((metric, index) => (
+        <div key={index} className="flex flex-col items-center gap-4">
+          <H1 from={from} to={to}>
+            {metric.value}
+          </H1>
+          <P size="md" className="max-w-[400px]">
+            {metric.description}
+          </P>
+        </div>
+      ))}
+    </div>
+  </div>
+);
+
+interface QuoteProps {
+  quote: string;
+}
+
+export const Quote = ({ quote }: QuoteProps) => (
+  <div className="col-span-12 flex flex-col py-8 md:col-span-10 md:col-start-2 lg:col-span-8 lg:col-start-3">
+    <div className="flex flex-col items-center text-center font-objektiv text-3xl italic text-white">
+      &ldquo; {quote} &rdquo;
+    </div>
+    <div className="flex justify-center pt-8">
+      <div className="flex items-center justify-center gap-3">
+        <Avatar size="lg" />
+        <P size="md" className="text-primary-400">
+          Walter Moniot,
+          <br />
+          CPO at Malt
+        </P>
+      </div>
+    </div>
+  </div>
+);
+
 interface CarousselContentBlockProps {
   title: ReactNode;
   subtitle?: ReactNode;
diff --git a/front/components/home/SolutionSection.tsx b/front/components/home/SolutionSection.tsx
index 63273eb92e33..042304da38b7 100644
--- a/front/components/home/SolutionSection.tsx
+++ b/front/components/home/SolutionSection.tsx
@@ -107,6 +107,7 @@ const renderSolutionSectionBlock = ({
     </div>
   );
 };
+
 interface SolutionSectionContentBlockProps {
   title: ReactNode;
   content: ReactNode | ReactNode[];
diff --git a/front/components/home/TrustedBy.tsx b/front/components/home/TrustedBy.tsx
new file mode 100644
index 000000000000..49feee3a23fb
--- /dev/null
+++ b/front/components/home/TrustedBy.tsx
@@ -0,0 +1,79 @@
+import Image from "next/image";
+
+import { H3 } from "@app/components/home/ContentComponents";
+import { classNames } from "@app/lib/utils";
+
+export default function TrustedBy() {
+  return (
+    <>
+      <div
+        className={classNames(
+          "col-span-12 flex flex-col items-center py-8",
+          "lg:col-span-12 lg:col-start-1",
+          "xl:col-span-10 xl:col-start-2"
+        )}
+      >
+        <H3 className="w-full text-center text-white">
+          Trusted by 500+ organizations, including:
+        </H3>
+        <div
+          className={classNames(
+            "mt-8 max-w-[400px] sm:w-full sm:max-w-none",
+            "grid grid-cols-2 gap-x-2",
+            "sm:grid-cols-3 sm:gap-x-16",
+            "md:grid-cols-4 md:gap-x-16"
+          )}
+        >
+          <Image
+            alt="alan"
+            src="/static/landing/logos/alan.png"
+            width={600}
+            height={300}
+          />
+          <Image
+            alt="watershed"
+            src="/static/landing/logos/watershed.png"
+            width={600}
+            height={300}
+          />
+          <Image
+            alt="qonto"
+            src="/static/landing/logos/qonto.png"
+            width={600}
+            height={300}
+          />
+          <Image
+            alt="pennylane"
+            src="/static/landing/logos/pennylane.png"
+            width={600}
+            height={300}
+          />
+          <Image
+            alt="payfit"
+            src="/static/landing/logos/payfit.png"
+            width={600}
+            height={300}
+          />
+          <Image
+            alt="watershed"
+            src="/static/landing/logos/malt.png"
+            width={600}
+            height={300}
+          />
+          <Image
+            alt="hivebrite"
+            src="/static/landing/logos/hivebrite.png"
+            width={600}
+            height={300}
+          />
+          <Image
+            alt="blueground"
+            src="/static/landing/logos/blueground.png"
+            width={600}
+            height={300}
+          />
+        </div>
+      </div>
+    </>
+  );
+}
diff --git a/front/components/home/content/Product/IntroSection.tsx b/front/components/home/content/Product/IntroSection.tsx
index 9557414ca02e..0c1e25566319 100644
--- a/front/components/home/content/Product/IntroSection.tsx
+++ b/front/components/home/content/Product/IntroSection.tsx
@@ -9,15 +9,11 @@ import {
 import Link from "next/link";
 import React, { useEffect, useState } from "react";
 
-import {
-  Grid,
-  H1,
-  H4,
-  P,
-  Strong,
-} from "@app/components/home/ContentComponents";
+import { Grid, H1, P, Strong } from "@app/components/home/ContentComponents";
 import { classNames } from "@app/lib/utils";
 
+import TrustedBy from "../../TrustedBy";
+
 const ResponsiveIframe = () => {
   return (
     <div className="relative h-[70vh] w-[70vw]">
@@ -156,30 +152,9 @@ export function IntroSection() {
         >
           {MainVisualImage()}
         </div>
-        <div
-          className={classNames(
-            "col-span-12 flex flex-col items-center py-8",
-            "lg:col-span-10 lg:col-start-2",
-            "xl:col-span-8 xl:col-start-3"
-          )}
-        >
-          <H4 className="w-full text-center text-white">
-            Trusted by 500+ organizations, including:
-          </H4>
-          <div
-            className={classNames(
-              "max-w-[400px] sm:w-full sm:max-w-none",
-              "grid grid-cols-2 gap-x-2",
-              "md:grid-cols-5 md:gap-x-12"
-            )}
-          >
-            <img alt="alan" src="/static/landing/logos/alan.png" />
-            <img alt="qonto" src="/static/landing/logos/qonto.png" />
-            <img alt="pennylane" src="/static/landing/logos/pennylane.png" />
-            <img alt="payfit" src="/static/landing/logos/payfit.png" />
-            <img alt="watershed" src="/static/landing/logos/watershed.png" />
-          </div>
-        </div>
+
+        <TrustedBy />
+
         <div
           className={classNames(
             "col-span-12",
diff --git a/front/components/home/menu/MainNavigation.tsx b/front/components/home/menu/MainNavigation.tsx
index db05681d7d85..7f2f2270f18b 100644
--- a/front/components/home/menu/MainNavigation.tsx
+++ b/front/components/home/menu/MainNavigation.tsx
@@ -4,8 +4,6 @@ import * as React from "react";
 
 import { H4, Strong } from "@app/components/home/ContentComponents";
 import { menuConfig } from "@app/components/home/menu/config";
-import { classNames } from "@app/lib/utils";
-
 import {
   NavigationMenu,
   NavigationMenuContent,
@@ -14,7 +12,8 @@ import {
   NavigationMenuList,
   NavigationMenuTrigger,
   navigationMenuTriggerStyle,
-} from "./NavigationMenu";
+} from "@app/components/home/menu/NavigationMenu";
+import { classNames } from "@app/lib/utils";
 
 export function MainNavigation() {
   return (
diff --git a/front/pages/home/solutions/customer-support-2.tsx b/front/pages/home/solutions/customer-support-2.tsx
new file mode 100644
index 000000000000..8bd5fc84c021
--- /dev/null
+++ b/front/pages/home/solutions/customer-support-2.tsx
@@ -0,0 +1,317 @@
+import type { ReactElement } from "react";
+
+import {
+  Carousel,
+  CarouselContent,
+  CarouselItem,
+} from "@app/components/home/Carousel";
+import {
+  BlogBlock,
+  MetricComponent,
+  Quote,
+} from "@app/components/home/ContentBlocks";
+import { HeaderContentBlock } from "@app/components/home/ContentBlocks";
+import { Grid, H2 } from "@app/components/home/ContentComponents";
+import type { LandingLayoutProps } from "@app/components/home/LandingLayout";
+import LandingLayout from "@app/components/home/LandingLayout";
+import {
+  getParticleShapeIndexByName,
+  shapeNames,
+} from "@app/components/home/Particles";
+import type { SolutionSectionAssistantBlockProps } from "@app/components/home/SolutionSection";
+import { SolutionSection } from "@app/components/home/SolutionSection";
+import TrustedBy from "@app/components/home/TrustedBy";
+import { classNames } from "@app/lib/utils";
+
+export async function getServerSideProps() {
+  return {
+    props: {
+      shape: getParticleShapeIndexByName(shapeNames.octahedron),
+    },
+  };
+}
+
+interface pageSettingsProps {
+  uptitle: string;
+  title: React.ReactNode;
+  description: React.ReactNode;
+  from: string;
+  to: string;
+}
+
+const pageSettings: pageSettingsProps = {
+  uptitle: "Customer Support",
+  title: (
+    <>
+      Instant knowledge,
+      <br />
+      exceptional support.
+    </>
+  ),
+  from: "from-sky-200",
+  to: "to-sky-500",
+  description: (
+    <>
+      Dust brings all your&nbsp;tools and&nbsp;company knowledge at
+      your&nbsp;fingertips for&nbsp;endless&nbsp;possibilities.
+    </>
+  ),
+};
+
+export default function CustomerSupport() {
+  return (
+    <>
+      <HeaderContentBlock
+        uptitle={"Dust for " + pageSettings.uptitle}
+        title={pageSettings.title}
+        from={pageSettings.from}
+        to={pageSettings.to}
+        subtitle={pageSettings.description}
+      />
+
+      <Grid>
+        {/* <div
+          className={classNames(
+            "col-span-12 py-8",
+            "grid grid-cols-1 gap-x-8 gap-y-20",
+            "md:grid-cols-3 md:gap-y-16",
+            "2xl:col-span-10 2xl:col-start-2"
+          )}
+        >
+          <ImgBlock
+            title={
+              <>
+                Resolve
+                <br />
+                faster.
+              </>
+            }
+            content={
+              <>
+                Surface relevant information from all connected knowledge bases
+                instantly and understand messages in 50+ languages.
+              </>
+            }
+          >
+            <Avatar size="xl" emoji={"💡"} backgroundColor={"bg-sky-300"} />
+          </ImgBlock>
+          <ImgBlock
+            title={
+              <>
+                Boost
+                <br />
+                Team Productivity.
+              </>
+            }
+            content={
+              <>
+                Keep teams synchronized with real-time access to information
+                across all communication channels and reduce onboarding times.
+              </>
+            }
+          >
+            <Avatar size="xl" emoji={"🪄"} backgroundColor={"bg-sky-300"} />
+          </ImgBlock>
+          <ImgBlock
+            title={
+              <>
+                Understand <br />
+                customer needs.
+              </>
+            }
+            content={
+              <>
+                Gain insights from coss-tool interactions to undertstand and act
+                on customer needs, improve documentation.
+              </>
+            }
+          >
+            <Avatar size="xl" emoji={"🚀"} backgroundColor={"bg-sky-300"} />
+          </ImgBlock>
+        </div> */}
+
+        <TrustedBy />
+
+        <MetricComponent
+          metrics={[
+            {
+              value: "15x",
+              description: (
+                <>
+                  Responses generated 15x&nbsp;faster
+                  after&nbsp;implementing&nbsp;Dust
+                </>
+              ),
+            },
+            {
+              value: "8h",
+              description: (
+                <>
+                  Save 8&nbsp;hours per&nbsp;agent per&nbsp;week on&nbsp;average
+                </>
+              ),
+            },
+          ]}
+          from="from-amber-200"
+          to="to-amber-500"
+        />
+
+        <SolutionSection
+          title="Top customer support use-cases."
+          blocks={[
+            {
+              color: "sky",
+              contentBlocks: [
+                {
+                  title: <>Resolve faster.</>,
+                  content: [
+                    <>
+                      Surface relevant information from all connected knowledge
+                      bases instantly and understand messages in 50+ languages.
+                    </>,
+                  ],
+                },
+                {
+                  title: <>Boost team productivity.</>,
+                  content: [
+                    <>
+                      Keep teams synchronized with real-time access to
+                      information across all communication channels and reduce
+                      onboarding times.
+                    </>,
+                  ],
+                },
+                {
+                  title: <>Understand customer needs.</>,
+                  content: [
+                    <>
+                      Gain insights from coss-tool interactions to undertstand
+                      and act on customer needs, improve documentation.
+                    </>,
+                  ],
+                },
+              ],
+              assistantBlocks: [
+                assistantExamples[0],
+                assistantExamples[1],
+                assistantExamples[2],
+                assistantExamples[3],
+              ],
+            },
+          ]}
+        />
+
+        <Quote
+          quote="We're managing a&nbsp;higher volume of&nbsp;tickets and have
+              cut&nbsp;processing time from an&nbsp;average of 6&nbsp;minutes
+              per&nbsp;ticket to&nbsp;just a&nbsp;few&nbsp;seconds…
+            "
+        />
+
+        <div
+          className={classNames(
+            "flex flex-col gap-8",
+            "col-span-12",
+            "lg:col-span-10 lg:col-start-2",
+            "xl:col-span-9 xl:col-start-2",
+            "2xl:col-start-3"
+          )}
+        >
+          <H2 from={pageSettings.from} to={pageSettings.to}>
+            How&nbsp;Dust boosts support teams&nbsp;at:
+          </H2>
+        </div>
+        <div className="col-span-12 flex flex-col items-center gap-4">
+          <Carousel className="w-full">
+            <CarouselContent>
+              <CarouselItem className="basis-full md:basis-1/2 md:px-6 lg:basis-1/3">
+                <BlogBlock
+                  title="Navigating Growth and Innovation with November Five’s Dario Prskalo"
+                  content="Discover how November Five leverages AI with Dust to enhance efficiency and maintain a human touch in their digital solutions."
+                  href="https://blog.dust.tt/november-five-ai-transformation-dust/"
+                >
+                  <img
+                    src="https://blog.dust.tt/content/images/size/w2000/2024/04/DSCF6552-1.jpeg"
+                    alt="Blog Image"
+                  />
+                </BlogBlock>
+              </CarouselItem>
+              <CarouselItem className="basis-full px-6 md:basis-1/2 lg:basis-1/3">
+                <BlogBlock
+                  title="How Eléonore improved the efficiency of Pennylane’s Care team thanks to Dust"
+                  content="Discover how Pennylane leveraged Dust’s specialized virtual assistants to improve efficiency and optimize workflows."
+                  href="https://blog.dust.tt/pennylane-dust-customer-support-journey/"
+                >
+                  <img
+                    src="https://blog.dust.tt/content/images/size/w2000/2024/04/Ele-onore-MOTTE--1--1.jpg"
+                    alt="Blog Image"
+                  />
+                </BlogBlock>
+              </CarouselItem>
+              <CarouselItem className="basis-full px-6 md:basis-1/2 lg:basis-1/3">
+                <BlogBlock
+                  title="Integrating AI for Enhanced Workflows at Alan"
+                  content="Discover how Alan revolutionizes healthcare and enhances workflows using AI. See how @code-help and Dust streamline developer tasks."
+                  href="https://blog.dust.tt/integrating-ai-workflows-alan/"
+                >
+                  <img
+                    src="https://blog.dust.tt/content/images/size/w2000/2024/03/cover-vincent.png"
+                    alt="Blog Image"
+                  />
+                </BlogBlock>
+              </CarouselItem>
+            </CarouselContent>
+          </Carousel>
+        </div>
+      </Grid>
+    </>
+  );
+}
+
+const assistantExamples: SolutionSectionAssistantBlockProps[] = [
+  {
+    emoji: "🖋️",
+    name: "Ticket Resolution",
+    backgroundColor: "bg-sky-300",
+    description: (
+      <>Smart answer suggestions and contextual knowledge at your fingertips.</>
+    ),
+  },
+  {
+    emoji: "🔎",
+    name: "Agent Coaching",
+    backgroundColor: "bg-sky-300",
+    description: (
+      <>
+        Helps new support agents learn bst practices and company knowledge
+        faster.
+      </>
+    ),
+  },
+  {
+    emoji: "📞",
+    name: "Documentation Builder",
+    backgroundColor: "bg-sky-300",
+    description: (
+      <>
+        Converts resolved support tickets into searchable knowledge base
+        articles and FAQ.
+      </>
+    ),
+  },
+  {
+    emoji: "📊",
+    name: "Customer Voice",
+    backgroundColor: "bg-sky-300",
+    description: (
+      <>Turn customer feedback from every channel into actionable insights.</>
+    ),
+  },
+];
+
+CustomerSupport.getLayout = (
+  page: ReactElement,
+  pageProps: LandingLayoutProps
+) => {
+  return <LandingLayout pageProps={pageProps}>{page}</LandingLayout>;
+};
diff --git a/front/public/static/landing/logos/alan.png b/front/public/static/landing/logos/alan.png
index 644e8443918d..073f77a7cbc9 100644
Binary files a/front/public/static/landing/logos/alan.png and b/front/public/static/landing/logos/alan.png differ
diff --git a/front/public/static/landing/logos/blueground.png b/front/public/static/landing/logos/blueground.png
new file mode 100644
index 000000000000..01d405c017ef
Binary files /dev/null and b/front/public/static/landing/logos/blueground.png differ
diff --git a/front/public/static/landing/logos/hivebrite.png b/front/public/static/landing/logos/hivebrite.png
new file mode 100644
index 000000000000..f18ec4c2393e
Binary files /dev/null and b/front/public/static/landing/logos/hivebrite.png differ
diff --git a/front/public/static/landing/logos/kyriba.png b/front/public/static/landing/logos/kyriba.png
new file mode 100644
index 000000000000..1ae84f22038d
Binary files /dev/null and b/front/public/static/landing/logos/kyriba.png differ
diff --git a/front/public/static/landing/logos/malt.png b/front/public/static/landing/logos/malt.png
new file mode 100644
index 000000000000..da2f03a125c5
Binary files /dev/null and b/front/public/static/landing/logos/malt.png differ
diff --git a/front/public/static/landing/logos/payfit.png b/front/public/static/landing/logos/payfit.png
index d055258d1c3c..792a012851c5 100644
Binary files a/front/public/static/landing/logos/payfit.png and b/front/public/static/landing/logos/payfit.png differ
diff --git a/front/public/static/landing/logos/pennylane.png b/front/public/static/landing/logos/pennylane.png
index 4c069988c83f..8efce6e7d41e 100644
Binary files a/front/public/static/landing/logos/pennylane.png and b/front/public/static/landing/logos/pennylane.png differ
diff --git a/front/public/static/landing/logos/qonto.png b/front/public/static/landing/logos/qonto.png
index 1c9bbec6087a..3d1e645093c8 100644
Binary files a/front/public/static/landing/logos/qonto.png and b/front/public/static/landing/logos/qonto.png differ
diff --git a/front/public/static/landing/logos/watershed.png b/front/public/static/landing/logos/watershed.png
index 56bda93e1611..65d34ba280b4 100644
Binary files a/front/public/static/landing/logos/watershed.png and b/front/public/static/landing/logos/watershed.png differ