.hero {
  position: relative;
  width: 100%;
  height: auto;
  text-align: center;
}

.hero img {
  width: 100%;
  height: auto;
  display: block;
}

.hero-text {
  position: absolute;
  top: 36%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-family: 'Red Rose', serif;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.7);
}

.hero-text h1 {
  font-size: 1400%;
  margin-bottom: -60px;
  font-family: "Bebas Neue", sans-serif;
  letter-spacing: 8px; /* Ubah angkanya sesuai kebutuhan */

}

.hero-text p {
  font-size: 400%;
  font-family: "Raleway", sans-serif;
}

@media (max-width: 600px) {
  .hero-text h1 {
    font-size: 80px;
    margin-bottom: -30px;
  }

  .hero-text p {
    font-size: 30px;
  }
}