feat: add Why Choose SnapOtter section, expand hero animation phrases

apps/landing/src/app/page.tsx

@@ -8,6 +8,7 @@ import { Navbar } from "@/components/navbar";
 import { OpenSource } from "@/components/open-source";
 import { ThreeWays } from "@/components/three-ways";
 import { UseCases } from "@/components/use-cases";
+import { WhyChoose } from "@/components/why-choose";
 
 export default function Home() {
   return (
@@ -15,6 +16,7 @@ export default function Home() {
       <Navbar />
       <main>
         <Hero />
+        <WhyChoose />
         <BentoGrid />
         <ThreeWays />
         <Enterprise />

apps/landing/src/components/typing-cursor.tsx

@@ -5,12 +5,15 @@ import { useCallback, useEffect, useState } from "react";
 
 const phrases = [
   "No signups. No accounts.",
+  "No uploads to the cloud. Ever.",
   "100% local processing.",
-  "Unlimited use. Forever free.",
+  "Forever free. No paywalls.",
+  "No limits. No hidden caps.",
   "Works fully offline.",
-  "Zero data leaves your network.",
+  "Unlimited batch processing.",
   "50+ image tools.",
   "14 AI models. Your hardware.",
+  "Lightning fast. Built on Sharp.",
   "Air-gapped ready.",
   "One Docker container.",
   "Open source. Always.",

apps/landing/src/components/why-choose.tsx

@@ -0,0 +1,65 @@
+import { BadgeCheck, CircleDollarSign, Layers, ShieldCheck, UserRoundX, Zap } from "lucide-react";
+import { FadeIn } from "./fade-in";
+
+const benefits = [
+  {
+    title: "No Signup",
+    description: "Start instantly, no accounts or emails required.",
+    icon: UserRoundX,
+  },
+  {
+    title: "No Uploads",
+    description: "Your files stay on your server. Nothing leaves your network.",
+    icon: ShieldCheck,
+  },
+  {
+    title: "Forever Free",
+    description: "All tools, no trials, no paywalls. Open source.",
+    icon: CircleDollarSign,
+  },
+  {
+    title: "No Limits",
+    description: "Use as much as you want, no hidden caps.",
+    icon: BadgeCheck,
+  },
+  {
+    title: "Batch Processing",
+    description: "Handle unlimited images in one go.",
+    icon: Layers,
+  },
+  {
+    title: "Lightning Fast",
+    description: "Powered by Sharp. Process images instantly.",
+    icon: Zap,
+  },
+];
+
+export function WhyChoose() {
+  return (
+    <section className="bg-dark-bg px-6 py-24 text-dark-fg md:py-36">
+      <div className="mx-auto max-w-6xl">
+        <FadeIn>
+          <h2 className="text-center text-3xl font-bold tracking-tight md:text-4xl">
+            Why choose SnapOtter?
+          </h2>
+        </FadeIn>
+
+        <div className="mt-16 grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
+          {benefits.map((benefit, i) => (
+            <FadeIn key={benefit.title} delay={i * 0.05}>
+              <div className="rounded-2xl border border-white/10 bg-white/5 p-6">
+                <div className="flex items-center gap-3">
+                  <benefit.icon size={24} className="text-accent shrink-0" />
+                  <h3 className="text-lg font-bold">{benefit.title}</h3>
+                </div>
+                <p className="mt-3 text-sm leading-relaxed text-dark-muted">
+                  {benefit.description}
+                </p>
+              </div>
+            </FadeIn>
+          ))}
+        </div>
+      </div>
+    </section>
+  );
+}