refactor: align landing page and 404 with Calculate blueprint

- Hero: remove framer-motion, CSS stagger animations, glass pill CTA button, refined typography and scroll indicator
- Stats: remove framer-motion, Lucide icons, tighter glass cards with mono labels
- ToolsGrid: remove framer-motion, editorial section heading, 4-col xl grid
- ToolCard: replace framer-motion motion.Link with plain Link + CSS hover, compact layout (icon→title→desc→badges+arrow), ElementType icon prop
- Footer: remove framer-motion, matches sidebar footer style
- BackToTop: remove framer-motion, JS scroll progress bar (1px primary line), compact glass button
- not-found: remove framer-motion and shadcn Button, glass pill CTA, 120px mono 404, CSS stagger
- page.tsx: remove unnecessary 'use client' directive

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

components/ToolsGrid.tsx

@@ -1,45 +1,37 @@
-'use client';
-
-import { motion } from 'framer-motion';
 import ToolCard from './ToolCard';
 import { tools } from '@/lib/tools';
 
 export default function ToolsGrid() {
   return (
-    <section id="tools" className="relative py-20 px-4">
-      <div className="max-w-6xl mx-auto">
+    <section id="tools" className="relative py-16 px-6">
+      <div className="max-w-5xl mx-auto">
+
         {/* Section heading */}
-        <motion.div
-          className="text-center mb-16"
-          initial={{ opacity: 0, y: 20 }}
-          whileInView={{ opacity: 1, y: 0 }}
-          viewport={{ once: true }}
-          transition={{ duration: 0.6 }}
+        <div
+          className="mb-8"
+          style={{ animation: 'fadeIn 0.5s ease-out both' }}
         >
-          <h2 className="text-4xl md:text-5xl font-bold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-purple-400 to-cyan-400">
+          <span className="text-[10px] font-semibold text-muted-foreground uppercase tracking-widest block mb-1">
             Available Tools
-          </h2>
-          <p className="text-muted-foreground text-lg max-w-2xl mx-auto">
-            Explore our collection of carefully crafted tools designed to boost your productivity and creativity
+          </span>
+          <p className="text-xs text-muted-foreground/40">
+            Carefully crafted tools for your workflow
           </p>
-        </motion.div>
+        </div>
 
         {/* Tools grid */}
-        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
-          {tools.map((tool, index) => {
-            const Icon = tool.icon;
-            return (
-              <ToolCard
-                key={tool.href}
-                title={tool.title}
-                description={tool.summary}
-                icon={<Icon className="w-12 h-12" />}
-                url={tool.href}
-                badges={tool.badges}
-                index={index}
-              />
-            );
-          })}
+        <div className="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-4 gap-3">
+          {tools.map((tool, index) => (
+            <ToolCard
+              key={tool.href}
+              title={tool.shortTitle}
+              description={tool.summary}
+              icon={tool.icon}
+              url={tool.href}
+              badges={tool.badges}
+              index={index}
+            />
+          ))}
         </div>
       </div>
     </section>