.everything_section {
  padding: 120px 20px 0 20px;
  position: relative;

  @media (max-width: 991.98px) {
    padding: 0 20px 0 20px;
  }

  @media (max-width: 767.98px) {
    padding: 0 20px 0 20px;
  }

  .vector-img {
    position: absolute;
    right: 0;
    top: -20%;

    @media (max-width: 767.98px) {
      width: 100px;
      top: unset;
      bottom: 100px;
    }

    @media (max-width: 575.98px) {
      width: 60px;
      top: unset;
      bottom: 190px;
    }
  }

  .everything_container {
    max-width: 1240px;
    margin: 0 auto;
    position: relative;

    .everything_content {
      width: 100%;
      margin: 0 auto;
      gap: 10px;

      .border_blue {
        border: 1px solid var(--color-neavy-blue);
        width: 40px;
        border-radius: 18px;
      }

      .everthing-top-text {
        @media (max-width: 576.98px) {
          font-size: 12px !important;
        }
      }
    }

    .everything_heading {
      margin-top: 20px;

      @media (max-width: 575.98px) {
        margin-top: 10px;
      }
    }

    .everything_para {
      opacity: 70%;
      font-size: var(--text-base);

      @media (max-width: 575.98px) {
        font-size: 14px;
      }
    }

    .everything_wrapper {
      margin-top: 60px;
      gap: 26px;
      justify-content: space-between !important;

      @media (max-width: 565.98px) {
        gap: 50px;
      }

      @media (max-width: 575.98px) {
        margin-top: 50px;
      }

      .everything_left_content {
        max-width: 580px;

        @media (max-width: 1119.98px) {
          max-width: 500px;
        }

        @media (max-width: 991.98px) {
          max-width: 660px;
          width: 100%;
        }

        .everything_left_content_heading {
          font-size: var(--text-5xl);

          @media (max-width: 575.98px) {
            font-size: 22px !important;
          }
        }

        .everything_left_content-para {
          opacity: 70%;
          /* letter-spacing: 0.4px; */

          /* font-size: var(--text-base); */

          @media (max-width: 575.98px) {
            font-size: 14px;
            max-width: 303px;
          }
        }

        .flex_icons_wrapper {
          gap: 11px;

          .icon_wrapper {
            display: flex;
            gap: 6px;

            .icon {
              width: 24px;
              height: 24px;
            }
          }
        }
      }

      .everything_img {
        max-width: 554px;

        img {
          height: 405px;
          max-width: 554px;
          width: 100%;

          @media (max-width: 1023.98px) {
            height: auto;
          }

          @media (max-width: 575.98px) {
            height: 256px !important;
          }
        }
      }
    }
  }

  .slider-controls {
    position: absolute;
    left: 0px;
    bottom: 52px;
    display: flex;
    gap: 10px;
    z-index: 10;

    @media (max-width: 1199.98px) {
      bottom: 10px;
    }

    @media (max-width: 991.98px) {
      bottom: -60px;
      left: 50%;
      transform: translateX(-50%);
    }

    @media (max-width: 767.98px) {
      bottom: -45px;
    }

    @media (max-width: 575.98px) {
      transform: none;
      left: 0;
    }
  }

  .custom-prev,
  .custom-next {
    width: 40px;
    height: 40px;
    background: var(--color-neavy-blue);
    border: 2px solid transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.3s ease;

    @media (max-width: 575.98px) {
      width: 36px;
      height: 36px;

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

  .custom-prev svg path,
  .custom-next svg path {
    transition: all 0.3s ease;
  }

  .custom-prev:hover,
  .custom-next:hover {
    background: #fff;
    border-color: var(--color-neavy-blue);
  }

  .custom-prev:hover svg path,
  .custom-next:hover svg path {
    stroke: var(--color-neavy-blue) !important;
  }

  .swiper-pagination {
    text-align: center;
    bottom: 1px !important;
    width: 245px !important;
    left: 0;
    position: absolute;

    @media (max-width: 1199.98px) {
      bottom: -30px !important;
    }

    @media (max-width: 991.98px) {
      bottom: -100px;
      display: none;
    }
  }

  .swiper-pagination-bullet {
    background-color: var(--color-neavy-blue);
    opacity: 12%;
    width: 12px;
    border-radius: 50%;
    height: 12px;
  }

  .swiper-pagination-bullet-active {
    opacity: 50%;
  }
}

/* --------side-by-side-section---- */
.side_section {
  padding: 120px 20px;
  position: relative;

  @media (max-width: 991.98px) {
    padding: 160px 20px 120px 20px;
  }

  @media (max-width: 767.98px) {
    padding: 140px 20px 80px 20px;
  }

  @media (max-width: 565.98px) {
    padding: 140px 20px 90px 20px;
  }

  .vector-img1 {
    position: absolute;
    max-width: 451px;
    width: 100%;
    rotate: 157deg;
    left: -210px;
    bottom: 70px;
    z-index: -1;

    @media (max-width: 992px) {
      max-width: 390px;
    }

    @media (max-width: 768px) {
      max-width: 290px;
    }

    @media (max-width: 576px) {
      max-width: 132px;
      left: -30px !important;
      bottom: 350px !important;
    }
  }

  .side_container {
    max-width: 1240px;
    margin: 0 auto;

    .side_wrapper {
      width: 100%;
      margin: 0 auto;
      gap: 10px;

      .border_blue {
        border: 1px solid var(--color-neavy-blue);
        width: 40px;
        border-radius: 18px;
      }

      .everthing-top-text {
        @media (max-width: 576.98px) {
          font-size: 12px !important;
        }
      }
    }

    .see_wrapper {
      align-items: center;

      .see_heading {
        margin-top: 20px;

        @media (max-width: 575.98px) {
          margin-top: 10px;
        }
      }

      .see_para {
        opacity: 0.7;
        font-size: var(--text-lg);
        max-width: 393px;

        @media (max-width: 767.98px) {
          max-width: 100%;
        }

        @media (max-width: 575.98px) {
          font-size: 14px;
          padding-right: 20px;
        }
      }
    }

    .table_wrapper {
      margin-top: 60px;
      margin-bottom: 100px;
      border-radius: 12px;

      /* width: 100%; */
      border: #316dc65c 1px solid;
      background-color: white;
      overflow: hidden;

      @media (max-width: 1199.98px) {
        overflow-x: scroll;
        display: block;
        margin-bottom: 90px;
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
        margin-right: -20px;
      }

      &::-webkit-scrollbar {
        height: 5px;
      }

      &::-webkit-scrollbar-track {
        background: #f0f0f0;
      }

      &::-webkit-scrollbar-thumb {
        background-color: var(--color-neavy-blue);
        border-radius: 5px;
      }

      .custom-table {
        width: 100%;
        border-collapse: collapse;

        @media (max-width: 1199.98px) {
          min-width: 1190px;
        }

        .custom-thead {
          background-color: var(--color-neavy-blue);
          width: 100%;

          th {
            padding: 27px 24px;
            text-align: center;
            font-size: var(--text-xl);
            line-height: var(--line-height-150);
            color: var(--color-light-white);
            font-weight: normal;

            @media (max-width: 991.98px) {
              white-space: nowrap;
            }

            &:first-child {
              border-top-left-radius: 12px;
            }

            &:last-child {
              border-top-right-radius: 12px;

              @media (max-width: 565.98px) {
                border-top-right-radius: 0px;
              }
            }
          }
        }

        .custom-tbody {
          tr:nth-child(even) {
            background-color: #043b6f0a;
          }

          tr:nth-child(odd) {
            background-color: #fefefe;
          }

          td {
            padding: 12px 26px 15.3px 24px;
            font-size: 18px;
            line-height: var(--line-height-150);
            color: var(--color-neavy-blue);
            font-weight: normal;
            border-right: 1px solid #316dc65c;

            @media (max-width: 991.98px) {
              white-space: nowrap;
            }

            img {
              margin: 0 auto;
              width: 20px;
              height: 20px;
            }
          }

          .td-gap {
            gap: 10px;
          }
        }
      }
    }

    .btn-wrapper {
      gap: 57px;
      margin-top: 30px;

      @media (max-width: 991.98px) {
        gap: 32px;
      }

      @media (max-width: 767.98px) {
        gap: 20px;
      }

      @media (max-width: 575.98px) {
        gap: 12px;
        margin-top: 40px;
        padding-right: 20px;
      }

      .table-btn {
        background-color: var(--color-neavy-blue);
        padding: 12px 32px;
        border-radius: 100px;
        font-family: "Geologica", sans-serif;
        border: 1px transparent solid;
        font-size: var(--text-base);
        line-height: var(--line-height-110);
        color: var(--color-off-white);
        transition: all 0.3s ease;

        @media (max-width: 767.98px) {
          padding: 12px 52px;
        }

        &:hover {
          background-color: transparent;
          border-color: var(--color-neavy-blue);
          color: var(--color-neavy-blue);
        }
      }

      .btn-1 {
        @media (max-width: 575.98px) {
          padding: 12px 55.5px !important;
        }
      }

      .btn-2 {
        @media (max-width: 575.98px) {
          padding: 12px 51.4px !important;
        }
      }

      .btn-3 {
        @media (max-width: 575.98px) {
          padding: 12px 58px !important;
        }
      }

      .btn-4 {
        @media (max-width: 575.98px) {
          padding: 12px 54px !important;
        }
      }
    }

    .btn-5 {
      @media (max-width: 539.98px) {
        padding: 12px 51px !important;
        max-width: 350px;
        width: 100%;
      }
    }
  }
}

.my-swiper {
  position: relative;
}

.footer-section {
  padding: 50px 20px 0;
  background-color: var(--color-neavy-blue);

  @media (max-width: 765.98px) {
    padding: 40px 20px 0;
  }

  .subscribe-container {
    background-color: var(--color-off-white);
    max-width: 1240px;
    margin: 0 auto;
    border-radius: 12px;
    padding: 66.5px;

    @media (max-width: 991.98px) {
      padding: 40px;
    }

    @media (max-width: 767.98px) {
      padding: 28px;
    }

    @media (max-width: 575.98px) {
      padding: 42px 29px;
    }

    .subscribe-content {
      margin: 0 auto;

      .email-box {
        margin-top: 59px !important;
        display: flex;
        max-width: 778px;
        margin: 0 auto;
        justify-content: center;
        align-items: center;
        gap: 16px;

        @media (max-width: 767.98px) {
          margin-top: 40px !important;
        }

        @media (max-width: 575.98px) {
          flex-direction: column;
          gap: 10px;
        }

        .email-text {
          background-color: var(--color-off-white);
          border: 1px solid var(--color-neavy-blue);
          padding: 13px 24px;
          color: var(--color-neavy-blue);
          font-size: 16px !important;
          font-weight: 600;
          max-width: 368px;
          width: 100%;
          line-height: var(--line-height-100);
          border-radius: 36px;

          @media (max-width: 575.98px) {
            width: 100%;
          }

          &::placeholder {
            color: var(--color-neavy-blue);
          }
        }

        .submit-btn {
          padding: 15px 31px;
          background-color: var(--color-green);
          border-radius: 100px;
          font-family: "Geologica", sans-serif !important;
          font-size: var(--text-base);
          font-weight: 600;
          color: var(--dark-black);
          border: 1px solid var(--color-green);
          line-height: var(--line-height-110);
          transition: all 0.3s linear;

          @media (max-width: 575.98px) {
            width: 100%;
            font-size: 16px !important;
          }

          &:hover {
            background-color: var(--color-light-white);
          }
        }
      }
    }
  }

  .footer-container {
    max-width: 1240px;
    margin: 0 auto;
    margin-top: 80px !important;

    .footer-wrapper {
      @media (max-width: 767.98px) {
        gap: 40px;
      }

      .logo-content {
        max-width: 280px;

        @media (max-width: 575.98px) {
          max-width: 100%;
        }

        .text-lg {
          @media (max-width: 575.98px) {
            font-size: 16px !important;
          }
        }

        img {
          margin-bottom: 20px !important;
        }

        .para {
          margin-top: 12px !important;
        }
      }

      .link-wrapper {
        gap: 48px;

        @media (max-width: 991.98px) {
          width: 100%;
        }

        @media (max-width: 423.98px) {
          gap: 24px;
        }

        .link-column {
          max-width: 125px;
          width: 100%;
          min-width: 125px;

          &:last-child {
            ul {
              gap: 16px !important;
            }
          }

          @media (max-width: 424.98px) {
            max-width: 149px;
            /* min-width: 159px; */
            width: 100%;
            /* justify-content: center !important; */
          }

          p {
            margin-bottom: 12px !important;

            @media (max-width: 575.98px) {
              font-size: 18px !important;
            }
          }

          ul {
            gap: 10px !important;
            list-style: none;
            padding-left: 0 !important;
            margin-bottom: 0;

            li {
              font-size: var(--text-lg);
              line-height: var(--line-height-150);
              color: var(--color-off-white);
              font-weight: normal;

              @media (max-width: 575.98px) {
                font-size: 14px !important;
              }

              a {
                color: var(--color-off-white);
                text-decoration: none;
                position: relative;
                display: inline-block;

                &::after {
                  content: "";
                  position: absolute;
                  left: 0;
                  width: 100%;
                  height: 1px;
                  background-color: var(--color-off-white);
                  transform: scaleX(0);
                  transition: transform 0.3s ease;
                }

                &::after {
                  bottom: 0;
                  transform-origin: center;
                }

                &:hover::after {
                  transform: scaleX(1);
                }
              }
            }

            .social-link a {
              display: flex;
              align-items: center;
              gap: 10px;
            }
          }

          svg {
            width: 24px;
            height: 24px;

            @media (max-width: 575.98px) {
              width: 20px;
              height: 20px;
            }
          }
        }
      }
    }

    .custom-border {
      border: 1px solid white;
      opacity: 50%;
      margin-top: 52px !important;

      @media (max-width: 575.98px) {
        margin-top: 50px !important;
      }
    }

    .footer-bottom-wrapper {
      padding: 14px 0 !important;
      width: 100%;

      @media (max-width: 767.98px) {
        padding: 10px 0 18px 0 !important;
        gap: 12px;
      }

      p {
        text-align: start;

        @media (max-width: 767.98px) {
          text-align: center !important;
          width: 100%;
        }
      }
    }
  }
}

.get-more-section {
  padding: 0 20px;
  background-image: url(/assets/images/png/get-more-bg-img.png);
  background-position: top;
  background-repeat: no-repeat;
  background-size: cover;

  .get-more-container {
    max-width: 1240px;
    padding: 123px 0 100px 0;
    margin: auto;

    @media (max-width: 991.98px) {
      padding: 80px 0 80px 0;
    }

    @media (max-width: 767.98px) {
      padding: 60px 0 60px 0;
    }

    .get_wrapper {
      width: 100%;
      margin: 0 auto;
      gap: 10px;

      .border_blue {
        border: 1px solid var(--color-neavy-blue);
        width: 40px;
        border-radius: 18px;
      }

      .everthing-top-text {
        @media (max-width: 576.98px) {
          font-size: 12px !important;
        }
      }
    }

    .see_wrapper {
      align-items: center;
      gap: 10px;

      @media (max-width: 576.98px) {
        gap: 0px;
      }

      .see_heading {
        margin-top: 20px;
        max-width: 703px;

        @media (max-width: 575.98px) {
          margin-top: 10px;
        }
      }

      .see_para {
        max-width: 330px;
        opacity: 0.7;
        font-size: var(--text-lg);

        @media (max-width: 767.98px) {
          max-width: 100%;
        }

        @media (max-width: 575.98px) {
          font-size: 14px;
          padding-right: 20px;
        }
      }
    }

    .get-wrapper {
      margin-top: 60px;
      grid-template-columns: repeat(4, 1fr);
      gap: 24px;

      @media (max-width: 991.98px) {
        margin-top: 50px;
      }

      .get_card {
        max-width: 293px;
        padding: 19px;
        height: 100%;
        border: 1px solid #043b6f1f;
        border-radius: 16px;
        transition: all 300ms linear;

        @media (max-width: 1199.98px) {
          max-width: 100%;
        }

        .icon-box {
          height: 60px;
          width: 60px;
          display: flex;
          align-items: center;
          justify-content: center;
          border-radius: 100%;
          background: var(--color-neavy-blue);
          transition: all 300ms ease;

          svg {
            color: var(--color-off-white);
            transition: all 300ms ease;

            path {
              fill: currentColor;
            }
          }
        }

        .white-blur-box {
          height: 140px;
          top: -50px;
          right: -65px;
          pointer-events: none;
          width: 140px;
          background: var(--color-off-white);
          border-radius: 100%;
          filter: blur(100px);
        }

        .tittle-wrapper {
          display: flex;
          flex-direction: column;
          gap: 12px;

          .title-heading {
            color: var(--color-neavy-blue);
            font-weight: 400 !important;
            transition: color 300ms ease;

            @media (max-width: 575.98px) {
              font-size: 24px !important;
              line-height: 100%;
              /* max-width: 300px; */
            }
          }

          .tittle-para {
            font-size: 16px !important;
            color: var(--color-black);
            opacity: 0.7;
            transition: color 300ms ease;
            /* @media (max-width: 575.98px) {
                font-size: 16px;
                line-height: 150%;
          } */
          }
        }

        &:hover {
          background-color: var(--color-neavy-blue);
          box-shadow: 4px 4px 17.5px 0px #043b6f40;

          .icon-box {
            background: var(--color-off-white);

            svg {
              color: var(--color-neavy-blue);
            }
          }

          .title-heading {
            color: var(--color-off-white);
          }

          .tittle-para {
            color: var(--color-off-white);
            opacity: 1;
          }
        }
      }
    }
  }
}

.get_swiper {
  .swiper-slide {
    height: auto;

    .get_card {
      max-width: none;
      height: 100%;
    }
  }

  .swiper-slide.swiper-slide-active {
    .get_card {
      background-color: var(--color-neavy-blue);
      border-color: #043b6f1f;
      box-shadow: 4px 4px 17.5px 0px #043b6f40;

      .icon-box {
        background: var(--color-off-white);

        svg {
          color: var(--color-neavy-blue);
        }
      }

      .title-heading {
        color: var(--color-off-white) !important;
      }

      .tittle-para {
        color: var(--color-off-white) !important;
        opacity: 1 !important;
      }
    }
  }

  .get_swiper_dots {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 14px;
    margin-top: 24px;

    @media (max-width: 575.98px) {
      margin-top: 40px;
      gap: 8px;
    }

    .swiper-pagination-bullet {
      width: 10px;
      height: 10px;
      border-radius: 100px;
      background-color: #043b6f1a;
      transition: all 300ms linear;
      cursor: pointer;
      opacity: 100%;
      margin: 0 !important;
    }

    .swiper-pagination-bullet-active {
      /* width: 12px;
      height: 12px; */
      background-color: #043b6f66;
    }
  }
}
