From 62355e154d1941ff09269f03c97dccb4cf396bde Mon Sep 17 00:00:00 2001
From: Manuel <manuel@pcln>
Date: Sun, 10 May 2026 16:24:36 +0200
Subject: [PATCH] feat: slower entrance animations for a more elegant feel

---
 src/styles/animations.css | 43 ++++++++++++++-------------------------
 1 file changed, 15 insertions(+), 28 deletions(-)

diff --git a/src/styles/animations.css b/src/styles/animations.css
index 80af275..1477ba5 100644
--- a/src/styles/animations.css
+++ b/src/styles/animations.css
@@ -7,15 +7,10 @@
 
 .reveal {
   opacity: 0;
-  transform: translateY(28px);
+  transform: translateY(32px);
   transition:
-    opacity  800ms cubic-bezier(0.22, 1, 0.36, 1),
-    transform 800ms cubic-bezier(0.22, 1, 0.36, 1);
-}
-
-.reveal.visible {
-  opacity: 1;
-  transform: translateY(0);
+    opacity  1200ms cubic-bezier(0.22, 1, 0.36, 1),
+    transform 1200ms cubic-bezier(0.22, 1, 0.36, 1);
 }
 
 /* stagger via CSS variable set by JS */
@@ -24,14 +19,10 @@
 /* Variante horizontal (desde izquierda) */
 .reveal-left {
   opacity: 0;
-  transform: translateX(-32px);
+  transform: translateX(-40px);
   transition:
-    opacity  900ms cubic-bezier(0.22, 1, 0.36, 1),
-    transform 900ms cubic-bezier(0.22, 1, 0.36, 1);
-}
-.reveal-left.visible {
-  opacity: 1;
-  transform: translateX(0);
+    opacity  1300ms cubic-bezier(0.22, 1, 0.36, 1),
+    transform 1300ms cubic-bezier(0.22, 1, 0.36, 1);
 }
 
 /* Variante scale (para imágenes de galería) */
@@ -39,12 +30,8 @@
   opacity: 0;
   transform: scale(0.94);
   transition:
-    opacity  700ms cubic-bezier(0.22, 1, 0.36, 1),
-    transform 700ms cubic-bezier(0.22, 1, 0.36, 1);
-}
-.reveal-scale.visible {
-  opacity: 1;
-  transform: scale(1);
+    opacity  1100ms cubic-bezier(0.22, 1, 0.36, 1),
+    transform 1100ms cubic-bezier(0.22, 1, 0.36, 1);
 }
 
 /* ─── HERO ENTRANCE ──────────────────────────── */
@@ -52,8 +39,8 @@
 @keyframes mnq-rise {
   from {
     opacity: 0;
-    transform: translateY(36px);
-    filter: blur(4px);
+    transform: translateY(40px);
+    filter: blur(6px);
   }
   to {
     opacity: 1;
@@ -63,12 +50,12 @@
 }
 
 .hero-enter {
-  animation: mnq-rise 1000ms cubic-bezier(0.22, 1, 0.36, 1) both;
+  animation: mnq-rise 1200ms cubic-bezier(0.22, 1, 0.36, 1) both;
 }
-.hero-enter-1 { animation-delay: 200ms; }
-.hero-enter-2 { animation-delay: 500ms; }
-.hero-enter-3 { animation-delay: 780ms; }
-.hero-enter-4 { animation-delay: 1050ms; }
+.hero-enter-1 { animation-delay: 300ms; }
+.hero-enter-2 { animation-delay: 700ms; }
+.hero-enter-3 { animation-delay: 1100ms; }
+.hero-enter-4 { animation-delay: 1500ms; }
 
 /* ─── GOLD SHIMMER (botones) ─────────────────── */