/* =========================
   TABLET (768px and below)
========================= */
@media (max-width: 768px) {

  /* NAVBAR */
  .navbar {
    padding: 0 25px;
    height: 80px;
  }

  .nav-links {
    display: none; /* optional: replace with hamburger later */
  }

  /* HERO */
  .hero {
    flex-direction: column;
    padding: 120px 25px 60px;
    text-align: center;
  }

  .hero-content {
    width: 100%;
  }

  .hero-content h1 {
    font-size: 48px;
  }

  .hero-content p {
    width: 100%;
    font-size: 16px;
  }

  .hero-buttons {
    justify-content: center;
    flex-wrap: wrap;
  }

  .hero-image {
    width: 100%;
    margin-top: 40px;
  }

  /* PACKAGES */
  .package-container {
    grid-template-columns: 1fr;
    padding: 20px;
  }

  .packages {
    padding: 80px 25px;
  }

  /* HOW TO ORDER */
  .steps-container {
    grid-template-columns: 1fr 1fr;
  }

  .how-to-order {
    padding: 80px 25px;
  }

  /* CART */
  .cart-sidebar {
    width: 320px;
  }
}


/* =========================
   MOBILE (480px and below)
========================= */
@media (max-width: 480px) {

  /* HERO */
  .hero-content h1 {
    font-size: 36px;
  }

  .sub-title {
    font-size: 28px;
  }

  .hero-content p {
    font-size: 15px;
  }

  .btn {
    width: 100%;
    text-align: center;
  }

  /* PACKAGES */
  .package-card {
    padding: 25px;
  }

  .package-header h3 {
    font-size: 22px;
  }

  .package-header span {
    font-size: 14px;
    padding: 8px 14px;
  }

  /* HOW TO ORDER */
  .steps-container {
    grid-template-columns: 1fr;
  }

  .step-card {
    padding: 30px 20px;
  }

  /* CART */
  .cart-sidebar {
    width: 100%;
  }

  .cart-item {
    padding: 15px;
  }

  /* CHECKOUT MODAL */
  .checkout-box {
    width: 95%;
  }
}