// Плавный скролл
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
    anchor.addEventListener('click', function(e) {
        e.preventDefault();
        const section = document.querySelector(this.getAttribute('href'));
        section.scrollIntoView({ behavior: 'smooth' });
    });
});

// Анимация при скролле
const observer = new IntersectionObserver((entries) => {
    entries.forEach(entry => {
        if (entry.isIntersecting) {
            entry.target.classList.add('visible');
        }
    });
}, { threshold: 0.2 });

document.querySelectorAll('.service-card').forEach(element => {
    observer.observe(element);
});

// Изменение шапки при скролле
window.addEventListener('scroll', () => {
    const header = document.querySelector('.header');
    if (window.scrollY > 50) {
        header.classList.add('scrolled');
    } else {
        header.classList.remove('scrolled');
    }
});

// Three.js 3D-анимация (плавающие сферы с контролем з-индекса)
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
const renderer = new THREE.WebGLRenderer({ alpha: true });
renderer.setSize(window.innerWidth, window.innerHeight);
document.getElementById('three-canvas').appendChild(renderer.domElement);

// Свет
const ambientLight = new THREE.AmbientLight(0xffffff, 0.6);
scene.add(ambientLight);
const pointLight = new THREE.PointLight(0xff6200, 1.2, 100);
pointLight.position.set(15, 15, 15);
scene.add(pointLight);

// Создание сфер
const spheres = [];
const sphereGeometry = new THREE.SphereGeometry(0.5, 32, 32);
const sphereMaterial = new THREE.MeshPhongMaterial({ color: 0xff6200, emissive: 0xff6200, emissiveIntensity: 0.6, transparent: true, opacity: 0.8 });

for (let i = 0; i < 15; i++) {
    const sphere = new THREE.Mesh(sphereGeometry, sphereMaterial);
    sphere.position.set(
        (Math.random() - 0.5) * 15,
        (Math.random() - 0.5) * 15 - 5, // Сдвигаем вниз, чтобы избежать текста
        (Math.random() - 0.5) * 15
    );
    sphere.userData = { velocity: new THREE.Vector3((Math.random() - 0.5) * 0.015, (Math.random() - 0.5) * 0.015, (Math.random() - 0.5) * 0.015) };
    scene.add(sphere);
    spheres.push(sphere);
}

camera.position.z = 12;
camera.position.y = 2; // Сдвигаем камеру вверх для избежания пересечения

// Анимация сфер с ограничением
function animate() {
    requestAnimationFrame(animate);

    spheres.forEach(sphere => {
        sphere.position.add(sphere.userData.velocity);

        // Ограничение движения
        if (Math.abs(sphere.position.x) > 10) sphere.userData.velocity.x *= -0.9;
        if (sphere.position.y > 5 || sphere.position.y < -10) sphere.userData.velocity.y *= -0.9;
        if (Math.abs(sphere.position.z) > 10) sphere.userData.velocity.z *= -0.9;

        sphere.rotation.x += 0.02;
        sphere.rotation.y += 0.02;
    });

    renderer.render(scene, camera);
}
animate();

// Адаптация канваса
window.addEventListener('resize', () => {
    camera.aspect = window.innerWidth / window.innerHeight;
    camera.updateProjectionMatrix();
    renderer.setSize(window.innerWidth, window.innerHeight);
});

// Корзина услуг
let cart = [];

document.querySelectorAll('.add-to-cart-btn').forEach(button => {
    button.addEventListener('click', () => {
        const serviceCard = button.closest('.service-card');
        const serviceName = serviceCard.getAttribute('data-service');
        if (!cart.includes(serviceName)) {
            cart.push(serviceName);
            alert(`${serviceName} добавлено в корзину!`);
        } else {
            alert(`${serviceName} уже в корзине!`);
        }
    });
});

document.querySelector('.calculate-btn').addEventListener('click', () => {
    if (cart.length > 0) {
        const message = `Здравствуйте! Интересуют следующие услуги: ${cart.join(', ')}. Прошу рассчитать стоимость.`;
        const whatsappUrl = `https://wa.me/996500398754?text=${encodeURIComponent(message)}`;
        window.open(whatsappUrl, '_blank');
        cart = []; // Очищаем корзину после отправки
    } else {
        alert('Пожалуйста, выберите хотя бы одну услугу!');
    }
});