<!DOCTYPE html>

<html lang="de">

<head>

    <meta charset="UTF-8">

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

    <title>AINUMBER</title>

    <!-- Hier beginnt dein Code -->

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

    <style>

      * { box-sizing: border-box; }

      body {

        text-align: center;

        margin: 0;

        font-family: 'Nunito', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;

        color: #eaf2ff;

        background: #050b1a;

        min-height: 100vh;

        overflow-x: hidden;

      }

      #bgCanvas {

        position: fixed; inset: 0;

        width: 100%; height: 100%;

        z-index: 0;

        display: block;

      }

      .bg-glow {

        position: fixed; inset: 0; z-index: 0;

        pointer-events: none;

        background:

          radial-gradient(900px 500px at 15% 10%, rgba(0,132,255,.35), transparent 60%),

          radial-gradient(800px 500px at 85% 15%, rgba(255,205,0,.22), transparent 60%),

          radial-gradient(1000px 700px at 50% 110%, rgba(120,170,255,.25), transparent 60%),

          radial-gradient(600px 400px at 50% 45%, rgba(90,160,255,.12), transparent 70%);

      }

      .page {

        position: relative; z-index: 1;

        max-width: 1120px;

        margin: 0 auto;

        padding: 28px 18px 0 18px;

      }

      /* ===== HEADER / LOGO ===== */

      .top-badge {

        display: inline-flex; align-items: center; gap: 8px;

        max-width: 100%;

        white-space: nowrap;

        font-weight: 900; font-size: clamp(10px, 2.6vw, 13px); letter-spacing: 1.6px;

        color: #0a1a33;

        background: linear-gradient(180deg,#ffffff 0%, #d9e6ff 18%, #9fb8dd 42%, #f4f8ff 50%, #8fa6c8 58%, #e8eefc 100%);

        border: 2px solid rgba(255,255,255,.85);

        padding: 7px 16px;

        border-radius: 999px;

        box-shadow: 0 4px 0 #5a7396, 0 8px 18px rgba(0,0,0,.5), inset 0 1px 0 #fff;

        text-transform: uppercase;

      }

      h1 { margin-bottom: 20px; }

    </style>

</head>

<body>

    <!-- Sichtbarer Inhalt der Webseite -->

    <canvas id="bgCanvas" aria-hidden="true"></canvas>

    <div class="bg-glow"></div>

    <div class="page">

        <div class="top-badge">System Online</div>

        <h1 style="font-family: 'Orbitron', sans-serif; font-size: 3rem; margin-top: 20px;">AINUMBER</h1>

    </div>

</body>

</html>