<!doctype html>
<html lang="hu">
<head>
  <meta charset="utf-8" />

  <meta
    name="viewport"
    content="width=device-width, initial-scale=1"
  />

  <meta
    name="theme-color"
    content="#07050b"
  />

  <meta
    name="description"
    content="NoLimits RP"
  />

  <title>NoLimits RP</title>

  <!-- FAVICON -->

  <link
    rel="icon"
    type="image/png"
    sizes="16x16"
    href="/assets/img/logo.png"
  />

  <link
    rel="icon"
    type="image/png"
    sizes="32x32"
    href="/assets/img/logo.png"
  />

  <link
    rel="icon"
    type="image/png"
    sizes="48x48"
    href="/assets/img/logo.png"
  />

  <link
    rel="icon"
    type="image/png"
    sizes="64x64"
    href="/assets/img/logo.png"
  />

  <link
    rel="icon"
    type="image/png"
    sizes="128x128"
    href="/assets/img/logo.png"
  />

  <link
    rel="shortcut icon"
    type="image/png"
    href="/assets/img/logo.png"
  />

  <link
    rel="apple-touch-icon"
    sizes="180x180"
    href="/assets/img/logo.png"
  />


  <!-- FONTS -->

  <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=Inter:wght@400;500;600;700;800;900&family=Orbitron:wght@600;700;800;900&display=swap"
    rel="stylesheet"
  />


  <!-- GLOBAL CSS -->

  <link
    rel="stylesheet"
    href="/assets/css/style.css"
  />

</head>


<body>

  <!-- =====================================================
       HÁTTÉR EFFEKTEK
       ===================================================== -->

  <div class="ambient ambient-a"></div>

  <div class="ambient ambient-b"></div>

  <div class="grid-layer"></div>

  <div class="noise"></div>


  <!-- =====================================================
       GLOBÁLIS FELSŐ FEJLÉC
       ===================================================== -->

  <header
    class="site-header"
    id="siteHeader"
  >

    <!-- BRAND -->

    <a
      class="brand"
      href="#home"
      aria-label="NoLimits RP főoldal"
    >

      <span
        class="brand-mark"
        id="brandMark"
      >
        NL
      </span>


      <span class="brand-copy">

        <strong id="brandName">
          NoLimits RP
        </strong>

        <small id="brandSubtitle">
          ROLEPLAY COMMUNITY
        </small>

      </span>

    </a>


    <!-- MOBIL MENÜ -->

    <button
      class="menu-toggle"
      id="menuToggle"
      type="button"
      aria-label="Menü megnyitása"
      aria-expanded="false"
    >

      <span></span>
      <span></span>
      <span></span>

    </button>


    <!--
      A GOMBOKAT AZ APP.JS ÉPÍTI FEL
      A SITE.JSON-BAN MEGADOTT IKONOKKAL.
    -->

    <nav
      class="main-nav"
      id="mainNav"
      aria-label="Fő navigáció"
    ></nav>

  </header>


  <!-- =====================================================
       OLDAL TARTALOM
       ===================================================== -->

  <main id="app">

    <section class="loading-screen">

      <div class="loader-ring"></div>

      <p>
        NoLimits RP betöltése...
      </p>

    </section>

  </main>


  <!-- =====================================================
       GLOBÁLIS FOOTER
       ===================================================== -->

  <footer class="footer">

    <div class="footer-brand">

      <span class="brand-mark small">
        NL
      </span>


      <div>

        <strong id="footerName">
          NoLimits RP
        </strong>

        <p id="footerText"></p>

      </div>

    </div>


    <div
      class="footer-links"
      id="footerLinks"
    ></div>


    <p
      class="legal"
      id="legalNote"
    ></p>

  </footer>


  <!-- =====================================================
       TOAST
       ===================================================== -->

  <div
    class="toast"
    id="toast"
    role="status"
  ></div>


  <!-- =====================================================
       APP
       ===================================================== -->

  <script
    type="module"
    src="/assets/js/app.js"
  ></script>

</body>
</html>
