iterate

next/components/ParVaguesHeader.js

@@ -32,16 +32,17 @@ export default function ParVaguesHeader({ eventName = null, title = null }) {
   
   return (
     <header className="sticky top-0 left-0 w-full z-50 bg-black/80 backdrop-blur-md border-b border-[#d900ff]/20">
-      <div className={`${styles.neonGradient} opacity-5`}></div>
-      <div className="max-w-6xl mx-auto px-4 py-3 flex justify-between items-center relative">
-        <div className="flex items-center">
+      <div className={`${styles.neonGradient} opacity-5 absolute inset-0`}></div>
+      <div className="max-w-6xl mx-auto px-4 py-3 flex items-center justify-between">
+        {/* Logo and Title with Navigation */}
+        <div className="flex items-center justify-between w-full">
           <Link href="/parvagues" className="flex items-center group">
-            <div className="h-10 w-auto relative">
+            <div className="h-10 w-10 relative flex-shrink-0">
               <Image 
-                src="/images/parvagues/logo_transparent.png" 
+                src="/images/parvagues/logo.png" 
                 alt="ParVagues Logo" 
-                width={200}
-                height={200}
+                width={48}
+                height={48}
                 className="object-contain transition-all duration-300 group-hover:filter group-hover:drop-shadow-[0_0_8px_rgba(217,0,255,0.7)]" 
               />
             </div>
@@ -49,7 +50,7 @@ export default function ParVaguesHeader({ eventName = null, title = null }) {
             <div className="overflow-hidden ml-2">
               <span 
                 className={`text-white font-bold transition-all duration-500 ${
-                  showInHeader ? 'opacity-100 translate-y-0' : 'opacity-0 -translate-y-8'
+                  showInHeader || !isHome ? 'opacity-100 translate-y-0' : 'opacity-0 -translate-y-8'
                 }`}
                 style={{ 
                   textShadow: '0 0 5px rgba(217, 0, 255, 0.7), 0 0 10px rgba(217, 0, 255, 0.5)',
@@ -60,10 +61,11 @@ export default function ParVaguesHeader({ eventName = null, title = null }) {
               </span>
             </div>
           </Link>
-        </div>
           
+          {/* Navigation and CTA */}
+          <div className="flex items-center space-x-6">
             {/* Navigation Links */}
-        <nav className="hidden md:flex items-center space-x-6 text-sm tracking-wider">
+            <nav className="flex items-center space-x-6 text-sm tracking-wider">
               <Link href="/parvagues#music" className="text-gray-300 hover:text-[#ff3d7b] transition-colors">
                 Music
               </Link>
@@ -76,13 +78,15 @@ export default function ParVaguesHeader({ eventName = null, title = null }) {
             </nav>
             
             {/* CTA button */}
-        <a 
+            <Link 
               href="/book"
-          className={`${styles.outlineButton} py-2 px-4 text-sm`}
+              className={`${styles.outlineButton} py-2 px-4 text-sm flex items-center whitespace-nowrap`}
             >
-          <FaEnvelope className="inline mr-2" />
-          Book
-        </a>
+              <FaEnvelope className="mr-2 flex-shrink-0" />
+              <span>Book</span>
+            </Link>
+          </div>
+        </div>
       </div>
     </header>
   );

next/styles/parvagues.module.css

@@ -56,8 +56,8 @@
 }
 
 .heroContent {
-  padding: 2rem 3rem;
-  max-width: 1400px;
+  /* max width should be 80% */
+  max-width: 80%;
   margin: 0 auto;
   width: 100%;
   min-height: 100vh;
@@ -553,3 +553,10 @@ AS MODULE CSS FORBIDS ROOT VARIABLES
   animation: shine 1.5s ease-in-out;
 }
 */
+
+#section1 > .h3 {
+  margin: 1em 0;
+  text-decoration-line: underline;
+  text-decoration-color: var(--neon-down);
+  text-decoration-thickness: 3px;
+}
\ No newline at end of file