Премиальный промо-сайт швейцарской часовой мануфактуры

Эксклюзивный интерактивный лендинг, разработанный в эстетике dark luxury и цифрового минимализма. Главная цель проекта - передать философию медленной ручной сборки часов через безупречный UX/UI, сложные многоэтапные скролл-анимации и уникальную процедурную SVG-графику, работающую в реальном времени.

Что реализовано:
- Процедурная генерация SVG-часов в реальном времени: Все циферблаты на сайте созданы исключительно с помощью кода (Vanilla JS + SVG), без использования каких-либо растровых изображений. Главные часы в Hero-блоке синхронизируются с локальным временем пользователя, плавно отрисовывая движение каждой стрелки.
- Сложная интерактивная скролл-анимация (Exploded View): Секция с механизмом часов (Movement) использует закрепление экрана (pinning). Во время скролла пользователь буквально "разбирает" отрисованный в коде калибр часов на отдельные детали (шестерни, балансир, корпус), которые разлетаются по оси Y с появлением соответствующих подписей.
- Динамическое изменение цветовых тем (Theme Crossfade): Плавный переход между "темной" (Dark) и "светлой" (Paper) темами на лету во время прокрутки страницы. Реализовано через манипуляцию CSS-переменными с помощью ScrollTrigger для создания бесшовного визуального опыта.
- Премиальные микроинтеракции и кастомный курсор: Собственный алгоритм курсора с магнитным кольцом, которое плавно следует за мышью (используя математику lerp) и расширяется при наведении на активные зоны. Интерактивная кнопка-орбита в секции Commission также мягко притягивается к курсору, добавляя интерфейсу физической тяжести.
- Атмосферный эффект пленочного зерна (Film Grain): Кастомный анимированный эффект шума, созданный через SVG-фильтр (fractalNoise), который накладывается поверх всего сайта через mix-blend-mode для создания дорогой "аналоговой" текстуры без потери производительности (FPS).
- Тематический прелоадер и скролл-индикатор: Экран загрузки и фиксированный индикатор прогресса прокрутки страницы стилизованы под минималистичные циферблаты часов с динамическими стрелками.
- Математическая анимация движущихся частей: Программно сгенерированные шестерни (gear paths) и балансирная пружина, которые имеют зацикленные CSS/GSAP анимации вращения и колебания, имитируя настоящий механический движение (18,000 полуволн в час).
- Web Accessibility и оптимизация: Код написан на чистом Vanilla JS. Внедрена проверка prefers-reduced-motion: для пользователей, которые отключают анимации в системе, сайт автоматически отключает GSAP и показывает сразу разобранную схему часов, оставаясь полностью функциональным.

Технологии:
HTML5, CSS3 (Advanced CSS Variables), JavaScript (Vanilla ES6+, Procedural SVG Generation), GSAP (GreenSock), ScrollTrigger, SVG Filters/Animations.