.hero-wrap {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    padding: 14em 0 !important; /* default desktop */
  }

  /* Tablets */
  @media (max-width: 992px) {
    .hero-wrap {
      padding: 10em 0 !important;
    }
  }

  /* Mobile landscape */
  @media (max-width: 768px) {
    .hero-wrap {
      padding: 7em 0 !important; /* reduce height */
    }
  }

  /* Mobile portrait (iPhones, Samsung, etc.) */
  @media (max-width: 480px) {
    .hero-wrap {
      padding: 7em 0 !important; /* tighter for small phones */
      background-position: top center;
      background-size: 100% auto;
    }
  }

  /* Very small phones */
    @media (max-width: 360px) {
      .hero-wrap {
      padding: 7em 0 !important;
    }
  }

  .footer-fade {
      background-image: url('../images/FooterFade.png');
      background-size: cover;
      background-position: center; 
      background-repeat: no-repeat;
  }

  .footer-product {
    padding-bottom: 0.2rem !important;
  }