body {
  margin: 0;
  padding: 0;
  color: var(--text-color) !important;
  font-family: "Poppins", sans-serif !important;
  /* direction: rtl; */
}

body[dir="rtl"] {
  /* font-family: "Tajawal", sans-serif !important; */

  .fas.fa-arrow-right {
    transform: scaleX(-1);
  }
  
  .stat-box:not(:last-child)::after {
    right: unset;
    left: -65px;
  }

  .stats-section {
    .wrap {
      margin-left: unset;
    }
  }

  .has-sub-dropdown .arrow {
    transform: rotate(180deg); 
  }

  .sub-dropdown { left:unset; right: 100%; }
  .nav-links .dropdown{right: 0;left: unset;}

  .arrow:not(.has-sub-dropdown .arrow){left: -25px;right: unset !important;}
  

  .insights-section h2{translate: 50%;}
  .insight:not(:last-child)::after{right: unset; left: -20px;}
  .HR .insight:not(:last-child)::after{right: unset; left: -110px;}
  .success-stories .card .circle{left: unset; right: -35px;}
  .phase-card:not(:last-child):after{left: unset; right: 340px; transform: scaleX(-1);}

  .img-wrap img{
    border-bottom-right-radius: 200px;
    border-top-right-radius: 200px;
    border-bottom-left-radius: unset;
    border-top-left-radius: unset;
  }

  .fade-left-section { --transform-direction: 100px; }
}




:root {
  --primary-color: #9A1A3F;
  --text-color: #121212;
  --orange-color:#E7603E;
  --grey-text-color: #5A5A5A;
  --light-grey: #747474;
  --white-color: #FFFFFF;
  --pink-color: #fff3f0;
  --bg-pink: #FFDCD4;
  --input-border: #D9D9D9;
  --footer-bg : linear-gradient(268.32deg, #E7603E 1.14%, #BF3C3F 23.69%, #9A1A3F 98.86%);
  --footer-btn-bg: #E7603E;

}

a{text-decoration: none !important;}

.primary-btn,
.primary-outline-btn {
  background-color: var(--primary-color);
  color: white;
  padding: 10px 30px;
  border-radius: 40px;
  text-decoration: none;
  font-weight: 400;
  font-size: 18px;
  outline: none;
  border: none;
  font-family: "poppins" !important;
}

.primary-outline-btn {
  background-color: var(--white-color);
  color: var(--primary-color);
  border: 1px solid var(--primary-color);
}

.primary{color: var(--primary-color);}

.pink-bar-bg {
  background-image: url(../assets/bg/Rectangle.png);
  background-repeat: no-repeat;
}

.strip-overlay{
  /* background-image: url(.../assets
/bg/small-right-strip.png); */
  background-image: url(../assets/bg/strip.png);
  background-repeat: no-repeat;
  background-position: right top;
}

.left-strip-overlay{
  /* background-image: url(../assets
/bg/small-lefft-strip.png); */
  background-image: url(../assets/bg/left-strip.png);
  background-repeat: no-repeat;
  background-position: left top;
}

h2 {
  font-size: 32px;
  font-weight: 500 ;
  margin-bottom: 30px;
  color: var(--text-color);
  /* line-height: 33px !important; */
}

.page-title{
  color: var(--primary-color);
  font-weight: 600;
  font-size: 50px;
  margin-bottom: 30px;
}

.colored-header{
  background-color: var(--primary-color);
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  text-align: center;
  padding: 15px 10px;
}
.colored-header-desc{
  box-shadow: 0px 1px 4px 0px #74747433;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  padding: 20px;
  background-color: var(--white-color);
}

iframe{ width: 60%;height: 800px; border: none;}

/* ***************************************************************** */
/* ************************ TOP HEADER ***************************** */
/* ***************************************************************** */

header{
  position: sticky;
  top: 0;
  width: 100%;
  z-index: 9999;
}

.top-bar {
  background-color: var(--bg-pink);
  padding: 10px;
}

.top-bar .left span {
  margin-right: 20px;
  font-size: 14px;
  font-weight: 400;
  color: var(--text-color);
}

.mobile-only .left span {
  margin-right: 0;
}

.top-bar .right input {
  padding: 6px 20px;
  border-radius: 20px;
  border: none;
  outline: none;

}



input::placeholder{
  color: #747474;
  font-size: 12px;
  font-weight: 300px;
}

/* ***************************************************************** */
/* ************************ NAVBar ********************************* */
/* ***************************************************************** */

/* Navbar */
.navbar {
  background-color: white;
  box-shadow: 0px 4px 5px 0px #00000024;
  height: 120px;
}

.nav-links {
  list-style: none;
  display: flex;
  gap: 48px;
  margin: 0;
  padding: 0;
}

.nav-links li a {
  text-decoration: none;
  color: var(--grey-text-color);
  font-weight: 400;
  padding: 10px 0;
  position: relative;
  font-size: 18px;
}

.nav-links li a.active {
  color: var(--primary-color);
  font-weight: 600;
}

.nav-links li a.active::after {
  content: '';
  display: block;
  width: 28px;
  height: 2px;
  background: var(--primary-color);
  margin: auto;
  margin-top: -3px;
}

.arrow , .has-sub-dropdown .arrow{
  font-size: 0.8rem;
  margin-left: 4px;
  
}
.arrow:not(.has-sub-dropdown .arrow){
position: absolute;
  top: 5px;
  right: -20px;
}

.nav-links li a.active + .arrow{color: var(--primary-color);}

.nav-right {
  display: flex;
  align-items: center;
  gap: 15px;
}
.nav-right-mobile{display: none;}

.btn-contact {
  background-color: var(--primary-color);
  color: white;
  padding: 8px 20px;
  border-radius: 20px;
  text-decoration: none;
  font-weight: 500;
}

/* Hide hamburger on desktop */
.hamburger {
  display: none;
  font-size: 28px;
  cursor: pointer;
}

select{
  outline: none;
  border: none;
  cursor: pointer;
}

/* Base dropdown (first level) */
.nav-links .has-dropdown {
  position: relative;
}

.navbar .nav-links ul{
  list-style: none;
  padding: 10px 0;
}
.nav-links .dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  display: none;
  flex-direction: column;
  background-color: white;
  border: 1px solid #ccc;
  min-width: 200px;
  z-index: 1000;
}

.nav-links .serv.dropdown{ min-width: 290px;}

/* Sub-dropdown (second level) */
.has-sub-dropdown {
  position: relative;
}

.sub-dropdown {
  position: absolute;
  top: 0;
  left: 100%;
  display: none;
  flex-direction: column;
  background-color: white;
  border: 1px solid #ccc;
  min-width: 200px;
  /* padding-inline-end: 25px !important; */
  z-index: 1001;
}

.dropdown-title {
  padding: 0 12px;
  font-weight: 600;
  font-size: 14px;
  color: #969494;
  cursor: default;
  pointer-events: none;
}



/* Styling links */
.dropdown li{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 15px;
}
.dropdown li a{
  font-weight: 400;
  font-size: 15px;
}

.sub-dropdown li a {
  /* padding: 8px 15px; */
  display: flex;
  justify-content: space-between;
  color: var(--text-color);
  font-size: 15px;
  font-weight: 400;
  text-decoration: none;
  white-space: nowrap;
}

.dropdown li:hover,
.sub-dropdown li:hover {
  background-color: #f0f0f0;
}

/* ***************************************************************** */
/* ************************ HERO SECTION *************************** */
/* ***************************************************************** */

    .left-content {
      max-width: 88%;
      padding-top: 40px;
    }

    .left-content h2, .plg-banner .left-content h2 {
      color: var(--primary-color);
      font-size: 42px;
      font-weight: 600;
      margin-bottom: 30px;
    }

    h2 .title{
      position: relative;
      display: inline-block;
    }

    h2 .title::after, .plg-banner h2 .title::after{
      content: '';
      position: absolute;
      bottom: -10px;
      left: 0;
      width: 100%;
      height: 5px;
      background: var(--primary-color);
      border-radius: 5px;
    }

    .plg-banner .left-content h2 { line-height: 65px; }
    .plg-banner h2 .title::after{ bottom: 0px; }


    .left-content p {
      font-size: 20px;
      font-weight: 300;
      margin-bottom: 20px;
    }

    .left-content p span {
      font-weight: 500;
    }

    .left-content p span.colored {
      font-weight: 600;
      color: var(--orange-color);
    }

    .buttons {
      margin-top: 30px;

      i{
        position: relative;
        top: 2px;
        margin-inline-start: 5px;
      }
    }


    .right-content {
      position: relative;
    }

    .main-img {
      width: 650px;
      height: 650px;
      background-image: url('../assets/bg/circles-bg.png');
      background-size: cover;
      overflow: hidden;
      position: relative;
    }

    .main-img .img-circles, .plg-banner .main-img .bottom-img-circles{
      background-image: url(../assets/bg/dots-bg.png);
      width: 100%;
      height: 100%;
      background-repeat: no-repeat;
      background-position-x: right;
      position: absolute;
      right: 70px;
      top: 30px;
    }

    .plg-banner .main-img .bottom-img-circles{
      background-position: bottom;
      right: 175px;
      top: -50px;
      z-index: -1;
    }

    .main-img .image{
      width: 520px;
      height: 500px;
      border-radius: 50%;
      position: absolute;
      top: 75px;
      left: 70px;
    }

    .main-img .image img{
      height: 100%;
      width: 100%;
      object-fit: cover;
      border-radius: 50%;
    }

   

    .small-img {
      width: 170px;
      height: 170px;
      border-radius: 50%;
      border: 3px solid white;
      overflow: hidden;
      position: absolute;
      bottom: 70px;
      left: 60px;
      border: 1px solid var(--orange-color);
    }

    .small-img img{
      width: 100%;
      height: 100%;
      object-fit: cover;
    }


/* ************************************************************************************ */
/* ************************ TRUSTED COMPANIES SECTION ********************************* */
/* ************************************************************************************ */

.trusted-companies {
  text-align: center;
}

.trusted-companies .trusted-wave,
.services.trusted-companies .trusted-wave{
  background-image: url(../assets/bg/top-wave-bg.png);
  width: 100%;
  height: 570px;
  background-repeat: no-repeat;
  background-size: cover;
  margin-top: -180px;
  align-content: center;
}

.services.trusted-companies .trusted-wave{
  margin: -140px 0 100px;
}

.trusted-companies .trust-wrap{
  padding-top: 20%;
}

.trusted-companies h2 {
  font-weight: 600;
  font-size: 30px;
  margin-bottom: 30px;
  color: var(--text-color);
}

.trusted-companies .swiper{
  margin-top: 70px;
}

.trusted-companies .swiper-slide img {
  height: 90px;
  max-width: 100%;
  object-fit: contain;
}
    
/* *************************************************************************** */
/* ************************ SERVICES SECTION ********************************* */
/* *************************************************************************** */
.services-section {
  padding: 30px 0 60px ;
  
}
.services .header h2 {
  font-size: 32px;
  font-weight: 500;
  margin-bottom: 30px;
  padding-top: 30px;
}

.services .header p {
  margin: 5px 0;
  color: var(--text-color);
  font-weight: 300;
  font-size: 20px;
}

.services .header p strong {
  font-weight: 500;
}

.cards {
  display: flex;
  gap: 25px;
  margin-top: 40px;
  flex-wrap: wrap;
  justify-content: center;
}

.service-card{
  background: var(--white-color);
  border-radius: 10px;
  padding: 20px 10px;
  box-shadow: 0px 2px 4px 0px #00000026;
  text-align: center;
  max-width: 305px;
}

.up-wave{
  background-image: url(../assets/bg/up-wave.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom;
  width: 100%;
  height: 460px;
}

.space-top{ margin-top: -130px;}

.pg p{
  font-weight: 300;
  font-size: 20px;
  
  strong{ font-weight: 500;}

}

/* .serv{
  flex-wrap: wrap;
  gap: 30px;
} */

.service-card img {
  width: 40px;
  height: 40px;
  margin-bottom: 15px;
}

.service-card h3 {
  font-size: 17px;
  font-weight: 500;
  margin-bottom: 10px;
}

.service-card p {
  font-size: 14px;
  font-weight: 300;
  color: var(--grey-text-color);
  line-height: 25px;
  min-height: 60px;
  padding-inline: 20px;
}

.more-btn button {
  display: inline-block;
  margin-top: 15px;
  color: var(--primary-color);
  font-weight: 400;
  font-size: 14px;
  border: none;
  outline: none;
  background-color: var(--white-color);

  i{
    position: relative;
    top: 1px;
    margin-inline-start: 5px;
  }
}

.service-card button, .tool-box button {
  display: inline-block;
  margin-top: 15px;
  color: var(--primary-color);
  font-weight: 400;
  font-size: 14px;
  border: none;
  outline: none;
  background-color: var(--white-color);

  i{
    position: relative;
    top: 1px;
    margin-inline-start: 5px;
  }
}

/* ***************************************************************** */
/* ******************** Number SECTION ***************************** */
/* ***************************************************************** */

.stats-section {
  background: var(--pink-color);
  margin-top: 20px;
  padding: 5px 0 60px;
  text-align: center;
}

.stats-section .wrap{
  background-image: url(../assets/bg/dots-bg.png);
  background-repeat: no-repeat;
  height: 130px;
  margin-left: -25px;
  margin-top: -60px;
}

    .stats-section h2 {
      font-size: 32px;
      margin-bottom: 60px;
      font-weight: 500;
    }

    .stats-wrapp{
      display: flex;
      flex-direction: column;
    }

    .stats-container {
      display: flex;
      justify-content: space-between;
      margin: 0 auto 60px;
      width: 80%;
    }

    .stat-box{
      background: linear-gradient(360deg, var(--primary-color) 46.77%, var(--orange-color) 100%);
      color: var(--white-color);
      border-radius: 70px;
      align-content: center;
      width: 140px;
      height: 140px;
      padding: 16px 10px;
      position: relative;
    }

    .stat-box:not(:last-child)::after {
      content: "";
      position: absolute;
      top: 50%;
      right: -65px;
      width: 50px;
      height: 10px;
      background-image: url(../assets/bg/Line\ 8.png);
      background-repeat: no-repeat;
    }
    

    .stat-box p {
      font-size: 24px;
      font-weight: 600;
      margin-block: 0;
      line-height: 30px;
    }

    .stat-box span,.stat-box.sec span{
      font-size: 18px;
      font-weight: 600;
      line-height: 18px;
    }

    .stat-box.sec span{
      font-size: 14px;
      font-weight: 300;
    }

    .stat-box:first-child:not(.stat-box.sec) span{
      font-weight: 300;
      font-size: 11px;
    }


/* ***************************************************************** */
/* ************************ Reviews ******************************** */
/* ***************************************************************** */
  
  .testimonials-section {
    background: var(--white-color);
    padding: 70px 0;
  }

  .testimonials-section .strip-overlay{
    background-position: right top;
  }

  .testimonials-section h2 {
    font-weight: 500;
    font-size: 32px;
    margin-bottom: 35px;
  }

  .testimonials-section .swiper{
    padding: 40px 10px;
    margin-bottom: 40px ;
    background: #f2f2f2;
  }

  .testimonials-section .swiper-slide {
    background-color: #f2f2f2;
    /* border-radius: 10px; */
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  }

  .swiper-slide video {
    width: 100%;
    height: 200px;
    display: block;
  }
    
/* ***************************************************************** */
/* ************************ FEATURES ******************************* */
/* ***************************************************************** */

  .why-section {
      background-color: var(--pink-color);
      padding: 60px 0;
      text-align: center;
    }

  .why-section .strip-overlay{
    background-position: right top;
  }

    .why-section h2 {
      font-size: 32px;
      font-weight: 500;
      margin-bottom: 60px;
    }

    .features {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 60px 30px;
      max-width: 1200px;
      margin: 0 auto 60px;
      padding-top: 40px;
    }

  .features .wrap{
    background-image: url(../assets/bg/dots-bg.png);
    background-repeat: no-repeat;
    height: 130px;
    margin-left: -25px;
    margin-top: -60px;
  }

    .feature-card {
      background-color: #fff;
      padding: 20px;
      border-radius: 10px;
      width: 310px;
      box-shadow: 0px 2px 10px 0px #00000040;
      text-align: center;
      position: relative;
    }

    .feature-card img {
      width: 80px;
      margin-bottom: 15px;
      margin-top: -55px;
      
    }

    .feature-card h3 {
      font-size: 18px;
      font-weight: 600;
      margin: 10px 0 15px ;
      color: var(--text-color);
    }

    .feature-card p {
      font-size: 15px;
      color: var(--grey-text-color);
      font-weight: 400;
    }

    @media (max-width: 768px) {
      .feature-card {
        width: 90%;
      }
    }

/* ***************************************************************** */
/* ************************ Map SECTION **************************** */
/* ***************************************************************** */

/* Business Forward Section */
  .business-forward {
    padding: 4rem 0;
    text-align: center;
  }

  .business-forward h2 {
    font-size: 32px;
    font-weight: 500;
    margin-bottom: 40px;
  }

  .business-forward p {
    font-weight: 300;
    font-size: 22px;
    color: var(--text-color);
    width: 70%;
    padding-inline: 35px;
    margin: 0 auto ;

    strong{ font-weight: 500;}
  }

  p.colored-p{
    font-weight: 500 !important;
    font-size: 22px !important;
    color: var(--primary-color) !important;
    margin-bottom: 30px;
  }

  .business-forward button {
      width: 315px;
      margin-bottom: 16px;
      height: 52px;
  }

  /* Contact Section */
  .contact-section {
    padding: 4rem 0;
  }

  .contact-content {
      display: flex;
      gap: 3rem;
  }

  .contact-form{ 
    width: 40%;
    border-inline-end: 1px solid#D9D9D9;
    padding-inline-end: 60px;
  }

 
  .contact-form h2 {
      font-size: 32px;
      font-weight: 500;
      margin-bottom: 30px;
  }

  .contact-form p {
      color: var(--grey-text-color);
      font-size: 18px;
      font-weight: 300;
      margin-bottom: 2rem;
  }

  .form-group {
      margin-bottom: 1.5rem;
  }

  .form-group label {
      display: block;
      margin-bottom: 0.5rem;
      font-weight: 500;
      font-size: 14px;

      span{
        color: var(--primary-color);
      }
  }

  .form-group input,
  .form-group textarea {
      width: 100%;
      padding: 10px 20px;
      border: 1px solid var(--input-border);
      border-radius: 10px;
      font-size: 14px;
      outline: none;
  }

  .form-group textarea {
      height: 120px;
      resize: vertical;
  }

  .send-button {
      background: var(--primary-color);
      color: white;
      padding: 12px 30px;
      border: none;
      border-radius: 5px;
      font-size: 1rem;
      cursor: pointer;
      transition: background 0.3s;
      width: 100%;
  }

  .send-button:hover {
      background: var(--primary-color);
  }

  /* Contact Info */
  
  .map-placeholder {
    width: 100%;
    height: 300px;
    border-radius: 8px;
    margin-bottom: 16px;
  }

  

  .address-info {
      color: var(--text-color);
      font-weight: 300;
      font-size: 18px;
  }

  .address-info strong {
      font-weight: 500;
  }

  
/* ***************************************************************** */
/* ************************ FOOTER ********************************* */
/* ***************************************************************** */
.footer {
  background: var(--footer-bg);
  color: var(--white-color);
  padding: 60px 0 30px;
}


.footer-logo {
  margin-bottom: 20px;
}

.footer-desc {
  font-size: 14px;
  margin-bottom: 20px;
  line-height: 24px;
  width: 75%;
}

.newsletter label {
  font-weight: 500;
  font-size: 14px;
  line-height: 30px;
  margin-bottom: 10px;
}

.newsletter input {
  display: block;
  width: 50%;
  margin-bottom: 8px;
  padding: 10px 16px;
  border-radius: 10px;
  border: none;
  outline: none;
  font-size: 14px;
  background: var(--white-color);
}

.newsletter button {
  background-color: var(--footer-btn-bg);
  border: none;
  color: white;
  padding: 10px 16px;
  width: 50%;
  border-radius: 30px;
  font-weight: 500;
  font-size: 12px;
  cursor: pointer;
}

.footer-links{
  margin-top: 85px;
}

.footer-links .bottom-space{
  margin-bottom: 40px;
}

.footer-links h4 {
  font-size: 18px;
  font-weight: 500;
  line-height: 30px;
  margin-bottom: 20px;
}

.footer-links ul {
  list-style: none;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  margin: 0 0 20px;
  gap: 36px;

}

.footer-links li {
  font-size: 16px;
  font-weight: 400;
  line-height: 0;
}

.footer-links li a,
.footer-links h4 a{
  color: var(--white-color);
  text-decoration: none;
}


.footer-social{
  margin-top: -12px;
  
}

.footer-social h4 {
  margin-bottom: 10px;
  font-weight: 600;
  font-size: 15px;
}

.icons {
  display: flex;
  gap: 12px;
  margin-top: 10px;
}

.footer-bottom {
  border-top: 0.6px solid var(--primary-color);
  text-align: center;
  margin-top: 40px;
  padding-top: 15px;
  font-size: 14px;
  font-weight: 600;
}

.rate{
  background-color: white;
  width: 210px;
  border-radius: 10px;
  padding: 10px 14px;
  margin: 0 auto;
}

.desktop-only{display: block;}
.mobile-only{display: none;}

/* ***************************************************************** */
/* *********************** Blogs *********************************** */
/* ***************************************************************** */

.blog-section {
  /* max-width: 1200px; */
  /* margin: auto; */
  /* padding: 40px 20px; */
  padding: 40px 0;
  margin-top: -80px;
  margin-bottom: 100px;
  text-align: center;
}
.blog-section h2 {
  font-size: 32px;
  font-weight: 600;
  margin-bottom: 35px;
}

.subtitle {
  color: var(--grey-text-color);
  font-weight: 400;
  font-size: 16px;
  margin-bottom: 30px;
}

.news-cards {
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}

.blog-card {
  background: #fff;
  border-radius: 20px !important;
  padding: 20px;
  max-width: 370px;
  box-shadow: 0px 1px 7px 0px #D9D9D9;
  text-align: start;
}

.blog-card .image {
  width: 100%;
  height: 217px;
  object-fit: contain;
  border-radius: 10px;
}

.blog-card h3 {
  font-size: 16px;
  font-weight: 500;
  color: var(--primary-color);
  margin: 15px 0 10px;
}

.blog-card p{
  font-weight: 400;
  font-size: 14px;
  color: var(--light-grey);
}

.blog-card .date{
  color: var(--light-grey);
  font-weight: 300;
  font-size: 13px;
}

.blog-card .more-btn{
  padding: 5px 25px;
  font-size: 14px;
}

.load-more {
  margin-top: 30px;
  background: #800020;
  color: white;
  padding: 10px 25px;
  border: none;
  border-radius: 30px;
  cursor: pointer;
}


.page-info{
  padding-top:120px;
}

/* ***************************************************************** */
/* *********************** CONTACT US ****************************** */
/* ***************************************************************** */
.contact.up-wave{ 
  background-image: url(../assets/bg/contact-bg.svg);
  background-position: left;
}
.pg .info{
  font-size: 24px;
  font-weight: 500;
  width: 60%;
  margin: 0 auto;
}

.contact-section {
  padding: 50px 0;
}

.contact-section h2{
  font-weight: 600;
  font-size: 30px;
  margin-bottom: 30px;
}

.contact-section .header p{
  font-weight: 300;
  font-size: 18px;
  width: 65%;
  margin: 0 auto;
}

.contact-cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  margin-bottom: 40px;
}

.contact-cards .card,.contact-cards .card.primary {
  background: var(--white-color);
  border-radius: 20px;
  padding: 20px;
  width: 295px;
  text-align: center;
  box-shadow: 0px 1px 9px 0px #D0CFCE;
  color: var(--text-color);
}

.contact-cards .card.primary{ background: var(--primary-color); color: var(--white-color);}
.contact-cards .card img{
  width: 30px;
  height: 30px;
  margin: 0 auto 16px;
}
.contact-cards .card h4{
  font-weight: 400;
  font-size: 14px;
}

.contact-cards .card p,.contact-cards .card p.location{
  font-size: 22px;
  font-weight: 600;
  color: var(--text-color);
}
.contact-cards .card p.location{font-size: 14px;}
.contact-cards .card.primary p{ color: var(--white-color);}

.contact .contact-form {
  margin: auto;
  text-align: center;
  width: 100%;
  border-inline-end: none;
  padding-inline-end: 0;
}

.contact .contact-form p{
  font-weight: 500;
}

.contact-form .form-wrap{
  box-shadow: 0px 1px 14px 0px #D9D9D9;
  width: 100%;
  margin-top: 30px;
  padding: 40px;
  border-radius: 20px;
}

.form-grid .form-group:not(:last-child){margin-bottom: unset;}

.contact-form .form-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr); ;
  gap: 20px;
  text-align: start;
}

.contact-form input,
.contact-form select,
.job-form select {
  padding: 10px;
  border-radius: 8px;
  border: 1px solid var(--input-border);
  width: 100%;
  outline: none;
}

/* ***************************************************************** */
/* *************************** PLG ********************************* */
/* ***************************************************************** */

.plg-info{
  background-color: var(--primary-color);
  padding: 20px;
}

.plg-info p{
  font-weight: 300;
  font-size: 18px;
  color: var(--white-color);
  line-height: 33px;
}
.plg-info p span{
  font-weight: 500;
}

.plg-work .header{ padding-top: 90px; }

.plg-work .header h2, 
.why-plg .header h2, 
.plg-review .header h2,
.plg-corporate h2,
.plg-assessment h2,
.plg-contact .contact-slogan h2,
.plg-deveolp h2,
.about h2{ 
  font-weight: 600;
  font-size: 30px;
  margin-bottom: 40px;
}

.plg-work .plg-cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  margin: 50px 0;
}

.plg-cards .card{
  background: var(--white-color);
  border-radius: 10px;
  padding: 20px;
  width: 400px;
  text-align: center;
  border: none;
  box-shadow: 0px 2px 4px 0px #00000026;
  color: var(--text-color);
}

.plg-work .plg-cards p{
  font-weight: 500;
  font-size: 18px;
  margin-bottom: 10px;
}

.plg-work .plg-cards img{
  width: 45px;
  height: 45px;
  margin: 0 auto 16px;
}

.why-plg { margin: 80px 0; }
.why-plg ul li{
  color: var(--grey-text-color);
  font-size: 20px;
  font-weight: 400;
  margin-bottom: 10px;
}

.plg-review{ margin:100px 0 60px;}
.plg-review .swiper {
  width: 100%;
  max-width: 100%;
  /* max-width: 900px; */
  margin: auto;
  padding: 40px 0 70px;
}

.plg-review .swiper-slide {
  background: white;
  border-radius: 10px;
  padding:30px;
  opacity: 0.3;
  transition: opacity 0.3s;
  transform: scale(0.9);
  box-shadow: 0px 2px 4px 0px #D0CFCE;
  box-shadow: 0px 2px 4px 0px #D0CFCE;

}

.plg-review .swiper-slide-active {
  opacity: 1 !important;
  transform: scale(1);
}

.plg-review .swiper-slide img{
  width: 60px;
  height: 50px;
  margin-bottom: 30px;
}

.plg-review .swiper-slide blockquote {
  margin-bottom: 20px;
  font-weight: 400;
  font-size: 18px;
}

.plg-review .swiper-slide cite {
  color: var(--primary-color);
  font-size: 18px;
  font-weight: 500;
}

.plg-review .swiper-bottom-nav, .aod .swiper-bottom-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  margin-top: 20px;
  position: absolute;
  bottom: 8px;
  left: 50%;
  transform: translateX(-50%);
  /* width: 100%; */
  padding-bottom: 10px;
}

.swiper-pagination-bullets.swiper-pagination-horizontal{
    width: unset !important;
}

.plg-review .swiper-pagination {
  position: relative;
  display: flex;
  align-items: center;

}

.plg-review .swiper-button-next,
.plg-review .swiper-button-prev {
  color: var(--light-grey);
  position: relative; 
  background-color: var(--white-color);
  border-radius: 50%;
  box-shadow: 0px 0px 4px 0px #D9D9D9;
  width: 30px;
  height: 30px;

}

.plg-review .swiper-button-next::after,
.plg-review .swiper-button-prev::after{
  font-size: 14px;
}

.swiper-pagination-bullet {
  background: var(--light-grey) !important;
  width: 10px;
  height: 10px;
  margin: 0 5px;
  border-radius: 50%;
  opacity: 0.5;
  transition: background 0.3s;
}

.swiper-pagination-bullet-active {
  background: var(--primary-color) !important; /* Your active color */
}

.plg-contact.contact{
  margin-top: -35px;
  margin-bottom: 80px;

}

.plg-contact.contact .contact-form{
  width: 80%;
}

.plg-contact.contact .contact-form p{
  font-weight: 300;
  font-size: 18px;
  text-align: start;
}

.w-49{ width: 49%;}
.form-group.full-width {
  grid-column: span 2; 
}

.plg-corporate, .plg-assessment{ 
  padding: 20px 0;
  margin-bottom: 50px;
}

.plg-corporate p,
.plg-deveolp p,
.plg-assessment p,
.plg-assessment ul li{
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 30px; 
  line-height: 32px;
  color: var(--grey-text-color);
}
.plg-corporate p strong{ font-weight: 600;}

.plg-deveolp {margin-bottom: 80px;}
.plg-deveolp h2{margin-bottom: 20px;}
.plg-deveolp p{color: var(--light-grey);}
.plg-deveolp .cards{justify-content: center; gap: 30px;}
.plg-deveolp .service-card{max-width: 400px;}
.plg-deveolp .service-card h3{ font-size: 18px; }
.plg-deveolp .service-card p{
  font-size: 14px;
  font-weight: 300;
  line-height: 25px;
  margin-bottom: 0;
}

.plg-contact.contact .contact-slogan{margin-bottom: 50px;}
.plg-contact.contact .contact-slogan p{
  font-weight: 400;
  font-size: 21px;
  margin: auto;
  width: 75%;
  padding-inline: 40px;
}
.plg-contact.contact .assessment.contact-slogan p{
  width: 95%;
  margin-bottom: 25px;
}
.plg-contact.contact .contact-slogan p strong{
  font-weight: 600;
}

.plg-approach h2, .plg-why-assessment h2, .plg-tools h2{
  font-weight: 500;
  font-size: 20px;
  margin-bottom: 30px;
}

.plg-approach .colored-header h3{
  color: var(--white-color);
  font-weight: 500;
  font-size: 16px;
}
.plg-approach .colored-header h3 span{ font-size: 27px;}
.plg-approach .colored-header-desc p,.plg-approach .colored-header-desc ul li{ 
  font-size: 16px;
  font-weight: 300;
}
.plg-approach .colored-header-desc p strong{ font-weight: 500;}
.plg-approach .step-1{margin-bottom: 30px;}
.plg-approach .process-steps{
  display: flex;
  gap: 25px;
  margin-bottom: 30px;
  
}

.assessment .process-steps{ flex-wrap: wrap; background-color: var(--white-color);}
.assessment .process-steps .step-box{ max-width: 415px; }
.assessment .process-steps .colored-header-desc{ min-height: 130px;}


.plg-approach .custom-approach p{
  color: var(--light-grey);
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 30px;
}

.plg-why-assessment p{
  font-size: 20px;
  font-weight: 400;
  margin-bottom: 30px; 
  line-height: 36px;
  color: var(--grey-text-color);
}

.plg-tools{ padding: 80px 0; }
.work.plg-tools{ padding: 40px 0 80px; }
.plg-tools .tool-wrap{
  display: flex;
  gap: 25px;
}
.plg-tools .tool-box{
  text-align: center; 
  box-shadow: 0px 2px 4px 0px #00000026;
  border-radius: 10px;
  padding: 30px 15px;
  background-color: var(--white-color);
}
.plg-tools .tool-box h4{
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 20px;
}
.plg-tools .tool-box p{
  font-size: 14px;
  font-weight: 300;
  color: var(--grey-text-color);
  width: 70%;
  margin: auto;
}

.work .tool-box p{margin: 0 auto 16px;}
.work .tool-wrap{padding-top: 50px;}

.assesment-steps{padding: 25px 0;}
.assesment-steps p,.workshop p, .work p{
  color: var(--light-grey);
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 25px;
}
.plg-tools.assesment-steps .tool-wrap{gap: 20px;flex-wrap: wrap;}
.plg-tools.assesment-steps .tool-box{padding: 30px 10px; max-width: 305px;}
.plg-tools.assesment-steps.workshop .tool-box{max-width: 240px;}
.plg-tools.assesment-steps .tool-box p:not(:first-child){width: 90%;font-size: 13px;}
.plg-tools.assesment-steps .tool-box:last-child h4{font-size: 17px;}
.tool-box p:first-child{
  color: #D0CFCE;
  font-weight: 500;
  font-size: 50px;
}

.plg-why-assessment.plg-deveolp .service-card{max-width: 310px;}
.plg-why-assessment.plg-deveolp .cards{gap: 15px;margin-top: 0;}

.workshop .tool-box{padding: 20px 10px !important;}
.workshop .tool-box p:not(:first-child){font-weight: 300;font-size: 14px !important;line-height: 25px;}
.workshop .tool-box p strong{font-weight: 600;}

.workshop-for{padding-top: 70px;}
.workshop-for h2, .aod h2{
  font-weight: 500;
  font-size: 20px;
  margin-bottom: 40px;
}
.workshop-for ul li{
  font-weight: 400;
  font-size: 18px;
  line-height: 37px;
}

/* AOD Certificate Page */
/* .aod.plg-deveolp, .aod.workshop-for h2{margin-bottom: 0;} */
.aod.workshop-for img{ width: 100%; height: 100%;}
.aod.plg-tools .tool-wrap{padding-top: 20px;}
.aod.plg-tools .tool-box{padding: 30px;}
.aod.plg-tools .tool-box:not(:nth-child(3)) h4{width: 90%;}
.aod.plg-tools .tool-box:nth-child(3) h4{margin: 0 auto 20px;width: 70%;}
.aod.expert{padding: 30px 0 60px;}
.aod.shrm{padding: 20px 0 60px;}
.aod.expert p, .aod.shrm p{
  font-size: 18px;
  font-weight: 400;
  color: var(--grey-text-color);
  width: 80%;
  line-height: 32px;
}
.aod.shrm p{width: 90%;}
.aod.shrm p strong{font-weight: 600;}
.aod.plg-contact {padding: 80px 0;margin: 0;}
.aod.plg-contact p{font-size: 18px !important; color: var(--grey-text-color);}
.aod .contact-form{background-color: var(--white-color);}
.aod .contact-form button.primary-outline-btn{
  padding: 7px 10px;
  border-radius: 10px;
  font-weight: 500;
  font-size: 16px;
}
.aod .contact-form .form-wrap div p{
  font-weight: 500;
  font-size: 18px;
}

.aod .explore-wrap{
  display: flex;
  justify-content: center;
  padding: 30px 0;
}
.aod .circle{
  background: linear-gradient(270deg, #9A2240 0%, #E7603E 100%);
  border-radius: 73px;
  width: 100px;
  height: 100px;
  align-content: center;
  margin: 0 auto 16px;
}
.aod .circle img{width: 55px; height: 55px;}
.aod .explore-cards{ max-width: 310px;}
.aod .explore-cards h4{
  font-weight: 700;
  font-size: 26px;
  margin: 0 auto 16px;
  width: 50%;
}
.aod .explore-cards p{
  font-weight: 300;
  font-size: 22px;
  line-height: 32px;
}

.aod.slider{padding: 30px 0 70px;}
.aod .workshopSwiper{padding: 30px 0;}
.aod .workshopSwiper .swiper-slide video{
  height: 360px;
  border-radius: 10px;
}
.aod .glimpsesSwiper{margin: 35px 0 50px;padding-bottom: 110px;}
.aod .glimpsesSwiper .swiper-slide img{width: 100%; height: 100%; object-fit: cover;}
.aod .glimpsesSwiper .swiper-slide{transform: scale(0.5);}
.aod .glimpsesSwiper .swiper-slide-active{transform: scale(1.5);}
/* .aod .glimpsesSwiper .swiper-slide-active img{height: 350px;} */

.vedio-overlay{
  background: #00000099;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  border-radius: 10px;
  z-index: 1;

}

.aod .workshopSwiper .swiper-bottom-nav, .aod .glimpsesSwiper .swiper-bottom-nav{
  z-index: 10;
  bottom: -15px;
  width: 10%;
}

.aod.assessment.plg-approach{padding: 40px 0 60px;}

/* personal diploma Page */
.personal-diploma ul li{
  font-size: 16px;
  font-weight: 400;
  line-height: 32px;
  color: var(--grey-text-color);
}
.personal-diploma .workshop-for h2{margin-bottom: 40px;}
.aod.plg-tools.personal-diploma .tool-box:last-child h4{width: 70%;margin: 0 auto 20px;}
.aod.plg-tools.personal-diploma .tool-box:nth-child(3) h4{width: 90%;margin: 0 auto 20px;}
.personal-diploma.assessment .process-steps .step-box, .servic.social .step-box{width: 415px;}

/* TOT Page */
.tot .colored-header h3{width: 65%; margin: auto;}

.aod.plg-tools.personal-diploma.cbi .tool-box:last-child h4{width: 90%;}

.workshop-work{padding: 30px 0 60px;}
.workshop-work h2{
  font-weight: 500;
  font-size: 20px;
  margin-bottom: 50px;
}
.workshop-work p{ font-size:16px; font-weight: 400;}
.workshop-work p strong{ font-weight: 700;}
.workshop-work img{ width:20px; height: 20px;}

/* ***************************************************************** */
/* ************************* ABOUT US ****************************** */
/* ***************************************************************** */
.about.up-wave, .blog.up-wave{ height: 350px;}

.about-content {
  display: flex;
  flex-wrap: wrap;
  gap: 25px;
  margin-bottom: 60px;
}

.about-content .text { flex: 1; }
.about-content .text p{ width: 90%; }
.about-content .text p:first-child{ padding-inline-end: 35px; }

.about-content p {
  font-size: 18px;
  font-weight: 300;
  line-height: 33px;
  color: var(--text-color);
}
.about-content p span{ font-weight: 600; }

.video-box {
  position: relative;
  flex: 1;
  max-width: 565px;
  height: 330px;
  background: #121212B5;
}

.video-box video {
  width: 100%;
  height: 100%;
}

.play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 60px;
  cursor: pointer;
}
.play-btn img{
  width: 100%;
  height: 100%;
}

.about-content button{
  margin: 15px auto 0;
}
.about-content button i{
  position: relative;
  top: 1px;
  margin-inline-start: 5px;
}

.mission-vision {
  background-color: var(--white-color);
  border-radius: 50px;
  padding: 40px;
  width: 80%;
  margin: auto;
  display: flex;
  justify-content: space-between;
}

.mission-vision .box {
  padding: 0px 30px 10px;
}

.mission-vision img{
  width: 30px;
  height: 30px;
}

.mission-vision h4, .values h4 {
  color: var(--primary-color);
  font-size: 26px;
  font-weight: 500;
  margin-bottom: 0;
}
.mission-vision p {
  font-weight: 300;
  font-size: 16px;
  color: #000000;
  line-height: 27px;
}
.mission-vision .box:last-child p{ padding-inline-end: 15px;}
.mission-vision .content{padding-inline-start: 25px;}

.values-grid {
  padding-top: 20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}

.value-card {
  background: var(--primary-color);
  padding: 20px;
  text-align: center;
  border-radius: 12px;
  max-width: 170px;
}
.value-card:first-child,.value-card:last-child{ width: 135px;}

.value-card p{
  color: var(--white-color);
  font-size: 18px;
  font-weight: 400;
  margin-bottom: 0;
}
.value-card img{
  width: 45px;
  height: 45px;
  margin-bottom: 10px;
}

.badges,.ceo-word{ padding: 80px 0;}

.badges .bg{
  background-image: url(../assets/bg/clutch-bg.png);
  background-repeat: no-repeat;
  background-position: center left;
}

.badges h2, .ceo-word .header h2{
  font-weight: 600;
  font-size: 30px;
  margin-bottom: 40px;
}
.badges h2{ margin-bottom: 70px;}

.bg .badge-wrap{
  display: flex;
  justify-content: center;
  gap: 25px;
}

.ceo-word .img-wrap{
  width: 100%;
  height: 400px;
}

.img-wrap img{
  width: 100%;
  height: 100%;
  border-bottom-left-radius: 200px;
  border-top-left-radius: 200px;
  object-fit: cover;
}

.ceo-word p{
  font-weight: 300;
  font-size: 18px;
  line-height: 36px;
  width: 90%;
}

.ceo-sign{
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
}

.ceo-word p strong, .ceo-sign strong{ font-weight: 600;}

.about.business-forward {
  padding: 80px 0;
}
.about.business-forward h2{
  font-weight: 600;
  font-size: 30px;
}
.about.business-forward p{
  font-weight: 400;
  width: 85%;
}

.about.business-forward p strong{font-weight: 600;}


/* ***************************************************************** */
/* ******************* Blog Details ******************************** */
/* ***************************************************************** */

.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 40px 0 10px;
}

.breadcrumb a {
  color: var(--light-grey);
  text-decoration: none;
  font-weight: 300;
  font-size: 16px;
}

.breadcrumb a:hover {
  text-decoration: none;
  color: var(--light-grey);
}

.separator {
  color: var(--light-grey);
  font-size: 30px;
  font-weight: 300;
}

.current {
  font-weight: 500;
}

.blog-card .time img{
  width: 14px;
  height: 14px;
}

.detail-blog{
  padding: 15px 0 60px ;
}

.relate-blog{padding-bottom: 80px;}

.detail-blog .banner{
  width: 100%;
  height: 480px;
  border-radius: 10px;
  margin-bottom: 16px;
}

.detail-blog .banner img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.detail-blog span{
  font-weight: 300;
  font-size: 19px;
  color: var(--light-grey);
}
.detail-blog h4{
  font-weight: 600;
  font-size: 38px;
  color: var(--primary-color);
  line-height: 52px;
  width: 75%;
  margin-bottom: 25px;
}

.detail-blog p{
  font-weight: 300;
  font-size: 20px;
  line-height: 40px;
  color: var(--text-color);
  width: 95%;
}

.detail-blog .primary-outline-btn{
  padding: 10px 17px;
  border-radius: 10px;
}
.detail-blog .download-btn{
  font-weight: 600;
  font-size: 15px;
}

.relate-blog h2{
  font-weight: 500;
  font-size: 24px;
  color: var(--primary-color);
  line-height: 34px;
  margin-bottom: 30px;
}
.relate-blog .news-cards{ justify-content: start ;}
.relate-blog .news-cards .blog-card{
  max-width: 415px;
}

/* ***************************************************************** */
/* *************************** POLICY ****************************** */
/* ***************************************************************** */

.policy .header h2{
  font-weight: 600;
  font-size: 30px;
  margin-bottom: 40px;
}
.policy .policy-section{ margin-bottom: 40px;}

.policy .policy-section h2{
  font-size: 18px;
  font-weight: 600;
  /* margin-bottom: 20px; */
  color: var(--text-color);
}

.policy .policy-section:first-child p{
  font-size: 20px;
  margin-bottom: 20px;
}
.policy .policy-section:first-child h2{
  font-size: 20px;
}

.policy .policy-section p{
  font-size: 16px;
  font-weight: 300;
  line-height: 30px;
  margin-bottom: 0;
}

.policy .policy-section p strong{font-weight: 500;}

.policy .policy-section ul li{margin-bottom: 6px;}

.policy .plg-info{
  margin-bottom: 80px;
  padding: 50px 0;
}

.policy .plg-info p{
  font-weight: 400;
  width: 90%;
  margin: auto;
  font-size: 22px;
  margin-bottom: 30px;
}
.policy .plg-info p strong{ font-weight: 600; }

/* ***************************************************************** */
/* *************************** Services Details ******************** */
/* ***************************************************************** */

.servic.plg-tools{padding: 40px 0 20px;}
.servic h2{
  font-weight: 500;
  font-size: 20px;
}
.servic.assessment .process-steps .colored-header-desc{ min-height: 170px;}

.servic.plg-tools.assesment-steps .tool-box {
  padding: 30px 15px;
  max-width: 435px;
  width: 415px;
}
.servic.plg-tools .tool-box h4 {
  width: 80%;
  margin: auto;
  line-height: 34px;
}
.servic.business-forward{ padding-top: 0; }
.servic.business-forward h2{
  font-weight: 600;
  font-size: 30px;
  margin-bottom: 40px;
}
.servic.business-forward p{
  font-weight: 400;
  font-size: 21px;
  line-height: 38px;
  margin-bottom: 30px;
  width: 80%;
}

.l-d button{
  padding-inline-end: 0;
  width: 230px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.l-d button img{
  width: 50px;
  height: 50px;
  transform: scale(1.4);
}

.servic.recruit{padding: 60px 0;}
.servic.assessment.plg-approach .cards{background-color: var(--white-color);border-radius: 10px;}
.servic.assessment.plg-approach .service-card{width: 320px;}

.servic.gov{padding: 40px 0 60px;}
.servic.assessment.plg-approach.gov .service-card{min-width: 415px;}
.servic.assessment.social .process-steps .colored-header-desc{ min-height: 200px;}
.social-steps-wrap{padding-bottom: 40px;}

.legal-category img{width: 30px; height: 30px;}
.legal-category p{
  font-weight: 500;
  font-size: 18px;
  line-height: 28px;
  color: var(--grey-text-color);
}

.sub-titl{
  font-weight: 500;
  font-size: 19px;
}

.payroll .service-card img{width: 45px;height: 38px;}
.payroll.servic{padding: 70px 0 20px;}
.benefits-section { padding: 70px 0 0;}
.benefits-section h2{margin-bottom: 40px;}

.benefit {
  margin-bottom: 24px;
}

.benefit h3 {
  color: var(--primary-color);
  font-size: 20px;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.benefit h3 img{
  width: 20px;
  height: 20px;
}

.benefit p {
  font-size: 16px;
  font-weight: 300;
  line-height: 30px;
  color: var(--grey-text-color);
  width: 80%;
}

.offshore.servic.gov{padding: 60px 0 0;}

.phase-card-wrapper{
  width: 65%;
  margin: auto; 
  padding: 50px 0 60px;
}

.phase-card-container{
  display: flex; 
  justify-content: space-between; 
  gap: 20px;
}
.phase-card{
  position: relative;
  min-width: 320px;
}
.phase-card:not(:last-child):after{
  content: "";
  position: absolute;
  top: 60%;
  left: 340px;
  width: 160px;
  height: 10px;
  background-image: url(../assets/bg/phase-line.png);
  background-repeat: no-repeat;
  background-position: center;
}
.phase-card .head{
  background: #FFF3F0;
  padding: 20px;
  border: 0.5px solid #D9D9D9;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.phase-card .head p{
  margin-bottom: 10px; 
  font-weight: 400;
  font-size: 14px;
  color: var(--light-grey);
}
.phase-card .head h3{
  font-weight: 500;
  font-size: 16px;
}
.phase-card .phase-body{
  min-height: 180px; 
  background-color: white;
  padding: 20px; 
  border: 0.5px solid #D9D9D9;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.offshore.left-strip-overlay{ background-image: url(../assets/bg/phase-strip.png); }

.offshore .strip-overlay{ background-image: url(../assets/bg/right-phase-strip.png); background-position: right;}

.responsiblity , .eor.plg-approach{margin-bottom: 50px;}
.responsiblity h2{
  font-weight: 500;
  font-size: 22px;
  margin-bottom: 20px;
}

.responsible-wrap{
  display: flex;
  flex-wrap: wrap;
  gap: 20px;

}
.responsible-card{
  box-shadow: 0px 1px 4px 0px #00000040;
  padding: 20px 16px;
  border-radius: 20px;
  background-color: var(--white-color);
  flex-grow: 1;
}
.responsible-card div{
  display: flex;
  align-items: center;
  gap: 16px;
}
.responsible-card img{
  width: 65px;
  height: 60px;
}
.responsible-card p{
  font-weight: 400;
  font-size: 20px;
  color: var(--text-color);
}


.figure-container{
  display: flex;
  gap: 20px;
}
.figure-wrap{
  background: linear-gradient(180deg, #FFFFFF 0%, #EBEBEB 100%);
  text-align: center; 
  border-radius: 30px;
  padding: 20px;
}
.figure-wrap p{
  font-size: 14px;
  font-weight: 300;
}

.figure-circle{
  background: linear-gradient(360deg, var(--primary-color) 46.77%, var(--orange-color) 100%);
  color: var(--white-color);
  border-radius: 70px;
  align-content: center;
  width: 140px;
  height: 140px;
  padding: 10px;
  margin: 0 auto 10px;
  text-align: center;

}
.figure-circle p{
  font-weight: 600;
  font-size: 46px;
  margin-bottom: 0;
}
.figure-circle span{
  font-weight: 400;
  font-size: 16px;
}

.success-stories {
  padding: 40px 20px;
}

.success-stories h2 {
  font-size: 2rem;
  margin-bottom: 30px;
  position: relative;
}

.success-stories .card-wrapp{
  border: 1px solid var(--primary-color);
  border-radius: 20px;
  padding: 6px 2px;
  padding-inline-start: 10px;
  position: relative;
  z-index: 1;
  max-width: 305px;
}

.success-stories .cards {
  display: flex;
  flex-wrap: wrap;
  gap: 25px;
}

.success-stories .card {
  position: relative;
  background: #FFDCD499;
  padding: 40px 20px;
  padding-inline-start: 40px;
  border-radius: 20px;
  flex: 1 1 300px;
  border:none;
  box-sizing: border-box;
}

.success-stories .card .circle {
  position: absolute;
  top: -35px;
  left: -30px;
  background-color: var(--primary-color);
  color: var(--white-color);
  width: 60px;
  height: 60px;
  border-radius: 60px;
  display: flex;
  align-items: center;
  font-weight: 500;
  font-size: 24px;
  padding: 10px;
  padding-inline-start: 15px;
  z-index: -1;
}

.success-stories .card-wrapp p {
  margin: 0;
  font-weight: 400;
  font-size: 16px;
}
.success-stories .card-wrapp p strong{font-weight: 600;}

/* Section container */
.insights-section {
  margin: 0 auto 50px;
  padding: 80px 20px;
  text-align: center;
}
.HR.insights-section{margin-bottom: 0;padding-bottom: 0;}

/* Title styled like a pill */
.insights-section h2 {
  display: inline-block;
  background-color: var(--primary-color); /* your dark red */
  color: var(--white-color);
  padding: 12px 50px;
  border-radius: 10px;
  font-size: 20px;
  font-weight: 500;
  position: absolute;
  top: -26px;
  translate: -50%;
}

.insights-wrapper, .HR .insights-wrapper{
  background: var(--white-color);
  box-shadow: 0px 1px 4px 0px #00000040;
  border-radius: 20px;
  position: relative;
}
.HR .insights-wrapper{
  width: 80%;
  margin: auto;
}

.insights-cards {
  display: flex;
  justify-content: space-between;
  gap: 40px;
  padding: 80px 20px 20px;
}
.HR .insights-cards{
  width: 90%;
  margin: auto;
}

/* Each card */
.insight {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}

.insight:not(:last-child)::after{
  content: "";
  position: absolute;
  right: -20px; /* half of the gap */
  top: 50px;
  height: 55%;
  border-inline-end: 3px solid #D0CFCE; /* color of the line */
}
.HR .insight:not(:last-child)::after{
  height: 40%;
  right: -80px;
}


.progress-circle span {
  position: absolute;
  font-size: 19px;
  font-weight: 500;
  color: var(--primary-color);
}

.insight p {
  font-size: 16px;
  line-height: 30px;
  font-weight: 500;
}
.insight p span{color: var(--primary-color);}




.progress-circle{
  width: 100px;
  height: 100px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 15px;
}

.inner-circle {
  width: 85px;
  height: 85px;
  background: white;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.consult p{
  font-weight: 400;
  font-size: 16px;
  color: var(--grey-text-color);
  margin-bottom: 0;
}
.consult .cards{flex-wrap: unset;margin-top: 20px;}
.consult .service-card{max-width: unset !important;}

.figure-section{margin: 60px 0;}
.figure-section h2{
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 30px;
}

.success-stories h2{
  font-weight: 500;
  font-size: 24px;
  margin-bottom: 60px;
}

.phase


/* ***************************************************************** */
/* *************************** Careers ***************************** */
/* ***************************************************************** */

.upload-container {
  display: flex;
  gap: 16px;
  align-items: center;
  position: relative;
  margin-bottom: 1.5rem;
}

.upload-btn {
  display: flex;
  gap: 5px;
  padding: 10px 20px;
  background-color: var(--white-color);
  color: var(--light-grey);
  border: 1px solid #D9D9D9;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 300;
  cursor: pointer;
  align-items: center;
}
.upload-btn img{
  width: 22px;
  height: 22px;
}

.file-input {
  display: none;
}

.file-name {
  font-size: 14px;
  color: var(--text-color);
}

.job-form a:hover{color: var(--primary-color);}
.job p{
  color: var(--text-color);
  font-weight: 400;
  font-weight: 18px;
  line-height: 36px;
}

.job p strong{
  font-weight: 600;
  font-size: 24px;
}

.job-img{
  width: 100%;
  height: 530px;
  margin-top: -180px;
}
.job h2.career{line-height: 52px;}
.job h2.career .title::after{bottom: 0;}
.career-img{
  width: 100%;
  height: 450px;
}

.job-search .search-wrap{
  box-shadow: 0px 1px 4px 0px #D9D9D9;
  padding: 30px;
  margin-bottom: 60px;
  border-radius: 10px;
  background-color: var(--white-color);
}

.search-wrap form{
  display: flex;
  justify-content: space-between;
  gap: 16px;
}

.search-wrap form .form-group{
  width: 25%; 
  margin-bottom: 0 !important;
}
.search-wrap form .form-group select, .search-wrap form .form-group input{
  color:#777777;
  font-size: 14px;
  font-weight: 400;
}

.jobs-cards{margin-bottom: 80px;}
.jobs-cards h5{
  font-weight: 500;
  font-size: 16px;
  margin-bottom: 20px;
}
.cards-wrap{
  display:flex;
  flex-wrap: wrap;
  gap: 25px;
}
.job-card{
  width: 415px; 
  box-shadow: 0px 2px 4px 0px #74747499;
  padding: 30px;
  border-radius: 10px;
  background-color: var(--white-color);
}

.job-card p:first-child{
  color: var(--light-grey);
  font-size: 10px;
  font-weight: 500;
  margin-bottom: 5px;
}

.job-card p{
  color: var(--grey-text-color);
  font-size: 13px;
  font-weight: 300;
}

.job-card h3{
  color: var(--primary-color);
  font-weight: 500;
  font-size: 24px;
}

.job-tags{
  color: var(--grey-text-color);
  font-size: 12px;
  font-weight: 300;
  display: flex;
  gap: 20px;
  margin-bottom: 20px;
}

.job-tags img{
  width: 16px;
  height: 16px;
  margin-inline-end: 6px;
}

.job-card a, .job-card a:hover{
  display: block;
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  color: var(--primary-color);
}

.job-detail p{
  font-size: 18px;
  font-weight: 400;
  color: var(--grey-text-color);
}
.job-detail p strong{font-weight: 500;}
.job-detail .job-tags div{
  box-shadow: 0px 0px 4px 0px #00000040;
  border-radius: 10px;
  padding: 15px 20px;
  font-weight: 400;
  font-size: 16px;
  color: var(--text-color);
}
.job-detail .job-tags strong{font-weight: 600;}
.job-detail .job-tags img{width:28px; height: 24px;}
.job-detail h4{
  font-weight: 600;
  font-size: 18px;
  margin-bottom: 20px;
}

/* ***************************************************************** */
/* ******* styles for tablets and smaller screens ****************** */
/* ***************************************************************** */
@media (max-width: 540px){
   .container{ padding: 0 20px !important; }

  .hamburger { display: block;}
  .navbar{height: 80px;}
  .nav-links {
    position: absolute;
    top: 81px; /* below navbar */
    left: 0;
    width: 100%;
    height: 100vh;
    background: white;
    flex-direction: column;
    align-items: start;
    gap: 20px;
    padding: 20px;
    display: none; /* hidden by default */
    z-index: 99;
    box-shadow: 0px 4px 5px rgba(0,0,0,0.1);
  }
  .nav-links.show { display: flex;}
  .nav-right { display: none;}
  .nav-right-mobile{display: block;}
  .navbar { position: relative;}

  .dropdown {
      position: static;
      width: 100%;
      border: none;
      padding-left: 20px;
      display: none;
    margin-top: 10px;

  }
  .nav-links .serv.dropdown {min-width: 340px;}

  .sub-dropdown{
    top: 100%;
    left: 15px;
    width: 325px;
  }
  .dropdown.active,
  .sub-dropdown.active {
    display: block;
  }
  
  .arrow {
    cursor: pointer;
  }
  .has-sub-dropdown .arrow { transform: rotate(90deg) !important; }



  iframe{ width: 90%;height: 400px;}

  .left-content{max-width: 100%;}
  .left-content h2{ font-size: 24px;}
  .left-content p{font-size: 12px;}

  .buttons{
    display: flex;
    gap: 10px;
  }

  .buttons .primary-btn,
  .buttons .primary-outline-btn{
    padding: 10px 25px;
    font-size: 12px;
    margin-right: 0 !important;
  }
  .main-img {
    width: 320px;
    height: 295px;
    background-image: url('../assets/bg/small-circles.png');
    margin: 30px auto 0;
  }
  .main-img .img-circles{
    right: 0;
    top: 0;
  }
  .main-img .image{
    width: 240px;
    height: 228px;
    top: 45px;
    left: 40px;
  }
  .small-img{
    bottom: -15px;
    left: 20px;
    width: 100px;
    height: 100px;
  }

  .services .header h2,
  .trusted-companies h2,
  .testimonials-section h2,
  .why-section h2, 
  .feature-card h3,
  .business-forward h2, 
  .contact-form h2,
  .contact-form p{ font-size: 16px !important; }

  .services .header p{ font-size: 12px;width: 90%;}
  .cards { flex-wrap: wrap; gap: 16px;justify-content: center;}
  .service-card, .serv .service-card {max-width: unset;}
  .service-card img {width: 30px;height: 30px;}
  .service-card h3 {font-size: 14px;}
  .service-card p {font-size: 12px; line-height: unset;padding-inline: 15px;}

  .stats-section h2{
    font-size: 16px;
    text-align: start;
  }
  .stats-container{ flex-direction: column;width: unset;margin: 0 auto}
  .stats-wrapp{flex-direction: row;}
  .stat-box{ margin-bottom: 40px; }
  .stat-box:not(:last-child)::after{
    content: "";
    position: absolute;
    top: 103%;
    left: 50%;
    right: unset !important;
    transform: translateX(-50%);
    width: 10px;
    height: 50px;
    background-image: url('../assets/bg/Line.png');
    background-repeat: no-repeat;
    z-index: 2;
  }

  .trusted-companies .trusted-wave{
    margin-top: 0;
    height: 350px;
  }
  .trusted-companies .trust-wrap{padding-top: 23%;}
  .trusted-companies .swiper{margin-top: 60px;}
  .trusted-companies .swiper-slide img{height: 60px;}

  .testimonials-section{padding: 30px 0 50px;}
  .testimonials-section button{font-size: 12px;}
  .testimonials-section .swiper{margin-bottom: 20px;}

  .why-section .feature-card p,.business-forward p.colored-p{font-size: 13px !important;}
  .why-section .feature-card img{width: 70px;}

  .business-forward,.contact-section {text-align: start;padding: 2rem 0;}
  .business-forward {text-align: center;padding: 2rem 0;}
  .business-forward p {
    font-size: 13px !important;
    width: 95% !important;
    padding-inline: 0;
    text-align: center;
    margin: 0;
    line-height: 28px !important;
  }


  .contact-content{flex-direction: column;}
  .contact-form{padding-inline-end: 0;width: 100%;border-inline-end:unset}
  .contact-form p{margin-bottom: 1rem;}
  .contact-form button{width: 50% !important;font-size: 14px;}
  .form-group label{font-size: 13px;}
  .address-info{font-size: 14px;}

  .footer{ text-align: center;}
  .footer-desc {margin: 0 auto 20px;width:90%}
  .footer-links{margin-top: 25px;}
  .footer-links h4 {font-size: 15px;}
  .footer-links ul{justify-content: center;}
  .footer-links ul li{font-size: 14px;}
  .newsletter input,.newsletter button{
    width: 80%;
    margin: 0 auto 8px;
  }
  .footer-social {margin: 0 auto;}
  .footer-social .rate{text-align: center !important;}

  .desktop-only{display: none;}
  .mobile-only{display: block;}
  .mobile-only .left{
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 12px;
    padding: 10px 0;
  }

  /* Services Page */
  .page-title {font-size: 24px !important;}
  .page-info{padding-top: 90px;}
  .page-info p {font-size: 14px; padding-inline: 20px;}
  .up-wave{height: 380px;}

  .services.trusted-companies .trusted-wave{
    margin: -50px 0 50px;
    height: 350px;
  }

  /* Contact Us */
  .pg .info{font-size: 16px; width: 85%;}
  .contact-section h2{font-size: 18px;}
  .contact-section .header p {font-size: 16px; width: 100%;}
  .contact-cards .card{height: 130px;padding: 16px;}
  .contact-cards .card h4{font-size: 10px;}
  .contact-cards .card p{font-size: 18px;}
  .contact-cards .card p.location{font-size: 12px;}
  .contact .contact-form p{font-size: 12px;width: 65%; margin: 0 auto 1rem;}
  .contact .contact-form .form-wrap{padding: 40px 25px;}
  .contact .contact-form .form-grid{grid-template-columns: unset}
  .contact .contact-form .form-group{margin-bottom: 1rem;}
  .contact .contact-form button{width: 100% !important;}

  /* Blog Details */
  .breadcrumb{ width: 90%;gap: 4px;}
  .breadcrumb a{font-size: 14px;}
  .detail-blog .banner{height: 235px;}
  .detail-blog h4{font-size: 20px; line-height: 26px;width: unset;}
  .detail-blog p{font-size: 15px; line-height: 26px;}
  .detail-blog span{font-size: 16px;}
  .relate-blog h2{font-size: 20px;}
  .blog-section{margin-top: -55px;}
  .blog.up-wave, .about.up-wave{height: 210px;}
  .blog.up-wave div:first-child, .about.up-wave div:first-child{padding-top: 65px !important;}
  .blog-section h2, .policy .header h2{font-size: 18px;}
  .blog-section .subtitle {font-size: 12px;margin: 0 auto 30px; width: 85%;}

  /* Policy */
  .policy .policy-section:first-child p, .policy .policy-section p{font-size: 14px;}

  /* About Us */
  .about h2, .about.business-forward h2,.badges h2, .ceo-word .header h2{font-size: 16px !important;}
  .about-content{flex-direction: column;}
  .about-content .text p{width: 100%;}
  .about-content p{font-size: 14px;}
  .about-content .text p:first-child{padding-inline-end: 20px;}
  .about-content .video-box{margin-bottom: 40px;}
  .badges .bg{
    background-image: url(../assets/bg/clutch-vertical.png);
    background-position: bottom;
    background-repeat: repeat-y;
  }
  .bg .badge-wrap{ 
    flex-direction: column;
    width: 90%;
    margin: auto;
  }
  .bg .badge-wrap img{ width: 70%; margin: auto;padding-top: 45px;}
  .ceo-word {padding: 80px 0 0;}
  .ceo-word .img-wrap{height: 300px; margin-bottom: 30px;}
  .ceo-word .img-wrap img{object-fit: initial;}
  .ceo-word p{font-size: 14px; line-height: 26px; width: 100%; padding-inline-end: 10px;}
  .ceo-sign{font-size: 12px !important;}
  .about.business-forward{text-align: center;}
  .about.business-forward p{font-size: 14px !important;margin: auto;}
  .about.business-forward button, .about-content button{font-size: 12px; width: unset;}
  .mission-vision {width: 95%; padding: 40px 0;flex-direction: column;}
  .mission-vision .content{width: 100% !important; padding-inline-start: 10px; order: 2;}
  .mission-vision .values{width: 100% !important; order: 1; margin-bottom: 50px;}
  .mission-vision h4, .values h4{font-size: 22px;}
  .mission-vision img{width: 27px;height: 27px;}
  .mission-vision .box:first-child{margin-bottom: 30px;}

  /* PLG */
  .plg-banner .left-content h2{font-size: 24px;width: 90%;line-height: normal;}
  .plg-info{margin-top: 40px;}
  .plg-info p{font-size: 14px;line-height: 24px;text-align: center;}
  .plg-work .plg-cards{width: 90%;margin: auto;}
  .plg-work .header h2, .why-plg .header h2, .plg-review .header h2,.plg-corporate h2, .plg-contact .contact-slogan h2{font-size: 18px;}
  .why-plg ul li{font-size: 14px;}
  .plg-review .swiper-slide blockquote, .plg-review .swiper-slide cite {font-size: 12px;}
  .plg-review .swiper-slide img {width: 35px;height: 35px;}
  .plg-contact.contact{margin-top: unset;}
  .plg-contact.contact .contact-form {width: 90%;}
  .plg-contact.contact .contact-form p{font-size: 12px !important;width: 100%; margin-bottom: 35px;}
  .plg-contact.contact .contact-form .form-grid{display: block;}
  .plg-contact.contact .contact-form .form-group{margin-bottom: 30px; width: 100% !important;}

  .plg-deveolp .serv .service-card{max-width: 400px;}
  .plg-approach .process-steps, .plg-tools .tool-wrap{flex-direction: column;}
  .plg-contact.contact .contact-slogan p{width: 100% !important; font-size: 12px !important;}
  .plg-approach .colored-header-desc p, 
  .plg-approach .colored-header-desc ul li {font-size: 12px; line-height: 24px;}
  .plg-approach .colored-header h3, .plg-approach .custom-approach p,
  .plg-corporate p, .plg-deveolp p, .plg-assessment p, .plg-assessment ul li{font-size: 12px; line-height: normal;}
  .plg-approach .colored-header h3 span{font-size: 23px;}
  .plg-work .header h2, .why-plg .header h2, .plg-review .header h2, 
  .plg-corporate h2, .plg-assessment h2, .plg-deveolp h2, .about h2{font-size: 20px;}
  .plg-corporate, .plg-assessment{margin-bottom: 20px;}
  .plg-why-assessment h2{font-size: 18px;}
  .plg-tools .tool-box{width: 100% !important;}
  .plg-tools .tool-box h4{font-size: 14px;}
  .plg-tools .tool-box p, .aod.expert p, .aod.shrm p{width: 100%;}
  .plg-tools.assesment-steps .tool-box, .plg-tools.assesment-steps.workshop .tool-box{max-width: unset;}
  .tool-box p:first-child{font-size: 36px;}
  .assesment-steps p, .workshop p, .work p{font-size: 12px;}
  .aod.plg-deveolp, .aod.workshop-for h2{margin-bottom: 30px;}
  .workshop-for ul li{font-size: 14px; line-height: 26px;}
  .aod.workshop-for img, .aod.shrm img {margin-bottom: 20px;}
  .workshop-for h2, .aod h2{line-height: 45px;}
  .aod.shrm h2{line-height: 33px;}
  .aod h2 .title::after{bottom: 0;}
  .contact-button-download{flex-direction: column;}
  .contact .contact-form .contact-button-download button{width: 70% !important;}
  .aod .workshopSwiper .swiper-bottom-nav, .aod .glimpsesSwiper .swiper-bottom-nav{width: 25%;}
  .aod .workshopSwiper .swiper-slide video{height: 190px;}

  .aod .glimpsesSwiper .swiper-slide{transform: none;}
  .aod .glimpsesSwiper{padding-bottom: 30px; margin: 35px 0 0;}
  .aod .explore-cards .circle{width: 80px; height: 80px;}
  .aod .explore-cards .circle img{width: 45px; height: 45px;}
  .aod .explore-cards h4{font-size: 14px;}
  .aod .explore-cards{max-width: 150px;}
  .aod .assessment .explore-cards p{line-height: 18px;}
  .personal-diploma.assessment .process-steps .step-box, .servic.social .step-box{width: unset;}


  /* Careers */
  .job p{ font-size: 14px !important;line-height: 26px;}
  .job p strong{ font-size: 16px;}
  .job-img,.career-img{ height: 325px;}
  .job-img{ margin: 0 auto 20px;}
  .job-form{ 
    padding: 40px 20px; 
    border-radius: 20px; 
    box-shadow: 0px 1px 14px 0px #D9D9D9; 
    background-color: var(--white-color);
  }
  .upload-container{flex-direction: column;align-items: start;}
  .search-wrap form{flex-direction: column;}
  .search-wrap form .form-group{width: 100%;}
  .job-card{width: 100%;}
  .job-tags{flex-direction: column;}

  .job-detail h4{text-align: center;font-weight: 500;}
  .job-detail .job-tags{width: fit-content;}
  .job-detail .col-lg-6:first-child{margin-bottom: 60px;}
  .job-detail .job-tags div{font-size: 14px;}
  .job-detail .job-tags img{width: 24px;height: 20px;}

  .insights-section h2{
    display: block;
    translate: -50%;
    width: 80%;
    padding: 12px 30px;
    font-size: 16px;
    left: 50%;
  }
  .insights-cards{flex-wrap: wrap;}
  .HR .insight{width: 100%;}
  .HR .insight:not(:last-child)::after{height: 0;right: 50%;}
  .insight:not(:last-child)::after{
    border-inline-end: none;
    border-bottom: 3px solid #D0CFCE;
    bottom: 0;
    top: unset;
    right: 50%;
    translate: 50%;
    height: 0;
    width: 55%;
  }
  .HR .insights-wrapper{width: 100%;}
  .HR .insights-cards{justify-content: center;}
  .success-stories .card-wrapp{max-width: unset; margin-bottom: 30px;}
  .figure-container{flex-direction: column;}
  .figure-circle{
    width: 120px;
    height: 120px;
  }
  .figure-circle p{font-size: 24px;}
  .figure-circle span{font-size: 13px;}
  .consult .cards{flex-direction: column;}
  .servic.assessment.plg-approach.gov .service-card{max-width: unset;min-width: unset;width: 100%;}
  .eor .service-card{max-width: 100%;}

  .offshore .strip-overlay{background-position: right top;}
  .phase-card::after{display: none;}
  .phase-card-wrapper{width: 100%;}
  .phase-card-container{flex-direction: column;}

  .job h2.career, .plg-why-assessment h2, .payroll.plg-approach h2{line-height: 32px;}
  .plg-why-assessment h2 .title::after, .benefits-section h2 .title::after {bottom: 0;}
  .benefits-section h2{line-height: 29px;}
  .offshore.plg-assessment h2, .recruit h2, .cust-line {line-height: 30px;}
  .offshore.plg-assessment h2 .title::after, 
  .payroll.plg-approach h2 .title::after, 
  .recruit h2 .title::after,
  .cust-line .title::after{bottom: -2px;}

  body[dir="rtl"] {
    .insights-section h2{left: unset; right: 50%;}
    .nav-links{right: 0;left: unset;}
    .stat-box:not(:last-child)::after {left: 50%;}
    .sub-dropdown{right: 15px !important;}
  }

}

@media (min-width: 540px) and (max-width: 768px) {
   .container{ padding: 0 20px !important; }

  .hamburger { display: block;}
  .navbar{height: 80px;}
  .nav-links {
    position: absolute;
    top: 81px; /* below navbar */
    left: 0;
    width: 100%;
    height: 100vh;
    background: white;
    flex-direction: column;
    align-items: start;
    gap: 20px;
    padding: 20px;
    display: none; /* hidden by default */
    z-index: 99;
    box-shadow: 0px 4px 5px rgba(0,0,0,0.1);
  }
  .nav-links.show { display: flex;}
  .nav-right { display: none;}
  .nav-right-mobile{display: block;}
  .navbar { position: relative;}

  .dropdown {
      position: static;
      width: 100%;
      border: none;
      padding-left: 20px;
      display: none;
    margin-top: 10px;

  }
  .nav-links .serv.dropdown {min-width: 340px;}

  .sub-dropdown{
    top: 100%;
    left: 15px;
    width: 325px;
  }
  .dropdown.active,
  .sub-dropdown.active {
    display: block;
  }
  
  .arrow {
    cursor: pointer;
  }
  .has-sub-dropdown .arrow { transform: rotate(90deg) !important; }
  
  iframe{ width: 90%;height: 400px;}

  .left-content{max-width: 100%;}
  .left-content h2{ font-size: 24px;}
  .left-content p{font-size: 12px;}

  .buttons{
    display: flex;
    gap: 10px;
  }

  .buttons .primary-btn,
  .buttons .primary-outline-btn{
    padding: 10px 25px;
    font-size: 12px;
    margin-right: 0 !important;
  }
  .main-img {
    width: 320px;
    height: 295px;
    background-image: url('../assets/bg/small-circles.png');
    margin: 30px auto 0;
  }
  .main-img .img-circles{
    right: 0;
    top: 0;
  }
  .main-img .image{
    width: 240px;
    height: 228px;
    top: 45px;
    left: 40px;
  }
  .small-img{
    bottom: -15px;
    left: 20px;
    width: 100px;
    height: 100px;
  }

  /* .strip-overlay{ background-position: right;} */
  /* .left-strip-overlay{ background-position: left;} */

  .services .header h2,
  .trusted-companies h2,
  .testimonials-section h2,
  .why-section h2, 
  .feature-card h3,
  .business-forward h2, 
  .contact-form h2,
  .contact-form p{ font-size: 16px !important; }

  .services .header p{ font-size: 12px;width: 90%;}
  .cards { flex-wrap: wrap; gap: 16px;justify-content: center;}
  .service-card, .serv .service-card {max-width: 185px;}
  .service-card img {width: 30px;height: 30px;}
  .service-card h3 {font-size: 14px;}
  .service-card p {font-size: 12px; line-height: unset;padding-inline: 15px;}

  .stats-section h2{
    font-size: 16px;
    text-align: start;
  }
  .stats-container{ flex-direction: column;width: unset;margin: 0 auto}
  .stats-wrapp{flex-direction: row;}
  .stat-box{ margin-bottom: 40px; }
  .stat-box:not(:last-child)::after{
    content: "";
    position: absolute;
    top: 103%;
    left: 50%;
    right: unset !important;
    transform: translateX(-50%);
    width: 10px;
    height: 50px;
    background-image: url('../assets/bg/Line.png');
    background-repeat: no-repeat;
    z-index: 2;
  }

  .trusted-companies .trusted-wave{
    margin-top: 0;
    height: 350px;
  }
  .trusted-companies .trust-wrap{padding-top: 23%;}
  .trusted-companies .swiper{margin-top: 60px;}
  .trusted-companies .swiper-slide img{height: 60px;}

  .testimonials-section{padding: 30px 0 50px;}
  .testimonials-section button{font-size: 12px;}
  .testimonials-section .swiper{margin-bottom: 20px;}

  .why-section .feature-card p,.business-forward p.colored-p{font-size: 13px !important;}
  .why-section .feature-card img{width: 70px;}

  .business-forward,.contact-section {text-align: start;padding: 2rem 0;}
  .business-forward {text-align: center;padding: 2rem 0;}
  .business-forward p {
    font-size: 13px !important;
    width: 95%;
    padding-inline: 0;
    line-height: 28px !important;
    text-align: center;
    margin: 0;
  }

  .contact-content{flex-direction: column;}
  .contact-form{padding-inline-end: 0;width: 100%;border-inline-end:unset}
  .contact-form p{margin-bottom: 1rem;}
  .contact-form button{width: 50% !important;font-size: 14px;}
  .form-group label{font-size: 13px;}
  .address-info{font-size: 14px;}

  .footer{ text-align: center;}
  .footer-desc {margin: 0 auto 20px;width:90%}
  .footer-links{margin-top: 25px;}
  .footer-links h4 {font-size: 15px;}
  .footer-links ul{justify-content: center;}
  .footer-links ul li{font-size: 14px;}
  .newsletter input,.newsletter button{
    width: 80%;
    margin: 0 auto 8px;
  }
  .footer-social {margin: 0 auto;}
  .footer-social .rate{text-align: center !important;}

  .desktop-only{display: none;}
  .mobile-only{display: block;}
  .mobile-only .left{
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 12px;
    padding: 10px 0;
  }

  /* Services Page */
  .page-title {font-size: 24px !important;}
  .page-info{padding-top: 90px;}
  .page-info p {font-size: 14px; padding-inline: 20px;}
  .up-wave{height: 380px;}

  .services.trusted-companies .trusted-wave{
    margin: -50px 0 50px;
    height: 350px;
  }

  /* Contact Us */
  .pg .info{font-size: 16px; width: 85%;}
  .contact-section h2{font-size: 18px;}
  .contact-section .header p {font-size: 16px; width: 100%;}
  .contact-cards .card{height: 130px;padding: 16px;}
  .contact-cards .card h4{font-size: 10px;}
  .contact-cards .card p{font-size: 18px;}
  .contact-cards .card p.location{font-size: 12px;}
  .contact .contact-form p{font-size: 12px;width: 65%; margin: 0 auto 1rem;}
  .contact .contact-form .form-wrap{padding: 40px 25px;}
  .contact .contact-form .form-grid{grid-template-columns: unset}
  .contact .contact-form .form-group{margin-bottom: 1rem;}
  .contact .contact-form button{width: 100% !important;}

  /* Blog Details */
  .breadcrumb{ width: 90%;gap: 4px;}
  .breadcrumb a{font-size: 14px;}
  .detail-blog .banner{height: 235px;}
  .detail-blog h4{font-size: 20px; line-height: 26px;width: unset;}
  .detail-blog p{font-size: 15px; line-height: 26px;}
  .detail-blog span{font-size: 16px;}
  .relate-blog h2{font-size: 20px;}
  .blog-section{margin-top: -55px;}
  .blog.up-wave, .about.up-wave{height: 210px;}
  .blog.up-wave div:first-child, .about.up-wave div:first-child{padding-top: 65px !important;}
  .blog-section h2, .policy .header h2{font-size: 18px;}
  .blog-section .subtitle {font-size: 12px;margin: 0 auto 30px; width: 85%;}

  /* Policy */
  .policy .policy-section:first-child p, .policy .policy-section p{font-size: 14px;}

  /* About Us */
  .about h2, .about.business-forward h2,.badges h2, .ceo-word .header h2{font-size: 16px !important;}
  .about-content{flex-direction: column;}
  .about-content .text p{width: 100%;}
  .about-content p{font-size: 14px;}
  .about-content .text p:first-child{padding-inline-end: 20px;}
  .about-content .video-box{margin-bottom: 40px;}
  .badges .bg{
    background-image: url(../assets/bg/clutch-vertical.png);
    background-position: bottom;
    background-repeat: repeat-y;
  }
  .bg .badge-wrap{ 
    flex-direction: column;
    width: 90%;
    margin: auto;
  }
  .bg .badge-wrap img{ width: 70%; margin: auto;padding-top: 45px;}
  .ceo-word {padding: 80px 0 0;}
  .ceo-word .img-wrap{height: 300px; margin-bottom: 30px;}
  .ceo-word .img-wrap img{object-fit: initial;}
  .ceo-word p{font-size: 14px; line-height: 26px; width: 100%; padding-inline-end: 10px;}
  .ceo-sign{font-size: 12px !important;}
  .about.business-forward{text-align: center;}
  .about.business-forward p{font-size: 14px !important;margin: auto;}
  .about.business-forward button, .about-content button{font-size: 12px; width: unset;}
  .mission-vision {width: 95%; padding: 40px 0;flex-direction: column;}
  .mission-vision .content{width: 100% !important; padding-inline-start: 10px; order: 2;}
  .mission-vision .values{width: 100% !important; order: 1; margin-bottom: 50px;}
  .mission-vision h4, .values h4{font-size: 22px;}
  .mission-vision img{width: 27px;height: 27px;}
  .mission-vision .box:first-child{margin-bottom: 30px;}

  /* PLG */
  .plg-banner .left-content h2{font-size: 24px;width: 90%;line-height: normal;}
  .plg-info{margin-top: 40px;}
  .plg-info p{font-size: 14px;line-height: 24px;text-align: center;}
  .plg-work .plg-cards{width: 90%;margin: auto;}
  .plg-work .header h2, .why-plg .header h2, .plg-review .header h2,.plg-corporate h2, .plg-contact .contact-slogan h2{font-size: 18px;}
  .why-plg ul li{font-size: 14px;}
  .plg-review .swiper-slide blockquote, .plg-review .swiper-slide cite {font-size: 12px;}
  .plg-review .swiper-slide img {width: 35px;height: 35px;}
  .plg-contact.contact{margin-top: unset;}
  .plg-contact.contact .contact-form {width: 90%;}
  .plg-contact.contact .contact-form p{font-size: 12px !important;width: 100%; margin-bottom: 35px;}
  .plg-contact.contact .contact-form .form-grid{display: block;}
  .plg-contact.contact .contact-form .form-group{margin-bottom: 30px; width: 100% !important;}

  .plg-deveolp .serv .service-card{max-width: 400px;}
  .plg-approach .process-steps, .plg-tools .tool-wrap{flex-direction: column;}
  .plg-contact.contact .contact-slogan p{width: 100% !important; font-size: 12px !important;}
  .plg-approach .colored-header-desc p, 
  .plg-approach .colored-header-desc ul li {font-size: 12px; line-height: 24px;}
  .plg-approach .colored-header h3, .plg-approach .custom-approach p,
  .plg-corporate p, .plg-deveolp p, .plg-assessment p, .plg-assessment ul li{font-size: 12px; line-height: normal;}
  .plg-approach .colored-header h3 span{font-size: 23px;}
  .plg-work .header h2, .why-plg .header h2, .plg-review .header h2, 
  .plg-corporate h2, .plg-assessment h2, .plg-deveolp h2, .about h2{font-size: 20px;}
  .plg-corporate, .plg-assessment{margin-bottom: 20px;}
  .plg-why-assessment h2{font-size: 18px;}
  .plg-tools .tool-box{width: 100% !important;}
  .plg-tools .tool-box h4{font-size: 14px;}
  .plg-tools .tool-box p, .aod.expert p, .aod.shrm p{width: 100%;}
  .plg-tools.assesment-steps .tool-box, .plg-tools.assesment-steps.workshop .tool-box{max-width: unset;}
  .tool-box p:first-child{font-size: 36px;}
  .assesment-steps p, .workshop p, .work p{font-size: 12px;}
  .aod.plg-deveolp, .aod.workshop-for h2{margin-bottom: 30px;}
  .workshop-for ul li{font-size: 14px; line-height: 26px;}
  .aod.workshop-for img, .aod.shrm img {margin-bottom: 20px;}
  .workshop-for h2, .aod h2{line-height: 45px;}
  .aod.shrm h2{line-height: 33px;}
  .aod h2 .title::after{bottom: 0;}
  .contact-button-download{flex-direction: column;}
  .contact .contact-form .contact-button-download button{width: 70% !important;}
  .aod .workshopSwiper .swiper-bottom-nav, .aod .glimpsesSwiper .swiper-bottom-nav{width: 25%;}
  .aod .workshopSwiper .swiper-slide video{height: 190px;}

  .aod .glimpsesSwiper .swiper-slide{transform: none;}
  .aod .glimpsesSwiper{padding-bottom: 30px; margin: 35px 0 0;}
  .aod .explore-cards .circle{width: 80px; height: 80px;}
  .aod .explore-cards .circle img{width: 45px; height: 45px;}
  .aod .explore-cards h4{font-size: 14px;}
  .aod .explore-cards{max-width: 150px;}
  .aod .assessment .explore-cards p{line-height: 18px;}
  .personal-diploma.assessment .process-steps .step-box, .servic.social .step-box{width: unset;}


  /* Careers */
  .job p{ font-size: 14px !important;line-height: 26px;}
  .job p strong{ font-size: 16px;}
  .job-img,.career-img{ height: 325px;}
  .job-img{ margin: 0 auto 20px;}
  .job-form{ 
    padding: 40px 20px; 
    border-radius: 20px; 
    box-shadow: 0px 1px 14px 0px #D9D9D9; 
    background-color: var(--white-color);
  }
  .upload-container{flex-direction: column;align-items: start;}
  .search-wrap form{flex-direction: column;}
  .search-wrap form .form-group{width: 100%;}
  .job-card{width: 100%;}
  .job-tags{flex-direction: column;}

  .job-detail h4{text-align: center;font-weight: 500;}
  .job-detail .job-tags{width: fit-content;}
  .job-detail .col-lg-6:first-child{margin-bottom: 60px;}
  .job-detail .job-tags div{font-size: 14px;}
  .job-detail .job-tags img{width: 24px;height: 20px;}

  .insights-section h2{
    display: block;
    translate: -50%;
    width: 80%;
    padding: 12px 30px;
    font-size: 16px;
    left: 50%;
  }
  .insights-cards{flex-wrap: wrap;}
  .HR .insight{width: 100%;}
  .HR .insight:not(:last-child)::after{height: 0;right: 50%;}
  .insight:not(:last-child)::after{
    border-inline-end: none;
    border-bottom: 3px solid #D0CFCE;
    bottom: 0;
    top: unset;
    right: 50%;
    translate: 50%;
    height: 0;
    width: 55%;
  }
  .HR .insights-wrapper{width: 100%;}
  .HR .insights-cards{justify-content: center;}
  .success-stories .card-wrapp{max-width: unset; margin-bottom: 30px;}
  .figure-container{flex-direction: column;}
  .figure-circle{
    width: 120px;
    height: 120px;
  }
  .figure-circle p{font-size: 24px;}
  .figure-circle span{font-size: 13px;}
  .consult .cards{flex-direction: column;}
  .servic.assessment.plg-approach.gov .service-card{max-width: unset;min-width: unset;width: 100%;}
  .eor .service-card{max-width: 100%;}

  .offshore .strip-overlay{background-position: right top;}
  .phase-card::after{display: none;}
  .phase-card-wrapper{width: 100%;}
  .phase-card-container{flex-direction: column;}

  .job h2.career, .plg-why-assessment h2, .payroll.plg-approach h2{line-height: 32px;}
  .plg-why-assessment h2 .title::after, .benefits-section h2 .title::after {bottom: 0;}
  .benefits-section h2{line-height: 29px;}
 .offshore.plg-assessment h2, .recruit h2, .cust-line {line-height: 30px;}
  .offshore.plg-assessment h2 .title::after, 
  .payroll.plg-approach h2 .title::after, 
  .recruit h2 .title::after,
  .cust-line .title::after{bottom: -2px;}

  body[dir="rtl"] {
    .insights-section h2{left: unset; right: 50%;}
    .nav-links{right: 0;left: unset;}
    .stat-box:not(:last-child)::after {left: 50%;}
    .sub-dropdown{right: 15px !important;}

  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .hamburger { display: block;}
  .navbar{height: 80px;}
  .nav-links {
    position: absolute;
    top: 81px; /* below navbar */
    left: 0;
    width: 100%;
    height: 100vh;
    background: white;
    flex-direction: column;
    align-items: start;
    gap: 20px;
    padding: 20px;
    display: none; /* hidden by default */
    z-index: 99;
    box-shadow: 0px 4px 5px rgba(0,0,0,0.1);
  }
  .nav-links.show { display: flex;}
  .nav-right { display: none;}
  .nav-right-mobile{display: block;}
  .navbar { position: relative;}

  .dropdown {
      position: static;
      width: 100%;
      border: none;
      padding-left: 20px;
      display: none;
    margin-top: 10px;

  }
  .nav-links .serv.dropdown {min-width: 340px;}

  .sub-dropdown{
    top: 100%;
    left: 15px;
    width: 325px;
  }
  .dropdown.active,
  .sub-dropdown.active {
    display: block;
  }
  
  .arrow {
    cursor: pointer;
  }
  .has-sub-dropdown .arrow { transform: rotate(90deg) !important; }

  iframe{ width: 90%;height: 600px;}

  .left-content{max-width: 100%;}
  .left-content h2{ font-size: 24px;}
  .left-content p{font-size: 12px;}

  .buttons{
    display: flex;
    gap: 10px;
  }

  .buttons .primary-btn,
  .buttons .primary-outline-btn{
    padding: 10px 25px;
    font-size: 12px;
    margin-right: 0 !important;
  }
  .main-img {
    width: 320px;
    height: 295px;
    background-image: url('../assets/bg/small-circles.png');
    margin: 30px auto 0;
  }
  .main-img .img-circles{
    right: 0;
    top: 0;
  }
  .main-img .image{
    width: 240px;
    height: 228px;
    top: 45px;
    left: 40px;
  }
  .small-img{
    bottom: -15px;
    left: 20px;
    width: 100px;
    height: 100px;
  }

  .services .header h2,
  .trusted-companies h2,
  .testimonials-section h2,
  .why-section h2, 
  .feature-card h3,
  .business-forward h2, 
  .contact-form h2,
  .contact-form p{ font-size: 16px !important; }

  .services .header p{ font-size: 12px;width: 90%;}
  .cards { flex-wrap: wrap; gap: 24px;}
  .service-card, .serv .service-card {max-width: 48%;}
  .recruit .service-card{max-width: 31%;}
  .service-card img {width: 30px;height: 30px;}
  .service-card h3 {font-size: 14px;}
  .service-card p {font-size: 12px; line-height: unset;padding-inline: 15px;}

  .stats-section h2{
    font-size: 16px;
    text-align: start;
  }
  .stats-container{ flex-direction: column;width: unset;margin: 0 auto}
  .stats-wrapp{flex-direction: row;}
  .stat-box{ margin-bottom: 40px; }
  .stat-box:not(:last-child)::after{
    content: "";
    position: absolute;
    top: 103%;
    left: 50%;
    right: unset !important;
    transform: translateX(-50%);
    width: 10px;
    height: 50px;
    background-image: url('../assets/bg/Line.png');
    background-repeat: no-repeat;
    z-index: 2;
  }

  .trusted-companies .trusted-wave{
    margin-top: 0;
    height: 350px;
  }
  .trusted-companies .trust-wrap{padding-top: 15%;}
  .trusted-companies .swiper{margin-top: 60px;}
  .trusted-companies .swiper-slide img{height: 60px;}

  .testimonials-section{padding: 30px 0 50px;}
  .testimonials-section button{font-size: 12px;}
  .testimonials-section .swiper{margin-bottom: 20px;}

  .why-section .feature-card p,.business-forward p.colored-p{font-size: 13px !important;}
  .why-section .feature-card img{width: 70px;}

  .business-forward,.contact-section {text-align: start;padding: 2rem 0;}
  .business-forward {text-align: center;padding: 2rem 0;}
  .business-forward p {
    font-size: 13px !important;
    width: 95% !important;
    padding-inline: 0;
    text-align: center;
    margin: 0;
    line-height: 28px !important;
  }

  .contact-content{flex-direction: column;}
  .contact-form{padding-inline-end: 0;width: 100%;border-inline-end:unset}
  .contact-form p{margin-bottom: 1rem;}
  .contact-form button{width: 50% !important;font-size: 14px;}
  .form-group label{font-size: 13px;}
  .address-info{font-size: 14px;}

  .footer{ text-align: center;}
  .footer-desc {margin: 0 auto 20px;width:90%}
  .footer-links{margin-top: 25px;}
  .footer-links h4 {font-size: 15px;}
  .footer-links ul{justify-content: center;}
  .footer-links ul li{font-size: 14px;}
  .newsletter input,.newsletter button{
    width: 80%;
    margin: 0 auto 8px;
  }
  .footer-social {margin: 0 auto;}
  .footer-social .rate{text-align: center !important;}

  .desktop-only{display: none;}
  .mobile-only{display: block;}
  .mobile-only .left{
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 12px;
    padding: 10px 0;
  }

  /* Services Page */
  .page-title {font-size: 24px !important;}
  .page-info{padding-top: 90px;}
  .page-info p {font-size: 14px; padding-inline: 20px;}
  .up-wave{height: 380px;}

  .services.trusted-companies .trusted-wave{
    margin: -50px 0 50px;
    height: 350px;
  }

  /* Contact Us */
  .pg .info{font-size: 16px; width: 85%;}
  .contact-section h2{font-size: 18px;}
  .contact-section .header p {font-size: 16px; width: 100%;}
  .contact-cards .card{height: 130px;padding: 16px;}
  .contact-cards .card h4{font-size: 10px;}
  .contact-cards .card p{font-size: 18px;}
  .contact-cards .card p.location{font-size: 12px;}
  .contact .contact-form p{font-size: 12px;width: 65%; margin: 0 auto 1rem;}
  .contact .contact-form .form-wrap{padding: 40px 25px;}
  .contact .contact-form .form-grid{grid-template-columns: unset}
  .contact .contact-form .form-group{margin-bottom: 1rem;}
  .contact .contact-form button{width: 100% !important;}

  /* Blog Details */
  .breadcrumb{ width: 90%;gap: 4px;}
  .breadcrumb a{font-size: 14px;}
  .detail-blog .banner{height: 235px;}
  .detail-blog h4{font-size: 20px; line-height: 26px;width: unset;}
  .detail-blog p{font-size: 15px; line-height: 26px;}
  .detail-blog span{font-size: 16px;}
  .relate-blog h2{font-size: 20px;}
  .relate-blog .news-cards .blog-card{max-width: 48%;}
  .blog-section{margin-top: -55px;}
  .blog.up-wave, .about.up-wave{height: 210px;}
  .blog.up-wave div:first-child, .about.up-wave div:first-child{padding-top: 65px !important;}
  .blog-section h2, .policy .header h2{font-size: 18px;}
  .blog-section .subtitle {font-size: 12px;margin: 0 auto 30px; width: 85%;}

  .plg-corporate h2{line-height: 36px;}

  /* Policy */
  .policy .policy-section:first-child p, .policy .policy-section p{font-size: 14px;}

  /* About Us */
  .about h2, .about.business-forward h2,.badges h2, .ceo-word .header h2{font-size: 16px !important;}
  .about-content .text p{width: 100%;}
  .about-content p{font-size: 14px;}
  .about-content .text p:first-child{padding-inline-end: 20px;}
  .about-content .video-box{margin-bottom: 40px;}
  .badges .bg{
    background-image: url(../assets/bg/clutch-vertical.png);
    background-position: bottom;
    background-repeat: repeat-y;
  }
  .bg .badge-wrap{ 
    flex-direction: column;
    width: 90%;
    margin: auto;
  }
  .bg .badge-wrap img{ width: 40%; margin: auto;padding-top: 45px;}
  .ceo-word {padding: 80px 0 0;}
  .ceo-word .img-wrap{ margin-bottom: 30px;}
  .ceo-word p{font-size: 14px; line-height: 26px; width: 100%; padding-inline-end: 10px;}
  .ceo-sign{font-size: 12px !important;}
  .about.business-forward{text-align: center;}
  .about.business-forward p{font-size: 14px !important;margin: auto;}
  .about.business-forward button, .about-content button{font-size: 12px; width: unset;}
  .mission-vision {width: 95%; padding: 40px 0;flex-direction: column;}
  .mission-vision .content{width: 100% !important; padding-inline-start: 10px; order: 2;}
  .mission-vision .values{ order: 1; margin:0 auto 50px;}
  .mission-vision h4, .values h4{font-size: 22px;}
  .mission-vision img{width: 27px;height: 27px;}
  .mission-vision .box:first-child{margin-bottom: 30px;}

  /* PLG */
  .plg-banner .left-content h2{font-size: 24px;width: 90%;line-height: normal;}
  .plg-info{margin-top: 40px;}
  .plg-info p{font-size: 14px;line-height: 24px;text-align: center;}
  .plg-cards .card{width: 48%;}
  .plg-work .plg-cards, .plg-deveolp .cards{background-color: var(--white-color);justify-content: start;}
  
  .plg-work .header h2, .why-plg .header h2, .plg-review .header h2,.plg-corporate h2, .plg-contact .contact-slogan h2{font-size: 18px;}
  .why-plg ul li{font-size: 14px;}
  .plg-review .swiper-slide blockquote, .plg-review .swiper-slide cite {font-size: 12px;}
  .plg-review .swiper-slide img {width: 35px;height: 35px;}
  .plg-contact.contact{margin-top: unset;}
  .plg-contact.contact .contact-form {width: 90%;}
  .plg-contact.contact .contact-form p{font-size: 12px !important;width: 100%; margin-bottom: 35px;}
  .plg-contact.contact .contact-form .form-grid{display: block;}
  .plg-contact.contact .contact-form .form-group{margin-bottom: 30px; width: 100% !important;}

  .plg-deveolp .serv .service-card{max-width: 47%;}
  .plg-approach .process-steps, .plg-tools .tool-wrap{flex-direction: row;flex-wrap: wrap;}
  .assessment .process-steps .step-box{max-width: 48%;}
  .plg-contact.contact .contact-slogan p{width: 100% !important; font-size: 12px !important;}
  .plg-approach .colored-header-desc p, 
  .plg-approach .colored-header-desc ul li {font-size: 12px; line-height: 24px;}
  .plg-approach .colored-header h3, .plg-approach .custom-approach p,
  .plg-corporate p, .plg-deveolp p, .plg-assessment p, .plg-assessment ul li{font-size: 12px; line-height: normal;}
  .plg-approach .colored-header h3 span{font-size: 23px;}
  .plg-work .header h2, .why-plg .header h2, .plg-review .header h2, 
  .plg-corporate h2, .plg-assessment h2, .plg-deveolp h2, .about h2{font-size: 20px;}
  .plg-corporate, .plg-assessment{margin-bottom: 20px;}
  .plg-why-assessment h2{font-size: 18px;}
  .plg-tools .tool-box{width: 48% !important;}
  .plg-tools .tool-box h4{font-size: 14px;}
  .plg-tools .tool-box p, .aod.expert p, .aod.shrm p{width: 100%;}
  .plg-tools.assesment-steps .tool-box, .plg-tools.assesment-steps.workshop .tool-box{max-width: unset;}
  .tool-box p:first-child{font-size: 36px;}
  .assesment-steps p, .workshop p, .work p{font-size: 12px;}
  .aod.plg-deveolp, .aod.workshop-for h2{margin-bottom: 30px;}
  .workshop-for ul li{font-size: 14px; line-height: 26px;}
  .aod.workshop-for img, .aod.shrm img {margin-bottom: 20px;}
  .workshop-for h2, .aod h2{line-height: 45px;}
  .aod.shrm h2{line-height: 33px;}
  .contact-button-download{flex-direction: column;}
  .contact .contact-form .contact-button-download button{width: 70% !important;}
  .aod .workshopSwiper .swiper-bottom-nav, .aod .glimpsesSwiper .swiper-bottom-nav{width: 25%;}
  .aod .workshopSwiper .swiper-slide video{height: 190px;}

  .aod .glimpsesSwiper .swiper-slide{transform: none;}
  .aod .glimpsesSwiper{padding-bottom: 30px; margin: 35px 0 0;}
  .aod .explore-cards .circle{width: 80px; height: 80px;}
  .aod .explore-cards .circle img{width: 45px; height: 45px;}
  .aod .explore-cards h4{font-size: 14px;}
  .aod .explore-cards{max-width: 150px;}
  .aod .assessment .explore-cards p{line-height: 18px;}


  /* Careers */
  .job p{ font-size: 14px !important;line-height: 26px;}
  .job p strong{ font-size: 16px;}
  .job-img,.career-img{ height: 325px;}
  .job-img{ margin: 0 auto 20px;}
  .job-form{ 
    padding: 40px 20px; 
    border-radius: 20px; 
    box-shadow: 0px 1px 14px 0px #D9D9D9; 
    background-color: var(--white-color);
  }
  .upload-container{flex-direction: column;align-items: start;}
  .search-wrap form{flex-direction: column;}
  .search-wrap form .form-group{width: 100%;}
  .job-card{width: 100%;}

  .job-detail h4{text-align: center;font-weight: 500;}
  .job-detail .job-tags{width: fit-content;}
  .job-detail .col-lg-6:first-child{margin-bottom: 60px;}
  .job-detail .job-tags div{font-size: 14px;}
  .job-detail .job-tags img{width: 24px;height: 20px;}

  .insights-section h2{
    display: block;
    translate: -50%;
    width: 80%;
    padding: 12px 30px;
    font-size: 16px;
    left: 50%;
  }
  .insights-cards{flex-wrap: wrap;justify-content: center;}
  .HR .insight{width: 100%;}
  .HR .insight:not(:last-child)::after{height: 0;right: 50%;}
  .insight:not(:last-child)::after{
    border-inline-end: none;
    border-bottom: 3px solid #D0CFCE;
    bottom: 0;
    top: unset;
    right: 50%;
    translate: 50%;
    height: 0;
    width: 55%;
  }
  .HR .insights-wrapper{width: 100%;}
  .HR .insights-cards{justify-content: center;}
  .success-stories .card-wrapp{max-width: 48%; margin-bottom: 30px;}
  .figure-container{flex-wrap: wrap;}
  .figure-wrap{width: 48%;}
  .figure-circle{
    width: 120px;
    height: 120px;
  }
  .figure-circle p{font-size: 24px;}
  .figure-circle span{font-size: 13px;}
  .servic.assessment.plg-approach.gov .service-card{max-width: unset;min-width: unset;width: 48%;}
  .eor .service-card, .responsible-card{max-width: 48%;}
  .responsible-wrap, .consult .cards{background-color: var(--white-color);}
  .consult .service-card{width: 31%;}
  .consult .cards{flex-wrap: wrap;}

 


  .offshore .strip-overlay{background-position: right top;}
  .phase-card::after{display: none;}
  .phase-card-wrapper{width: 100%;}

  .job h2.career, .plg-why-assessment h2, .payroll.plg-approach h2{line-height: 32px;}
  .plg-why-assessment h2 .title::after, .benefits-section h2 .title::after {bottom: 0;}
  .benefits-section h2{line-height: 29px;}
  .offshore.plg-assessment h2, .recruit h2, .cust-line {line-height: 30px;}
  .offshore.plg-assessment h2 .title::after, 
  .payroll.plg-approach h2 .title::after, 
  .recruit h2 .title::after,
  .cust-line .title::after{bottom: -2px;}


  body[dir="rtl"] {
    .insights-section h2{left: unset; right: 50%;}
    .nav-links{right: 0;left: unset;}
    .stat-box:not(:last-child)::after {left: 50%;}
    .sub-dropdown{right: 15px !important;}

  }
}

@media (min-width: 1025px) and (max-width: 1300px) {
  .nav-links{ gap: 35px !important; }
  .nav-links li a{font-size: 16px !important;}
  .nav-links .has-dropdown:hover .dropdown {
    display: block;
  }
  
  .has-sub-dropdown:hover .sub-dropdown {
    display: block;
  }
  .left-content{max-width: 100%;}
  .left-content h2{ font-size: 28px;}
  .left-content p{font-size: 16px;}

  .buttons{
    display: flex;
    gap: 10px;
  }

  .buttons .primary-btn,
  .buttons .primary-outline-btn{
    padding: 10px 25px;
    font-size: 12px;
    margin-right: 0 !important;
  }
  .main-img {
    width: 400px;
    height: 380px;
    background-image: url('../assets/bg/small-circles.png');
    margin: 30px auto 0;
  }
  .main-img .img-circles{
    right: 0;
    top: 0;
  }
  .main-img .image{
    width: 75%;
    height: 75%;
    top: 15%;
    left: 11%;
  }
  .small-img{
    bottom: 0;
    left: 12%;
    width: 120px;
    height: 120px;
  }

  .trusted-companies .trusted-wave{
    margin-top: -100px;
    height: 600px;
  }

  .stats-container{ width: 90%;}

  .plg-cards .card, .plg-deveolp .service-card{ width: 350px;}
  .plg-why-assessment.plg-deveolp .service-card{max-width: 265px;}
  .plg-tools.assesment-steps.workshop .tool-box{max-width: 205px;}

  .assessment .process-steps .step-box, 
  .relate-blog .news-cards .blog-card,
  .servic.plg-tools.assesment-steps .tool-box{max-width: 355px;}

  .servic.assessment.plg-approach.gov .service-card{min-width: 355px;}

  .plg-tools.assesment-steps .tool-box{max-width: 260px;}

  .aod.plg-contact p{font-size: 16px !important;}
  .jobs-cards .cards-wrap{ justify-content: center;}
  .job-detail p{width: 95%;}
  .servic.assessment.plg-approach .service-card{width: 260px;}

  .HR .insight:not(:last-child)::after{ right :-45px; }
  .phase-card:not(:last-child):after{ display: none;}

}

@media (min-width:1300px) {
 
  .nav-links .has-dropdown:hover .dropdown {
    display: block;
  }
  
  .has-sub-dropdown:hover .sub-dropdown {
    display: block;
  }
}
/* ///////////////////////////////////////////////////////////////////// */
/* /////////////////// Animation Styles /////////////////////////////// */
/* /////////////////////////////////////////////////////////////////// */

.fade-left-section,
.fade-in-section {
  opacity: 0;
  will-change: opacity;
  transition-timing-function: ease-in-out;
  transition-delay: 0.2s;
}

.fade-left-section {
  transform: translateX(var(--transform-direction, -100px));
  /* transform: translateX(-100px); */
  
  will-change: opacity, transform;
  transition-property: opacity, transform;
  transition-duration: 2s;
}

.fade-left-section.visible {
  opacity: 1;
  transform: translateX(0);
}

.fade-in-section {
  transition-property: opacity;
  transition-duration: 1.5s;
}

.fade-in-section.visible {
  opacity: 1;
}