.team-member-grid .team-member{
    height: 500px;
    overflow: hidden;
    position: relative;
    border-top: 1px solid #f2f2f2;
    /* border-right: 1px solid #f2f2f2; */
}
.team-member-grid .swiper-slide:first-child .team-member{
    border-left: 1px solid #f2f2f2;
}
.team-member__wrap{
    height: 100%;
    overflow: hidden;
	transition: 0.6s;
}
.team-member__image{
    width: 100%;
    height: 100%;
    overflow: hidden;
    transition: 0.4s;
}

.team-member__image img{
    width: 100%;
    height: 100% !important;
    object-fit: cover;
	
    object-position: center top;
}

.team-member__content{
    text-align: center;
    padding: 20px 0;
    color: #fff;
    position: absolute;
    left: 0;
    bottom: 0px;
    width: 100%;
    background-color: #03111D;
    transition: 0.6s;
    padding-left: 10px;
    padding-right: 10px;
}
.team-member__name{
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 5px;
    color: #D81023;
}
.team-member__designation{
    font-size: 16px;
    margin-bottom: 10px;
    display: block;
}
.team-member-grid .team-member:hover .team-member__content{
    bottom: 0;
}

.team-member__description {
  height: 0;
    opacity: 0;
    overflow: hidden;
    transition: height 0.4s ease, opacity 0.3s ease
}

/* .team-member-grid .team-member:hover .team-member__description {
    height: 100%;
    opacity: 1;
} */

/* Desktop hover keeps working */
@media (hover: hover) and (pointer: fine){
  .team-member-grid .team-member:hover .team-member__description{
    opacity:1;
    height:auto;
  }

	/* Desktop hover keeps working */
	.team-member-grid .team-member:hover .team-member__image{
	  -webkit-filter: blur(3px);
	  filter: blur(3px);
	}
}
/* Smooth blur on images */
.team-member__image{
  transition: filter .3s ease, -webkit-filter .3s ease;
  will-change: filter;
}

/* Mobile/tap: same effect when JS toggles .is-hovered */
.team-member-grid .team-member.is-hovered .team-member__image{
  -webkit-filter: blur(3px);
  filter: blur(3px);
}


.team-member-grid .swiper-button-next, .team-member-grid .swiper-button-prev{
    color: #D81023;
    font-size: 30px;
}

.team-member-grid .swiper-button-next:after, 
.team-member-grid .swiper-button-prev:after{
    font-size: 30px;
}

.team-member-grid .swiper-pagination{
    display: none;
}

.team-member-grid {
  display: grid;
  gap: 20px; /* Adjust spacing as needed */
}

/* Default: Mobile (sm) - 100% width unless overridden */
[class*="grid-sm-"] {
  grid-template-columns: repeat(12, 1fr);
}



.grid-sm-1 { grid-template-columns: repeat(1, 1fr); }
.grid-sm-2 { grid-template-columns: repeat(2, 1fr); }
.grid-sm-3 { grid-template-columns: repeat(3, 1fr); }
.grid-sm-4 { grid-template-columns: repeat(4, 1fr); }
.grid-sm-5 { grid-template-columns: repeat(5, 1fr); }
.grid-sm-6 { grid-template-columns: repeat(6, 1fr); }
.grid-sm-7 { grid-template-columns: repeat(7, 1fr); }
.grid-sm-8 { grid-template-columns: repeat(8, 1fr); }
.grid-sm-9 { grid-template-columns: repeat(9, 1fr); }
.grid-sm-10 { grid-template-columns: repeat(10, 1fr); }
.grid-sm-11 { grid-template-columns: repeat(11, 1fr); }
.grid-sm-12 { grid-template-columns: repeat(12, 1fr); }


.team-member-grid .team-member__item.is-featured{
	grid-column: span 2 !important;
}

/* Tablet (md) */
@media (min-width: 768px) {
  .grid-md-1 { grid-template-columns: repeat(1, 1fr); }
  .grid-md-2 { grid-template-columns: repeat(2, 1fr); }
  .grid-md-3 { grid-template-columns: repeat(3, 1fr); }
  .grid-md-4 { grid-template-columns: repeat(4, 1fr); }
  .grid-md-5 { grid-template-columns: repeat(5, 1fr); }
  .grid-md-6 { grid-template-columns: repeat(6, 1fr); }
  .grid-md-7 { grid-template-columns: repeat(7, 1fr); }
  .grid-md-8 { grid-template-columns: repeat(8, 1fr); }
  .grid-md-9 { grid-template-columns: repeat(9, 1fr); }
  .grid-md-10 { grid-template-columns: repeat(10, 1fr); }
  .grid-md-11 { grid-template-columns: repeat(11, 1fr); }
  .grid-md-12 { grid-template-columns: repeat(12, 1fr); }
}

/* Laptop (lg) — now starts above tablet landscape */
@media (min-width: 1200px) {
  .grid-lg-1  { grid-template-columns: repeat(1, 1fr); }
  .grid-lg-2  { grid-template-columns: repeat(2, 1fr); }
  .grid-lg-3  { grid-template-columns: repeat(3, 1fr); }
  .grid-lg-4  { grid-template-columns: repeat(4, 1fr); }
  .grid-lg-5  { grid-template-columns: repeat(5, 1fr); }
  .grid-lg-6  { grid-template-columns: repeat(6, 1fr); }
  .grid-lg-7  { grid-template-columns: repeat(7, 1fr); }
  .grid-lg-8  { grid-template-columns: repeat(8, 1fr); }
  .grid-lg-9  { grid-template-columns: repeat(9, 1fr); }
  .grid-lg-10 { grid-template-columns: repeat(10, 1fr); }
  .grid-lg-11 { grid-template-columns: repeat(11, 1fr); }
  .grid-lg-12 { grid-template-columns: repeat(12, 1fr); }
}



/* Desktop (xl) — now only above 1600px so laptop values win up to 1600 */
@media (min-width: 1600px) {
  .grid-xl-1  { grid-template-columns: repeat(1, 1fr); }
  .grid-xl-2  { grid-template-columns: repeat(2, 1fr); }
  .grid-xl-3  { grid-template-columns: repeat(3, 1fr); }
  .grid-xl-4  { grid-template-columns: repeat(4, 1fr); }
  .grid-xl-5  { grid-template-columns: repeat(5, 1fr); }
  .grid-xl-6  { grid-template-columns: repeat(6, 1fr); }
  .grid-xl-7  { grid-template-columns: repeat(7, 1fr); }
  .grid-xl-8  { grid-template-columns: repeat(8, 1fr); }
  .grid-xl-9  { grid-template-columns: repeat(9, 1fr); }
  .grid-xl-10 { grid-template-columns: repeat(10, 1fr); }
  .grid-xl-11 { grid-template-columns: repeat(11, 1fr); }
  .grid-xl-12 { grid-template-columns: repeat(12, 1fr); }
}
