From 8e9862032c22e3e6d6feca5ea79d6a8f690dd8cb Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sat, 7 Mar 2026 12:11:16 +0000
Subject: [PATCH] Update src/app/features/page.tsx

---
 src/app/features/page.tsx | 165 +++++++++++++++++++++++++-------------
 1 file changed, 110 insertions(+), 55 deletions(-)

diff --git a/src/app/features/page.tsx b/src/app/features/page.tsx
index 28aca4e..6f88025 100644
--- a/src/app/features/page.tsx
+++ b/src/app/features/page.tsx
@@ -4,9 +4,10 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
 import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
 import FeatureCardMedia from "@/components/sections/feature/FeatureCardMedia";
+import AboutMetric from "@/components/sections/about/AboutMetric";
 import ContactCTA from "@/components/sections/contact/ContactCTA";
 import FooterSimple from "@/components/sections/footer/FooterSimple";
-import { Zap, Sparkles, Headphones } from "lucide-react";
+import { Zap, Sparkles, Headphones, Battery, Waves, Music, Zap as ZapIcon } from "lucide-react";
 
 export default function FeaturesPage() {
   return (
@@ -26,67 +27,59 @@ export default function FeaturesPage() {
         <NavbarLayoutFloatingInline
           brandName="AirPods"
           navItems={[
-            { name: "Products", id: "/products" },
+            { name: "Products", id: "/" },
             { name: "Features", id: "/features" },
-            { name: "Why AirPods", id: "metrics" },
-            { name: "Support", id: "faq" },
+            { name: "Comparison", id: "/comparison" },
+            { name: "Why AirPods", id: "/" },
+            { name: "Support", id: "/" },
           ]}
-          button={{ text: "Shop Now", href: "/products" }}
+          button={{ text: "Shop Now", href: "#products" }}
           animateOnLoad={true}
         />
       </div>
 
       <div id="hero" data-section="hero">
         <HeroSplitKpi
-          title="Discover Premium Audio Features"
-          description="Experience cutting-edge technology designed for the perfect listening experience. From active noise cancellation to spatial audio, every feature is crafted with precision."
-          background={{ variant: "glowing-orb" }}
+          title="Advanced Features Built for You"
+          description="Discover the cutting-edge technology that powers AirPods Pro and AirPods Max. From intelligent noise control to immersive spatial audio, experience audio innovation at its finest."
+          background={{ variant: "plain" }}
           kpis={[
-            { value: "6", label: "Key Features" },
-            { value: "Premium", label: "Audio Quality" },
-            { value: "Advanced", label: "Technology" },
+            { value: "30+ Hours", label: "Total Battery" },
+            { value: "Adaptive", label: "Noise Control" },
+            { value: "360°", label: "Spatial Audio" },
           ]}
           enableKpiAnimation={true}
-          tag="Feature Showcase"
-          tagIcon={Zap}
+          tag="Feature Deep Dive"
+          tagIcon={Sparkles}
           tagAnimation="slide-up"
           buttons={[
-            { text: "Explore All Features", href: "#features" },
-            { text: "Shop Now", href: "/products" },
+            { text: "Shop Now", href: "/" },
+            { text: "Back Home", href: "/" },
           ]}
           buttonAnimation="slide-up"
-          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/spatial-audio-visualization-showing-3d-s-1772884352783-6a2daab8.png"
-          imageAlt="Premium Audio Features Visualization"
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/a-sleek-premium-product-shot-of-airpods--1772884352155-5b47d23f.png"
+          imageAlt="AirPods Pro with premium charging case"
           mediaAnimation="blur-reveal"
           imagePosition="right"
         />
       </div>
 
-      <div id="features" data-section="features">
+      <div id="noise-cancellation" data-section="features-noise">
         <FeatureCardMedia
-          title="Key Features That Matter"
-          description="Engineered excellence in every detail. Experience the features that make audio transcendent."
+          title="Noise Cancellation Excellence"
+          description="Experience advanced active noise cancellation that learns and adapts to your environment."
           tag="Core Technology"
-          tagIcon={Sparkles}
+          tagIcon={Zap}
           tagAnimation="slide-up"
           features={[
             {
-              id: "active-noise-cancellation",              title: "Active Noise Cancellation",              description: "Revolutionary ANC that adapts to your environment in real time. Experience breakthrough silence and immersive listening wherever you go.",              tag: "Pro Feature",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/abstract-visualization-of-active-noise-c-1772884352205-cdd837a4.png",              imageAlt: "Active noise cancellation visualization",              buttons: [{ text: "Learn More", href: "#" }],
+              id: "anc-adaptive",              title: "Adaptive Audio Intelligence",              description: "Our advanced algorithms analyze ambient sound patterns in real-time. AirPods Pro automatically adjusts noise cancellation strength based on your environment, whether you're in a bustling airport, quiet office, or moving between locations.",              tag: "Pro Feature",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/abstract-visualization-of-active-noise-c-1772884352205-cdd837a4.png",              imageAlt: "Adaptive noise cancellation visualization",              buttons: [{ text: "Learn More", href: "#" }],
             },
             {
-              id: "spatial-audio",              title: "Spatial Audio & Head Tracking",              description: "Immerse yourself in dynamic head tracking with room-aware audio. Feel the action unfold around you with theater-like presence in every moment.",              tag: "Immersive",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/spatial-audio-visualization-showing-3d-s-1772884352783-6a2daab8.png",              imageAlt: "Spatial audio 3D visualization",              buttons: [{ text: "Experience It", href: "#" }],
+              id: "transparency-mode",              title: "Transparency Mode",              description: "Stay aware of your surroundings when you need to. Transparency mode lets ambient sounds through so you can hear announcements, conversations, and environmental audio while still enjoying your music or calls at optimal levels.",              tag: "Smart Feature",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/spatial-audio-visualization-showing-3d-s-1772884352783-6a2daab8.png",              imageAlt: "Transparency mode feature",              buttons: [{ text: "Discover", href: "#" }],
             },
             {
-              id: "adaptive-audio",              title: "Adaptive Audio Control",              description: "Smart algorithms learn your preferences and adapt audio playback. Personalized volume and sound profile that evolves with your listening habits.",              tag: "Smart",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/apple-ecosystem-integration-showing-ipho-1772884352656-6d2f7cb3.png",              imageAlt: "Adaptive audio control interface",              buttons: [{ text: "Discover More", href: "#" }],
-            },
-            {
-              id: "battery-life",              title: "Extended Battery Performance",              description: "Up to 30 hours of battery life with charging case. Stay connected all day and beyond with advanced power management technology.",              tag: "Endurance",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/high-quality-product-photography-of-airp-1772884351466-337fed24.png",              imageAlt: "Battery performance showcase",              buttons: [{ text: "View Specs", href: "#" }],
-            },
-            {
-              id: "seamless-connectivity",              title: "Seamless Device Switching",              description: "Intelligent automatic switching between iPhone, Mac, iPad, and Apple Watch. One setup connects everything - experience true ecosystem integration.",              tag: "Connected",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/apple-ecosystem-integration-showing-ipho-1772884352656-6d2f7cb3.png",              imageAlt: "Device ecosystem integration",              buttons: [{ text: "See Integration", href: "#" }],
-            },
-            {
-              id: "personalization",              title: "Personalized Sound Experience",              description: "Customize audio to match your unique preferences. Fine-tune EQ, enable or disable features, and create your perfect listening profile.",              tag: "Customizable",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/airpods-2nd-generation-with-charging-cas-1772884351239-d2c575a8.png",              imageAlt: "Personalization settings interface",              buttons: [{ text: "Customize Now", href: "#" }],
+              id: "conversation-awareness",              title: "Conversation Awareness",              description: "Automatically detect when you're speaking to someone and lower music volume while activating transparency mode. Continue your conversation naturally without removing your AirPods. Perfect for quick interactions while staying immersed in your content.",              tag: "Intelligent",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/apple-ecosystem-integration-showing-ipho-1772884352656-6d2f7cb3.png",              imageAlt: "Conversation awareness illustration",              buttons: [{ text: "Experience", href: "#" }],
             },
           ]}
           animationType="slide-up"
@@ -95,19 +88,81 @@ export default function FeaturesPage() {
         />
       </div>
 
+      <div id="battery-life" data-section="features-battery">
+        <FeatureCardMedia
+          title="Extended Battery Performance"
+          description="Power that keeps up with your lifestyle - all day listening with intelligent battery management."
+          tag="Power & Performance"
+          tagIcon={Battery}
+          tagAnimation="slide-up"
+          features={[
+            {
+              id: "battery-duration",              title: "All-Day Battery Life",              description: "AirPods Pro deliver up to 6 hours of listening time per charge, with 30 hours total using the charging case. AirPods Max provide up to 20 hours per charge. Intelligent power management optimizes battery based on your usage patterns and audio settings.",              tag: "Extended",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/abstract-visualization-of-active-noise-c-1772884352205-cdd837a4.png",              imageAlt: "Battery performance chart",              buttons: [{ text: "View Specs", href: "#" }],
+            },
+            {
+              id: "fast-charging",              title: "Fast Charging Technology",              description: "Get back in the action quickly with our optimized charging system. Just 15 minutes of charging provides up to 1 hour of listening time. The wireless charging case uses advanced power management to maximize battery health over the device's lifetime.",              tag: "Quick Charge",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/spatial-audio-visualization-showing-3d-s-1772884352783-6a2daab8.png",              imageAlt: "Fast charging capability",              buttons: [{ text: "Compare", href: "#" }],
+            },
+            {
+              id: "battery-health",              title: "Battery Health Monitoring",              description: "Track your AirPods battery status in real-time through the iOS battery widget. Receive automatic notifications when battery is low. Our smart battery conditioning helps maintain longevity and performance, keeping your AirPods performing optimally for years.",              tag: "Smart Monitoring",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/apple-ecosystem-integration-showing-ipho-1772884352656-6d2f7cb3.png",              imageAlt: "Battery health interface",              buttons: [{ text: "Learn More", href: "#" }],
+            },
+          ]}
+          animationType="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="immersive-sound" data-section="features-sound">
+        <FeatureCardMedia
+          title="Immersive Sound Experience"
+          description="Premium audio quality with spatial rendering and personalized audio tuning."
+          tag="Audio Technology"
+          tagIcon={Music}
+          tagAnimation="slide-up"
+          features={[
+            {
+              id: "spatial-audio-feature",              title: "Spatial Audio with Dynamic Head Tracking",              description: "Experience cinema-like spatial audio that places sound around you in three-dimensional space. Dynamic head tracking follows your movement, making it feel like sound sources stay positioned in the room. Perfect for movies, music, and gaming with compatible content.",              tag: "Immersive",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/abstract-visualization-of-active-noise-c-1772884352205-cdd837a4.png",              imageAlt: "Spatial audio 3D visualization",              buttons: [{ text: "Experience", href: "#" }],
+            },
+            {
+              id: "audio-personalization",              title: "Personalized Audio & Volume",              description: "AirPods automatically adjust audio personalization based on your hearing capabilities and preferences. Custom eq settings enhance bass, mids, and treble to match your unique audio preferences. Adaptive audio adjusts volume intelligently based on ambient noise levels.",              tag: "Personal",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/spatial-audio-visualization-showing-3d-s-1772884352783-6a2daab8.png",              imageAlt: "Audio personalization settings",              buttons: [{ text: "Customize", href: "#" }],
+            },
+            {
+              id: "quality-codec",              title: "Premium Audio Codec & Drivers",              description: "Our advanced H1 and H2 chips process audio with minimal latency. Custom-engineered acoustic design combined with premium speaker drivers delivers rich, detailed sound across all frequencies. Whether streaming music or taking calls, experience superior audio clarity.",              tag: "Technical",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/apple-ecosystem-integration-showing-ipho-1772884352656-6d2f7cb3.png",              imageAlt: "Audio codec technology",              buttons: [{ text: "Explore", href: "#" }],
+            },
+          ]}
+          animationType="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="metrics" data-section="metrics">
+        <AboutMetric
+          title="Feature Specifications That Matter"
+          metrics={[
+            { icon: Battery, label: "Maximum Battery Life", value: "30+ Hours" },
+            { icon: Waves, label: "Noise Cancellation Levels", value: "Multi-Stage" },
+            { icon: Headphones, label: "Audio Modes", value: "4+ Modes" },
+            { icon: ZapIcon, label: "Setup Time", value: "Instant" },
+          ]}
+          metricsAnimation="slide-up"
+          useInvertedBackground={false}
+        />
+      </div>
+
       <div id="contact-cta" data-section="contact-cta">
         <ContactCTA
-          tag="Experience Premium Audio"
+          tag="Ready to Experience?"
           tagIcon={Headphones}
           tagAnimation="slide-up"
-          title="Ready to Upgrade Your Listening?"
-          description="Discover how these advanced features can transform your audio experience. Shop our complete lineup and find the perfect model for your lifestyle."
+          title="Discover Premium Audio Innovation"
+          description="All these advanced features come together in AirPods Pro and AirPods Max. Find the perfect model for your lifestyle and experience the difference."
           buttons={[
-            { text: "Shop Now", href: "/products" },
-            { text: "View Specifications", href: "/products" },
+            { text: "Shop AirPods Pro", href: "/" },
+            { text: "View Comparison", href: "/comparison" },
           ]}
           buttonAnimation="slide-up"
-          background={{ variant: "glowing-orb" }}
+          background={{ variant: "plain" }}
           useInvertedBackground={false}
         />
       </div>
@@ -117,26 +172,26 @@ export default function FeaturesPage() {
           columns={[
             {
               title: "Products",              items: [
-                { label: "AirPods Pro", href: "/products" },
-                { label: "AirPods Max", href: "/products" },
-                { label: "AirPods (2nd Gen)", href: "/products" },
-                { label: "Compare Models", href: "/products" },
+                { label: "AirPods Pro", href: "/" },
+                { label: "AirPods Max", href: "/" },
+                { label: "AirPods (2nd Gen)", href: "/" },
+                { label: "Compare Models", href: "/comparison" },
+              ],
+            },
+            {
+              title: "Features",              items: [
+                { label: "Noise Cancellation", href: "#noise-cancellation" },
+                { label: "Battery Life", href: "#battery-life" },
+                { label: "Sound Quality", href: "#immersive-sound" },
+                { label: "Ecosystem", href: "/" },
               ],
             },
             {
               title: "Support",              items: [
-                { label: "FAQ", href: "#faq" },
-                { label: "Setup Guide", href: "#" },
-                { label: "Troubleshooting", href: "#" },
-                { label: "Contact Us", href: "/contact" },
-              ],
-            },
-            {
-              title: "Company",              items: [
-                { label: "About Us", href: "#" },
-                { label: "Blog", href: "#" },
-                { label: "Careers", href: "#" },
-                { label: "News", href: "#" },
+                { label: "Setup Guide", href: "/" },
+                { label: "FAQ", href: "/" },
+                { label: "Troubleshooting", href: "/" },
+                { label: "Contact Us", href: "/" },
               ],
             },
             {