added animation

Author: QuadAces

frontend/src/pages/404.tsx

@@ -1,6 +1,6 @@
 import Footer from '@/components/Footer';
 import Navbar from '@/components/Navbar';
-
+import { motion } from 'framer-motion';
 export default function Custom404() {
   return (
     <section className="flex flex-col min-h-screen justify-between py-8 xl:px-24 md:px-10 px-5 relative overflow-hidden">
@@ -11,9 +11,11 @@ export default function Custom404() {
           Sorry! We can't find the page you're looking for!
           <br />
         </p>
-        <p className="text-2xl pt-10">
-          While we may have found some tomfoolery, we haven't found your page :'(
-        </p>
+        <motion.div className="opacity-0" whileHover={{ opacity: 1 }} transition={{duration: 0.2}}>
+          <p className="text-2xl pt-10">
+            While we may have found some tomfoolery, we haven't found your page :'(
+          </p>
+        </motion.div>
         <a href="/">
           <button className="mt-10 bg-white border text-[#3977F8] border-[#A7A6E5] text-lg rounded-xl w-[30%] xl:h-12 h-10">
             Back to saftey