.homepage {
  @apply com-w-full com-min-h-screen com-bg-white com-overflow-hidden;

  .homepage-section {
    @apply com-max-w-screen-xl com-container com-pt-12 md:com-pt-24 com-px-4 md:com-px-0;

    .page-heading {
      max-width: 500px;
      @apply com-mb-6 com-mt-2 md:com-mt-6 com-text-3xl md:com-text-6xl com-text-center md:com-text-left com-font-bold com-leading-none com-text-Yankees-Blue;

      span {
        color: #57c3b9;
      }
    }

    .homepage-actions {
      @apply md:com-absolute com-mt-4 md:com-mt-12 com-flex com-justify-center md:com-justify-start com-gap-3 com-flex-wrap com-z-10;

      .homepage-action {
        background-color: #57c3b9;
        border-color: #57c3b9;
        @apply com-w-full sm:com-w-auto com-rounded-xl;

        &:hover {
          background-color: rgba(87, 195, 185, 0.8);
          border-color: rgba(87, 195, 185, 0.8);
        }
      }
    }

    .homepage-arrow {
      @apply com-ml-auto com-mt-8 com-hidden md:com-block com-max-w-xs com-min-h-[140px];
      @apply com-absolute com-bottom-16 com--right-16;
    }

    .section-heading {
      @apply com-mt-0 com-mb-8 md:com-mb-12 com-text-left;

      h2 {
        a {
          @apply com-m-0 com-text-2xl md:com-text-4xl com-font-semibold com-text-Yankees-Blue com-no-underline;
        }
      }
    }

    .subheading {
      @apply com-text-base md:com-text-xl com-leading-relaxed com-font-normal com-text-gray-500 com-mb-8 md:com-mb-12 com-mt-1;
    }

    app-search-box {
      &::ng-deep {
        nb-form-field {
          .main-search-bar {
            @apply com-bg-white com-text-black;
          }
        }
      }
    }

    .testimonials {
      @apply com-flex com-flex-col com-m-0;

      .heading {
        @apply com-text-center md:com-text-xl com-text-base com-font-bold com-text-primary-500 com-m-0 md:com-mb-4 com-mb-6;
      }

      .subheading {
        @apply com-text-center md:com-text-4xl com-text-2xl com-font-bold com-text-black com-m-0 md:com-mb-[52px] com-mb-6;
      }

      .testimonial-card {
        @apply com-flex com-justify-center;
      }
    }
  }
}

.homepage-callout {
  @apply com-py-12 com-bg-blue-50;

  .content {
    color: #0095ff;
  }

  .homepage-get-started {
    background-color: #0095ff;
    @apply com-mt-2;
  }
}

.homepage-static-image {
  @apply com-w-full com-h-full;
  img {
    @apply com-w-full com-h-full;
  }
}
