diff --git a/index.php b/index.php
index 9188e5f..ae3099f 100644
--- a/index.php
+++ b/index.php
@@ -731,12 +731,7 @@ $facebook_link = "https://www.facebook.com/profile.php?id=61587890927489";
         </section>
 
 
-        <!-- Right Section: Featured Image -->
-        <section class="image-section">
-            <div class="featured-img-container">
-                <img src="<?= htmlspecialchars($projectImageUrl) ?>" alt="Featured Image">
-            </div>
-        </section>
+
     </div>
 
     <!-- Floating Social Links -->
@@ -776,91 +771,93 @@ $facebook_link = "https://www.facebook.com/profile.php?id=61587890927489";
             source.connect(analyzer);
             analyzer.connect(audioCtx.destination);
             
-            analyzer.fftSize = 128;
+            analyzer.fftSize = 256;
             const bufferLength = analyzer.frequencyBinCount;
             const dataArray = new Uint8Array(bufferLength);
 
-            canvas.width = canvas.offsetWidth;
-            canvas.height = canvas.offsetHeight;
-
-        let hue = 0;
-        function draw() {
-            if (audio.paused) {
-                document.documentElement.style.setProperty('--dynamic-glow', 'rgba(56, 189, 248, 0.7)');
-                document.documentElement.style.setProperty('--dynamic-glow-dim', 'rgba(56, 189, 248, 0.4)');
-                document.documentElement.style.setProperty('--shake-offset-x', '0px');
-                document.documentElement.style.setProperty('--shake-offset-y', '0px');
-                document.documentElement.style.setProperty('--bass-flash-opacity', '0');
-                return;
+            function resizeCanvas() {
+                canvas.width = canvas.offsetWidth * window.devicePixelRatio;
+                canvas.height = canvas.offsetHeight * window.devicePixelRatio;
+                ctx.scale(window.devicePixelRatio, window.devicePixelRatio);
             }
-            animationId = requestAnimationFrame(draw);
-            analyzer.getByteFrequencyData(dataArray);
+            resizeCanvas();
+            window.addEventListener('resize', resizeCanvas);
 
-            ctx.clearRect(0, 0, canvas.width, canvas.height);
+            let hue = 0;
+            function draw() {
+                if (audio.paused) {
+                    ctx.clearRect(0, 0, canvas.width, canvas.height);
+                    document.documentElement.style.setProperty('--dynamic-glow', 'rgba(56, 189, 248, 0.7)');
+                    document.documentElement.style.setProperty('--dynamic-glow-dim', 'rgba(56, 189, 248, 0.4)');
+                    document.documentElement.style.setProperty('--shake-offset-x', '0px');
+                    document.documentElement.style.setProperty('--shake-offset-y', '0px');
+                    document.documentElement.style.setProperty('--bass-flash-opacity', '0');
+                    return;
+                }
+                animationId = requestAnimationFrame(draw);
+                analyzer.getByteFrequencyData(dataArray);
 
-            const barWidth = (canvas.width / bufferLength) * 2.5;
-            let barHeight;
-            let x = 0;
+                ctx.clearRect(0, 0, canvas.width, canvas.height);
 
-            // Calcular intensidad promedio para reactividad
-            let sum = 0;
-            for(let i=0; i<bufferLength; i++) sum += dataArray[i];
-            const average = sum / bufferLength;
+                const barCount = bufferLength / 1.5;
+                const logicalWidth = canvas.width / window.devicePixelRatio;
+                const logicalHeight = canvas.height / window.devicePixelRatio;
+                const barWidth = (logicalWidth / barCount) * 0.8;
+                let x = logicalWidth / 2;
+                let xLeft = logicalWidth / 2;
 
-            // Detectar bajos para el efecto de sacudida (shake) y flash
-            const bassRange = 4;
-            let bassSum = 0;
-            for(let i=0; i<bassRange; i++) bassSum += dataArray[i];
-            const bassAverage = bassSum / bassRange;
+                let sum = 0;
+                for(let i=0; i<bufferLength; i++) sum += dataArray[i];
+                const average = sum / bufferLength;
 
-            if (bassAverage > 210) {
-                const intensity = (bassAverage - 210) / 45;
-                const shakeX = (Math.random() - 0.5) * 12 * intensity;
-                const shakeY = (Math.random() - 0.5) * 12 * intensity;
-                document.documentElement.style.setProperty('--shake-offset-x', `${shakeX}px`);
-                document.documentElement.style.setProperty('--shake-offset-y', `${shakeY}px`);
-                document.documentElement.style.setProperty('--bass-flash-opacity', (intensity * 0.25).toString());
-            } else {
-                document.documentElement.style.setProperty('--shake-offset-x', '0px');
-                document.documentElement.style.setProperty('--shake-offset-y', '0px');
-                document.documentElement.style.setProperty('--bass-flash-opacity', '0');
-            }
-            
-            // Rotar el color base según el tiempo y la intensidad
-            hue = (hue + 0.5 + (average / 50)) % 360;
-            
-            // Actualizar el resplandor de la imagen con el color actual y reactividad
-            const glowOpacity = 0.4 + (average / 255) * 0.5;
-            const currentGlow = `hsla(${hue}, 80%, 60%, ${glowOpacity})`;
-            const currentGlowDim = `hsla(${hue}, 80%, 60%, ${glowOpacity * 0.5})`;
-            
-            document.documentElement.style.setProperty('--dynamic-glow', currentGlow);
-            document.documentElement.style.setProperty('--dynamic-glow-dim', currentGlowDim);
+                const bassRange = 4;
+                let bassSum = 0;
+                for(let i=0; i<bassRange; i++) bassSum += dataArray[i];
+                const bassAverage = bassSum / bassRange;
 
-            for (let i = 0; i < bufferLength; i++) {
-                barHeight = (dataArray[i] / 255) * canvas.height;
+                if (bassAverage > 210) {
+                    const intensity = (bassAverage - 210) / 45;
+                    const shakeX = (Math.random() - 0.5) * 12 * intensity;
+                    const shakeY = (Math.random() - 0.5) * 12 * intensity;
+                    document.documentElement.style.setProperty('--shake-offset-x', `${shakeX}px`);
+                    document.documentElement.style.setProperty('--shake-offset-y', `${shakeY}px`);
+                    document.documentElement.style.setProperty('--bass-flash-opacity', (intensity * 0.25).toString());
+                } else {
+                    document.documentElement.style.setProperty('--shake-offset-x', '0px');
+                    document.documentElement.style.setProperty('--shake-offset-y', '0px');
+                    document.documentElement.style.setProperty('--bass-flash-opacity', '0');
+                }
                 
-                // Color dinámico basado en hue, índice de barra e intensidad
-                const barHue = (hue + (i * 2)) % 360;
-                const saturation = 80 + (average / 255) * 20;
-                const lightness = 50 + (dataArray[i] / 255) * 25;
+                hue = (hue + 0.5 + (average / 50)) % 360;
+                const glowOpacity = 0.4 + (average / 255) * 0.5;
+                const currentGlow = `hsla(${hue}, 80%, 60%, ${glowOpacity})`;
+                const currentGlowDim = `hsla(${hue}, 80%, 60%, ${glowOpacity * 0.5})`;
+                
+                document.documentElement.style.setProperty('--dynamic-glow', currentGlow);
+                document.documentElement.style.setProperty('--dynamic-glow-dim', currentGlowDim);
 
-                const gradient = ctx.createLinearGradient(0, canvas.height, 0, canvas.height - barHeight);
-                gradient.addColorStop(0, `hsl(${barHue}, ${saturation}%, ${lightness}%)`);
-                gradient.addColorStop(1, `hsl(${(barHue + 40) % 360}, ${saturation}%, ${lightness + 10}%)`);
+                for (let i = 0; i < barCount; i++) {
+                    const barHeight = (dataArray[i] / 255) * logicalHeight;
+                    const barHue = (hue + (i * 3)) % 360;
+                    const saturation = 80 + (average / 255) * 20;
+                    const lightness = 50 + (dataArray[i] / 255) * 25;
 
-                ctx.fillStyle = gradient;
-                ctx.shadowBlur = 15;
-                ctx.shadowColor = `hsla(${barHue}, ${saturation}%, ${lightness}%, 0.5)`;
+                    const gradient = ctx.createLinearGradient(0, logicalHeight, 0, logicalHeight - barHeight);
+                    gradient.addColorStop(0, `hsla(${barHue}, ${saturation}%, ${lightness}%, 0.2)`);
+                    gradient.addColorStop(0.5, `hsla(${barHue}, ${saturation}%, ${lightness}%, 0.8)`);
+                    gradient.addColorStop(1, `hsla(${(barHue + 40) % 360}, ${saturation}%, ${lightness + 10}%, 1)`);
 
-                // Rounded bars
-                ctx.beginPath();
-                ctx.roundRect(x, canvas.height - barHeight, barWidth - 3, barHeight, 4);
-                ctx.fill();
-
-                x += barWidth;
+                    ctx.fillStyle = gradient;
+                    ctx.beginPath();
+                    ctx.roundRect(x, logicalHeight - barHeight, barWidth, barHeight, 2);
+                    ctx.fill();
+                    ctx.beginPath();
+                    ctx.roundRect(xLeft - barWidth, logicalHeight - barHeight, barWidth, barHeight, 2);
+                    ctx.fill();
+                    x += barWidth + 2;
+                    xLeft -= barWidth + 2;
+                }
             }
-        }
             draw();
         }