feat: cria o header bottom para telas desktop

pagina-institucional/src/components/HeaderBottom.tsx

@@ -0,0 +1,26 @@
+import React from "react";
+import styles from "../style/HeaderBottom.module.scss";
+
+const HeaderBottom = () => {
+  return (
+    <div className={styles.header___wrapper}>
+      <div className={styles.textcontainer}>
+        <a className={styles.textlinks1} href="/">
+          Cursos
+        </a>
+      </div>
+      <div className={styles.textcontainer}>
+        <a className={styles.textlinks2} href="/">
+          Saiba Mais
+        </a>
+      </div>
+      <div className={styles.textcontainer}>
+        <a className={styles.textlinks3} href="/">
+          Institucionais
+        </a>
+      </div>
+    </div>
+  );
+};
+
+export { HeaderBottom };

pagina-institucional/src/pages/Home.tsx

@@ -2,9 +2,15 @@ import React from "react";
 import { Route } from "react-router";
 import { BrowserRouter } from "react-router-dom";
 import { Header } from "../components/Header";
+import { HeaderBottom } from "../components/HeaderBottom";
 
 const Home = () => {
-  return <Header />;
+  return (
+    <>
+      <Header />
+      <HeaderBottom />
+    </>
+  );
 };
 
 export { Home };

pagina-institucional/src/style/HeaderBottom.module.scss

@@ -0,0 +1,27 @@
+.header___wrapper {
+  display: flex;
+  background: #000;
+  gap: 55px;
+  height: 44px;
+
+  .textlinks1 {
+    margin-left: 125px;
+  }
+
+  .textlinks1,
+  .textlinks2,
+  .textlinks3 {
+    display: flex;
+    align-self: center;
+    text-transform: uppercase;
+    color: white;
+    text-align: center;
+    text-decoration: none;
+  }
+
+  .textcontainer {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+}