body, html {
  margin: 0;
  padding: 0;
  background: #280550;
  overflow-x: hidden; /* Prevent horizontal overflow */
  box-sizing: border-box;
}



header {
  text-align: center; /* Center the header content */
}

header h1 {
  color: #FFFFFF; /* White color for better visibility */
  font-family: 'Open Sans', sans-serif; /* Open Sans font */
  font-size: 2em; /* Adjust size as needed */
  font-weight: 700; /* Bold font weight */
  margin-top: 0.2em; /* Reduced space from the top */
  margin-bottom: 0; /* Remove space below the heading */
  margin-left: 15px;
  line-height: 1; /* Reduce line height to minimize space */
  text-align: left;
}

header h2 {
  color: #FFFFFF; /* White color to match the main heading */
  font-family: 'Open Sans', sans-serif; /* Consistent font with the main heading */
  font-size: 0.25em; /* Smaller font size for the subheading */
  font-weight: 400; /* Regular font weight */
  opacity: 0.8; /* Slightly transparent for a subtle effect */
  margin-top: 4px; /* No space above to keep it close to the main heading */
  margin-bottom: 0; /* No space below, to keep it close to the main heading */
  margin-left: 65px;
  line-height: 0; /* Reduce line height to minimize space */
  text-align: left;
}



/* Style for each section */
section {
  display: flex; /* Enables flexbox */
  flex-direction: column; /* Stacks items vertically */
  align-items: center; /* Centers items horizontally */
  justify-content: center; /* Centers items vertically */
  min-height: 10vh; /* Each section takes at least the height of the viewport */
  color: #26024f; 
  padding: 20px; /* Some padding around the content */
  background-color: #f7f1ffd6;
  margin-top: 0.0em;
}

/* Style for section headings */
section h2 {
  margin: 10px 0; /* Spacing above and below the heading */
  font-size: 5em; /* Adjust as needed */
}

/* Style for section paragraphs */
section p {
  margin-top: 10px;
  font-size: 1em; /* Adjust as needed */
  max-width: 600px; /* Max width for readability */
  text-align: left; /* Center-align text */

}
.content p:first-of-type, /* If you didn't add a class */
.intro-text /* If you added the 'intro-text' class */ {
  font-size: 2em; 
  text-align: center; /* Centers the text */
  max-width: 800px; /* Sets a max-width for better readability */
  margin-left: auto; /* These two margins center the block */
  margin-right: auto;
  margin-top: 0.0em; /* Reduced space from the top */
}

.section2 {
  display: flex; /* Enables flexbox */
  flex-direction: column; /* Stacks items vertically */
  align-items: center; /* Centers items horizontally */
  justify-content: center; /* Centers items vertically */
  min-height: 10vh; /* Each section takes at least the height of the viewport */
  color: #FFFFFF;
  padding: 20px; /* Some padding around the content */
  text-align: center;
  font-size: 1.5em;
  transform: skewX(-10deg); /* Slightly skew the text */
  line-height: 1.3;
  background-color: #280550;
  margin-top: 0.0em;
  margin-left: 15em;
  margin-right: 15em;
}








@keyframes neonGlow {
  from {
    text-shadow: 0 0 10px rgba(0, 255, 255, 0.7), 0 0 20px rgba(0, 255, 255, 0.5);
  }
  to {
    text-shadow: 0 0 20px rgba(0, 255, 255, 0.7), 0 0 40px rgba(0, 255, 255, 0.5);
  }
}

canvas {
  max-width: 100%;
  height: auto; /* Adjust as needed */
  /*display: block; /* To prevent extra space below the canvas */
}