.app-showcase {
  width: 100%;
  margin-top: 0px;
  padding: 50px 0;
}

.showcase-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2rem;
}

.showcase-cta {
  flex: 0 1 auto;
  text-align: center;
  padding: 2rem;
  z-index: 3;
}

.showcase-cta .btn {
  margin-bottom: 1rem;
  font-size: 1.25rem;
  padding: 1rem 2.5rem;
}

.cta-text {
  color: var(--primary);
  font-size: 1.125rem;
  font-weight: 700;
}

.showcase-image.mobile {
  content: "";
  background: linear-gradient(90deg, #6f5edd 0%, #e1bdfd 100%);
  width: 95vw;
  height: 300px;
  border-radius: 0 140px 140px 0;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  padding-right: 2px;
  margin-top: 80px;
}

.showcase-image.mobile img {
  height: 380px;
}

.showcase-image.desktop {
  content: "";
  background: linear-gradient(270deg, #6f5edd 0%, #e1bdfd 100%);
  width: 95vw;
  height: 300px;
  border-radius: 140px 0 0 140px;
  position: relative;
  bottom: 0px;
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
  align-self: flex-end;
  padding-left: 0px;
  margin-top: 50px;
}

.showcase-image.desktop img {
  width: 400px;
}

/* Tablet - 768px and up */
@media (min-width: 768px) {

}

/* Desktop - 1024px and up */
@media (min-width: 1024px) {
  .app-showcase {
    overflow: visible;
  }

  .app-showcase .showcase-content {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
  }

  .showcase-cta {
    order: 2;
  }

  .showcase-image.mobile {
    order: 1;
    width: 35vw;
  }

  .showcase-image.desktop {
    order: 3;
    width: 35vw;
  }
}

/* Large Desktop - 1280px and up */
@media (min-width: 1280px) {
  
}

/* Large Desktop - 1440px and up */
@media (min-width: 1440px) {
  
}