Create script.js

script.js

@@ -0,0 +1,61 @@
+document.addEventListener('DOMContentLoaded', function () {
+  // Smooth scrolling for anchor links
+  document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+    anchor.addEventListener('click', function (e) {
+      e.preventDefault();
+      const targetId = this.getAttribute('href').substring(1); // Extract the target ID
+      const target = document.getElementById(targetId);
+      if (target) {
+        target.scrollIntoView({
+          behavior: 'smooth',
+          block: 'start'
+        });
+      }
+    });
+  });
+
+  // Add animation on scroll for service cards
+  const observer = new IntersectionObserver((entries) => {
+    entries.forEach(entry => {
+      if (entry.isIntersecting) {
+        entry.target.style.opacity = '1';
+        entry.target.style.transform = 'translateY(0)';
+      }
+    });
+  }, {
+    threshold: 0.1
+  });
+
+  document.querySelectorAll('.service-card').forEach(card => {
+    card.style.opacity = '0';
+    card.style.transform = 'translateY(20px)';
+    card.style.transition = 'opacity 0.5s ease, transform 0.5s ease';
+    observer.observe(card);
+  });
+
+  // Hero text fade-in animation
+  const heroTitle = document.querySelector('.hero h1');
+  const heroParagraph = document.querySelector('.hero p');
+
+  heroTitle.style.opacity = '0';
+  heroParagraph.style.opacity = '0';
+  heroTitle.style.transform = 'translateY(20px)';
+  heroParagraph.style.transform = 'translateY(20px)';
+
+  setTimeout(() => {
+    heroTitle.style.transition = 'opacity 1s ease, transform 1s ease';
+    heroParagraph.style.transition = 'opacity 1s ease 0.5s, transform 1s ease 0.5s';
+    heroTitle.style.opacity = '1';
+    heroTitle.style.transform = 'translateY(0)';
+    heroParagraph.style.opacity = '1';
+    heroParagraph.style.transform = 'translateY(0)';
+  }, 500); // Delay to allow page load
+
+  // Dark mode toggle functionality
+  const darkModeToggle = document.getElementById('dark-mode-toggle');
+
+  darkModeToggle.addEventListener('click', function (e) {
+    e.preventDefault();
+    document.body.classList.toggle('dark-mode');
+  });
+});