body {
  overflow-x: hidden; /* Prevent horizontal scrollbar */
}

body:has(.banner) {
  overflow: hidden;
}

.banner {
  background-size: cover;
  background-position: center;
  align-content: center;
  height: 100vh;
}

.board {
  background-size: cover;
  background-position: center;
  width: 50px;
}

.btn-flat {
  color: white;
  padding: 8px 24px;
  border-radius: 4px;
  background: #670BFF;
  transition: background 0.3s ease;
}

.carousel-home {
  height: calc(100vh - 220px);
  width: 100%;
  overflow: hidden;
  // margin-top: 0px;
  // object-fit: cover;
}

.carousel-home-item.active {
  // padding-top: 50;
}

.get-started-btn {
  position: absolute;
  top: 74%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  border:none !important;
  background-color: $yellow !important;
  text-shadow: 1px 1px 3px rgba(0,0,0,0.2);
  font-weight: bold;
}

.text-intro {
  font-size: 37px;
  position: absolute;
  top: 49%;
  left: 63%;
  width: 100%;
  transform: translate(-50%, -50%);
  margin: 0;
  color: white;
  text-shadow: 1px 1px 3px rgba(0,0,0,0.4);
  font-weight: bold;
}
.image-gallery {
  display: flex;
  flex-wrap: wrap; /* Ensures images wrap to the next row if they don't fit */
  gap: 15px;
  justify-content: center;
  margin-top: 0; /* Adds spacing between images */
}

.image-gallery img {
  width: 157px; /* Adjust to the desired width */
  height: auto; /* Maintain aspect ratio */
  object-fit: cover; /* Ensures the image is cropped if necessary */
  border: 2px solid #ddd; /* Adds a border around the images */
  border-radius: 5px; /* Rounds corners of the images */
}
.image-banner h2 {
  font-size: 37px;
  text-shadow: 1px 1px 3px rgba(0,0,0,0.2);
  font-weight: bold;
  color: white;
}