/* Базовый сброс и фон */
html, body {
  margin: 0; padding: 0;
  height: 100%; width: 100%;
  overflow: hidden;
  background: transparent;
  font-family: 'Courier New', monospace;
}

/* Canvas тот же, что и на главной */
#matrix-canvas {
  position: fixed; top: 0; left: 0;
  width: 100%; height: 100%;
  z-index: 0;
}

/* Центрирование содержимого */
.overlay {
  position: fixed; top: 0; left: 0;
  width: 100%; height: 100%;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center; z-index: 1;
  pointer-events: none;
}

/* Логотип */
.logo {
  max-width: 150px; width: 50%;
  filter: drop-shadow(0 0 10px #00ff41);
  margin-bottom: 1rem;
}

/* Анимированный заголовок */
.title {
  color: #00ff41;
  font-size: 2.5rem;
  white-space: nowrap; overflow: hidden;
  border-right: .15em solid #00ff41;
  text-shadow: 0 0 10px rgba(0,255,65,0.7);
  margin-bottom: .5rem;
}

/* Подзаголовок */
.subtitle {
  color: #ccc;
  font-size: 1rem;
  margin-bottom: 1.5rem;
  pointer-events: auto;
}

/* Кнопка */
.btn {
  pointer-events: auto;
  text-decoration: none;
  color: #000; background: #00ff41;
  padding: .75rem 1.5rem;
  border-radius: .5rem;
  font-weight: bold;
  transition: background .3s;
}
.btn:hover {
  background: #00cc35;
}

/* Анимации для .title */
@keyframes typing { from { width: 0 } to { width: 10ch } }
@keyframes blink  { 50% { border-color: transparent } }
.title.typing {
  animation: typing 2s steps(10), blink .75s step-end infinite;
}

/* Адаптив */
@media (max-width: 480px) {
  .logo { max-width: 120px; }
  .title { font-size: 2rem; border-right: .1em solid #00ff41; }
  .subtitle { font-size: .9rem; }
}