@media (max-width: 767px) {
    .sub-services {
        .swiper-wrapper {
            flex-wrap: nowrap !important;
            gap: 0 !important;
            /* .sub-service-item {
                width: 100%;
            } */
        }
    }

    .why-this-service {
        .swiper-wrapper {
            flex-wrap: nowrap !important;
            gap: 0 !important;
            .why-this-service-point {
                border-right: 1px solid #e6e6e6 !important;
                border-bottom: 1px solid #e6e6e6 !important;
                border-left: 0;
                border-top: 0;

                div {
                    padding: 0 20px 32px 20px !important;
                }

                &:nth-of-type(4),
                &:nth-of-type(5),
                &:nth-of-type(6) {
                    .why-this-description {
                        padding-bottom: 32px !important;
                    }
                }

                &::after {
                    content: "";
                    position: absolute;
                    width: 6px;
                    height: 6px;
                    background: #004f90;
                    right: -3px;
                    bottom: -3px;
                    border-radius: 100%;
                    z-index: 1;
                }

            }
        }
    }
}

@media (max-width: 1024px) {
  .sub-services {
    .sub-service-item {
        width: calc(50% - 10px);

      div {
        padding: 26px 16px !important;
        gap: 14px !important;
      }

      h3 {
        font-family: DM Sans !important;
        font-weight: 600 !important;
        font-size: 18px !important;
        line-height: 100% !important;
        letter-spacing: 0%; !important
      }

      p {
        font-family: DM Sans !important;
        font-weight: 300 !important;
        font-size: 14px !important;
        line-height: 23px !important;
        letter-spacing: 0% !important;
      }
    }
  }

  .why-this-service {
    .swiper-wrapper {
        .why-this-service-point {
            width: 50%;
            
            div {
                padding: 32px 20px !important;
                gap: 14px;

                svg {
                    width: 63px;
                    height: 65px;
                    margin-bottom: 10px;
                }

                .why-this-title {
                    font-family: DM Sans;
                    font-weight: 400;
                    font-size: 20px;
                    line-height: 100%;
                    letter-spacing: 0%;
                }

                .why-this-description {
                    font-family: DM Sans;
                    font-weight: 400;
                    font-size: 14px;
                    line-height: 21px;
                    letter-spacing: 0px;
                }
            }

            &:nth-of-type(1),
            &:nth-of-type(2),
            &:nth-of-type(3) {
                div {
                    padding-top: 0 !important;
                }
            }

            &:nth-of-type(4),
            &:nth-of-type(5),
            &:nth-of-type(6) {
                div {
                    padding-bottom: 0 !important;
                }
            }
        }
    }
  }
}

.sub-services {
  /* max-width: 1440px;
    margin: 100px auto; */

  .swiper-wrapper {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;

    .sub-service-item {
      width: calc(33.33% - 40px / 3);
      box-shadow: 0px 0px 36px 0px #0000000f;
      border-radius: 6px;
      transition: all 600ms ease;

      & > div {
        padding: 40px;
        display: flex;
        flex-direction: column;
        gap: 16px;
      }

      .icon {
        padding: 15px;
        background: #e8f4ff;
        margin-bottom: 8px;
        border-radius: 100%;
        display: inline-flex;
        height: 49px;
        width: 49px;
        transition: all 600ms ease;
        align-items: center;
        justify-content: center;

        svg {
          width: 19px;
          height: 19px;
          transition: all 600ms ease;
        }
      }

      h3.sub-service-title {
        margin: 0;
        font-family: DM Sans;
        font-weight: 600;
        font-size: 21px;
        line-height: 100%;
        letter-spacing: 0%;
        color: #121212;
      }

      p.sub-service-description {
        margin: 0;
        font-family: DM Sans;
        font-weight: 300;
        font-size: 16px;
        line-height: 23px;
        letter-spacing: 0%;
        color: #9f9f9f;
      }

      &:hover {
        transform: scale(0.98);

        .icon {
          background: #004f90;

          svg {
            filter: brightness(0) saturate(100%) invert(99%) sepia(0%)
              saturate(256%) hue-rotate(219deg) brightness(115%) contrast(100%);
          }
        }
      }
    }
  }
}

.why-this-service {
  /* max-width: 1440px;
  margin: 100px auto; */
  .swiper-wrapper {
    display: flex;
    flex-wrap: wrap;
    .why-this-service-point {
      width: calc(33.33% - 2px);
      border-color: #e6e6e6;
      position: relative;

      &:nth-of-type(1),
      &:nth-of-type(2),
      &:nth-of-type(4),
      &:nth-of-type(5) {
        border-right: 1px solid #e6e6e6 !important;
      }

      &:nth-of-type(1),
      &:nth-of-type(2),
      &:nth-of-type(3) {
        border-bottom: 1px solid #e6e6e6 !important;
      }

      &:nth-of-type(1)::after,
      &:nth-of-type(2)::after {
        content: "";
        position: absolute;
        width: 6px;
        height: 6px;
        background: #004f90;
        right: -3px;
        bottom: -3px;
        border-radius: 100%;
        z-index: 1;
      }

      > div {
        padding: 60px;
        display: flex;
        flex-direction: column;
        gap: 16px;
      }

      &:nth-of-type(1),
      &:nth-of-type(2),
      &:nth-of-type(3) {
        div {
            padding-top: 0;
        }
      }

      &:nth-of-type(4),
      &:nth-of-type(5),
      &:nth-of-type(6) {
        div {
            padding-bottom: 0;
        }
      }

      svg {
        width: 83px;
        height: 85px;
        margin-bottom: 16px;
      }

      .why-this-title {
        margin: 0;
        font-family: DM Sans;
        font-weight: 400;
        font-size: 26px;
        line-height: 100%;
        letter-spacing: 0%;
        color: #121212;
      }

      .why-this-description {
        margin: 0;
        font-family: DM Sans;
        font-weight: 400;
        font-size: 16px;
        line-height: 26px;
        letter-spacing: 0px;
        color: #9f9f9f;
      }
    }
  }
}

.sub-services-nav {
    display: flex;
    justify-content: end;
    gap: 20px;
    margin-top: 22px;
    
    > .sub-services-slider-prev,
    > .sub-services-slider-next {
      padding: 8px;
      box-shadow: 0px 0px 36px 0px #0000000F;
      border-radius: 100%;
      background: #fff;
      display: inline-flex;
      svg {
        width: 24px;
        height: 24px;
      }
    } 
  }
  
  @media (min-width: 768px) {
    .sub-services-nav {
      display: none !important;
    }
  }