/* Mobile: 1 column */
@media (max-width: 768px) {
  .grid-container {
    grid-template-columns: 1fr; /* 1 column */
    margin: 0 20px;
  }

  .step {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .step-left {
    align-items: start;
  }

  .step-description {
    max-width: 400px;
    text-align: left;
  }
  .container-referral {
    flex-direction: column;
    background-color: #fff;
    margin: 40px 0;
  }

  .box img {
    max-width: 50%;
    height: auto;
    margin: 30px 0;
  }

  .arrow-campaign {
    width: 30px;
  }
  .step-container {
    margin: 0 20px;
  }

  .banner-middle {
    margin: 0 20px;
  }

  .final-text::before,
  .final-text::after {
    display: none;
  }

  .final-image .img {
    width: 200px;
  }

  .desc-red-underline {
    line-height: 1.5;
    margin: 0 20px;
    padding-bottom: 20px;
  }
  .desc-howitworks {
    line-height: 1.5;
    margin: 0 20px;
  }
}

@media (max-width: 600px) {
  .final-image {
    flex-direction: column;
    align-items: center;
  }
}