@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');

body.crt {
  background: #0a0a1f;
  color: #00ff66;
  font-family: 'Press Start 2P', monospace;
  margin: 0;
  padding: 0;
  min-height: 100vh;
  overflow: hidden;
  position: relative;
}

/* Matrix Canvas Background */
.matrix-bg {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
}

.matrix-bg canvas {
  opacity: 0.45;           /* Change to 0.35 (weaker) or 0.55 (stronger) */
}

/* Terminal content */
.terminal {
  position: relative;
  z-index: 2;
  max-width: 720px;
  margin: 0 auto;
  padding: 2rem 1.5rem 4rem;
}

/* Your existing subtle CRT text + scanlines */
.site-name, .welcome, .terminal p, .boot-header, .signature, .links a, .prompt {
  position: relative;
  text-shadow: 0 0 3px #00ff66, 0 0 5px #00ff66;
  color: #00ff77;
}

.site-name::after,
.welcome::after,
.terminal p::after,
.boot-header::after,
.signature::after,
.links::after {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: repeating-linear-gradient(
    to bottom,
    transparent 0px,
    transparent 1px,
    rgba(0, 0, 0, 0.35) 1px,
    rgba(0, 0, 0, 0.35) 2px
  );
  pointer-events: none;
  z-index: 1;
  mix-blend-mode: multiply;
  opacity: 0.55;
}

.welcome {
  font-size: 1.45rem;
  margin: 1.6rem 0 1.4rem;
  color: #00ffaa;
  text-shadow: 0 0 8px #00ffaa, 0 0 14px #00ffaa;
}

.welcome::after {
  opacity: 0.55;
}

.links a {
  color: #00ffee;
  text-decoration: none;
}

.links a:hover {
  color: #44ffff;
  text-shadow: 0 0 6px #44ffff;
}

.boot-header {
  margin-bottom: 1.6rem;
  font-size: 0.95rem;
  color: #00cc55;
}

.prompt {
  color: #00ff99;
}

.terminal p {
  line-height: 1.8rem;
  margin-bottom: 1.3rem;
}

hr {
  border: none;
  height: 2px;
  background: linear-gradient(to right, transparent, #008844, transparent);
  margin: 2rem 0;
}

.signature {
  color: #ffbb00;
  font-size: 0.95rem;
}

.navigation {
  margin-bottom: 1.8rem;
}

.site-name {
  font-size: 1.5rem;
  letter-spacing: 3px;
  color: #00ff88;
}

@media (max-width: 768px) {
  .terminal { padding: 1.5rem 1.2rem 3rem; }
  .welcome { font-size: 1.25rem; }
}