---

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Визитка-мультиссылка</title>
    <!-- Подключение FontAwesome для иконок в футере -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="card">
        <!-- Шапка с аватаром и описанием -->
        <header>
            <img src="https://via.placeholder.com/120" alt="Аватар" class="avatar">
            <h1>Иван Иванов</h1>
            <p class="bio">Frontend-разработчик & UI/UX дизайнер. Создаю современные веб-сайты.</p>
        </header>

        <!-- Основной блок со ссылками -->
        <main>
            <section class="links">
                <a href="#" class="btn">Портфолио</a>
                <a href="#" class="btn">Telegram-канал</a>
                <a href="#" class="btn">Заказать проект</a>
                <a href="#" class="btn">Мой GitHub</a>
            </section>
        </main>

        <!-- Подвал с иконками соцсетей -->
        <footer>
            <div class="socials">
                <a href="#"><i class="fab fa-telegram"></i></a>
                <a href="#"><i class="fab fa-vk"></i></a>
                <a href="#"><i class="fab fa-github"></i></a>
            </div>
        </footer>
    </div>
</body>
</html>