/* 🧠 BODY: DARK SCENECORE VIBE */
body {
  background-color: #0b0b0b;
  color: #f0a5ff;
  font-family: 'Comic Neue', 'Patrick Hand', 'Fredoka One', sans-serif;
  margin: 0;
  padding: 0;
  line-height: 1.6;
  background-size: cover;
  background-attachment: fixed;
  text-shadow: 1px 1px 4px #ff00ff, 0 0 5px #ff003c;
  cursor: url('https://cur.cursors-4u.net/cursors/cur-4/cur394.cur'), auto;
}

/* 🔻 NAVBAR */
nav {
  background-color: rgba(20, 0, 30, 0.8);
  padding: 1rem;
  text-align: center;
  box-shadow: 0 0 20px #ff00ff;
  position: sticky;
  top: 0;
  z-index: 999;
}

nav ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

nav li {
  display: inline-block;
  margin: 0 15px;
}

nav a {
  color: #ff80ff;
  font-weight: bold;
  font-family: 'Fredoka One', sans-serif;
  text-shadow: 0 0 8px #ff00ff;
  text-decoration: none;
}

nav a:hover {
  color: #ffffff;
  text-shadow: 0 0 10px #ffffff;
}

/* 🧨 HEADER */
header {
  background: linear-gradient(145deg, #330033, #1a001a);
  text-align: center;
  padding: 2rem;
  color: #fff;
  font-family: 'Luckiest Guy', cursive;
  box-shadow: 0 0 20px #ff00ff;
  border-bottom: 4px double #ff00ff;
}

header h1 {
  font-size: 3em;
  margin: 0;
  text-shadow:
    3px 3px #ff00ff,
    0 0 10px #ff003c,
    2px 10px 0px rgba(255, 0, 0, 0.5); /* blood drip feel */
  animation: flicker 2s infinite alternate;
}

@keyframes flicker {
  from { opacity: 1; }
  to { opacity: 0.8; text-shadow: 0 0 5px #ff00ff, 0 0 20px #ff00ff; }
}

header p {
  font-size: 1.2em;
  font-style: italic;
  color: #d87aff;
}

/* 🧃 CARD SECTIONS */
.card {
  background-color: rgba(40, 0, 60, 0.85);
  margin: 2rem auto;
  max-width: 850px;
  padding: 2rem;
  border: 3px dashed #ff66cc;
  border-radius: 15px;
  font-family: 'Patrick Hand', cursive;
  box-shadow: 0 0 25px #ff003c;
  color: #ffccff;
}

.card h2 {
  color: #ff99ff;
  font-family: 'Fredoka One', sans-serif;
  font-size: 2.5em;
  text-shadow: 1px 1px 6px #ff00ff;
}

/* 🌐 LINKS */
a {
  color: #ff66ff;
  text-decoration: underline;
  font-weight: bold;
  font-style: italic;
}

a:hover {
  color: #ff003c;
  text-shadow: 0 0 15px #ff003c, 0 0 5px #ff0000;
}

/* 🖼️ IMAGES */
img {
  max-width: 90%;
  display: block;
  margin: 1.5rem auto;
  border: 5px groove #ff66cc;
  border-radius: 12px;
  box-shadow: 0 0 20px #ff00ff;
}

/* 📞 FOOTER */
footer {
  background-color: rgba(60, 0, 80, 0.8);
  text-align: center;
  padding: 1.5rem;
  font-size: 1.1em;
  font-family: 'Comic Neue', cursive;
  color: #ffc0ff;
  margin-top: 3rem;
  box-shadow: 0 -3px 10px #ff80c0;
}