/* ------------------------------------------
   responsive.css
   Fungsi: Responsif untuk berbagai ukuran layar
------------------------------------------- */

@media (max-width: 768px) {
  h1.display-4 {
    font-size: 2.5rem;
  }
  .countdown-boxes {
    flex-wrap: wrap;
    justify-content: center;
  }
  .countdown-boxes .box {
    min-width: 60px;
    font-size: 1rem;
  }
  .modal-content img.rounded-circle {
    width: 120px;
    height: 120px;
  }
}

@media (max-width: 480px) {
  h1.display-4 {
    font-size: 2rem;
  }
  form .btn-primary {
    width: 100%;
  }
  p, li {
    font-size: 1rem;
  }
  .modal-content {
    padding: 20px;
  }
}