polish: Priority 2 improvements - smooth scroll, badges, back to top

🎯 Smooth Scroll Behavior:
- Added smooth scroll CSS for seamless navigation
- Scroll indicator now links to #tools section
- Added hover states for scroll indicator
- Accessibility: respects prefers-reduced-motion

🏷️ Tool Badges:
- Added feature badges to each tool card
- Vert: Privacy, Open Source, Free
- Paint: Browser-Based, Free
- Pastel: Open Source, WCAG, Free
- Subtle glassmorphic badge design

⬆️ Back to Top Button:
- Animated button appears after scrolling 300px
- Smooth scroll to top on click
- Hover tooltip with "Back to top" label
- Scale animations on hover/tap
- Progress bar at top showing scroll position
- Gradient progress indicator

♿ Accessibility:
- Added prefers-reduced-motion support
- Proper ARIA labels
- Keyboard accessible
- Smooth animations respect user preferences

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

components/BackToTop.tsx

@@ -0,0 +1,77 @@
+'use client';
+
+import { motion, useScroll, useSpring } from 'framer-motion';
+import { useState, useEffect } from 'react';
+
+export default function BackToTop() {
+  const [isVisible, setIsVisible] = useState(false);
+  const { scrollYProgress } = useScroll();
+  const scaleX = useSpring(scrollYProgress, {
+    stiffness: 100,
+    damping: 30,
+    restDelta: 0.001,
+  });
+
+  useEffect(() => {
+    const toggleVisibility = () => {
+      if (window.pageYOffset > 300) {
+        setIsVisible(true);
+      } else {
+        setIsVisible(false);
+      }
+    };
+
+    window.addEventListener('scroll', toggleVisibility);
+    return () => window.removeEventListener('scroll', toggleVisibility);
+  }, []);
+
+  const scrollToTop = () => {
+    window.scrollTo({
+      top: 0,
+      behavior: 'smooth',
+    });
+  };
+
+  return (
+    <>
+      {/* Progress bar */}
+      <motion.div
+        className="fixed top-0 left-0 right-0 h-1 bg-gradient-to-r from-purple-500 to-cyan-500 transform origin-left z-50"
+        style={{ scaleX }}
+      />
+
+      {/* Back to top button */}
+      {isVisible && (
+        <motion.button
+          onClick={scrollToTop}
+          className="fixed bottom-8 right-8 p-4 rounded-full glass hover:bg-white/10 text-purple-400 hover:text-purple-300 transition-colors shadow-lg z-40 group"
+          initial={{ opacity: 0, y: 20 }}
+          animate={{ opacity: 1, y: 0 }}
+          exit={{ opacity: 0, y: 20 }}
+          whileHover={{ scale: 1.1 }}
+          whileTap={{ scale: 0.9 }}
+          aria-label="Back to top"
+        >
+          <svg
+            className="w-6 h-6"
+            fill="none"
+            stroke="currentColor"
+            viewBox="0 0 24 24"
+          >
+            <path
+              strokeLinecap="round"
+              strokeLinejoin="round"
+              strokeWidth={2}
+              d="M5 10l7-7m0 0l7 7m-7-7v18"
+            />
+          </svg>
+
+          {/* Tooltip */}
+          <span className="absolute bottom-full right-0 mb-2 px-3 py-1 text-xs text-white bg-gray-900 rounded-lg opacity-0 group-hover:opacity-100 transition-opacity whitespace-nowrap">
+            Back to top
+          </span>
+        </motion.button>
+      )}
+    </>
+  );
+}