.why-choose {
  background: rgba(var(--bg-color-6));
  /* padding: 77px 0px 136.4px; */
  position: relative;

  .why-choose__main {
    display: flex;
    flex-direction: column;
    gap: 67px;
    /* max-width: 1042.4px; */
    margin: 0 auto;

    .why-choose__details {
      display: flex;
      flex-direction: column;
      gap: 8px;

      .why-choose__eyebrow {
        text-align: center;

        span {
          font-size: var(--font-24);
          line-height: 3.25;
          font-weight: 400;
          color: rgba(var(--text-color-20));
          position: relative;

          &::before {
            content: "";
            position: absolute;
            max-width: 40px;
            width: 100%;
            height: 1px;
            top: 50%;
            left: -56px;
            background-color: rgba(var(--bg-color-20));
          }

          &::after {
            content: "";
            position: absolute;
            max-width: 40px;
            width: 100%;
            height: 1px;
            top: 50%;
            right: -56px;
            background-color: rgba(var(--bg-color-20));
          }

        }
      }

      .why-choose__title {
        font-family: var(--font-source-serif-4);
        font-weight: 700;
        font-size: var(--font-9-2);
        line-height: 1;
        color: rgba(var(--text-color-1));
        text-align: center;
      }
    }
  }
}

/* Split card */
.why-card {
  display: flex;
  /* margin: 0 auto; */
  border-radius: var(--border-radius-7) 0;
  overflow: hidden;
  box-shadow: 0px 10px 25px 0px rgba(var(--bg-color-6), 15%);
  border: 1px solid rgba(var(--border-color-2), 10%);

  .why-card__left {
    width: 60.4%;
    background: linear-gradient(90deg,
        rgba(var(--bg-color-6)),
        rgba(var(--bg-color-14)));
    padding: 56px 33.6px 56px 56px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 24px;

    .why-card__heading {
      font-family: var(--font-source-serif-4);
      font-weight: 600;
      font-size: var(--font-10);
      line-height: 1;
      color: rgba(var(--text-color-1));
    }

    .why-card__text {
      font-weight: 400;
      font-size: var(--font-24);
      line-height: 1.6;
      color: rgba(var(--text-color-1));
      max-width: 510.4px;
    }

    .why-card__btn {
      margin-top: 33.6px;
    }
  }

  .why-card__right {
    width: 39.6%;
    background: rgba(var(--bg-color-1));
    padding: 40px 56px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 32px;

    .award-badge {
      border-radius: var(--border-radius-4);
      width: 100%;
      object-fit: contain;
    }

    .why-checklist {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column;
      gap: 16px;

      li {
        display: flex;
        align-items: start;
        gap: 10px;
        font-weight: 500;
        font-size: var(--font-24);
        line-height: 1.3;
        color: rgba(var(--text-color-6));

        .why-checklist__icon {
          flex-shrink: 0;
          width: 24px;
          height: 24px;
          border-radius: 50%;
          background: rgba(var(--bg-color-10));
          display: flex;
          align-items: center;
          justify-content: center;

          svg {
            width: 10px;
            height: 10px;
          }
        }
      }
    }
  }
}

/*  light version */
.light_why_choose_section {
  background-color: rgba(var(--bg-color-26)) !important;

  .why-choose__title {
    color: rgba(var(--text-color-2)) !important;
  }

  .section__wave {
    path {
      fill: rgba(var(--bg-color-26)) !important;
    }
  }

}

/* Responsive */
@media (max-width: 991px) {
  .why-choose {
    padding: 46px 0px 98px;

    .why-choose__main {
      gap: 40px;

      .why-card {
        flex-direction: column;

        .why-card__left {
          padding: 35px;

          .why-card__btn {
            margin-top: 10px;
          }
        }

        .why-card__right {
          padding: 30px 43px !important;

          img {
            max-width: 360px;
          }
        }

        .why-card__left,
        .why-card__right {
          width: 100% !important;
        }
      }
    }
  }
}

@media (max-width: 767px) {
  .why-card__left {
    padding: 32px;
  }

  .why-card__right {
    padding: 32px;
  }

  .why-checklist__icon {
    width: 24px;
    height: 24px;
  }
}

@media (max-width: 480px) {
  .why-card__right img {
    height: 95px;
  }
}