changed hero styling, added animations

src/components/Footer.tsx

@@ -19,14 +19,24 @@ export function Footer({
     <footer className="border-t border-secondary bg-bg px-4 py-10">
       <div className="mx-auto flex max-w-7xl flex-col items-center justify-between gap-6 md:flex-row">
         <div className="text-center md:text-left">
-          <div className="text-xl font-extrabold tracking-wide text-text">Jody Holt</div>
-          <p className="text-sm text-text/70">Passion Pioneer</p>
+          <div className="text-xl md:text-2xl font-extrabold font-name tracking-wide text-text">
+            Jody Holt
+          </div>
+          <div className="text-[11px] md:text-sm text-text/70">
+            Passion Pioneer
+          </div>
         </div>
 
         <nav className="flex items-center gap-5">
-          <a className="text-text hover:text-primary" href="#projects">Projects</a>
-          <a className="text-text hover:text-primary" href="#experience">Experience</a>
-          <a className="text-text hover:text-primary" href="#home">Background</a>
+          <a className="text-text hover:text-primary" href="#projects">
+            Projects
+          </a>
+          <a className="text-text hover:text-primary" href="#experience">
+            Experience
+          </a>
+          <a className="text-text hover:text-primary" href="#home">
+            Background
+          </a>
         </nav>
 
         <div className="flex items-center gap-4 text-text">
@@ -38,14 +48,18 @@ export function Footer({
               className="inline-flex h-10 w-10 items-center justify-center rounded-lg border border-secondary hover:border-primary hover:text-primary"
               title={s.label}
             >
-              {s.icon ?? <span className="h-2.5 w-2.5 rounded-full bg-current" />}
+              {s.icon ?? (
+                <span className="h-2.5 w-2.5 rounded-full bg-current" />
+              )}
             </a>
           ))}
         </div>
       </div>
 
       <div className="mx-auto mt-6 flex max-w-7xl items-center justify-center gap-4">
-        <div className="text-center text-xs text-text/60">© {year} Jody Holt • All rights reserved</div>
+        <div className="text-center text-xs text-text/60">
+          © {year} Jody Holt • All rights reserved
+        </div>
         {showBackToTop && (
           <button
             onClick={() => window.scrollTo({ top: 0, behavior: "smooth" })}
@@ -57,4 +71,4 @@ export function Footer({
       </div>
     </footer>
   );
-}
+}