/* =========================================
   ANIMATIONS & INFO BERJALAN
   ========================================= */

@keyframes shine {
  0% { transform: translate(-50%, -50%); }
  100% { transform: translate(0, 0); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Info Berjalan (Running Text) */
.info-berjalan {
  background: #fffbeb;
  border: 1px solid #fcd34d;
  border-radius: 8px;
  margin: 20px auto;
  max-width: 600px;
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: center;
  min-height: 70px;
  box-shadow: 0 2px 8px rgba(252, 211, 77, 0.2);
}

.info-slide {
  width: 100%;
  padding: 12px 16px;
  position: absolute;
  top: 0; left: 0;
}

.info-judul {
  font-size: 13px;
  font-weight: 700;
  color: #b45309;
  margin-bottom: 4px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.info-isi-running {
  color: #92400e;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  display: block;
}

.info-isi-running span {
  display: inline-block;
  padding-left: 100%;
  animation: scrollKiri 40s linear infinite;
}

.info-berjalan:hover .info-isi-running span {
  animation-play-state: paused;
}

.slide-in { animation: slideInRight 0.8s ease-out forwards; }
.slide-out { animation: slideOutLeft 0.8s ease-in forwards; }

@keyframes slideInRight {
  from { transform: translateX(100%); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}

@keyframes slideOutLeft {
  from { transform: translateX(0); opacity: 1; }
  to { transform: translateX(-100%); opacity: 0; }
}

@keyframes scrollKiri {
  0% { transform: translateX(0); }
  100% { transform: translateX(-100%); }
}

/* Responsive Mobile */
@media (max-width: 480px) {
  .button-group { grid-template-columns: 1fr; }
  .promo-title { font-size: 24px; }
  .social-icon { width: 45px; height: 45px; font-size: 20px; }
  .info-berjalan { max-width: 100%; margin: 16px 12px; min-height: 60px; }
  .info-judul { font-size: 12px; }
  .info-isi-running { font-size: 13px; }
  .info-isi-running span { animation-duration: 30s; }
}
