script.js

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');
  });
});