/* ==========================================================================
   Import Google Fonts (Caveat untuk Font 'Selamat Datang di')
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@600;700&display=swap');

.hero-bina-wirawan {
  position: relative;
  width: 100%;
}

/* Custom Font Style untuk Tulisan 'Selamat Datang di' */
.hero-script-title {
  font-family: 'Caveat', cursive, sans-serif;
  line-height: 1.1;
  font-weight: 700;
}

/* White Gradient Overlay (Sangat Halus & Menyatu dengan Foto Kanan) */
.hero-white-overlay {
  background: linear-gradient(
    90deg, 
    rgba(255, 255, 255, 0.98) 0%, 
    rgba(255, 255, 255, 0.94) 38%, 
    rgba(255, 255, 255, 0.70) 58%, 
    rgba(255, 255, 255, 0.10) 85%, 
    rgba(255, 255, 255, 0) 100%
  );
}

/* Responsive adjustment untuk Tampilan Mobile */
@media (max-width: 767px) {
  .hero-white-overlay {
    background: linear-gradient(
      180deg, 
      rgba(255, 255, 255, 0.98) 0%, 
      rgba(255, 255, 255, 0.90) 65%, 
      rgba(255, 255, 255, 0.35) 100%
    );
  }

  .hero-brush-top-right {
    opacity: 0.7;
    transform: scale(0.75) translate(15%, -15%);
  }

  .hero-brush-bottom-right {
    opacity: 0.9;
    transform: scale(0.85) translate(10%, 10%);
  }
}

/* Staggered Animation Items */
.hero-animate-item {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1), transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.hero-bina-wirawan.hero-loaded .hero-animate-item {
  opacity: 1;
  transform: translateY(0);
}

.hero-bina-wirawan.hero-loaded .hero-animate-item:nth-child(1) { transition-delay: 0.05s; }
.hero-bina-wirawan.hero-loaded .hero-animate-item:nth-child(2) { transition-delay: 0.12s; }
.hero-bina-wirawan.hero-loaded .hero-animate-item:nth-child(3) { transition-delay: 0.18s; }
.hero-bina-wirawan.hero-loaded .hero-animate-item:nth-child(4) { transition-delay: 0.24s; }
.hero-bina-wirawan.hero-loaded .hero-animate-item:nth-child(5) { transition-delay: 0.30s; }
.hero-bina-wirawan.hero-loaded .hero-animate-item:nth-child(6) { transition-delay: 0.36s; }

@media (prefers-reduced-motion: reduce) {
  .hero-animate-item {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}