<script setup>
import { arrowSvg, moonMark } from './symbols';

defineProps({ playUrl: { type: String, required: true } });
</script>

<template>
    <footer class="footer" data-screen-label="05 Footer">
        <div class="wrap">
            <div class="footer-cta reveal">
                <span class="eyebrow">Свет лунного колодца зовет</span>
                <div style="height: 20px"></div>
                <h2 class="h-display">Один лаунчер - и ты у ворот Тельдрассила.</h2>
                <p>Наш лаунчер сам поставит игровой клиент, пропишет realmlist и будет держать все в актуальном состоянии. Без ручных патчей и копирования файлов.</p>
                <div class="launcher-steps">
                    <div class="launcher-step"><span class="n">01</span><span class="t">Скачай лаунчер</span></div>
                    <div class="launcher-step"><span class="n">02</span><span class="t">Войди или создай аккаунт</span></div>
                    <div class="launcher-step"><span class="n">03</span><span class="t">Нажми «Играть» - остальное автоматически</span></div>
                </div>
                <div class="hero-cta" style="justify-content: center; margin-top: 40px">
                    <a :href="playUrl" class="btn btn-primary">Скачать лаунчер для Windows <span v-html="arrowSvg"></span></a>
                    <a href="#" class="btn btn-ghost is-disabled" aria-disabled="true">macOS - в разработке</a>
                </div>
                <div style="margin-top: 20px; font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.18em; color: var(--text-mute); text-transform: uppercase">v 1.4.2 · ~180 MB · автообновление</div>
            </div>

            <div class="footer-grid">
                <div class="footer-col footer-brand">
                    <div style="display: flex; align-items: center; gap: 12px; color: var(--moon)">
                        <span v-html="moonMark(28)"></span>
                        <span style="font-family: var(--f-display); letter-spacing: 0.18em; font-size: 16px; color: var(--ivory)">MOONWELL</span>
                    </div>
                    <p>Приватный сервер World of Warcraft 3.3.5a с индивидуальным прогрессом, соло-данжами и режимом «Предатель». Бесплатно и без pay-to-win.</p>
                </div>
                <div class="footer-col"><h4>Сервер</h4><a href="#">Статус реалмов</a><a href="#">Скачать клиент</a><a href="#">Правила</a><a href="#">Дорожная карта</a></div>
                <div class="footer-col"><h4>Сообщество</h4><a href="#">Discord</a><a href="#">Форум</a><a href="#">Поддержка</a><a href="#">Вакансии</a></div>
                <div class="footer-col"><h4>База знаний</h4><a href="#">Гайды</a><a href="#">База данных</a><a href="#">Рейтинги</a><a href="#">API</a></div>
            </div>

            <div class="footer-bottom">
                <span>© 2026 MoonWell · fan project · не связан с Blizzard Entertainment</span>
                <span>Сделано с лунным светом</span>
            </div>
        </div>
    </footer>
</template>
