Adding animations

src/components/AboutSection.tsx

@@ -13,7 +13,7 @@ const AboutSection = () => (
         <motion.div
           initial={{ opacity: 0, x: -40 }}
           whileInView={{ opacity: 1, x: 0 }}
-          viewport={{ once: true }}
+          viewport={{ once: false, amount: 0.15 }}
           transition={{ duration: 0.6 }}
         >
           <img
@@ -27,7 +27,7 @@ const AboutSection = () => (
         <motion.div
           initial={{ opacity: 0, x: 40 }}
           whileInView={{ opacity: 1, x: 0 }}
-          viewport={{ once: true }}
+          viewport={{ once: false, amount: 0.15 }}
           transition={{ duration: 0.6 }}
         >
           <h2 className="font-display text-4xl md:text-5xl font-bold mb-6 text-gradient">

src/components/BookingSection.tsx

@@ -173,7 +173,7 @@ const BookingSection = () => {
         <motion.div
           initial={{ opacity: 0, y: 20 }}
           whileInView={{ opacity: 1, y: 0 }}
-          viewport={{ once: true }}
+          viewport={{ once: false, amount: 0.15 }}
           className="text-center mb-10"
         >
           <h2 className="font-display text-4xl md:text-5xl font-bold text-gradient mb-4">
@@ -187,7 +187,7 @@ const BookingSection = () => {
         <motion.form
           initial={{ opacity: 0, y: 30 }}
           whileInView={{ opacity: 1, y: 0 }}
-          viewport={{ once: true }}
+          viewport={{ once: false, amount: 0.15 }}
           onSubmit={handleSubmit}
           className="bg-card rounded-2xl p-6 md:p-10 shadow-elevated space-y-5"
         >

src/components/FooterSection.tsx

@@ -2,9 +2,16 @@ import { ABOUT_ORG, FOOTER } from "@/data/event-data";
 import { Instagram, Facebook, Youtube, Mail } from "lucide-react";
 import hacecalor from "@/assets/hacecalor.png";
 import activat from "@/assets/activat.png";
+import { motion } from "framer-motion";
 
 const FooterSection = () => (
-  <footer className="bg-foreground text-primary-foreground">
+  <motion.footer 
+    initial={{ opacity: 0, y: 30 }}
+    whileInView={{ opacity: 1, y: 0 }}
+    viewport={{ once: false, amount: 0.15 }}
+    transition={{ duration: 0.6 }}
+    className="bg-foreground text-primary-foreground"
+  >
     <div className="container mx-auto px-4 py-12">
       <div className="grid md:grid-cols-3 gap-8 mb-8">
         {/* Brand */}
@@ -58,7 +65,7 @@ const FooterSection = () => (
         <p className="text-sm text-primary-foreground/50">{FOOTER.copyright}</p>
       </div>
     </div>
-  </footer>
+  </motion.footer>
 );
 
 export default FooterSection;

src/components/GallerySection.tsx

@@ -8,7 +8,7 @@ const GallerySection = () => (
       <motion.div
         initial={{ opacity: 0, y: 20 }}
         whileInView={{ opacity: 1, y: 0 }}
-        viewport={{ once: true }}
+        viewport={{ once: false, amount: 0.15 }}
         className="text-center mb-12"
       >
         <h2 className="font-display text-4xl md:text-5xl font-bold text-gradient mb-4">
@@ -22,7 +22,7 @@ const GallerySection = () => (
             key={i}
             initial={{ opacity: 0, scale: 0.9 }}
             whileInView={{ opacity: 1, scale: 1 }}
-            viewport={{ once: true }}
+            viewport={{ once: false, amount: 0.15 }}
             transition={{ delay: i * 0.08 }}
             className="aspect-square rounded-xl overflow-hidden bg-muted flex items-center justify-center"
           >

src/components/HotelSection.tsx

@@ -9,7 +9,7 @@ const HotelSection = () => (
       <motion.div
         initial={{ opacity: 0, y: 20 }}
         whileInView={{ opacity: 1, y: 0 }}
-        viewport={{ once: true }}
+        viewport={{ once: false, amount: 0.15 }}
         className="text-center mb-12"
       >
         <h2 className="font-display text-4xl md:text-5xl font-bold text-gradient mb-4">
@@ -26,7 +26,7 @@ const HotelSection = () => (
             key={room.id}
             initial={{ opacity: 0, y: 30 }}
             whileInView={{ opacity: 1, y: 0 }}
-            viewport={{ once: true }}
+            viewport={{ once: false, amount: 0.15 }}
             transition={{ delay: i * 0.1 }}
             className="bg-background rounded-2xl overflow-hidden shadow-card hover:shadow-elevated transition-shadow"
           >

src/components/OrgSection.tsx

@@ -16,7 +16,7 @@ const OrgSection = () => (
         <motion.div
           initial={{ opacity: 0, y: 30 }}
           whileInView={{ opacity: 1, y: 0 }}
-          viewport={{ once: true }}
+          viewport={{ once: false, amount: 0.15 }}
           transition={{ duration: 0.6 }}
         >
           <h2 className="font-display text-4xl md:text-5xl font-bold mb-6 text-gradient">
@@ -69,7 +69,7 @@ const OrgSection = () => (
         <motion.div
           initial={{ opacity: 0, y: 30 }}
           whileInView={{ opacity: 1, y: 0 }}
-          viewport={{ once: true }}
+          viewport={{ once: false, amount: 0.15 }}
           transition={{ duration: 0.6, delay: 0.2 }}
         >
           <img

src/components/PracticalSection.tsx

@@ -8,7 +8,7 @@ const PracticalSection = () => (
       <motion.div
         initial={{ opacity: 0, y: 20 }}
         whileInView={{ opacity: 1, y: 0 }}
-        viewport={{ once: true }}
+        viewport={{ once: false, amount: 0.15 }}
         className="text-center mb-12"
       >
         <h2 className="font-display text-4xl md:text-5xl font-bold text-gradient mb-4">
@@ -21,7 +21,7 @@ const PracticalSection = () => (
         <motion.div
           initial={{ opacity: 0, x: -30 }}
           whileInView={{ opacity: 1, x: 0 }}
-          viewport={{ once: true }}
+          viewport={{ once: false, amount: 0.15 }}
         >
           <div className="rounded-2xl overflow-hidden shadow-card mb-4 aspect-video">
             <iframe
@@ -48,7 +48,7 @@ const PracticalSection = () => (
         <motion.div
           initial={{ opacity: 0, x: 30 }}
           whileInView={{ opacity: 1, x: 0 }}
-          viewport={{ once: true }}
+          viewport={{ once: false, amount: 0.15 }}
           className="space-y-8"
         >
           {/* Aeropuertos */}

src/components/ScheduleSection.tsx

@@ -22,7 +22,7 @@ const ScheduleSection = () => (
       <motion.div
         initial={{ opacity: 0, y: 20 }}
         whileInView={{ opacity: 1, y: 0 }}
-        viewport={{ once: true }}
+        viewport={{ once: false, amount: 0.15 }}
         className="text-center mb-12"
       >
         <h2 className="font-display text-4xl md:text-5xl font-bold text-gradient mb-4">
@@ -39,7 +39,7 @@ const ScheduleSection = () => (
             key={day.day}
             initial={{ opacity: 0, y: 30 }}
             whileInView={{ opacity: 1, y: 0 }}
-            viewport={{ once: true }}
+            viewport={{ once: false, amount: 0.15 }}
             transition={{ delay: di * 0.15 }}
           >
             <h3 className="font-display text-xl font-bold text-foreground mb-6 pb-3 border-b-2 border-primary">

src/components/StaffSection.tsx

@@ -32,7 +32,7 @@ const StaffSection = () => {
         <motion.div
           initial={{ opacity: 0, y: 20 }}
           whileInView={{ opacity: 1, y: 0 }}
-          viewport={{ once: true }}
+          viewport={{ once: false, amount: 0.15 }}
           className="flex items-end justify-between gap-4 mb-6 md:mb-8"
         >
           <div className="text-center md:text-left w-full">
@@ -78,7 +78,7 @@ const StaffSection = () => {
                 key={member.id}
                 initial={{ opacity: 0, y: 30 }}
                 whileInView={{ opacity: 1, y: 0 }}
-                viewport={{ once: true }}
+                viewport={{ once: false, amount: 0.15 }}
                 transition={{ delay: i * 0.05 }}
                 data-staff-card
                 className="snap-start shrink-0 w-4/5 sm:w-1/2 lg:w-1/3 xl:w-1/4 bg-card rounded-2xl overflow-hidden shadow-card hover:shadow-elevated transition-shadow group"

update_animations.mjs

@@ -0,0 +1,15 @@
+import fs from 'fs';
+import path from 'path';
+
+const dir = 'src/components';
+const files = fs.readdirSync(dir).filter(f => f.endsWith('.tsx'));
+
+for (const file of files) {
+  const filePath = path.join(dir, file);
+  let content = fs.readFileSync(filePath, 'utf8');
+  if (content.includes('viewport={{ once: true }}')) {
+    content = content.replaceAll('viewport={{ once: true }}', 'viewport={{ once: false, amount: 0.15 }}');
+    fs.writeFileSync(filePath, content);
+    console.log(`Updated ${file}`);
+  }
+}