Atualização do cabeçalho e reposicionamento da logo

_includes/header.html

@@ -1,10 +1,8 @@
 <div class="header">
     <div class="branding">
-        <a href="/">
+        <a href="/" class="is-flex is-align-items-center">
-                <a class="mx-1 image is-48x48" href="https://alice.ufsj.edu.br/"><img src="/assets/logos/newAlice.png" width='100px'/></a>
+            <img src="/assets/logos/newAlice.png" class="mx-1" width="48px" alt="Alice Logo"/>
-                <div class="is-flex">
             <h1 class="brand-name">Alice.</h1>
-                </div>
         </a>
     </div>
     <div class="menu">
@@ -23,6 +21,9 @@
                  <a class="" href="/trens.html">
                     Trens
                 </a>
+                <a class="" href="/orquidea.html">
+                    Orquídea
+                </a>
        
     </div>    
 </div>

assets/css/atual.css

@@ -62,16 +62,24 @@ h1, h2, h3, h4, h5, h6 {
 
 /* ================================================================================================================================== */
 /* header section */
-.header{
+.header {
-    width: 100vw;
+    /* Posicionamento Fixo */
-    height: 8vh;
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 1; /* Garante que o header fique sempre na frente */
 
+    /* Cor e Dimensões */
+    background-color: var(--background-color); /* Usa a sua cor de fundo principal */
+    width: 100%;
+    height: 8vh;
+    padding: 0 30px;
+
+    /* Alinhamento (Flexbox) */
     display: flex;
     flex-direction: row;
+    align-items: center; /* Centraliza verticalmente o logo e o menu */
     justify-content: space-between;
-
-    padding: 0 30px;
-    position: fixed;
 }
 
 .branding{