site-4625f/script.js

(function() {
  'use strict';

  const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;

  // Mobile Navigation Toggle
  const navToggle = document.querySelector('.nav-toggle');
  const navLinks = document.querySelector('.nav-links');

  if (navToggle && navLinks) {
    navToggle.addEventListener('click', () => {
      const isExpanded = navToggle.getAttribute('aria-expanded') === 'true';
      navToggle.setAttribute('aria-expanded', !isExpanded);
      navLinks.classList.toggle('active');
    });

    navLinks.querySelectorAll('a').forEach(link => {
      link.addEventListener('click', () => {
        navToggle.setAttribute('aria-expanded', 'false');
        navLinks.classList.remove('active');
      });
    });

    document.addEventListener('click', (e) => {
      if (!navToggle.contains(e.target) && !navLinks.contains(e.target)) {
        navToggle.setAttribute('aria-expanded', 'false');
        navLinks.classList.remove('active');
      }
    });
  }

  // Reveal on Scroll
  const revealElements = document.querySelectorAll('.reveal');

  if (!prefersReducedMotion && revealElements.length > 0) {
    const revealObserver = new IntersectionObserver((entries) => {
      entries.forEach(entry => {
        if (entry.isIntersecting) {
          entry.target.classList.add('revealed');
          revealObserver.unobserve(entry.target);
        }
      });
    }, {
      threshold: 0.1,
      rootMargin: '0px 0px -50px 0px'
    });

    revealElements.forEach(el => revealObserver.observe(el));
  } else {
    revealElements.forEach(el => el.classList.add('revealed'));
  }

  // Pause blob animations when hero is out of view
  const heroBg = document.querySelector('.hero-bg');
  if (heroBg && !prefersReducedMotion) {
    const heroObserver = new IntersectionObserver((entries) => {
      entries.forEach(entry => {
        if (entry.isIntersecting) {
          entry.target.classList.add('in-view');
        } else {
          entry.target.classList.remove('in-view');
        }
      });
    }, {
      threshold: 0
    });

    heroObserver.observe(heroBg);
  } else if (heroBg) {
    heroBg.classList.add('in-view');
  }

  // Smooth scroll for anchor links
  document.querySelectorAll('a[href^="#"]').forEach(anchor => {
    anchor.addEventListener('click', function(e) {
      const href = this.getAttribute('href');
      if (href === '#') return;

      const target = document.querySelector(href);
      if (target) {
        e.preventDefault();
        
        const headerOffset = 80;
        const elementPosition = target.getBoundingClientRect().top;
        const offsetPosition = elementPosition + window.pageYOffset - headerOffset;

        if (prefersReducedMotion) {
          window.scrollTo(0, offsetPosition);
        } else {
          window.scrollTo({
            top: offsetPosition,
            behavior: 'smooth'
          });
        }
      }
    });
  });

  // Header shadow on scroll
  const header = document.querySelector('.site-header');
  
  if (header) {
    let ticking = false;
    
    window.addEventListener('scroll', () => {
      if (!ticking) {
        window.requestAnimationFrame(() => {
          if (window.pageYOffset > 100) {
            header.style.boxShadow = '0 4px 20px rgba(0, 0, 0, 0.08)';
          } else {
            header.style.boxShadow = 'none';
          }
          ticking = false;
        });
        ticking = true;
      }
    }, { passive: true });
  }

  // Form validation and submission
  const contactForm = document.querySelector('.contact-form');
  
  if (contactForm) {
    const formStatus = contactForm.querySelector('.form-status');
    
    // Email validation regex
    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
    
    // Clear error state on input
    contactForm.querySelectorAll('input, select, textarea').forEach(field => {
      field.addEventListener('input', () => {
        const group = field.closest('.form-group');
        if (group) {
          group.classList.remove('has-error');
          field.classList.remove('error');
        }
      });
    });
    
    contactForm.addEventListener('submit', function(e) {
      e.preventDefault();
      
      // Reset status
      formStatus.className = 'form-status';
      formStatus.textContent = '';
      
      // Validate fields
      const fields = {
        name: { el: this.querySelector('#name'), validate: v => v.trim().length > 0 },
        email: { el: this.querySelector('#email'), validate: v => emailRegex.test(v.trim()) },
        subject: { el: this.querySelector('#subject'), validate: v => v.trim().length > 0 },
        message: { el: this.querySelector('#message'), validate: v => v.trim().length > 0 }
      };
      
      let isValid = true;
      let firstError = null;
      
      Object.values(fields).forEach(({ el, validate }) => {
        const group = el.closest('.form-group');
        const valid = validate(el.value);
        
        if (!valid) {
          isValid = false;
          group.classList.add('has-error');
          el.classList.add('error');
          if (!firstError) firstError = el;
        } else {
          group.classList.remove('has-error');
          el.classList.remove('error');
        }
      });
      
      if (!isValid) {
        formStatus.className = 'form-status error';
        formStatus.textContent = 'נא למלא את כל השדות הנדרשים';
        if (firstError) firstError.focus();
        return;
      }
      
      const submitBtn = this.querySelector('button[type="submit"]');
      const originalHTML = submitBtn.innerHTML;
      
      submitBtn.innerHTML = '<span>שולח...</span>';
      submitBtn.disabled = true;
      
      // Simulate form submission
      setTimeout(() => {
        formStatus.className = 'form-status success';
        formStatus.textContent = 'ההודעה נשלחה בהצלחה! נחזור אליך בהקדם.';
        
        submitBtn.innerHTML = '<span>נשלח בהצלחה ✓</span>';
        submitBtn.style.background = 'var(--teal)';
        
        setTimeout(() => {
          submitBtn.innerHTML = originalHTML;
          submitBtn.style.background = '';
          submitBtn.disabled = false;
          contactForm.reset();
          
          // Clear success message after a bit
          setTimeout(() => {
            formStatus.className = 'form-status';
            formStatus.textContent = '';
          }, 3000);
        }, 2000);
      }, 1500);
    });
  }

  // FAQ - native details/summary, no custom animation that fights browser
  // The CSS handles the icon rotation; no JS override needed

})();