/* ---------- RESET ---------- */
html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  font-family: "Segoe UI", Arial, sans-serif;
  background-color: #000;
  color: white;
}

/* ---------- BACKGROUND ---------- */
#background {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

/* ---------- MAIN TEXT ---------- */
.center-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  z-index: 1;
}

.center-text h1 {
  font-size: 3em;
  color: #00aaff;
  text-transform: uppercase;
  letter-spacing: 3px;
  margin: 0;
  animation: glow 2s ease-in-out infinite alternate;
}

.center-text p {
  font-size: 1.2em;
  color: #cfdfff;
  margin-top: 10px;
  opacity: 0.9;
}

/* ---------- FOOTER ---------- */
footer {
  position: fixed;
  bottom: 10px;
  width: 100%;
  text-align: center;
  color: #aaa;
  font-size: 0.9em;
  z-index: 1;
}

/* ---------- GLOW ANIMATION ---------- */
@keyframes glow {
  from {
    text-shadow: 0 0 10px #007bff, 0 0 20px #007bff, 0 0 30px #00ffff;
  }
  to {
    text-shadow: 0 0 20px #00ccff, 0 0 40px #00ffff, 0 0 60px #007bff;
  }
}