---

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Меню доставки еды</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>

    <!-- Шапка сайта -->
    <header class="header">
        <div class="logo">Вкусная Еда</div>
        <div class="search-stub">Поиск блюд...</div>
    </header>

    <!-- Контейнер каталога -->
    <main class="catalog">
        
        <!-- Карточка 1 -->
        <div class="card">
            <img src="https://placehold.co/300x200/orange/white?text=Spicy+Pizza" alt="Пицца" class="card-img">
            <div class="card-content">
                <span class="badge spicy">Острое</span>
                <h2 class="card-title">Пицца Дьябола</h2>
                <div class="card-info">
                    <span>450 г</span> • <span>1100 ккал</span>
                </div>
                <div class="card-price">650 ₽</div>
                <!-- Кнопка прижата к низу благодаря margin-top: auto в CSS -->
                <button class="add-btn">В корзину</button>
            </div>
        </div>

        <!-- Карточка 2 -->
        <div class="card">
            <img src="https://placehold.co/300x200/green/white?text=Vegan+Salad" alt="Салат" class="card-img">
            <div class="card-content">
                <span class="badge vegan">Веган</span>
                <h2 class="card-title">Салат Летний</h2>
                <div class="card-info">
                    <span>250 г</span> • <span>150 ккал</span>
                </div>
                <div class="card-price">320 ₽</div>
                <button class="add-btn">В корзину</button>
            </div>
        </div>

        <!-- Карточка 3 -->
        <div class="card">
            <img src="https://placehold.co/300x200/brown/white?text=Burger" alt="Бургер" class="card-img">
            <div class="card-content">
                <h2 class="card-title">Бургер Классика</h2>
                <div class="card-info">
                    <span>350 г</span> • <span>800 ккал</span>
                </div>
                <div class="card-price">450 ₽</div>
                <button class="add-btn">В корзину</button>
            </div>
        </div>

        <!-- Карточка 4 -->
        <div class="card">
            <img src="https://placehold.co/300x200/red/white?text=Spicy+Wings" alt="Крылышки" class="card-img">
            <div class="card-content">
                <span class="badge spicy">Острое</span>
                <h2 class="card-title">Куриные Крылышки</h2>
                <div class="card-info">
                    <span>300 г</span> • <span>600 ккал</span>
                </div>
                <div class="card-price">380 ₽</div>
                <button class="add-btn">В корзину</button>
            </div>
        </div>

         <!-- Карточка 5 -->
         <div class="card">
            <img src="https://placehold.co/300x200/lightgreen/black?text=Vegan+Soup" alt="Суп" class="card-img">
            <div class="card-content">
                <span class="badge vegan">Веган</span>
                <h2 class="card-title">Грибной Крем-суп</h2>
                <div class="card-info">
                    <span>300 г</span> • <span>200 ккал</span>
                </div>
                <div class="card-price">280 ₽</div>
                <button class="add-btn">В корзину</button>
            </div>
        </div>

        <!-- Карточка 6 -->
        <div class="card">
            <img src="https://placehold.co/300x200/gold/black?text=Pasta" alt="Паста" class="card-img">
            <div class="card-content">
                <h2 class="card-title">Паста Карбонара</h2>
                <div class="card-info">
                    <span>400 г</span> • <span>750 ккал</span>
                </div>
                <div class="card-price">550 ₽</div>
                <button class="add-btn">В корзину</button>
            </div>
        </div>

    </main>

    <!-- Футер -->
    <footer class="footer">
        <p>© 2026 Вкусная Еда. Все права защищены.</p>
    </footer>

</body>
</html>