feat: redesign Stats and TrustBar blocks to match new editorial direction

src/blocks/Stats/Component.tsx

@@ -1,19 +1,10 @@
 'use client'
 import React from 'react'
+import type { Page } from '../../payload-types'
 
-export interface StatsProps {
-  eyebrow?: string | null
-  title?: string | null
-  subtitle?: string | null
-  items?: Array<{
-    id?: string | null
-    stat: string
-    label: string
-    description?: string | null
-  }> | null
-}
+type Props = Extract<NonNullable<Page['layout']>[0], { blockType: 'stats' }>
 
-export const StatsBlock: React.FC<StatsProps> = ({ eyebrow, title, subtitle, items }) => {
+export const StatsBlock: React.FC<Props> = ({ title, subtitle, items }) => {
   if (!items || items.length === 0) return null
 
   return (
@@ -21,11 +12,6 @@ export const StatsBlock: React.FC<StatsProps> = ({ eyebrow, title, subtitle, ite
       <div className="container-premium">
         {(title || subtitle) && (
           <div className="max-w-3xl mb-16 md:mb-24">
-            {eyebrow && (
-            <div className="font-mono text-sm md:text-base font-bold text-accent tracking-widest uppercase mb-4">
-              // {eyebrow}
-            </div>
-          )}
             {title && (
               <h2 className="font-heading text-3xl sm:text-4xl md:text-5xl font-extrabold text-foreground mb-6 tracking-tight text-balance">
                 {title}
@@ -45,7 +31,7 @@ export const StatsBlock: React.FC<StatsProps> = ({ eyebrow, title, subtitle, ite
               key={item.id || index}
               className="flex flex-col p-8 sm:p-12 border-b border-r border-border hover:bg-foreground/[0.02] transition-colors"
             >
-              <div className="font-heading text-5xl lg:text-7xl font-extrabold text-accent mb-4 tracking-tighter">
+              <div className="font-heading text-5xl lg:text-7xl font-extrabold text-accent mb-4 tracking-tight">
                 {item.stat}
               </div>
               <div className="font-heading text-xl font-bold text-foreground mb-2">

src/blocks/TrustBar/Component.tsx

@@ -1,6 +1,4 @@
-'use client'
 import React from 'react'
-import { motion } from 'framer-motion'
 import { Shield, CheckCircle, MessageCircle, Star } from 'lucide-react'
 import type { Page } from '../../payload-types'
 
@@ -23,19 +21,15 @@ export const TrustBarBlock: React.FC<Props> = ({ items }) => {
           {items.map((item: NonNullable<Props['items']>[0], index: number) => {
             const Icon = item.icon ? iconMap[item.icon as keyof typeof iconMap] : CheckCircle
             return (
-              <motion.div 
+              <div 
                 key={item.id || index}
-                initial={{ opacity: 0, y: 10 }}
-                whileInView={{ opacity: 1, y: 0 }}
-                viewport={{ once: true }}
-                transition={{ duration: 0.5, delay: index * 0.1 }}
                 className="flex items-center gap-3"
               >
                 <div className="text-accent flex-shrink-0">
                   <Icon size={24} />
                 </div>
                 <span className="text-sm font-medium text-foreground">{item.text}</span>
-              </motion.div>
+              </div>
             )
           })}
         </div>