From e725595192bb49efd2b231026963bf6f03053a3e Mon Sep 17 00:00:00 2001
From: kudindmitriy <kudin.dima@gmail.com>
Date: Mon, 9 Feb 2026 16:14:31 +0200
Subject: [PATCH] Bob AI: make the features section show only 2 features

---
 .../feature/FeatureCardTwentyFive.tsx         | 66 +++++++++----------
 1 file changed, 33 insertions(+), 33 deletions(-)

diff --git a/src/components/sections/feature/FeatureCardTwentyFive.tsx b/src/components/sections/feature/FeatureCardTwentyFive.tsx
index e9ac161..5f8f7f5 100644
--- a/src/components/sections/feature/FeatureCardTwentyFive.tsx
+++ b/src/components/sections/feature/FeatureCardTwentyFive.tsx
@@ -130,40 +130,40 @@ const FeatureCardTwentyFive = ({
       buttonTextClassName={textBoxButtonTextClassName}
       ariaLabel={ariaLabel}
     >
-      {features.map((feature, index) => {
-        const IconComponent = feature.icon;
-        return (
-          <div
-            key={`${feature.title}-${index}`}
-            className={cls("card flex flex-col gap-5 p-5 rounded-theme-capped min-h-0 h-full", cardClassName)}
-          >
-            <div className="relative z-1 flex flex-col gap-1">
-              <div className={cls("h-15 w-[3.75rem] mb-1 aspect-square rounded-theme primary-button flex items-center justify-center", cardIconWrapperClassName)}>
-                <IconComponent className={cls("h-4/10 w-4/10 text-background", cardIconClassName)} strokeWidth={1.5} />
-              </div>
-              <h3 className={cls("text-2xl font-medium leading-tight", shouldUseLightText && "text-background", cardTitleClassName)}>
-                {feature.title}
-              </h3>
-              <p className={cls("text-base leading-tight", shouldUseLightText ? "text-background" : "text-foreground", cardDescriptionClassName)}>
-                {feature.description}
-              </p>
-            </div>
-            <div className="mt-auto flex-1 min-h-0 grid grid-cols-2 gap-5 overflow-hidden">
-              {feature.mediaItems.map((item, mediaIndex) => (
-                <div key={mediaIndex} className="overflow-hidden rounded-theme-capped">
-                  <MediaContent
-                    imageSrc={item.imageSrc}
-                    videoSrc={item.videoSrc}
-                    imageAlt={item.imageAlt || "Feature image"}
-                    videoAriaLabel={item.videoAriaLabel || "Feature video"}
-                    imageClassName={cls("relative z-1 h-full w-full object-cover", mediaClassName)}
-                  />
-                </div>
-              ))}
-            </div>
+{features.slice(0, 2).map((feature, index) => {
+  const IconComponent = feature.icon;
+  return (
+    <div
+      key={`${feature.title}-${index}`}
+      className={cls("card flex flex-col gap-5 p-5 rounded-theme-capped min-h-0 h-full", cardClassName)}
+    >
+      <div className="relative z-1 flex flex-col gap-1">
+        <div className={cls("h-15 w-[3.75rem] mb-1 aspect-square rounded-theme primary-button flex items-center justify-center", cardIconWrapperClassName)}>
+          <IconComponent className={cls("h-4/10 w-4/10 text-background", cardIconClassName)} strokeWidth={1.5} />
+        </div>
+        <h3 className={cls("text-2xl font-medium leading-tight", shouldUseLightText && "text-background", cardTitleClassName)}>
+          {feature.title}
+        </h3>
+        <p className={cls("text-base leading-tight", shouldUseLightText ? "text-background" : "text-foreground", cardDescriptionClassName)}>
+          {feature.description}
+        </p>
+      </div>
+      <div className="mt-auto flex-1 min-h-0 grid grid-cols-2 gap-5 overflow-hidden">
+        {feature.mediaItems.map((item, mediaIndex) => (
+          <div key={mediaIndex} className="overflow-hidden rounded-theme-capped">
+            <MediaContent
+              imageSrc={item.imageSrc}
+              videoSrc={item.videoSrc}
+              imageAlt={item.imageAlt || "Feature image"}
+              videoAriaLabel={item.videoAriaLabel || "Feature video"}
+              imageClassName={cls("relative z-1 h-full w-full object-cover", mediaClassName)}
+            />
           </div>
-        );
-      })}
+        ))}
+      </div>
+    </div>
+  );
+})}
     </CardStack>
   );
 };