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

<head>
    <%- include('./components/head'); %>
</head>

<body style="background-image: url('/static/img/mymind-tZCrFpSNiIQ-unsplash.webp'); background-position: center; background-size: cover;">
    <div style="background-color: #eee9;">
        <div class="container min-vh-100 d-flex align-items-center p-4">
            <main>
                <div class="text-dark opacity-50 d-flex align-items-center gap-2 mb-2">
                    <h1 class="fw-normal fs-4 mb-0">Netlico</h1>
                    <span class="badge text-bg-dark fw-light fs-6 transform-uppercase">alpha</span>
                </div>
                <h2 class="fs-1">Your own site in minutes, simple and free.</h2>
                <p class="fs-5 text-dark text-opacity-75">
                    Ever wanted to have your personal website, but didn't know how to make it happen? Introducing Netlico, our tool for creating microsites quickly and effortlessly. Netlico makes online presence accessible to everyone, and with our free plan, your site can be up and running in minutes, at zero cost.
                </p>
                <div class="d-flex gap-3">
                    <% if (isLoggedIn) { %>
                        <a class="btn btn-dark btn-lg" href="/sites" role="button">My sites</a>
                        <a class="btn btn-dark-secondary btn-lg" href="/account" role="button">Account settings</a>
                    <% } else { %>
                        <a class="btn btn-dark btn-lg" href="/account/register" role="button">Get started</a>
                        <a class="btn btn-dark-secondary btn-lg" href="/account/login" role="button">Log in</a>
                    <% } %>
                </div>
            </main>
        </div>
    </div>
    <%- include('./components/footer'); %>
</body>

</html>