Задача: Адаптивная верстка карточек конкурсов

Исходные данные

Имеется готовая веб-страница со списком конкурсов. В текущей версии конкурсы представлены в виде списка.

Цель работы

Визуально преобразовать страницу, представив каждый конкурс в виде отдельной карточки с адаптивным расположением.

Требования к верстке

• Для десктопных экранов: Карточки конкурсов должны отображаться по три в один ряд.
• Для мобильных устройств: Карточки должны перестраиваться в один вертикальный ряд, отображаясь одна под другой.
• Верстка должна быть полностью адаптивной и корректно отображаться на всех размерах экранов.

Визуальный образец

За основу визуального восприятия сетки карточек взят пример с другого сайта, где реализована аналогичная структура.

Технические детали

• Работа ведется с существующей HTML-структурой и стилями.
• Необходимо переработать или дополнить CSS для реализации адаптивной сетки карточек (например, с использованием Flexbox или CSS Grid).
• Существующий функционал и контент страницы должны быть полностью сохранены.

Результат

Готовая, адаптированная под все устройства страница с конкурсами, где каждый конкурс представлен в отдельной карточке.