ТЗ: Кликабельное колесо вкусов + фильтрация зерна (CoffeeChoice, WordPress)

1) Что нужно сделать
Сделать интерактивный блок на сайте: “Колесо вкусов”, где каждая область (сегмент) кликабельна и работает как фильтр для каталога карточек зерна/блендов.
2) Логика работы (десктоп)
• На странице: слева/сверху колесо, справа/ниже — список карточек зерна.
• Клик по сегменту колеса:
o сегмент подсвечивается (selected)
o добавляется в блок “Вы выбрали:” (список выбранных вкусов)
o карточки зерна фильтруются по выбранным вкусам
• Мультивыбор: можно выбрать несколько сегментов.
• Кнопки/действия:
o Снять выбор (по клику на выбранный вкус)
o Очистить всё
• Желательно: состояние фильтра сохраняется в URL (например ?flavors=chocolate,citrus), чтобы можно было поделиться ссылкой.
Режим фильтрации по умолчанию: AND (пересечение) — чем больше вкусов выбрано, тем уже выдача.
3) Карточки зерна (что показывать)
Каждая карточка минимальная:
• фото зерна/пачки
• название зерна/бленда
• название обжарщика
• основные нотки (списком/тегами)
• кнопка/ссылка “Перейти на сайт производителя” (внешняя ссылка)
4) Админка (добавление новых карточек)
Нужно, чтобы из админки WordPress можно было:
• добавлять/редактировать карточки зерна (как Custom Post Type или аналог)
• указывать:
o фото
o название
o обжарщик
o набор вкусовых тегов (которые связаны с сегментами колеса)
o внешнюю ссылку на производителя
5) Мобильная версия (адаптация обязательно)
Так как колесо целиком не влезает:
• На экране показывается половина колеса
• Есть кнопки управления «влево / вправо» (или свайп), чтобы прокручивать колесо по кругу
• Тап по видимому сегменту — выбирает вкус (как фильтр)
• Блок “Вы выбрали” — всегда доступен (чипсы/теги) + “Очистить”
• Карточки ниже (или кнопка “Показать результаты”, если нужно экономить место)
6) Техническое пожелание
• Реализация колеса: SVG (удобно делать кликабельные сегменты и подсветку) или другой вариант, который предложит исполнитель.
• Фильтрация: без перезагрузки страницы (AJAX/JS).