Bob AI: Add animations across multiple sections: fade-in animations

src/app/page.tsx

@@ -227,29 +227,87 @@ export default function LandingPage() {
         .stagger-delay-3 { animation-delay: 0.3s; }
         .stagger-delay-4 { animation-delay: 0.4s; }
         .stagger-delay-5 { animation-delay: 0.5s; }
+        @keyframes fadeInUp {
+          from {
+            opacity: 0;
+            transform: translateY(30px);
+          }
+          to {
+            opacity: 1;
+            transform: translateY(0);
+          }
+        }
+        @keyframes slideInLeft {
+          from {
+            opacity: 0;
+            transform: translateX(-40px);
+          }
+          to {
+            opacity: 1;
+            transform: translateX(0);
+          }
+        }
+        @keyframes slideInRight {
+          from {
+            opacity: 0;
+            transform: translateX(40px);
+          }
+          to {
+            opacity: 1;
+            transform: translateX(0);
+          }
+        }
+        @keyframes scaleIn {
+          from {
+            opacity: 0;
+            transform: scale(0.95);
+          }
+          to {
+            opacity: 1;
+            transform: scale(1);
+          }
+        }
+        .fade-in-section {
+          animation: fadeInUp 0.8s ease-out forwards;
+          opacity: 0;
+        }
+        .slide-in-card {
+          animation: slideInLeft 0.6s ease-out forwards;
+          opacity: 0;
+        }
+        .scale-on-hover {
+          transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+        }
+        .scale-on-hover:hover {
+          transform: scale(1.05);
+        }
+        .card-stagger {
+          animation: slideInLeft 0.6s ease-out forwards;
+          opacity: 0;
+        }
       `}</style>
-      <div id="hero-section" data-section="hero-section" className="hero-parallax">
+      <div id="hero-section" data-section="hero-section" className="fade-in-section">
         <HeroOverlay
-          title="Ремісничі хлібобулочні вироби доставляються до вашого дверей"
-          description="Відчуйте тепло домашнього хліба, тістечок та десертів, виготовлених з любов'ю за допомогою перевірених часом технік та найкращих інгредієнтів. Кожен укус розповідає історію традиції та пристрасті."
-          tag="Свіжий щоденний хліб"
+          title="Смакуйте свіжість кожного дня"
+          description="Наші ремісничі хлібобулочні вироби готуються з найкращих інгредієнтів та традиційних рецептів. Від хрустких батонів до м'яких тістечок - кожен продукт створений з любов'ю для вас."
+          tag="Свіжий хліб щодня"
           tagIcon={Sparkles}
           tagAnimation="slide-up"
-           buttons={[
-             { text: "Переглянути наше меню", href: "#products-section" },
-             { text: "Відвідайте наш магазин", href: "#about-section" }
-           ]}
+          buttons={[
+            { text: "Замовити зараз", href: "#products-section", dataWebildId: "hero_overlay_order_btn" },
+            { text: "Дізнатися більше", href: "#about-section", dataWebildId: "hero_overlay_learn_btn" }
+          ]}
           buttonAnimation="slide-up"
-          imageSrc="https://img.b2bpic.net/free-photo/bakery-atmospheric-photo_1321-4640.jpg"
-          imageAlt="Теплий, рустикальний інтер'єр пекарні зі свіжими тістечками на виставці"
+          imageSrc="https://img.b2bpic.net/free-photo/abstract-luxury-gradient-blue-background_53876-120942.jpg"
+          imageAlt="Свіжий хліб Теплої Скоринки Пекарні"
           textPosition="bottom-left"
           showDimOverlay={true}
           showBlur={true}
-          ariaLabel="Ласкаво просимо до нашої затишної пекарні з ремісничими хлібобулочними виробами"
+          ariaLabel="Ласкаво просимо до Теплої Скоринки Пекарні"
         />
       </div>
 
-      <div id="about-section" data-section="about-section" className="fade-in-up testimonial-card" style={{ animation: 'fadeInUp 0.8s ease-out' }}>
+       <div id="about-section" data-section="about-section" className="fade-in-section testimonial-card">
         <TestimonialAboutCard
           tag="Наша історія"
           tagIcon={Sparkles}