Complete website optimization: Color scheme standardization and hero page enhancement

- STANDARDIZED COLOR SCHEMES: Unified all service pages to use consistent purple theme (#6d28d9)
  - Removed theme-specific body classes from automation-flows.html and agentic-ai.html
  - Removed inline CSS color overrides from machine-learning.html, generative-ai.html, and data-analysis.html
  - Updated 15+ instances of hardcoded border colors to use rgba(var(--primary-color-rgb), 0.3)
  - Updated 5+ hover effects to use rgba(var(--primary-color-rgb), 0.4) for consistent glow colors
  - All service pages now maintain visual consistency with the main website

- ENHANCED HERO PAGE: Improved data node scattering for better organic distribution
  - Repositioned core service nodes (ML, AI, Analytics, Automation) for natural scatter pattern
  - Enhanced industry nodes positioning with organic right-side distribution
  - Improved strategic nodes placement across right quadrant for better visual balance
  - Added varied animation delays and floating patterns for different node groups
  - Implemented micro-positioning adjustments for more natural appearance
  - Created size variations and rotation effects for enhanced organic feel

- NEW FEATURES ADDED:
  - Enhanced CSS animations with varied floating patterns
  - Improved node interaction effects with staggered hover animations
  - Better responsive design for mobile devices
  - New documentation files for color standardization completion

- TECHNICAL IMPROVEMENTS:
  - Updated hero-animation.css with enhanced organic scatter positioning
  - Maintained all existing functionality while improving visual aesthetics
  - Ensured cross-browser compatibility and mobile responsiveness

js/main.js

@@ -0,0 +1,137 @@
+/**
+ * Main.js - Core interaction and animation functionality for Gyannetra website
+ */
+
+document.addEventListener('DOMContentLoaded', function() {
+    // Initialize all interactive components
+    initScrollAnimations();
+    initParallaxEffects();
+    initSectionTransitions();
+    initCursorEffects();
+    
+    // Remove page loader when everything is ready
+    setTimeout(() => {
+        const body = document.querySelector('body');
+        if (body) body.classList.add('loaded');
+    }, 300);
+});
+
+// Animate elements when they enter viewport
+function initScrollAnimations() {
+    const animatedElements = document.querySelectorAll('.exp-item, .section-heading, .hero-content, .btn-primary');
+    
+    // Create intersection observer
+    const observer = new IntersectionObserver((entries) => {
+        entries.forEach(entry => {
+            if (entry.isIntersecting) {
+                entry.target.classList.add('animated');
+                // Stop observing after animation is triggered
+                observer.unobserve(entry.target);
+            }
+        });
+    }, {
+        threshold: 0.2,
+        rootMargin: '0px 0px -10% 0px'
+    });
+    
+    // Observe all animated elements
+    animatedElements.forEach(element => {
+        observer.observe(element);
+        // Add base animation class
+        element.classList.add('animate-on-scroll');
+    });
+}
+
+// Parallax background effects
+function initParallaxEffects() {
+    const parallaxElements = document.querySelectorAll('.atmospheric-bg, .light-effect-top, .light-effect-bottom');
+    
+    window.addEventListener('scroll', () => {
+        const scrollY = window.scrollY;
+        
+        parallaxElements.forEach((element, index) => {
+            // Different parallax speeds based on element
+            const speed = index * 0.1 + 0.1;
+            element.style.transform = `translateY(${scrollY * speed}px)`;
+        });
+    });
+}
+
+// Smooth section transitions
+function initSectionTransitions() {
+    const sections = document.querySelectorAll('section');
+    
+    sections.forEach(section => {
+        section.classList.add('transition-ready');
+    });
+}
+
+// Custom cursor effects for interactive elements
+function initCursorEffects() {
+    const interactiveElements = document.querySelectorAll('a, button, .data-node, .tech-marquee-item');
+    const body = document.body;
+    
+    // Create custom cursor elements
+    const cursor = document.createElement('div');
+    cursor.className = 'custom-cursor';
+    body.appendChild(cursor);
+    
+    const cursorDot = document.createElement('div');
+    cursorDot.className = 'cursor-dot';
+    body.appendChild(cursorDot);
+    
+    // Update cursor position
+    document.addEventListener('mousemove', (e) => {
+        cursor.style.transform = `translate(${e.clientX}px, ${e.clientY}px)`;
+        cursorDot.style.transform = `translate(${e.clientX}px, ${e.clientY}px)`;
+    });
+    
+    // Hover effects
+    interactiveElements.forEach(element => {
+        element.addEventListener('mouseenter', () => {
+            cursor.classList.add('cursor-hover');
+            cursorDot.classList.add('cursor-hover');
+        });
+        
+        element.addEventListener('mouseleave', () => {
+            cursor.classList.remove('cursor-hover');
+            cursorDot.classList.remove('cursor-hover');
+        });
+    });
+}
+
+// Watch for page visibility to optimize performance
+document.addEventListener('visibilitychange', function() {
+    if (document.hidden) {
+        document.body.classList.add('page-hidden');
+    } else {
+        document.body.classList.remove('page-hidden');
+    }
+});
+
+// Add smooth scrolling to anchor links
+document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+    anchor.addEventListener('click', function (e) {
+        e.preventDefault();
+        
+        const targetId = this.getAttribute('href');
+        if (targetId === '#') return;
+        
+        const targetElement = document.querySelector(targetId);
+        if (targetElement) {
+            // Add animation class
+            targetElement.classList.add('section-highlighted');
+            
+            // Smooth scroll
+            targetElement.scrollIntoView({
+                behavior: 'smooth',
+                block: 'start'
+            });
+            
+            // Remove class after animation
+            setTimeout(() => {
+                targetElement.classList.remove('section-highlighted');
+            }, 2000);
+        }
+    });
+});