Changed around line 1
+ document.addEventListener('DOMContentLoaded', () => {
+ // Navigation menu toggle
+ const menuToggle = document.querySelector('.menu-toggle');
+ const navLinks = document.querySelector('.nav-links');
+
+ menuToggle?.addEventListener('click', () => {
+ navLinks.classList.toggle('active');
+ });
+
+ // Smooth scroll for navigation links
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+ anchor.addEventListener('click', function (e) {
+ e.preventDefault();
+ const target = document.querySelector(this.getAttribute('href'));
+ if (target) {
+ target.scrollIntoView({
+ behavior: 'smooth'
+ });
+ }
+ });
+ });
+
+ // Tab functionality
+ const tabs = document.querySelectorAll('.tab');
+ tabs.forEach(tab => {
+ tab.addEventListener('click', () => {
+ // Remove active class from all tabs
+ tabs.forEach(t => t.classList.remove('active'));
+ // Add active class to clicked tab
+ tab.classList.add('active');
+
+ // Show corresponding content
+ const tabContents = document.querySelectorAll('.tab-content');
+ tabContents.forEach(content => content.classList.remove('active'));
+ const targetContent = document.querySelector(`#${tab.dataset.tab}`);
+ if (targetContent) {
+ targetContent.classList.add('active');
+ }
+ });
+ });
+
+ // Intersection Observer for animations
+ const observer = new IntersectionObserver((entries) => {
+ entries.forEach(entry => {
+ if (entry.isIntersecting) {
+ entry.target.classList.add('visible');
+ }
+ });
+ }, {
+ threshold: 0.1
+ });
+
+ // Observe all section elements
+ document.querySelectorAll('section').forEach(section => {
+ observer.observe(section);
+ });
+ });