<!DOCTYPE html>
<html lang="ru">
<head>
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>KuromiHost - хостинг майнкрафт серверов и скриптов</title>

    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300..700&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300..700&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Tiny5&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300..700&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Tiny5&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300..700&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&family=Tiny5&display=swap" rel="stylesheet">

    <link rel="stylesheet" href="src/styles/style.css?v=<?= md5_file('src/styles/style.css'); ?>">
    <link rel="stylesheet" href="src/styles/heads.css?v=<?= md5_file('src/styles/heads.css'); ?>">

    
    <link rel="shortcut icon" href="src/img/favicon.ico?v=<?= md5_file('src/img/favicon.ico'); ?>" type="image/x-icon">
</head>
<body>

    <!-- <video autoplay muted loop id="myVideo">
        <source src="src/video/output.mp4" type="video/mp4">
      </video> -->
    <div id="background"></div>
    <canvas id="particles"></canvas>

    <div id="panel">
        <img src="src/img/logo.png" alt="" class="panel_logo">
        <h1 class="logo_name">kuromi.host</h1>
        <a href="javascript:void(0);" onclick="document.getElementById('about').scrollIntoView({ behavior: 'smooth' });">О нас</a>
        <a href="javascript:void(0);" onclick="document.getElementById('prices').scrollIntoView({ behavior: 'smooth' });">Тарифы</a>
        <a href="javascript:void(0);" onclick="document.getElementById('contacts').scrollIntoView({ behavior: 'smooth' });">Контакты</a>
        <a href="https://panel.kuromi.host/">Панель</a>
        <p class="profile" id="redirect"><img src="src/img/svgs/user.png" alt=""><?php echo $username . $os . $balance; ?></p>
    </div>
    <!-- <div id="language-switcher">
        <button onclick="setLanguage('en_US')">EN</button>
        <button onclick="setLanguage('ru_RU')">RU</button>
    </div> -->

    
    <div id="classic_panel">
        <h1 class="logo_name">kuromi.host</h1>
        <p>Открыть меню</p>

    </div>

    <div id="mobile_panel">
        <img src="src/img/logo.png" alt="" class="panel_logo">
        <h1 class="logo_name">kuromi.host</h1>
        <div class="panel_box">
            <li><a href="javascript:void(0);" onclick="document.getElementById('about').scrollIntoView({ behavior: 'smooth' });">О нас</a></li>
            <li><a href="javascript:void(0);" onclick="document.getElementById('prices').scrollIntoView({ behavior: 'smooth' });">Тарифы</a></li>
            <li><a href="javascript:void(0);" onclick="document.getElementById('contants').scrollIntoView({ behavior: 'smooth' });">Контакты</a></li>
            <li><a href="https://panel.kuromi.host/">Панель</a></li>
            <li><p class="profile" id="redirect1" class=".color-pink"><?php echo $username . $os . $balance; ?></p></li>
        </div>
    </div>
    
    <h1 class="welcome"></h1>
    <h1 class="welcome_p"></h1>
    <img src="src/img/kuromi.gif" alt="" class="kuromi">
    <div class="border"><br></div>

    <div id="about">
        <h1 data-lang="about">Про kuromi.host:</h1>
        <p>Мы новый хостинг, который готов предоставить вам тарифы, которые точно будут вам по карману!</p>
        <div class="about_list">
            <li><h2><img src="src/img/svgs/main/shield-bolt-svgrepo-com.svg" alt="" class="icons">Защита</h2>Защита на уровне L4, предоставленная нам сервисом <a href="https://mitelis.net/" target="_blank">Mitelis</a> <br><a href="javascript:void(0);" onclick="document.getElementById('prices').scrollIntoView({ behavior: 'smooth' });" class="next">➜ подробнее</a></li>
            <li><h2><img src="src/img/svgs/main/power-alt-svgrepo-com.svg" alt="" class="icons">Бесперебойность</h2>Аптайм 99% <br><a href="javascript:void(0);" onclick="document.getElementById('prices').scrollIntoView({ behavior: 'smooth' });" class="next">➜ подробнее</a></li>
            <li><h2><img src="src/img/svgs/main/support-svgrepo-com.svg" alt="" class="icons">Тех.поддержка</h2>Поддержка 12/7 <br><a href="javascript:void(0);" onclick="document.getElementById('prices').scrollIntoView({ behavior: 'smooth' });" class="next">➜ подробнее</a></li>
            <li><h2><img src="src/img/svgs/main/hardware-chip-svgrepo-com.svg" alt="" class="icons">Современное оборудование</h2>Сервера на <b>SSD</b> и <b>DDR4</b> блашках <br><a href="javascript:void(0);" onclick="document.getElementById('prices').scrollIntoView({ behavior: 'smooth' });" class="next">➜ подробнее</a></li>
            <li><h2><img src="src/img/svgs/main/pricing-workspace-svgrepo-com.svg" alt="" class="icons">Бюджет</h2>Низкие цены за производительное оборудование и защиту <br><a href="javascript:void(0);" onclick="document.getElementById('prices').scrollIntoView({ behavior: 'smooth' });" class="next">➜ подробнее</a></li>
        </div>
        <br>
        <h1>Сравнение с конкурентами:</h1>
        <p>Возьмём в пример тариф на 8G ОЗУ</p>
        <li class="hide_point" id="stabilize1" style="color: rgb(70, 201, 70) !important;"><img src="src/img/kuromihost.png" alt="" width="200px"> 3.70$</li>
        <li class="hide_point" id="stabilize1" style="color: rgb(230, 230, 98) !important;"><img src="https://i.ibb.co/T42wy29/image.png" alt="" width="200px"> 7$</li>
        <li class="hide_point" id="stabilize1" style="color: rgb(202, 102, 102) !important;"><img src="https://googiehost.com/blog/wp-content/uploads/2022/03/Scalacube-Review-Hosting-.png" alt="" width="200px"> 24$</li>
        
        <h1>Как купить услугу?</h1>
        <p>Очень просто! Регистрируетесь, переходите в личный кабинет, пополняете баланс и выбираете тариф снизу!</p>
        <p style="color: rgb(187, 187, 187);">Подробный гайд по покупке мы расписали на нашем <a href="https://discord.gg/GqbCSukSyy" target="_blank">Discord сервере</a></p>
    </div>

    <div id="prices">
        <h1>Тарифы:</h1>
        <!-- <p><img src="https://www.hosterfy.com/assets/images/icons/games/bungeecord-shape.webp" alt="" width="50px" class="price_images"><img src="https://avatars.githubusercontent.com/u/41710604?s=200&v=4" alt="" width="50px" class="price_images">Готовые тарифы для <b>Прокси</b>:</p> -->
        <div id="pricing-container"></div>
    </div>

    <div id="contacts">
        <h1>Контакты:</h1>
        <p>Связаться с нами можно тут:</p>
        <li><img src="https://web.telegram.org/img/logo_share.png" alt="" width="15px" class="image1"> Telegram <a href="https://t.me/timur_konstantinov2003" target="_blank">@timur_konstantinov2003</a> (Администратор)</li>
        <li><img src="https://abbygoldsmith.com/wp-content/uploads/2022/03/Discord-Logo-Color.png" alt="" width="15px" class="image1"> Discord <b>@kuromi.dev</b> (Администратор)</li>
        <br>
        <!-- <li><img src="https://web.telegram.org/img/logo_share.png" alt="" width="15px"> Telegram <a href="https://t.me/core2k21" target="_blank">@core2k21</a> (Администратор 2)</li>
        <br> -->
        <li><img src="https://abbygoldsmith.com/wp-content/uploads/2022/03/Discord-Logo-Color.png" alt="" width="15px" class="image1"> <a href="https://discord.gg/32ZMPgZZns" target="_blank">Наш Discord</a></li>

    </div>


</body>
</html>

<script src="src/script/get_prices.js?v=<?= md5_file('src/script/get_prices.js'); ?>"></script>

<script src="src/script/animations.js?v=<?= md5_file('src/script/animations.js'); ?>"></script>
<script type="text/javascript">
    document.getElementById("redirect").onclick = function () {
        location.href = "billing";
    };
    document.getElementById("redirect1").onclick = function () {
        location.href = "billing";
    };
</script>

<script src="src/script/canvas.js"></script>
<script>

document.addEventListener('DOMContentLoaded', function () {
    const classicPanel = document.getElementById("classic_panel");
    const mobilePanel = document.getElementById("mobile_panel");

    // Открытие панели
    classicPanel.addEventListener('click', function () {
        mobilePanel.classList.add('show'); // Добавляем класс для показа панели
        document.body.classList.add('no-scroll'); // Блокируем скролл страницы
    });

    // Закрытие панели при клике на неё
    mobilePanel.addEventListener('click', function () {
        mobilePanel.classList.remove('show'); // Убираем класс для скрытия панели
        document.body.classList.remove('no-scroll'); // Восстанавливаем прокрутку
    });
});


</script>