/* Responsive Styles for Mobile */
@media screen and (max-width: 600px) {
  /* Reduce font sizes */
  .hero h1 {
    font-size: 36px;
  }

  .intro h2 {
    font-size: 28px;
  }

  .tagline {
    font-size: 18px;
    margin-top: 0;
  }

  /* Stack sections vertically */
  .section {
    flex-direction: column !important;
    padding: 10px;
  }

  /* Make images responsive */
  .section-image,
  .machine img {
    width: 100%;
    height: auto;
  }

  /* Adjust header logo */
  .logo-img {
    height: 50px;
  }

  .logo {
    font-size: 20px;
  }

  /* Adjust padding and margins */
  .intro,
  .machines {
    padding: 20px 10px;
  }

  .hero {
    padding: 20px 10px;
  }
}
