.reward-app-download {
  background-color: var(--background-color);
  color: var(--primary-black);
  clip-path: none;

  .reward-app-download-container {
    margin-top: var(--space-40px);

    @media (width >= 768px) {
      margin-top: var(--space-80px);
    }
  }

  .hero-section {
    .g-row {
      align-items: center;
    }

    .hero-content {

      .hero-image-mobile {
        margin-block: var(--space-12px);
      }

      .hero-title,
      .hero-description {
        color: var(--primary-black);
      }

      .hero-description {
        margin: 0;
        @media (width >= 768px) {
          margin: var(--space-16px) 0 calc(var(--space-32px) + var(--space-24px));
        }
      }

      .cta-download-wrapper {
        margin: 0;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;

        @media (min-width: 1024px) {
          justify-content: flex-start;
        }

        .cta-primary {
          padding: 8px 16px;
          background-color: var(--primary-blue-700);
          color: var(--secondary-white);
          font-size: var(--heading-font-20-mob-text);
          line-height: var(--heading-lh-4--mob-text-medium);
          height: fit-content;
          width: auto;
          order: 1;
          margin-top: var(--space-30px);

          &:hover {
            background-color: var(--primary-blue-900);
          }

          @media (min-width: 1024px) {
            padding: 12px 24px;
          }
        }
      }

      .download-section {
        order: 2;

        .download-text {
          color: var(--primary-blue-700);
        }

        .download-app_btn-divider {
          border-color: var(--primary-blue-700);
        }
      }
    }
  }

  .benefits-section {
    margin-top: var(--space-40px);
    padding-block: 0;

    @media (width >= 768px) {
      margin-top: var(--space-80px);
    }

    .benefits-title {
      color: var(--primary-black);
    }

    .reward-cards-container {
      .reward-card {

        .reward-card-number {
          display: block;
          font-size: calc(var(--heading-font-2-des) + var(--space-2px));
          font-style: normal;
          font-weight: var(--fw-600);
          line-height: var(--heading-lh-28-des);
          color: var(--secondary-black);
          margin-bottom: var(--space-28px);

          @media (width >= 768px) {
            margin-bottom: var(--space-24px);
          }
        }

        .reward-card-title {
          color: var(--primary-black);
          width: 100%;
          position: relative;
          padding-bottom: var(--space-16px);
          margin-bottom: var(--space-16px);

          &::before {
            content: '';
            width: 100%;
            height: 1px;
            position: absolute;
            bottom: 0;
            left: 0;
            background: linear-gradient(90deg, rgba(0, 0, 0, 0.00) 0%, var(--primary-black) 50%, rgba(0, 0, 0, 0.00) 100%);
          }
        }

        .reward-card-bullets {
          color: var(--primary-black);
        }
      }
    }
  }
}