changed where the main tag appears

src/components/layouts/HomeLayout.tsx

@@ -4,10 +4,10 @@ import type { Children } from "@utils/types/props";
 
 export const HomeLayout: React.FC<Children> = ({ children }) => {
   return (
-    <>
+    <main>
       <Header />
       {children}
       <Footer />
-    </>
+    </main>
   );
 };

src/components/layouts/InfoLayout.tsx

@@ -4,7 +4,7 @@ import { IoClose } from "react-icons/io5";
 
 export const InfoLayout: React.FC<Children> = ({ children }) => {
   return (
-    <>
+    <main>
       <Link
         href="/"
         className="relative flex min-h-screen flex-col items-center justify-center"
@@ -15,6 +15,6 @@ export const InfoLayout: React.FC<Children> = ({ children }) => {
         />
       </Link>
       {children}
-    </>
+    </main>
   );
 };

src/components/layouts/RootLayout.tsx

@@ -9,5 +9,5 @@ const murecho = Murecho({
 });
 
 export const RootLayout: React.FC<Children> = ({ children }) => {
-  return <main className={`${murecho.variable} font-sans`}>{children}</main>;
+  return <div className={`${murecho.variable} font-sans`}>{children}</div>;
 };