refactor: Cleaner landing page - focused hero & reduced animations

**User Feedback:**
- Hero Section: Too much going on, redundant generator
- Animations: Too excessive throughout
- Phone Mockup: Works great, keep it!

**Hero Section - Major Cleanup:**
- REMOVED: Interactive QR Generator (redundant with generator below)
- NEW: QRTypesShowcase - 3x3 grid showing 9 QR code types
- NEW: Auto-rotating phone mockup demonstrating each type
- Shows variety instead of single interactive element
- Much cleaner, more focused first impression

**Animation Cleanup:**
- FeatureCustomizationDemo: Cycles ONCE then stops
- FeatureBulkDemo: Animates ONCE then stays static
- Features.tsx: Removed all infinite animations (rotate, scale, etc.)
- StatsCounter: Subtiler - smaller text, slower animation
- No more animation overload!

**Philosophy:**
- CLEANER > overloaded
- FOCUSED > excessive interaction
- SUBTLE > flashy animations
- Show variety > show everything

**PhoneMockup Enhanced:**
- Auto-rotates through 9 QR types every 5s
- Shows scan animation for each type
- Displays type name in notification
- Clean demo of all capabilities

**Components:**
- NEW: QRTypesShowcase.tsx - Grid with 9 QR types
- UPDATED: PhoneMockup.tsx - Auto-rotation logic
- UPDATED: Hero.tsx - Uses showcase instead of generator
- UPDATED: Features.tsx - Static icons, no infinite loops
- UPDATED: StatsCounter.tsx - Subtiler appearance

Result: Professional, clean, focused landing page without animation chaos!

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

src/components/marketing/FeatureCustomizationDemo.tsx

@@ -14,14 +14,25 @@ const colorPresets = [
 
 export const FeatureCustomizationDemo: React.FC = () => {
   const [activeIndex, setActiveIndex] = useState(0);
+  const [hasAnimated, setHasAnimated] = useState(false);
 
   useEffect(() => {
+    if (hasAnimated) return;
+
     const interval = setInterval(() => {
-      setActiveIndex((prev) => (prev + 1) % colorPresets.length);
-    }, 2500);
+      setActiveIndex((prev) => {
+        const next = prev + 1;
+        if (next >= colorPresets.length) {
+          clearInterval(interval);
+          setHasAnimated(true);
+          return 0; // Reset to first
+        }
+        return next;
+      });
+    }, 1500);
 
     return () => clearInterval(interval);
-  }, []);
+  }, [hasAnimated]);
 
   const currentPreset = colorPresets[activeIndex];