
#teamTrack {
  position: relative; 
  overflow: hidden; 
}


#teamTrack .team-slider {
  display: grid !important;
  grid-auto-flow: column;
  grid-template-rows: repeat(2, auto);
  grid-auto-columns: calc(20% - 40px);
  gap: 20px 40px;
  transition: transform 0.6s ease;
}



.arrow {
  position: absolute;
  top: 50%; 
  transform: translateY(-50%);
  border: none;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  cursor: pointer;
  z-index: 10;
  display: flex;
  align-items: center;  
  justify-content: center;
  /*background: linear-gradient(135deg, #0c344d, #0d0d0d); */
  background-color: #F26A21;
  color: #fff;
  transition: all 0.3s ease;
}

.arrow:hover {
  background: linear-gradient(135deg, #0a2a3b, #000000);
  transform: translateY(-50%) scale(1.1);
}

.arrow.left { left: 10px; }
.arrow.right { right: 10px; }

.arrow img {
  width: 30px;
  height: 30px;
  object-fit: cover;
  max-width: fit-content;
}

.p-image{
    display: flex;
    justify-content:center; 
}
.p-image .elementor-widget-container {
    max-height: 250px !important;
    object-fit: cover;
    border-radius: 50%;
    overflow: hidden;
    max-width: 250px;
    width: 100%;
    height: 100%;
}
.p-image .elementor-widget-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* border-radius: 50%; */
}

/* ---------- Responsive Grid ---------- */
@media (max-width: 1024px) and (min-width: 800px){
  #teamTrack .team-slider{
    grid-auto-columns: calc(25% - 33px);  
    gap: 20px 40px;
  }
}

@media (max-width: 799.98px) and (min-width: 650px){
  #teamTrack .team-slider{
    grid-auto-columns: calc(33.33% - 33px);  
  }
}

@media (max-width: 649.98px) and (min-width: 500px){
  #teamTrack .team-slider{
    grid-auto-columns: calc(50% - 29px); 
    transition: transform 0.6s ease;
  }
  .team-card{
      width: 100%;
  }
}

@media (max-width: 499.98px){
  #teamTrack .team-slider{
    grid-auto-columns: 100%; 
    gap: 20px 20px;
  }
  .team-card{
      width: 100%;
  }
}
