/* Reset default browser styles */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* Set the background for the entire page */
body {
  background-color: #000000;
  /* Create a grid pattern using repeating linear gradients */
  background-image: 
    /* Vertical lines */
    repeating-linear-gradient(
      to right,
      transparent 0 100px,
      #25283b22 100px 101px
    ),
    /* Horizontal lines */
    repeating-linear-gradient(
      to bottom,
      transparent 0 100px,
      #25283b22 100px 101px
    );
}


/* Add a decorative background image to the body */
body::before {
  position: absolute;
  width: min(1400px, 90vw); /* Responsive width */
  top: 10%;
  left: 50%;
  height: 90%;
  transform: translateX(-50%); /* Center the element */
  content: ""; /* Required for pseudo-elements */
  background-image: url("../images/bg.png");
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: top center;
  pointer-events: none; /* Prevents the pseudo-element from interfering with user interactions */
  
}