// NAV SCROLL EFFECT
const navbar = document.getElementById(‘navbar’);
window.addEventListener(‘scroll’, () => {
navbar.classList.toggle(‘scrolled’, window.scrollY > 40);
});
// HAMBURGER MENU
const hamburger = document.getElementById(‘hamburger’);
const navLinks = document.getElementById(‘navLinks’);
hamburger.addEventListener(‘click’, () => {
const open = navLinks.classList.toggle(‘open’);
hamburger.setAttribute(‘aria-expanded’, open);
if (!open) closeAllDropdowns();
});
// MOBILE ACCORDION DROPDOWNS
const MOBILE_BREAKPOINT = 900;
const dropdowns = document.querySelectorAll(‘.has-dropdown’);
function closeAllDropdowns() {
dropdowns.forEach(d => d.classList.remove(‘open’));
}
dropdowns.forEach(item => {
const toggle = item.querySelector(‘.dropdown-toggle’);
toggle.addEventListener(‘click’, (e) => {
// Only intercept as an accordion on mobile; let it navigate on desktop
if (window.innerWidth <= MOBILE_BREAKPOINT) {
e.preventDefault();
const isOpen = item.classList.contains('open');
closeAllDropdowns();
if (!isOpen) item.classList.add('open');
}
});
});
// Reset accordion state when resizing back to desktop
window.addEventListener('resize', () => {
if (window.innerWidth > MOBILE_BREAKPOINT) {
closeAllDropdowns();
navLinks.classList.remove(‘open’);
hamburger.setAttribute(‘aria-expanded’, ‘false’);
}
});
// CLOSE MENU ON LINK CLICK (only real navigation links, not accordion toggles)
navLinks.querySelectorAll(‘a:not(.dropdown-toggle)’).forEach(link => {
link.addEventListener(‘click’, () => {
navLinks.classList.remove(‘open’);
hamburger.setAttribute(‘aria-expanded’, ‘false’);
closeAllDropdowns();
});
});
// CONTACT FORM SUBMIT (PLACEHOLDER)
const form = document.getElementById(‘contactForm’);
if (form) {
form.addEventListener(‘submit’, (e) => {
e.preventDefault();
const btn = form.querySelector(‘button[type=”submit”]’);
btn.textContent = ‘Message Sent ✓’;
btn.style.background = ‘#22c55e’;
setTimeout(() => {
btn.textContent = ‘Send Message →’;
btn.style.background = ”;
form.reset();
}, 3000);
});
}
// SCROLL REVEAL (lightweight)
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, .product-card, .why-card, .case-card, .proc-step, .testimonial-card, .feature-tag, .about-left’).forEach(el => {
el.style.opacity = ‘0’;
el.style.transform = ‘translateY(20px)’;
el.style.transition = ‘opacity 0.5s ease, transform 0.5s ease’;
observer.observe(el);
});
