.home {
  min-height: 100vh;
  height: 100vh;
  position: relative;
  overflow: hidden;
  /* padding: 0px 0 75px; */

  /* @media screen and (max-width: 768px) {
    min-height: 80vh;
  }

  @media screen and (max-width: 500px) {
    height: 60vh;
  } */


  .home__inner {
    @media screen and (min-width: 1080px) {
      max-width: 1920px;
      margin: auto;
    }
  }

  .home__inner__video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    /* background-image: url("assets/images/home-video-1.mp4"); */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

    video,
    iframe {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      scale: 1;
    }

    &::after {
      content: "";
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(90deg, rgba(0, 79, 86, 0.30) 0%, rgba(5, 32, 64, 0.90) 100%);
      z-index: 0;
    }
  }

  .navbar-brand {
    /* width: 100px; */

    img {
      width: 144px;

      @media screen and (max-width: 1300px) {
        width: 100px;

        height: auto;
      }

      @media screen and (max-width: 991px) {
        width: 160px;

        height: auto;
      }
    }
  }

  nav.navbar {
    position: static;
    z-index: 100;
    right: 0;
    left: 0;
    width: 100%;
    border-bottom: 0.5px solid rgba(255, 255, 255, 0.70);
    backdrop-filter: blur(20px);
    padding: 40px 0;

    @media screen and (max-width: 767px) {
      padding: 25px 0;
    }

    .navbar-nav {
      gap: 32px;

      @media screen and (max-width:1100px) {
        /* gap: 25px; */
        gap: 21px;
        gap: 15px;
      }

      &:lang(ar) {
        margin-right: 64px;
        margin-left: 50px;

        @media screen and (max-width:1060px) {
          margin-right: 25px;
        }

        margin-left: auto;
      }

      &:lang(en) {
        margin-left: 64px;
        margin-left: 33px;

        @media screen and (max-width: 1060px) {
          margin-left: 25px;
        }

        /* @media screen and (max-width: 1020px) {
          margin-left: 27px;
        } */

        margin-right: auto;
      }

      @media screen and (max-width: 991px) {
        margin-right: 0 !important;
        margin-left: 0 !important;
        margin-top: 30px;
        display: flex;
        flex-direction: column;
        gap: 16px;
        align-items: center;
        margin: 0;
      }

      li.nav-item {
        a.nav-link {
          color: #fff;
          text-transform: capitalize;
          /* font-size: 16px; */
          font-size: 18px;
          font-size: 17px;
          font-weight: 400;
          position: relative;
          padding: 10px 6px;

          &.active {
            /* color: #f9722f; */
            font-weight: 600;
          }
        }
      }
    }

    .nav__actions {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 24px;

      @media screen and (max-width: 991px) {
        margin-top: 20px;
      }

      @media screen and (max-width: 991px) {
        flex-flow: column nowrap;
      }

      @media screen and (max-width: 1024px) {
        gap: 20px;
      }

      .search {
        display: none;

        img {
          width: 33px;
          height: 33px;
          cursor: pointer;
        }
      }

      .dropdown {
        .dropdown-toggle {
          color: white;
          border-radius: 50px;
          background: rgba(255, 255, 255, 0.12);
          display: flex;
          width: 144px;
          width: 132px;
          height: 48px;
          padding: 12px;
          justify-content: space-between;
          align-items: center;
          border: none;

          &::after {
            display: none !important;
          }

          .dropdown-toggle-right {
            display: flex;
            flex-flow: row nowrap;
            gap: 6px;

            p {
              font-size: 14px;
            }
          }
        }

        .dropdown-menu {
          &:lang(ar) {
            text-align: right;
          }

          &:lang(en) {
            text-align: left;
          }
        }
      }


      .divider {
        width: 1px;
        height: 24px;
        border-radius: 30px;
        background: rgba(255, 255, 255, 0.60);
        display: none;

        @media screen and (max-width: 992px) {
          display: none;
        }
      }
    }



    .navbar-toggler {
      border: 1px solid white;
      background-color: #fff;
      /* display: flex; */

      /* flex-flow: ; */
      &:focus {
        box-shadow: none;
      }

      @media screen and (max-width: 767px) {

        width: 35px;
        height: 30px;
        display: flex;
        padding: 2px;
        justify-content: center;
        align-items: center;

        .navbar-toggler-icon {
          width: 20px;
          height: 20px;
        }
      }
    }
  }

  .home__inner__content {
    min-height: calc(100vh - 135px);
    min-height: calc(100vh - 215px);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-flow: row nowrap;
    /* position: relative; */
    /* z-index: 99; */
    margin-top: 40px;
    /* @media screen and (max-width: 1200px) {
      padding-top: 200px;
    } */

    @media screen and (max-width: 767px) {
      display: flex;
      flex-flow: column nowrap;
      align-items: center;
      justify-content: center;
      gap: 120px;
    }


    .home__inner__content__right {
      display: flex;
      flex-flow: column nowrap;
      gap: 32px;

      @media screen and (max-width: 767px) {
        gap: 20px;
        align-items: center;
      }

      .home__inner__content__right__title {
        color: #FFF;
        font-size: 42px;
        font-weight: 500;

        @media screen and (max-width: 768px) {
          font-size: 35px;
        }

        @media screen and (max-width: 550px) {
          font-size: 29px;
        }
      }

      .home__inner__content__right__description {
        color: #FFF;
        font-size: 20px;
        font-weight: 400;
        line-height: 32px;

        /* 160% */
        @media screen and (max-width: 1200px) {
          width: 80%;
        }

        @media screen and (max-width: 768px) {
          width: 100%;
          font-size: 14px;
        }
      }

      .home__inner__content__right__btn {
        color: #fff;
        font-size: 16px;
        font-weight: 400;
        background-color: transparent;
        border: none;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 16px;
        /* width: fit-content; */
        transition: all 0.5s ease-in-out;
        text-decoration: none;
        width: 192px;
        height: 54px;
        position: relative;

        @media screen and (max-width: 768px) {
          gap: 10px;
          font-size: 14px;
        }

        &::after {
          content: "";
          position: absolute;
          width: 54px;
          height: 54px;
          border-radius: 50px;
          background: linear-gradient(91deg, #2497A4 -53.54%, #1C449A 179.97%);
          z-index: -1;
          transition: all 0.5s ease-in-out;
        }

        &:lang(ar) {
          &::after {
            right: 0;
          }
        }

        &:lang(en) {
          &::after {
            left: 0;
          }
        }

        .home__inner__content__right__btn__icon {
          position: absolute;
          top: 50%;
          display: flex;
          width: 24px;
          height: 24px;
          padding: 5.249px 5.25px 5.252px 5.246px;
          justify-content: center;
          align-items: center;
          opacity: 1;



          &:lang(ar) {
            left: 0;
            transform: translateY(-50%) translateX(100%);
            transition: left 0.5s ease-in-out, opacity 0.5s ease-in-out 0.1s;
          }

          &:lang(en) {
            right: 0;
            transform: translateY(-50%) translateX(-100%);
            transition: right 0.5s ease-in-out, opacity 0.5s ease-in-out 0.1s;

          }

          img {
            width: 100%;
            height: 100%;
          }
        }

        .home__inner__content__right__btn__text {
          height: 100%;
          display: flex;
          align-items: center;
          justify-content: center;
          transition: all 0.5s ease-in-out;

          &:lang(ar) {
            padding-left: 70px;
          }

          &:lang(en) {
            padding-right: 70px;
          }
        }


        &:hover {
          padding: 8px 23px;
          border-radius: 35px;

          .home__inner__content__right__btn__icon {
            opacity: 0;

            &:lang(ar) {
              left: 35%;
              transform: translateY(-50%) translateX(100%);
              transition: left 0.5s ease-in-out, opacity 0.5s ease-in-out 0.1s;
            }

            &:lang(en) {
              right: 35%;
              transform: translateY(-50%) translateX(-100%);
              transition: right 0.5s ease-in-out, opacity 0.5s ease-in-out 0.1s;
            }
          }

          &::after {
            width: 192px;
          }

          .home__inner__content__right__btn__text {
            &:lang(ar) {
              padding-left: 0px;
            }

            &:lang(en) {
              padding-right: 0px;
            }
          }
        }

        @media screen and (max-width: 768px) {

          height: 35px;
          width: 140px;

          &::after {
            height: 35px;
          }

          &.active {
            padding: 8px 23px;
            border-radius: 35px;

            .home__inner__content__right__btn__icon {
              opacity: 0;

              &:lang(ar) {
                left: 35%;
                transform: translateY(-50%) translateX(100%);
                transition: left 0.5s ease-in-out, opacity 0.5s ease-in-out 0.1s;
              }

              &:lang(en) {
                right: 35%;
                transform: translateY(-50%) translateX(-100%);
                transition: right 0.5s ease-in-out, opacity 0.5s ease-in-out 0.1s;
              }
            }

            &::after {
              width: 140px;
            }

            .home__inner__content__right__btn__text {
              &:lang(ar) {
                padding-left: 0px;
              }

              &:lang(en) {
                padding-right: 0px;
              }
            }
          }
        }
      }
    }

    .home__inner__content__left {
      /* max-width: 150px !important; */
      max-width: 92px !important;

      @media screen and (max-width: 768px) {
        display: flex;
        justify-content: center;
        position: absolute;
        bottom: 40px;
        left: 0px;
      }

      .home__inner__text__more {
        min-width: fit-content;
        min-width: 170px;
        display: flex;
        align-items: center;
        gap: 10px;
        transform-origin: center;
        transform: rotate(-90deg);
        cursor: pointer;
        text-decoration: none;

        &:lang(ar) {
          flex-flow: row nowrap;
        }

        &:lang(en) {
          flex-flow: row-reverse nowrap;
        }

        .home__inner__text__more__text {
          /* color: white;
          font-size: 14px;
          font-weight: 400; */
          display: flex;
          align-items: center;
          /* Align text and line */
          gap: 5px;
          /* animation: moveText 2s infinite ease-in-out; */
          min-width: 100px;



          color: #FFF;
          text-align: center;
          font-family: Rubik;
          font-size: 16px;
          font-style: normal;
          font-weight: 400;
          line-height: normal;
        }

        .home__inner__text__more__line {
          min-width: 40px;
          color: white;
          border: 1px solid;
          position: relative;
          animation: pulseWidth 3s infinite ease-in-out;

          &::after {
            content: "";
            border: solid white;
            padding: 4px;
            bottom: 0;
            position: absolute;
            border-width: 2px 0 0 2px;
            left: 2px;
            transform-origin: bottom right;
            transform: rotate(-45deg);
          }
        }
      }
    }
  }

  .home__inner__img__left {
    position: absolute;
    bottom: 0;
    /* height: 100%; */
    /* width: 100%; */
    z-index: 1;

    &:lang(ar) {
      left: 15px;

    }

    &:lang(en) {
      right: 15px;

    }

    @media screen and (max-width: 1200px) {
      bottom: -50px;

      height: 30px;

      img {
        width: 100%;
        height: 100%;
      }
    }

    @media screen and (max-width: 767px) {
      height: 20px;

      img {
        width: 100%;
        height: 100%;
      }
    }
  }

  .home__inner__videos {
    display: flex;
    flex-flow: row nowrap;
    gap: 4px;
    align-items: center;
    position: absolute;
    bottom: 40px;
    /* bottom: 0; */


    &:lang(ar) {
      right: 0;
    }

    &:lang(en) {
      left: 0;
    }

    @media screen and (max-width: 575px) {
      &:lang(ar) {
        right: 15px;
      }

      &:lang(en) {
        left: 15px;
      }
    }

    .home__inner__videos__item {
      width: 24px;
      height: 4px;
      border-radius: 32px;
      background: rgba(255, 255, 255, 0.30);
      transition: all 0.5s ease-in-out;

      @media screen and (max-width: 768px) {
        width: 16px;
      }


      &.active {
        width: 64px;
        background: #FFF;
      }
    }
  }
}

.Crown__Prince {
  position: relative;
  z-index: 1;
  overflow: hidden;
  height: 742px;

  @media screen and (max-width: 1024px) {
    height: auto;
  }

  &::after {
    content: "";
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;

    z-index: 1
  }


  &:lang(ar) {
    &::after {
      left: 0;
      background: linear-gradient(90deg, #FFF 42.09%, rgba(255, 255, 255, 0.00) 86.46%);
    }
  }

  &:lang(en) {
    &::after {
      right: 0;
      background: linear-gradient(90deg, #FFF 42.09%, rgba(255, 255, 255, 0.00) 86.46%);
    }
  }


  &:lang(ar),
  &:lang(en) {
    @media screen and (max-width: 1024px) {
      &::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(0deg, #FFF 33.09%, rgba(255, 255, 255, 0.00) 86.46%);
        z-index: 1
      }
    }


    /* @media screen and (max-width: 1200px) {
      &::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(0deg, #FFF 33%, rgba(255, 255, 255, 0.00) 86.46%);
        z-index: 1
      }
    } */

    @media screen and (max-width: 768px) {
      &::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(0deg, #FFF 45.09%, rgba(255, 255, 255, 0.00) 86.46%);
        z-index: 1
      }
    }
  }

  .Crown__Prince__img {
    position: absolute;
    top: 0;

    &:lang(ar) {
      right: 0;
      /* transform: translateX(-50px); */

      @media screen and (max-width: 1500px) {
        transform: translateX(100px);
      }

      @media screen and (max-width: 1300px) {
        transform: translateX(200px);
      }

      @media screen and (max-width: 1100px) {
        transform: translateX(200px);
      }

      @media screen and (max-width: 1024px) {
        transform: translateX(0x);
      }
    }

    &:lang(en) {
      right: 0;

      @media screen and (max-width: 1500px) {
        transform: translateX(100px);
      }

      @media screen and (max-width: 1300px) {
        transform: translateX(150px);
      }

      @media screen and (max-width: 1100px) {
        transform: translateX(200px);
      }

      @media screen and (max-width: 1024px) {
        transform: translateX(0x);
      }
    }


    &:lang(ar),
    &:lang(en) {
      @media screen and (max-width: 1024px) {
        position: static;
        width: 100%;
        right: 0;
        left: 0;
        top: -70px;
        transform: translateX(0);
      }
    }

    img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }

  .Crown__Prince__inner {
    position: relative;
    z-index: 2;
    display: flex;
    flex-flow: row nowrap;
    display: flex;
    flex-flow: column;
    gap: 16px;
    height: 100%;
    justify-content: center;
    width: 50%;
    margin-right: auto;


    @media screen and (max-width: 1024px) {
      justify-content: flex-end;
      align-items: center;
      padding: 40px 0;
      margin: auto;
      width: 80%;
    }

    .Crown__Prince__text {
      color: #000;
      font-family: Rubik;
      font-size: 32px;
      font-size: 39px;
      font-style: normal;
      font-weight: 600;
      line-height: 50px;
      position: relative;
      display: inline-block;

      .quote {
        /* content: ""; */
        display: inline-block;
        background-image: url("../assets/images/single quote.svg");
        background-repeat: no-repeat;
        background-position: top right;
        background-size: contain;
        width: 50px;
        height: 50px;
        z-index: 1;

        &:lang(ar) {
          rotate: 180deg;

          &:first-of-type {
            rotate: 0deg;

          }
        }

        &:lang(en) {
          rotate: 0deg;

          &:first-of-type {
            rotate: 180deg;
          }
        }

        @media screen and (max-width: 1024px) {
          width: 30px;
          height: 30px;
        }

        @media screen and (max-width: 767px) {
          width: 20px;
          height: 20px;
        }


      }

      /* &::before {
        content: "";
        display: inline-block;
        width: 100%;
        height: 100%;
        background-image: url("../assets/images/single quote.svg");
        background-repeat: no-repeat;
        background-position: top right;
        background-size: contain;
        width: 50px;
        height: 50px;
        z-index: 1;
      } */

      @media screen and (max-width: 1024px) {
        width: 100%;
        text-align: center;
      }

      @media screen and (max-width: 768px) {
        font-size: 24px;
        line-height: 32px;
      }
    }

    .Crown__Prince__inner__owner__word {

      display: flex;
      /* width: 289px; */
      flex-direction: column;
      gap: 8px;

      @media screen and (max-width: 1024px) {
        width: 100%;
        text-align: center;
      }

      .Crown__Prince__inner__title {
        color: #00818D;
        font-family: Rubik;
        font-size: 16px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
      }

      .Crown__Prince__inner__subtitle {
        color: #00818D;
        font-family: Rubik;
        font-size: 16px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
      }
    }
  }
}

.objectives {
  padding: 80px 0;
  background: #F4F4F4;
  position: relative;
  z-index: 1;
  overflow: hidden;

  @media screen and (max-width: 767px) {
    padding: 80px 0 180px;
  }

  .objectives__inner {
    display: flex;
    flex-flow: column;
    gap: 60px;
    position: relative;
    z-index: 1;


    .carousel-arrow {
      position: absolute;
      bottom: -130px;
      display: flex;
      padding: 8px;
      align-items: center;
      gap: 10px;
      border-radius: 40px;
      border: 1px solid #00818D;
      cursor: pointer;

      &#nextBtn-2 {
        right: calc(50% - 35px);
        transform: translateX(50%);
      }

      &#prevBtn-2 {
        left: calc(50% - 35px);
        transform: translateX(-50%);
      }
    }
  }

  .objectives__inner__content {
    display: flex;
    flex-flow: column;
    gap: 60px;

    @media screen and (max-width: 767px) {
      display: none;
    }

    @media screen and (min-width: 767px) and (max-width: 1024px) {
      gap: 40px;
    }

    .objectives__inner__content__itemRight {
      display: flex;
      flex-flow: row nowrap;
      align-items: center;
      gap: 44px;
      width: 80%;
      transition: all 0.2s ease-in-out;

      @media screen and (max-width: 1300px) {
        width: 100%;
      }

      @media screen and (max-width: 1024px) {
        flex-flow: column;
      }

      @media screen and (min-width: 767px) and (max-width: 1024px) {
        gap: 25px;
      }


      &:lang(en) {

        @media screen and (max-width: 1450px) {
          width: 100%;
        }
      }

      &:hover {
        transform: scale(1.03);
      }

    }

    .objectives__inner__content__itemLeft {
      display: flex;
      flex-flow: row nowrap;
      align-items: center;
      gap: 44px;
      width: 80%;
      transition: all 0.2s ease-in-out;

      &:hover {
        transform: scale(1.03);
      }

      .objectives__inner__content__text {
        order: 0;
      }

      .objectives__inner__content__img {
        order: 1;
      }

      &:lang(ar) {
        margin-right: auto;

        @media screen and (max-width: 1300px) {
          width: 100%;
        }

      }

      &:lang(en) {
        margin-left: auto;

        @media screen and (max-width: 1450px) {
          width: 100%;
        }
      }


      @media screen and (max-width: 1024px) {
        flex-flow: column;

        .objectives__inner__content__text {
          order: 1;
        }

        .objectives__inner__content__img {
          order: 0;
        }
      }

      @media screen and (min-width: 767px) and (max-width: 1024px) {
        gap: 25px;
      }

    }

    .objectives__inner__content__img {
      position: relative;
      min-width: 632px;
      /* height: 320px; */
      flex: 1;

      @media screen and (max-width: 1500px) {
        min-width: 530px;
        /* height: 320px; */
      }

      @media screen and (max-width: 1024px) {
        min-width: 100%;
        /* height: 500px;/ */
      }

      img {
        width: 100%;
        /* height: 100%; */
      }

      .objectives__inner__content__img__big {
        @media screen and (min-width: 767px) and (max-width: 1024px) {

          height: 200px;
          width: 100%;
          object-fit: cover;
          border-radius: 8px;
        }
      }

      .objectives__inner__content__img__icon {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        height: 120px;
        flex-shrink: 0;
        align-self: stretch;
        aspect-ratio: 1/1;
        border-radius: 50%;
        backdrop-filter: blur(12px);

        @media screen and (max-width: 1500px) {
          height: 80px;
        }


        @media screen and (max-width: 1200px) {
          height: 60px;
        }

        @media screen and (min-width: 767px) and (max-width: 1024px) {
          height: 60px;
        }

      }
    }



    .objectives__inner__content__text {

      display: flex;
      flex-flow: column;
      gap: 24px;
      flex: 1;

      .objectives__inner__content__text__title {
        font-family: Rubik;
        font-size: 64px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        background: linear-gradient(116deg, #00818D 16.6%, #032752 145.69%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;

        @media screen and (max-width: 1024px) {
          text-align: center;
        }
      }

      .objectives__inner__content__text__description {
        color: #1E1E1E;
        text-align: justify;
        word-spacing: -2px;
        hyphens: auto;
        font-family: Rubik;
        font-size: 20px;
        font-style: normal;
        font-weight: 400;
        line-height: 32px;

        /* 160% */
        @media screen and (max-width: 1024px) {
          /* text-align: center; */
          text-align-last: center;
          font-size: 19px;
        }

      }
    }
  }

  .objectives__inner__content__responsive {
    display: none;
    padding: 40px 0 0;

    @media screen and (max-width: 767px) {
      display: block;
    }

    .objectives__inner__content__responsive__item {
      position: relative;
      width: fit-content;

      .objectives__inner__content__responsive__item__media {

        .objectives__inner__content__responsive__item__img {
          width: 258px;
          height: 172px;
          border-radius: 8px;
          /* background: linear-gradient(110deg, rgba(0, 44, 86, 0.50) 3.97%, rgba(0, 129, 141, 0.50) 78.53%), url(<path-to-image>) lightgray 50% / cover no-repeat; */
          position: relative;

          img {
            width: 258px;
            height: 172px;
            object-fit: cover;
            border-radius: 8px;
          }
        }

        .objectives__inner__content__responsive__item__icon {
          height: 64px;
          flex-shrink: 0;
          align-self: stretch;
          aspect-ratio: 1/1;
          border-radius: 50%;
          backdrop-filter: blur(12px);
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);

          img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: 8px;
          }
        }
      }


      .objectives__inner__content__responsive__item__text {
        width: 338px;
        min-height: 150px;
        display: flex;
        flex-flow: column;
        justify-content: center;
        gap: 10px;

        .objectives__inner__content__responsive__item__title {
          /* text-align: center; */
          font-family: Rubik;
          font-size: 42px;
          font-style: normal;
          font-weight: 700;
          line-height: normal;
          background: linear-gradient(116deg, #00818D 16.6%, #032752 145.69%);
          background-clip: text;
          -webkit-background-clip: text;
          -webkit-text-fill-color: transparent;
        }

        .objectives__inner__content__responsive__item__description {
          color: #1E1E1E;
          font-family: Rubik;
          font-size: 14px;
          font-style: normal;
          font-weight: 400;
          line-height: 18px;
          text-align: justify;
          word-spacing: -2px;
          hyphens: auto;
          /* 128.571% */
        }
      }
    }

    .owl-stage {
      width: fit-content;

      .owl-item {
        justify-content: flex-start !important;
        height: 100%;
        width: fit-content !important;
      }
    }
  }

  .objectives__inner__patternRight {
    position: absolute;
    z-index: -1;
    top: 0;

    width: 832.355px;
    width: 550px;
    height: 600px;
    display: none;

    @media screen and (max-width: 1500px) {
      width: 500px;
    }

    @media screen and (min-width: 767px) {
      display: block;
    }



    &:lang(ar) {
      right: 0;
    }

    &:lang(en) {
      left: 0;
      transform: scaleX(-1);

      @media screen and (max-width:1200px) {
        width: 500px;
        height: 700px;
      }
    }



  }

  .objectives__inner__patternLeft {
    position: absolute;
    z-index: -1;
    bottom: 0;

    width: 550px;
    height: 550px;
    display: none;

    @media screen and (max-width: 1500px) {
      width: 400px;
    }

    &:lang(ar) {
      left: 0;
    }

    &:lang(en) {
      right: 0;
      transform: scaleX(-1);
    }

    @media screen and (min-width: 767px) {
      display: block;
    }
  }



  .responsive {
    @media screen and (max-width: 767px) {
      display: block;
    }

    @media screen and (min-width: 767px) {
      display: none;
    }

    &.objectives__inner__patternRight-mobile,
    &.objectives__inner__patternLeft-mobile {
      position: absolute;
      right: 0;

      width: 120%;

      &:lang(ar) {
        right: -40px;
      }

      &:lang(en) {
        left: -40px;
      }
    }


    &.objectives__inner__patternRight-mobile {
      position: absolute;

      top: 0;
    }

    &.objectives__inner__patternLeft-mobile {
      position: absolute;

      bottom: 0;
    }
  }



}


.board__members {
  padding: 80px 0 120px;
  background: #F4F4F4;
  overflow: hidden;

  .board__members__inner {
    display: flex;
    flex-flow: column;
    gap: 60px;
    align-items: center;
    position: relative;

    @media screen and (max-width: 1024px) {
      gap: 30px;
    }

    .board__members__inner__items__item {
      display: flex;
      width: 390px;
      /* height: 470px; */
      padding: 16px;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      gap: 16px;
      flex-shrink: 0;
      border-radius: 16px;
      border: 1px solid #E8E8E8;
      background: #FFF;

      @media screen and (max-width: 767px) {
        /* width: 320px; */
        width: 300px;
      }

      /* @media screen and (max-width: 576px) {
        width: 320px;
        width: 300px;
      } */

      .board__members__inner__items__item__img {
        flex: 1 0 0;
        align-self: stretch;
        border-radius: 16px;
        overflow: hidden;
        /* width: 358px; */
        min-height: 374px;
        height: 374px;
        flex-shrink: 0;

        @media screen and (max-width: 767px) {
          min-height: 250px;
          height: 250px;
        }

        img {
          width: 100%;
          height: 100%;
          border-radius: 16px;
          object-fit: cover;
          object-position: top;
        }
      }

      .board__members__inner__items__item__info {
        display: flex;
        height: 67px;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 12px;
        flex-shrink: 0;

        .board__members__inner__items__item__info__name {
          color: #1E1E1E;
          text-align: center;
          font-family: Rubik;
          font-size: 16px;
          font-style: normal;
          font-weight: 500;
          line-height: normal;
        }

        .board__members__inner__items__item__info__jobTitle {
          color: #00818D;
          text-align: center;
          font-family: Rubik;
          font-size: 14px;
          font-style: normal;
          font-weight: 400;
          line-height: normal;
        }
      }
    }
  }

  .carousel-arrow {
    position: absolute;
    bottom: -60px;
    display: flex;
    padding: 8px;
    align-items: center;
    gap: 10px;
    border-radius: 40px;
    border: 1px solid #00818D;
    cursor: pointer;

    &#nextBtn {
      right: calc(50% - 48px);
      transform: translateX(50%);
    }

    &#prevBtn {
      left: calc(50% - 48x);
      transform: translateX(-50%);
    }
  }
}



.contact__info {
  background-color: white;
  padding: 40px;
  position: absolute;
  /* left: 140px; */
  right: 50%;
  width: calc(100% - 140px);
  top: -192px;
  border-radius: 200px;
  background: #FFF;
  box-shadow: 0px 4px 40px 0px rgba(146, 154, 165, 0.16);
  transform: translate(50%, -50%);
  z-index: 1;

  @media screen and (max-width: 1200px) {
    /* padding: 20px; */
    top: -192px;
  }

  @media screen and (max-width:960px) {
    width: 350px;
    margin: auto;
    right: 50%;
    transform: translate(50%, -50%);
    border-radius: 30px;
  }

  @media screen and (max-width:500px) {
    width: 342px;
    margin: auto;
    right: 50%;
    transform: translate(50%, -50%);
    border-radius: 30px;
  }

  @media screen and (max-width: 767px) {
    /* padding: 10px; */
  }

  .contact__info__items {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;

    @media screen and (max-width: 960px) {
      flex-flow: column;
      align-items: flex-start;
      gap: 20px;
      width: fit-content;
      margin: auto;
    }

    .contact__info__items__item {
      display: flex;
      align-items: flex-start;
      gap: 16px;

      .contact__info__items__item__icon {
        display: flex;
        width: 48px;
        height: 48px;
        min-width: 48px;
        min-height: 48px;
        padding: 8px;
        justify-content: center;
        align-items: center;
        gap: 10px;
        border-radius: 30px;
        background: linear-gradient(90deg, #00818D 0%, #032752 100%);
      }

      .contact__info__items__item__info {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 10px;

        .contact__info__items__item__info__title {
          color: #1E1E1E;
          font-size: 24px;
          font-weight: 500;
          text-transform: capitalize;

          @media screen and (max-width: 767px) {
            font-size: 18px;
          }
        }

        .contact__info__items__item__info__description {
          color: #666876;
          font-size: 16px;
          font-weight: 500;
          text-transform: capitalize;
          text-decoration: none;

          @media screen and (max-width: 767px) {
            font-size: 14px;
          }
        }


      }
    }
  }
}

.about-container {
  background-image: url('../assets/images/about-background.png');
  background-position: left center;
  background-repeat: no-repeat;

  .about {
    margin: 40px auto;

    @media screen and (min-width: 768px) {
      margin: 140px auto;
      padding: 104px 6vw;
    }

    @media screen and (min-width: 1080px) {
      max-width: 1920px;
    }



    .inner__about {
      position: relative;

      .about__inner__video {
        max-width: 929px;
        flex-shrink: 0;
        position: relative;

        &:lang(ar) {
          margin-right: auto;
        }

        &:lang(en) {
          margin-left: auto;
        }

        video {
          width: 100%;
          height: 100%;
          border-radius: 24px;
          display: block;
        }

        &::after {
          content: "";
          position: absolute;
          inset: 0;
          /* max-width: 929px; */
          width: 100%;
          height: 100%;
          z-index: 0;
          background: linear-gradient(270deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.60) 100%);
          border-radius: 24px;

        }

      }

      .about__inner__content {
        display: flex;
        max-width: 794px;
        padding: 32px;
        flex-direction: column;
        gap: 32px;
        border-radius: 24px;
        background: #FFF;
        box-shadow: 0px 16px 50px 0px rgba(102, 104, 118, 0.16);
        position: absolute;
        top: 50%;

        &:lang(en) {
          left: 0;
        }

        &:lang(ar) {
          right: 0;
        }

        transform: translateY(-50%);

        color: #1E1E1E;
        align-self: stretch;
        font-family: Rubik,
        sans-serif;
        font-style: normal;

        h3 {
          text-align: start;
          font-size: clamp(1.5rem, 4vw, 42px);
          font-weight: 700;
          line-height: normal;
          color: #032752;
        }

        p {
          text-align: justify;
          font-size: clamp(1rem, 2.5vw, 20px);
          font-weight: 400;
          line-height: 1.6;
        }
      }

    }

    @media screen and (max-width: 800px) {
      margin-bottom: 450px;

      &:lang(ar) {
        margin-bottom: 300px;
      }

      .about__inner__content {
        h3 {
          text-align: center !important;
        }
      }

      .inner__about {
        .about__inner__content {
          left: 50%;
          transform: translateX(-50%);
          width: 90%;

          &:lang(ar),
          &:lang(en) {
            right: auto;
            left: 50%;
            transform: translateX(-50%);
          }

          margin-bottom: 40px;
        }
      }
    }
  }
}





.footer {
  padding: 192px 0px 20px;
  background: linear-gradient(90deg, #00818D 0%, #032752 100%);
  position: relative;

  @media screen and (max-width: 1200px) {
    /* padding: 100px 70px 20px; */

  }

  @media screen and (max-width: 676px) {
    /* padding: 40px 35px 20px; */

  }

  .footer__inner {
    padding-bottom: 40px;


  }

  .footer__inner__info {
    display: flex;
    flex-flow: column;
    gap: 24px;

    .footer__inner__info__logo {
      width: 144px;
      height: 52.73px;
      display: none;

      img {
        width: 100%;
        height: 100%;
        object-fit: contain;
      }
    }

    .footer__inner__info__text {
      color: #FFF;
      font-size: 18px;
      font-weight: 400;
    }

    .footer__inner__info__socials {
      display: flex;
      flex-flow: row;
      gap: 20px;
      align-items: center;
    }
  }

  .footer__inner__content {
    display: flex;
    flex-flow: column;
    gap: 20px;

    .footer__inner__title {
      color: #FFF;
      font-size: 20px;
      font-weight: 600;
    }

    .footer__inner__links {
      display: flex;
      flex-flow: column;
      gap: 24px;
      padding: 0;
      margin: 0;

      li {
        display: flex;
        flex-flow: row;
        gap: 8px;
        align-items: center;

        &:nth-of-type(2) {
          width: 70%;

          @media screen and (max-width: 1400px) {
            width: 100%;
          }
        }

        a {
          color: #FFF;
          font-size: 14px;
          font-weight: 400;
          text-decoration: none;
        }
      }
    }
  }

}



.specialties {
  padding: 40px 6vw;

  br {
    display: none;
  }

  @media screen and (min-width: 768px) {
    padding: 140px 6vw;
    display: flex;
    justify-content: space-between;

    br {
      display: block;
    }
  }


  .specialties__header {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-self: stretch;
    color: #1E1E1E;
    font-family: Rubik;
    font-style: normal;
    line-height: normal;
    overflow: hidden;

    h3,
    p {
      @media screen and (min-width: 768px) {
        transform: translateX(100%);


        &:lang(en) {
          transform: translateX(-100%);
        }

        opacity: 1;
        transition: transform 2s ease,
        opacity 2s ease;
      }

    }

    h3 {
      /* color: #1E1E1E; */
      color: #032752;

      text-align: start;
      font-family: Rubik;
      font-size: clamp(24px, 4vw, 42px);
      font-style: normal;
      font-weight: 700;
      line-height: normal;
      margin-bottom: 10px;

      @media screen and (max-width: 450px) {
        text-align: center;
      }
    }

    p {
      color: #676767;
      text-align: start;
      font-family: Rubik;
      font-size: clamp(16px, 2.5vw, 20px);
      font-style: normal;
      font-weight: 500;
      line-height: clamp(24px, 4vw, 32px);

      @media screen and (max-width: 450px) {
        text-align: justify;
        word-spacing: -2px;
        text-align-last: center;
      }
    }
  }

  &:hover .specialties__header h3 {
    transform: translateX(0);
    opacity: 1;
    transition-delay: 0s;
  }

  &:hover .specialties__header p {
    transform: translateX(0);
    opacity: 1;
    transition-delay: 0.3s;
  }

  position: relative;

  .overlay {
    width: 100%;
    position: relative;

    &::before,
    &::after {
      content: '';
      position: absolute;
      width: 100%;
      height: 267px;
      z-index: 222;
      pointer-events: none;
    }

    &::before {
      top: 0;
      background: linear-gradient(360deg, rgba(255, 255, 255, 0.00) 90%, #FFF 100%);
    }

    &::after {
      bottom: 0;
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 90%, #FFF 100%);
    }
  }


  .header__content {
    display: flex;
    justify-content: center;


  }


  .header__content {
    overflow: scroll;
    height: 600px;
  }

  .header__content::-webkit-scrollbar {
    display: none;
  }

  .card {
    @media screen and (max-width: 450px) {
      padding: 8px !important;
      gap: 0px !important;

    }

    display: flex;
    max-width: 370px;
    padding: 16px;
    flex-direction: column;
    border: none;
    gap: 16px;
    flex-shrink: 0;
    border-radius: 12px;
    background: linear-gradient(116deg, rgba(0, 129, 141, 0.08) 16.6%, rgba(3, 39, 82, 0.08) 145.69%),
    #FFF;
    margin: 16px;
    font-size: clamp(14px, 2.5vw, 16px);

    @media screen and (min-width: 400px) {
      padding: 8px !important;
    }

    .card__title {
      font-family: Rubik;
      font-size: clamp(20px, 3.5vw, 32px);
      font-style: normal;
      font-weight: 600;
      line-height: clamp(24px, 4vw, 28px);
      background: linear-gradient(110deg, #002C56 3.97%, #00818D 78.53%);
      background-clip: text;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }


    p {
      @media screen and (max-width: 450px) {
        font-size: 10px !important;
      }

      text-align: justify;
      word-spacing: -2px;
      hyphens: auto;
      color: #1E1E1E;
      font-family: Rubik;
      font-size: clamp(14px, 2vw, 16px);
      font-style: normal;
      font-weight: 500;
      line-height: normal;
    }

    &:hover {
      transform: scale(1.05);
    }
  }

}



.help {
  margin-bottom: 140px;
  padding: 80px 6vw;
  overflow: hidden;

  @media screen and (min-width: 768px) {
    padding: 140px 6vw;
    margin-bottom: 140px;
  }

  background-image: url('../assets/images/Hero-Image.svg');
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  z-index: 1;
  background-size: cover;

  .form {
    z-index: 99999999999;
    display: flex;
    max-width: 550px;
    padding: 24px;
    flex-direction: column;
    justify-content: center;
    gap: 24px;
    border-radius: 24px;
    background: #FFF;
    box-shadow: 0px 4px 40px rgba(146, 154, 165, 0.16);

    .nav {
      margin: 24px auto;
      display: flex;
      justify-content: space-between;
      height: 54px;
      padding: 8px;
      align-items: center;
      align-self: stretch;
      border-radius: 38px;
      background: #F5F6F9;

      button {
        text-decoration: none;
        color: #667085;
        text-align: center;
        font-family: "Rubik", sans-serif;
        font-size: clamp(14px, 1.5vw, 16px);
        font-weight: 400;
        padding: 8px;
        flex: 1 0 0;
        cursor: pointer;
        margin: auto 10px;
        transition: background 1s ease-out, color 2s ease;
        border: none;
        background-color: transparent;
        border-radius: 32px;
      }

      @media screen and (max-width: 375px) {
        button {
          padding: 5px;
          margin: auto 7px;

        }
      }

      button:hover:not(.active) {
        background: #f0f0f0;
        color: #1E1E1E;
        border-radius: 32px;
      }

      .active {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 10px;
        padding: 8px;
        flex: 1 0 0;
        border-radius: 32px;
        background: #FFF;
        box-shadow: 0px 0px 8px rgba(71, 84, 103, 0.10);
        color: #1E1E1E;
        text-align: center;
        font-family: "Rubik", sans-serif;
        font-size: clamp(14px, 1.5vw, 16px);
        font-weight: 500;

        /* Transition added for smooth animation */
        transition: background 0.3s ease, box-shadow 0.3s ease, color 0.3s ease;
      }

    }

    input {
      border-radius: 40px;
      border: 1px solid #D0D5DD;
      margin: 12px 0 20px;
    }

    label {
      color: #1E1E1E;
      text-align: right;
      font-family: "Rubik", sans-serif;
      font-size: clamp(13px, 1.3vw, 14px);
      font-weight: 500;
      text-transform: capitalize;
      align-self: stretch;
    }

    .required {
      color: #FF0000;
    }

    textarea {
      display: flex;
      height: 122px;
      padding: 16px;
      justify-content: flex-end;
      align-items: flex-start;
      gap: 10px;
      align-self: stretch;
      border-radius: 8px;
      border: 1px solid #D0D5DD;
      resize: none;
      box-shadow: none;
    }

    input {
      box-shadow: none;
    }

    .valid {
      border-color: green;
    }

    .in-valid {
      border-color: red;
    }

    .foot {
      text-align: end;

      button {
        margin-top: 24px;
        width: 170px;
        height: 54px;
        padding: 12px;
        border-radius: 50px;
        background: linear-gradient(90deg, #00818D 0%, #032752 100%);
        color: #FFF;
        font-family: "Rubik", sans-serif;
        font-size: clamp(14px, 1.5vw, 16px);
        font-weight: 500;
        text-align: center;
        border: none;
        transition: background 0.3s, transform 0.2s ease-in-out;
      }

      button:hover {
        background: linear-gradient(90deg, #032752 0%, #00818D 100%);
        transform: scale(1.05);
      }

      button:disabled {
        background: #d3d3d3;
        color: #a1a1a1;
        cursor: not-allowed;
        transform: none;
      }

    }

  }

  .spotlight {
    position: absolute;

    top: 50%;
    z-index: -1;
    transform: translateY(-50%);

    &:lang(ar) {
      left: 548px;
    }

    &:lang(en) {
      right: 548px;
    }

    .circle-1,
    .circle-2,
    .circle-3 {
      animation: opacityMove 1s infinite alternate;
    }

    .circle-1 {
      animation-delay: 0s;
    }

    .circle-2 {
      animation-delay: 0.2s;
    }

    .circle-3 {
      animation-delay: 0.4s;
    }
  }


}

.footer__rights {

  color: rgba(255, 255, 255, 0.60);
  font-size: 14px;
  font-weight: 400;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 0 0;
  /* border-top: 1px solid ; */
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  /* width: calc(100% - 140px); */
  margin: auto;
}



@keyframes opacityMove {
  0% {
    opacity: 0.1;
  }

  50% {
    opacity: 0.5;
  }

  100% {
    opacity: 1;
  }

}