Restructure blogs as Astro monorepo

sites/puzzles/src/components/sections/newsletter-signup.tsx

@@ -0,0 +1,64 @@
+import React from "react";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Mail } from "lucide-react";
+
+const NewsletterSignup = () => {
+  const [email, setEmail] = React.useState("");
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+    // This would be connected to your newsletter service
+    console.log("Submitting email:", email);
+    alert("Thanks for subscribing!");
+    setEmail("");
+  };
+
+  return (
+    <section className="bg-muted/50 border-t py-16 md:py-24">
+      <div className="container max-w-5xl">
+        <div className="bg-card flex flex-col items-center justify-between gap-8 rounded-2xl border p-8 shadow-sm md:p-12 lg:flex-row">
+          <div className="max-w-md text-center lg:text-left">
+            <div className="mb-3 flex justify-center lg:justify-start">
+              <div className="bg-primary/10 text-primary flex h-10 w-10 items-center justify-center rounded-full">
+                <Mail className="h-5 w-5" />
+              </div>
+            </div>
+            <h2 className="mb-3 text-2xl font-bold md:text-3xl">
+              Subscribe to our newsletter
+            </h2>
+            <p className="text-muted-foreground mb-0 text-base">
+              Stay updated with the latest articles, tutorials, and insights
+              from our team. We'll never spam your inbox.
+            </p>
+          </div>
+
+          <div className="w-full max-w-md">
+            <form
+              onSubmit={handleSubmit}
+              className="flex flex-col gap-2 sm:flex-row"
+            >
+              <Input
+                type="email"
+                placeholder="Enter your email"
+                value={email}
+                onChange={(e) => setEmail(e.target.value)}
+                required
+                className="h-12"
+              />
+              <Button type="submit" className="h-12">
+                Subscribe
+              </Button>
+            </form>
+            <p className="text-muted-foreground mt-2 text-xs">
+              By subscribing, you agree to our Privacy Policy and consent to
+              receive updates from our company.
+            </p>
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+};
+
+export default NewsletterSignup;