refactor: add fixed topbar with logo, nav now sticky below topbar

public/index.html

@@ -31,11 +31,34 @@
       line-height: 1.7;
     }
 
+    /* Fixed topbar with logo */
+    .topbar {
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      background: #0C0A08;
+      padding: 0.6rem 1rem;
+      z-index: 200;
+      text-align: center;
+      box-shadow: 0 2px 12px rgba(0,0,0,0.5);
+    }
+
+    .topbar img {
+      max-width: 220px;
+      width: 100%;
+    }
+
+    /* Push content down so it's not hidden behind topbar */
+    .topbar-spacer {
+      height: 76px;
+    }
+
     /* Header / Hero */
     header {
       background: linear-gradient(135deg, var(--color-dark) 0%, var(--color-primary) 100%);
       color: var(--color-cream);
-      padding: 4rem 2rem 3rem;
+      padding: 3rem 2rem 2.5rem;
       text-align: center;
     }
 
@@ -70,7 +93,7 @@
     nav {
       background: var(--color-dark);
       position: sticky;
-      top: 0;
+      top: 76px;
       z-index: 100;
       box-shadow: 0 2px 8px rgba(0,0,0,0.3);
     }
@@ -441,9 +464,17 @@
 </head>
 <body>
 
+  <!-- Fixed topbar with logo -->
+  <div class="topbar">
+    <img src="/logo.jpg" alt="Ensamble Armadillos">
+  </div>
+
+  <!-- Spacer so content starts below fixed topbar -->
+  <div class="topbar-spacer"></div>
+
   <!-- Header -->
   <header>
-    <img src="/logo.jpg" alt="Ensamble Armadillos" style="max-width:280px; width:100%; margin-bottom:1.5rem; border-radius:4px;">
+    <h1>Ensamble Armadillos</h1>
     <p class="tagline">Sembrando Cultura, Cosechando Futuro</p>
     <span class="header-badge">Asociación cultural sin fines de lucro — en proceso de constitución como A.C.</span>
     <p style="margin-top:1rem; opacity:0.7; font-size:0.95rem;">Acapetahua, Chiapas, México</p>
@@ -685,7 +716,6 @@
 
   <!-- Footer -->
   <footer>
-    <img src="/logo.jpg" alt="Ensamble Armadillos" style="max-width:140px; width:100%; margin-bottom:1rem; border-radius:4px; opacity:0.7;">
     <div class="footer-title">Ensamble Armadillos</div>
     <div>Sembrando Cultura, Cosechando Futuro</div>
     <div style="margin-top:0.5rem; opacity:0.6;">Acapetahua, Chiapas, México</div>