Сверстать макет на Bootstrap 5

Здравствуйте. Макет: https://www.figma.com/design/ODSPCVh7bDcsdujsoM8gQL/Редизайн-УралФильтрс-(Copy)?t=JEr5XFp0WqF7dPG7-0 Требования • Bootstrap 5 • Мобильное меню должно перестраиваться из основного (в коде не дублируются одни и те же ссылки) • Адаптивная вёрстка: в фигме макеты • Выпадающее меню на кнопке «Каталог» • SVG-иконки вставлять через <img src=”…”> • Фото товара по клику увеличиваются (Lightbox или что-то вроде того) • Слайдер картинкой • Кнопка каталог — по наведению раскрывается (иконка на кнопке меняется с бургер меню на крестик), по клику переход по ссылке (на мобильном тоже самое, но раскрытие по клику на стрелочку вниз). • Страница марки — тэги перед товарами изначально свёрнуты до 1 строки, по нажатию раскрываются, текст ссылки меняется на "свернуть модели" • Такой же механизм сворачивания/раскрытия на Страница марок, только там ограничено 5 строками • Города в шапке — выпадающий блок по наведению • Блок Карточка товара — сверстать по 12-колоночной сетке: Картинка = .col-lg-1 Артикул = .col-lg-2 Вид фильтра = .col-lg-2 Название = .col-lg-2 Товар в наличии = .col-lg-1 Количество = .col-lg-2 Кнопка = .col-lg-2 Если будут вопросы, готов ответить.