<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css' rel='stylesheet'>
    <link rel="stylesheet" href="style.css">
    <title>StarTok</title>
</head>

<body>

    <nav class="navbar">
        <a href="#" class="navbar__logo">StarTok</a>
        <div class="navbar__notch">
            <p>Главная</p>
            <a href="https://t.me/Toughened_callbot">Подать заявку</a>
        </div>
        <div class="navbar__menu">
            <a href="#" class="navbar__menu-link">Главная</a>
            <a href="spisok.html" class="navbar__menu-link">Список ТикТокеров</a>
        </div>
    </nav>

    <h2 class="separator">О нас</h2>

    <div class="program">
        <div class="program__info">
            <h2 class="program__title">Чем мы занимаемся?</h2>
            <p class="program__description">
                Мы даем вам информацию о многих ТикТокерах/Блогерах которая вам может быть интересна.
                У нас есть и сами ответы на многие ваши вопросы от ТикТокеров/Блогеров, которые вы возможно бы хотели узнать.
            </p>

            <div class="program__details">
                <div class="program__details-duration">
                    <h3 class="program__label">Придумать.</h3>
                    <ul class="program__duration-list">
                        <li class="program__duration-item">текс 1</li>
                        <li class="program__duration-item">текс 2</li>
                        <li class="program__duration-item">текс 3</li>
                        <li class="program__duration-item">текс 4</li>
                    </ul>
                </div>
                <div class="program__details-format">
                    <h3 class="program__label">Придумать.</h3>
                    <ul class="program__format-list">
                        <li class="program__format-item">текс 1</li>
                        <li class="program__format-item">текс 2</li>
                        <li class="program__format-item">текс 3</li>
                        <li class="program__format-item">текс 4</li>
                    </ul>
                </div>
            </div>

        </div>

        <div class="program__image">
            <img src="assets/profile-1.jpg" alt="Program Image" class="program__image-photo">
        </div>

    </div>

    <h2 class="separator">ТикТокеры</h2>

    <div class="course-list">
        <div class="course-list__item">
            <img src="assets/Dima.jpg" alt="Course Image" class="course-list__item-image">
            <div class="course-list__item-details">
                <h3 class="course-list__item-title">Опять дима</h3>
                <p class="course-list__item-price">5К+ <span>подписчиков</span></p>
            </div>
            <p class="course-list__item-description">
                Опять Дима - русский Тик Токер, монтажер из города Воронеж, снимает эдиты про город и иногда снимает забавные видео.
            </p>
            <button class="course-list__item-button" id="Опять Дима">Подробнее</button>
        </div>
        <div class="course-list__item">
            <img src="assets/notwwk.jpg" alt="Course Image" class="course-list__item-image">
            <div class="course-list__item-details">
                <h3 class="course-list__item-title">notwwk / Яна Гурари</h3>
                <p class="course-list__item-price">50К+ <span>подписчиков</span></p>
            </div>
            <p class="course-list__item-description">
                русский тик ток блоггер, музыкант.
                Гитаристка в панк-рок группе REGRITIT.
                Дата рождения: 26.12.2007 в городе Россошь.
            </p>
            <button class="course-list__item-button" id="notwwk / Яна Гурари">Подробнее</button>
        </div>
        <div class="course-list__item">
            <img src="assets/thenesti.jpg" alt="Course Image" class="course-list__item-image">
            <div class="course-list__item-details">
                <h3 class="course-list__item-title">Настюшка</h3>
                <p class="course-list__item-price">17К+ <span>подписчиков</span></p>
            </div>
            <p class="course-list__item-description">
                Русская тик токерша.
                Снимаю много интересных роликов на разные темы,раньше была анонимкой.
                Родилась  02.02.2010 г(в Воронежской области).
            </p>
            <button class="course-list__item-button" id="Настюшка">Подробнее</button>
        </div>
        <div class="course-list__item">
            <img src="assets/illyushkk.jpg" alt="Course Image" class="course-list__item-image">
            <div class="course-list__item-details">
                <h3 class="course-list__item-title">илюшкк</h3>
                <p class="course-list__item-price">13К+ <span>подписчиков</span></p>
            </div>
            <p class="course-list__item-description">
                илюшкк - русский Тик Токер,
                снимает забавный контент и про Воронеж.
                Родился 23 февраля 2007 в Белгородской обл.
            </p>
            <button class="course-list__item-button" id="илюшкк / illyushkk">Подробнее</button>
        </div>
        <a href="spisok.html">
        <button class="about__details-button">Увидеть больше</button>
    </a>
    </div>


    <div class="about">
        <img src="assets/profile-1.jpg" alt="About Image" class="about__image">
        <div class="about__details">
            <div class="about__details-title">Подробнее о нас</div>
            <div class="about__details-description">
                text text text text text text text text text text text text text text text text text text 
                text text text text text text text text text text text text text text text text text text 
                text text text text text text text text text text text text text text text
            </div>
            <button class="about__details-button">Узнать Подробнее</button>
        </div>
    </div>


    <div class="gradient">
        <!-- <div class="subscription">
            <form class="subscription__form">
                <input type="text" class="subscription__input" placeholder="Введите никнейм">
                <button type="submit" class="subscription__button">Поиск</button>
            </form>
        </div> -->

        <p class="footer">
            <div class="footer-links">
                <div class="footer__branding">
                    <a href="index.html">
                    <p class="footer__brand-name">StarTok</p>
                </a>
                </div>

                <div class="footer__column">
                    <a href="https://t.me/Toughened_callbot" class="footer__link">Подать заявку</a>
                    <a href="index.html" class="footer__link">Главная</a>
                    <a href="spisok.html" class="footer__link">Список ТикТокеров/Блогеров</a>
                </div>

                <div class="footer__column">
                    <a href="#" class="footer__link"><i class='bx bxl-telegram'></i></a>
                    <a href="#" class="footer__link"><i class='bx bxl-youtube'></i></a>
                    <a href="#" class="footer__link"><i class='bx bxl-vk'></i></a>
                </div>

            </div>

            <p class="footer__copyright">© Copyright StarTok (2024-2025)</p>
            <p class="footer__copyright1">! Копирование сайта запрещено и карается законом !</p>

        </footer>
    </div>
    <script src="script.js"></script>
</body>

</html>