Add Comic Sans font utility class and apply to hero text

Author: eric15342335

src/app/globals.css

@@ -127,4 +127,10 @@
   section {
     @apply w-full py-9 md:py-18;
   }
-}
+}
+
+@layer utilities {
+  .font-comic {
+    font-family: "Comic Sans MS", "Comic Sans", cursive;
+  }
+}

src/components/sections/hero.tsx

@@ -29,7 +29,9 @@ export function Hero() {
           <CarouselItem>
             <div className="p-1">
               <div className="flex h-96 items-center justify-center p-6">
-                <span className="text-4xl font-semibold text-center">Next generation voices for peace.</span>
+                <span className="text-4xl font-semibold text-center font-comic">
+                  Next generation voices for peace.
+                </span>
               </div>
             </div>
           </CarouselItem>