body {
  margin: 0;
  padding: 0; 
/* background: linear-gradient(to bottom right, #1c1736, #3b1b5b);*/

/*background: linear-gradient(rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.75)),
              url('pattern.png') no-repeat center center fixed;
  background-size: cover;
  color: white;*/

/*
  background: linear-gradient(rgba(28, 10, 40, 0.9), rgba(28, 10, 40, 0.9)),
              url('pattern.png') no-repeat center center fixed;
  background-size: cover;
  color: white;*/

/*  background: 
    linear-gradient(rgba(122, 35, 106, 0.7), rgba(122, 35, 106, 0.7)),
    url('pattern.png') no-repeat center center fixed;
  background-size: cover;
  color: white;*/
  background: 
    linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    linear-gradient(rgba(122, 35, 106, 0.85), rgba(122, 35, 106, 0.85)),
    url('pattern.png') no-repeat center center fixed;
  background-size: cover;
  color: white;




  font-family: 'Poppins', sans-serif;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  text-align: center;
}

.container {
  max-width: 700px;
  padding: 30px;
 animation: fadeSlideIn 1.2s ease-out both;

}

.logo img {
  width: 180px;
/*max-width: 100%;*/
  height: auto;
  object-fit: contain;
 
}
.logo {
  display: flex;
  justify-content: center;
  align-items: center;
}


h1 {
  font-size: 28px;
  letter-spacing: 1px;
  font-weight: 900;
  margin-bottom: 15px;
  font-weight: bolder;
  font-family: 'Gemunu Libre', sans-serif;
  /*letter-spacing: 3.5px;*/
}

.subtext {
  font-size: 22px;
  line-height: 1.6;
  margin-bottom: 25px;
  margin-block-end: .9rem;
  font-family: "Gemunu Libre", Sans-serif;
}


/*.stats {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  margin-bottom: 50px; 
  font-weight: 600;
  gap: 60px; 
  flex-wrap: wrap;
}

.stats div {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.stats i {
  color: #ffffff;
  font-size: 30px;
  font-weight: bolder;
}*/

/*.feature-box {
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.01));
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 18px;
  padding: 20px;
  max-width: 600px;
  margin: 0 auto 40px;
  font-size: 16px;
  text-align: left;
  color: #ffffff;
  backdrop-filter: blur(4px);
  letter-spacing: 1px;
}*/
.feature-box {
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.03));
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 18px;
  padding: 20px;
  max-width: 600px;
  margin: 0 auto 40px;
  font-size: 16px;
  text-align: left;
  color: #ffffff;
  backdrop-filter: blur(6px);
  letter-spacing: 1px;
}


.feature-box h2 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 15px;
  margin-top:0px;
}

.feature-box ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.feature-box li {
  display: flex;
  align-items: center;
  font-size: 15px;
  font-weight: 400;
}



/*.cta {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.btn {
  display: inline-block;
  padding: 20px;
  border-radius: 50px;
  width: 600px;
  text-decoration: none;
  font-size: 14px;
  letter-spacing: 1px;
  transition: all 0.3s ease;
  box-shadow: -2px 4px 12px 0px #000000;
  font-size: 22px;
    font-weight: 500;
    background: linear-gradient(to right, #47b0ff, #9c6eff);
}

.btn-primary {
  border: 3px solid white;
  color: white;
  margin-bottom: 20px;
  
}


.telegram-icon {
  background: #0088cc;
  color: white;
  padding: 12px;
  font-size: 20px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}*/
.cta-btn-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  margin-top: 30px;
}

.join-now-btn {
  background: #3ca6ff;
  color: white;
  font-size: 14px;
  font-weight: 600;
  padding: 10px 20px;
  border: 2px solid #2a82cc; 
  border-radius: 10px;
  text-decoration: none;
  font-family: 'Poppins', sans-serif;
  box-shadow: none;
  width: 140px; /* half-width size */
  text-align: center;
}

.telegram-circle {
  background: #3ca6ff;
  color: white;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #2a82cc;
  font-size: 18px;
}


.telegram-circle i {
  font-size: 16px;
}

/*
@keyframes fadeSlideIn {
  0% {
    opacity: 0;
    transform: translateY(200px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}*/


.container > * {
  opacity: 0;
  transform: translateY(90px); 
  animation: fadeSlideUp 1.2s ease-out forwards;
}

.container > *:nth-child(1) { animation-delay: 0s; }
.container > *:nth-child(2) { animation-delay: 0.3s; }
.container > *:nth-child(3) { animation-delay: 0.6s; }
.container > *:nth-child(4) { animation-delay: 0.9s; }
.container > *:nth-child(5) { animation-delay: 1.2s; }


@keyframes fadeSlideUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}





@media (max-width: 768px)  {
  
  
  
body {
  margin: 0;
  padding: 0; 
/* background: linear-gradient(to bottom right, #1c1736, #3b1b5b);*/

/*background: linear-gradient(rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.75)),
              url('pattern.png') no-repeat center center fixed;
  background-size: cover;
  color: white;*/

/*
  background: linear-gradient(rgba(28, 10, 40, 0.9), rgba(28, 10, 40, 0.9)),
              url('pattern.png') no-repeat center center fixed;
  background-size: cover;
  color: white;*/

/*  background: 
    linear-gradient(rgba(122, 35, 106, 0.7), rgba(122, 35, 106, 0.7)),
    url('pattern.png') no-repeat center center fixed;
  background-size: cover;
  color: white;*/
  background: 
    linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    linear-gradient(rgba(122, 35, 106, 0.85), rgba(122, 35, 106, 0.85)),
    url('pattern.png') no-repeat center center fixed;
  background-size: cover;
  color: white;

  font-family: 'Poppins', sans-serif;
  color: #fff;
  display: flex;
  justify-content: top;
  align-items: top;
  height: auto;
  text-align: center;
}

  .menu {
    display: none; /* Hide menu on mobile */
  }

  .mobile-menu-icon {
    display: block; /* Show hamburger icon */
  }
  
  h1 {
  font-size: 6vw;
  letter-spacing: 1px;
  font-weight: 900;
  margin-bottom: 15px;
  font-weight: bolder;
  font-family: 'Gemunu Libre', sans-serif;
  /*letter-spacing: 3.5px;*/
}
  
  .subtext {
  font-size: 4vw;
  line-height: 1.6;
  margin-bottom: 25px;
  margin-block-end: .9rem;
  font-family: "Gemunu Libre", Sans-serif;
}


.feature-box li {
  display: flex;
  align-items: center;
  font-size: 3vw;
  font-weight: 400;
}

}