body {
  margin: 0;
  font-family: "open-sans", sans-serif;
  overflow-x: hidden; /* prevent horizontal scroll */
}
main {
  overflow: hidden;
}
.main-content {
  text-align: center;
  padding-inline: 3rem;
}

.btn {
  text-decoration: none;
  padding: 10px 20px;
  background-color: #000;
  border-radius: 20px;
  color: #fff;
  border: 0;
}

.tools {
  left: 0;
  width: 100%;
  height: auto;

  z-index: 0;
}

#contact-form {
  background-image: url("../images/footer-bg.svg");
  background-position: center top; /* align image from top center */
  background-repeat: no-repeat;
  background-size: auto 120%; /* stretch height, width auto */

  margin-top: -30%; /* overlap previous section */
  padding: 15rem 2rem;
  color: #000; /* text color */
  text-align: center;
}

#contact-info {
  text-align: center;
}
input {
  padding: 10px;
  margin: 10px;
  box-shadow: inset 0px 5px 5px -5px rgba(0, 0, 0, 0.3);
  border: 0px;
  border-radius: 10px;
  width: 80%;
  max-width: 300px;
}

.submit-btn {
  font-size: 120%;
  padding: 10px 20px;
  margin: 10px;
  border: none;
  border-radius: 10px;
  background-color: #000;
  color: #fff;
  cursor: pointer;
  box-shadow: 0px 5px 5px -5px rgba(0, 0, 0, 0.3);
}

#back-div {
  display: flex;
  flex-direction: row-reverse;
}

@media (min-width: 750px) {
  .main-content {
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
    gap: 2rem;
    /* padding: 4rem 3rem; */
    direction: ltr;
  }

  .text-content {
    text-align: end; /* right-align inside container */
    max-width: 50%; /* text + button width */
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 1rem; /* spacing between h2, p, button */
  }

  .tools {
    flex: 0 0 20%; /* image width */
    max-width: 40%;
    height: auto;
    object-fit: contain;
    z-index: 0;
  }
  #contact-form {
    background-image: url("../images/footer-bg.svg");
    background-position: center top; /* align image from top center */
    background-repeat: no-repeat;
    /* background-size: auto 120%; stretch height, width auto */

    margin-top: -30%; /* overlap previous section */
    padding: 15rem 2rem;
    color: #000; /* text color */
    text-align: center;
  }
}