/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

body {
  background-color: #0d0d0d; /* fallback if image doesn’t load */
  color: #f8f8f8;
  font-family: Verdana, sans-serif;

  /* Background */
  background-image: url("/images/_.jpeg"); /* replace with your own image */
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
}

/* Intro Section */
.intro {
  text-align: center;
  padding: 40px;
  background: rgba(20, 20, 20, 0.8);
  border-radius: 15px;
  margin: 20px auto;
  max-width: 700px;
  color: #ffb3ec;
  box-shadow: 0 0 15px #b266ff;
}

.intro h2 {
  font-family: "Press Start 2P", cursive;
  font-size: 20px;
  margin-bottom: 10px;
  color: #80dfff;
}

.intro p {
  font-family: "Inter", sans-serif;
  font-size: 16px;
  line-height: 1.5;
}

/* Footer Section */
footer {
  text-align: center;
  font-size: 12px;
  padding: 20px;
  color: #cccccc;
  border-top: 1px solid #666;
  margin-top: 40px;
}

/* About Section */
.about {
  background: rgba(0, 0, 0, 0.7);
  padding: 40px;
  margin: 30px auto;
  max-width: 800px;
  border-radius: 15px;
  box-shadow: 0 0 20px #ff66cc;
}

.about h2 {
  font-family: "Press Start 2P", cursive;
  font-size: 22px;
  text-align: center;
  margin-bottom: 20px;
  color: #80dfff;
}

.about h3 {
  color: #ffb3ec;
  margin-top: 25px;
  font-family: "Press Start 2P", cursive;
  font-size: 16px;
}

.about p {
  font-family: "Inter", sans-serif;
  font-size: 15px;
  line-height: 1.6;
  color: #f0f0f0;
}

/* Retro Divider */
.divider {
  text-align: center;
  font-size: 20px;
  margin: 40px 0;
  color: #ff66cc;
  font-family: "Press Start 2P", cursive;
  letter-spacing: 10px;
  text-shadow: 0 0 5px #80dfff;
}
/* Translucent centered box for readability */
.content-box {
  max-width: 800px;
  margin: 50px auto;
  padding: 30px;
  background: rgba(0, 0, 0, 0.7); /* dark see-through */
  border-radius: 15px;
  color: white;
  font-family: "Helvetica Neue", Arial, sans-serif;
  line-height: 1.6;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.6);
}

.content-box h2 {
  margin-bottom: 20px;
  font-size: 1.8rem;
  font-weight: bold;
  color: #fff;
}

.content-box p {
  margin-bottom: 15px;
}