/* Kirim Invoice Custom CSS */

:root {
  --heading1-fs-custom: 2.5rem;
  --heading2-fs-custom: 2.3rem;
}

/* For medium screens (768px and above) */
@media (max-width: 768px) {
  :root {
      --heading1-fs-custom: 2.2rem;
      --heading2-fs-custom: 2.1rem;
  }
}

/* For small screens (480px and below) */
@media (max-width: 480px) {
  :root {
      --heading1-fs-custom: 2rem;
      --heading2-fs-custom: 1.8rem;
  }
}

html {
  font-size: 100%;
}

body {
  font-size: 16px !important;
}

.kirim-invoice-pages h2 {
  font-size: var(--heading2-fs-custom);
}

.kirim-invoice-pages p {
  font-size: var(--paragraph-fs);
}

.kirim-invoice-container {
  overflow: hidden;
  position: relative;
  background: linear-gradient(
    298.66deg,
    #257ab4 -3.43%,
    #206a9c 8.08%,
    #0f3449 36.22%,
    #0b2835 51.36%
  ) !important;
}

.kirim-invoice-container::before{
    background: transparent url(https://storage.googleapis.com/clevertap-assets/landing-page/stars.webp) repeat;
    position: absolute;
    top: 0;
    bottom: 20%;
    left: 0;
    right: 0;
    display: block;
    z-index: 0;
    opacity: 0.3;
    content: '';    
}

.hero-content h1 {
  text-align: left;
  font-family: Lato;
  font-size: var(--heading1-fs-custom);
  font-weight: 700;
  line-height: 1.5;
  color: #fff;
  margin: 0;
  padding: 0 0 1rem;
}

.hero-content.kirim-invoice p {
  font-size: var(--subheading-fs);
  margin-bottom: 0 !important;
  line-height: 1.8;
}

.button-kirim-invoice {
  z-index: 5;
}

.simulator-container-hero.kirim-invoice {
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 600px;
}

.trusted-by-client {
  padding: 3rem 0;
  width: 100%;
}

.trusted-by-client h3 {
  text-align: left;
  font-weight: 400;
}

.trusted-by-client .kirim-invoice img {
  margin: 0 0.5rem;
}
.client-hero_logo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.client-logo1{
  width: 100%;
  height: 100%;
  max-width: 55px !important;
  max-height: 55px !important;
}
.client-logo2{
  width: 100%;
  height: 100% ;
  max-width: 90px !important;
  max-height: 55px !important;
}
.client-logo3{
  width: 100%;
  height: 100%;
  max-width: 100px !important;
  max-height: 55px !important;
}
.client-logo4{
  width: 100%;
  height: 100%;
  max-width: 100px !important;
  max-height: 55px !important;
}
.users-testimony.kirim-invoice .paper-container {
  padding: 0 1rem 6rem;
}
.container-kenapa {
  color: #fff;
  max-width: 1120px !important;
  margin: 0 auto;
  padding-bottom: 6rem;
}

.kenapa-content.kirim-invoice {
  padding: 4rem 15px 0;
  display: flex;
  justify-content: space-between;
}

.kenapa.kirim-invoice h2 {
  text-align: center;
  font-family: Lato;
  font-size: var(--heading2-fs-custom);
  font-weight: 700;
  line-height: 1.5em;
  color: #fff;
  margin: 0;
  padding: 0;
}

.kenapa-copy.kirim-invoice {
  z-index: 999;
}

.open-api-video.kirim-invoice {
  width: 100%;
  max-width: 720px;
  padding-top: 0;
}
.open-api-video.kirim-invoice svg {
  border: none;
}

.kenapa-copy.kirim-invoice ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}
.kenapa-copy.kirim-invoice h3 {
  font-size: var(--subheading-fs);
  padding-top: 0.2rem;
  padding-left: 1rem;
  padding-bottom: 0.6rem;
}

.kenapa-copy.kirim-invoice p {
  font-size: var(--paragraph-fs);
  padding-top: 0.2rem;
  padding-left: 1rem;
}

#experienceTab.nav-pills .nav-item {
  margin: 0;
}

#experienceTab.nav-pills .nav-link.active {
  background-color: transparent;
  position: relative;
  border: none;
  color: #fff;
}

#experienceTab.nav-pills .nav-link.active::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 5px;
  height: 100%;
  background: linear-gradient(
    165.81deg,
    #bcd688 -6.76%,
    #438dc5 70.04%,
    #133f5d 136.59%
  );
  border-radius: 3px;
  transition: background 2s ease;
}

#experienceTab.nav-pills .nav-link {
  border-radius: 0px;
  border-left: 3px solid #ffffff4d;
  color: #ffffff4d;
  height: max-content;
  width: 462px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

#experienceTab.nav-pills .nav-link:hover {
  color: #fff;
  background-color: transparent;
}

.nav-link.tablist-link .motion-mobile {
  display: none;
}


.kirim-invoice > .kenapa-simulator > .open-api-video > div {
  display: none;
}

.kenapa-simulator.kirim-invoice.active {
  display: block;
}

.kenapa-simulator.kirim-invoice img {
  width: 100%;
  max-width: 600px;
}

.kirim-invoice .testimony-desc p {
  max-width: 650px;
  margin: auto;
}
.users-testimony .jobtitle img{
  max-width: 120px !important;
}
.kirim-invoice-pages .testimony-header  h2 {
  font-size: var(--heading2-fs-custom);
}
.kirim-invoice-pages .testimony-desc p {
  font-size: var(--table-header-fs);
}
.kirim-invoice-pages .carousel b {
  font-family: 'Lato', sans-serif;
}
.kirim-invoice-pages .testimony-title p {
  padding: 0;
}

.testimony-footer {
  display: flex;
  flex-direction: column;
  color: #fff;
  justify-content: center;
  text-align: center;
  padding-top: 5rem;
}
.testimony-footer h2 {
  color: #fff !important;
  padding-bottom: 1.5rem;
}

.kirim-invoice-pages .paper-container {
  padding: 6rem 1rem;
}

.benefit .paper-container h2 {
  padding: 0 0 4rem;
  margin: 0;
  color: #133f5d;
  font-size: var(--heading2-fs-custom);
  text-align: center;
  line-height: 1.5;
}

.oo-content .oo-point h3 {
  padding-bottom: 0.8em;
  font-size: var(--heading3-fs);
  font-weight: 900;
  color: #133f5d;
  line-height: 1.5;
}

.oo-content .oo-point p {
  /* font-size: 1.5rem; */
  line-height: 1.5;
  color: #133f5d;
}

.oo-content .oo-point .right h3,
.oo-content .oo-point .right p {
  padding-left: 5rem !important;
}

.oo-point.custom-order {
  margin-bottom: 4rem;
}

.custom-footer-new-index .kirim-invoice-footer {
  padding: 4rem 1rem 3rem;
  display: flex !important;
  flex-direction: column;
  justify-content: center !important;
  align-items: center;
  text-align: center;
}

.illustration-footer img {
  max-width: 550px;
}

.paperinaja-warapper.kirim-invoice-footer {
  text-align: center;
  max-width: 900px;
}

.paperinaja-warapper.kirim-invoice-footer .paper-heading-content {
  margin-top: -2rem;
}

.paper-heading-content h2, .paperinaja.kirim-invoice-footer .paper-heading-content h2 {
  font-size: var(--heading2-fs-custom);
  padding-bottom: 1rem;
}

.paperinaja-warapper.kirim-invoice-footer {
  padding: 0 !important;
}

.paperin-point.kirim-invoice h3 {
  color: #fff;
  font-weight: 400;
  font-size: 1.5rem;
}

.paperin-point {
  padding-top: 0 !important;
}

.paperinaja .paper-heading-content h2 {
  padding-top: 3rem;
}

.paperin-footer-kirim-invoice {
  padding: 1rem 0;
}

@media (max-width: 1033px) {
  .container-hero.kirim-invoice {
    display: grid !important;
    justify-content: center !important;
    padding: 12em 15px 6em;
    height: auto;
    text-align: center;
  }

  .hero-content.kirim-invoice {
    width: 100%;
    order: 2;
  }

  .simulator-container-hero.kirim-invoice {
    order: 1;
    margin: 3rem auto 12rem;
    width: 100%;
    position: relative;
    z-index: 1;
  }

  .simulator-container-hero.kirim-invoice img {
    left: 0 !important;
  }

  .simulator-container-hero img {
    max-width: 650px;
    margin: 0 auto;
  }

  br {
    display: none;
  }

  .hero-content h1 {
    text-align: center;
    position: relative;
    z-index: 2;
  }

  .trusted-by-client h3{
    text-align: center !important;
  }

  .client-hero_logo {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    gap: 1rem;
  }

  .container-kenapa {
    color: #fff;
    padding: 0 4rem 6rem;
  }

  .kenapa-copy.kirim-invoice p {
    font-size: 1.3rem !important;
    padding-top: 0;
  }

  .kenapa-simulator.kirim-invoice {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  #experienceTab.nav-pills .nav-link {
    height: 160px;
    width: 350px;
  }

  .benefit .paper-container h2 {
    width: 100%;
    max-width: 700px;
    margin-inline: auto;
  }

  .oo-content .oo-point .right h3,
  .oo-content .oo-point .right p {
    padding-left: 0 !important;
  }

  .oo-content .oo-point p {
    /* font-size: 1.3rem; */
  }

  .illustration-footer img {
    max-width: 450px;
  }
}

@media (max-width: 976px) {
  .simulator-container-hero {
    max-width: 550px;
  }

  .kenapa-copy.kirim-invoice .copy {
    padding-bottom: 2rem;
  }

  .kenapa-copy.kirim-invoice h3 {
    font-size: 1.8rem !important;
    margin-bottom: 0.3rem;
  }

  .kenapa-copy.kirim-invoice p {
    font-size: 1.1rem !important;
  }
  #experienceTab.nav-pills .nav-link {
    width: 300px;
  }

  .benefit .paper-container h2 {
    font-size: var(--heading2-fs-custom);
  }

  .oo-content .oo-point h3 {
    padding-bottom: 0.8em;
    font-size: 1.8rem;
  }

  .oo-content .oo-point p {
    /* font-size: 1.1rem; */
  }

  .paperin-point.kirim-invoice h3 {
    color: #fff;
    font-weight: 400;
    line-height: 1.8;
  }

  .paperinaja-warapper.kirim-invoice-footer .paper-heading-content, .kirim-invoice-pages .paperin-point {
    max-width: 600px;
  }

  .kirim-invoice-pages .users-testimony .ut-glass {
    padding: 1rem 2rem;
  }
}

@media (max-width: 768px) {
  .trusted-by-client {
    width: 100%;
  }
  .simulator-container-hero {
    margin: 3rem auto 0;
  }

  .simulator-container-hero img {
    width: 115%;
  } 

  .container-kenapa {
    padding: 0 2rem 4rem;
  }

  .kenapa-content.kirim-invoice {
    padding: 2rem 0 0;
    justify-content: center;
  }

  .kenapa-copy.kirim-invoice h3 {
    font-size: 1.6rem !important;
  }

  .kenapa-copy.kirim-invoice p {
    font-size: 1.5rem !important;
  }

  #experienceTab.nav-pills .nav-link {
    display: block;
    height: max-content;
    width: 100%;
  }

  .benefit .paper-container h2 {
    padding-bottom: 2rem;
    font-size: var(--heading2-fs-custom);
  }

  .oo-content .oo-point h3 {
    padding: 1rem 0 1rem !important;
    font-size: 1.6rem;
  }

  .oo-content .oo-point img {
    padding-top: 4rem;
    margin: -2rem 0 0 !important;
  }

  .oo-content .oo-point:nth-child(1) img {
    padding-top: 0;
  }

  .oo-content .oo-point .left img {
    margin-left: 0 !important;
  }

  .paperin-point.kirim-invoice h3 {
    color: #fff;
    font-weight: 400;
    font-size: 1.1rem;
  }
  .kenapa-simulator.kirim-invoice{
    display: none;
  }
  .nav-link.active.tablist-link .motion-mobile {
    display: block;
    width: 100%;
    max-width: 400px;
  }
  .nav-link.active.tablist-link .motion-mobile img {
    max-width: 400px;
    width: 100%;
  }

  .kirim-invoice-pages .paper-container {
    padding: 4rem 1rem !important;
  }

  .users-testimony.kirim-invoice .paper-container {
    padding: 0 1rem 4rem !important;
  }

  .kenapa-copy.kirim-invoice .copy {
    padding-bottom: 0;
  }

  .financing-simulator-container .container-hero {
    padding: 12rem 1rem 4rem !important;
  }
}

@media (max-width: 633px) {
  .hero-content {
    padding: 0 !important;
  }
  .hero-content h1 {
    padding-bottom: 1rem;
    padding-top: 4rem;
  }

  .simulator-container-hero.kirim-invoice {
    margin-top: 0;
  }

  .kenapa.kirim-invoice p {
    font-size: 1.2rem !important;
  }

  .hero-content p {
    font-size: 1rem;
  }

  .financing-simulator-container .container-hero {
    padding: 10rem 1rem 3rem;
  }

  .button-kirim-invoice {
    font-size: 0.9rem;
    padding: 10px 3px;
  }

  .kenapa-copy.kirim-invoice h3 {
    font-size: 1.4rem !important;
  }

  .oo-content .oo-point img {
    max-width: 400px !important;
  }

  .oo-content .oo-point h3 {
    font-size: 1.4rem;
  }

  .oo-content .oo-point p {
    /* font-size: 1.2rem; */
    line-height: 2;
  }

  .paper-heading-content {
    font-size: 0.8rem;
  }

  .paperin-point.kirim-invoice {
    padding-top: 0;
  }

  .paperin-point.kirim-invoice h3 {
    font-size: 1rem;
  }

  .illustration-footer img {
    max-width: 320px;
  }
}

@media (max-width: 480px) {
  .trusted-by-client {
    width: 100%;
  }
  .client-hero_logo {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    gap: 0.5rem;
  }
  .paper-heading-content h2 {
    font-weight: 800 !important;
  }

  .oo-content .oo-point img {
    width: 120% !important;
  margin-left: -2rem !important;

  }

  .oo-content .oo-point .left img {
  margin-left: -2rem !important;
  }

  .hero-content h1 {
    padding-top: 6rem;
  }
  
  .paperinaja .paper-heading-content h2 {
    padding-top: 7rem;
  }

  .simulator-container-hero.kirim-invoice {
    margin-bottom: 9rem;
  }
}

.banner-up.--primary-blue-bg.--mkt-banner{
  display: none !important;
}

@media (min-width: 1024px) {
  .--mkt-banner#--oa-banner{
    position: fixed;
    z-index: 9999;
    width: 100%;
    display: block;
    background: linear-gradient(240deg, #83BB3D 16.37%, #6F922E 79.6%) !important;
  }
  .kirim-invoice-pages .globalNav{
    margin-top: 2.6em;    
  }
  .oaBannerActive{
    position: fixed;
    width: 100%;
    z-index: 9999;
  }
}
@media (max-width: 1023px) {
  .--mkt-banner#--oa-banner{
    display: none !important;
  }
}