@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&display=swap');

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:'Orbitron',sans-serif;
    height:100vh;
    background:
        radial-gradient(circle at center,
        #0a1a3a 0%,
        #050816 60%,
        #000 100%);
    overflow:hidden;
    display:flex;
    justify-content:center;
    align-items:center;
    color:#8fefff;
}

.background-grid{
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(0,255,255,.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0,255,255,.08) 1px, transparent 1px);
    background-size:50px 50px;
    transform:perspective(600px) rotateX(70deg);
    transform-origin:center bottom;
}

.container{
    position:relative;
    z-index:10;
}

.panel{
    background:rgba(5,15,35,.65);
    border:1px solid #00ffff;
    padding:50px;
    border-radius:20px;
    text-align:center;
    backdrop-filter:blur(10px);
    box-shadow:
        0 0 10px #00ffff,
        0 0 25px #00ffff,
        0 0 50px rgba(0,255,255,.5);
    animation:pulse 3s infinite;
}

.panel h1{
    font-size:2rem;
    margin-bottom:25px;
    color:#00ffff;
    text-shadow:
        0 0 5px #00ffff,
        0 0 15px #00ffff,
        0 0 30px #00ffff;
}

.panel p{
    font-size:1.2rem;
    line-height:1.8;
    text-shadow:0 0 10px #00ffff;
}

@keyframes pulse{
    0%,100%{
        box-shadow:
            0 0 10px #00ffff,
            0 0 25px #00ffff;
    }
    50%{
        box-shadow:
            0 0 20px #00ffff,
            0 0 60px #00ffff;
    }
}