@media (max-width: 991px) {
  .directors-block {
    overflow: hidden;
  }
}
.directors-block .__heading {
  margin-bottom: 6.4rem;
}
@media (min-width: 768px) {
  .directors-block .__heading {
    margin-bottom: 8rem;
  }
}
.directors-block .__heading h2 {
  margin-bottom: 2.4rem;
}
@media (min-width: 768px) {
  .directors-block .__heading h2 {
    margin-bottom: 3.6rem;
  }
}
.directors-block .__heading p {
  max-width: 90rem;
  margin: auto;
}
.directors-block .__cards {
  background-color: #E7E7E7;
  transition: background-color 0.4s ease;
  position: relative;
  padding-bottom: 7.6rem;
  max-width: 37rem;
  margin: auto;
  border-radius: 8px 8px 0px 0px;
  overflow: hidden;
  margin-bottom: 2.8rem;
}
@media (min-width: 768px) {
  .directors-block .__cards {
    padding-bottom: 10rem;
    margin-bottom: 8rem;
  }
}
.directors-block .__cards figure {
  margin: 0;
}
.directors-block .__cards figure img {
  transition: filter 0.4s ease;
}
.directors-block .__cards .__content {
  background-color: white;
  padding: 1.2rem;
  height: auto;
  transition: all 0.6s ease;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}
@media (min-width: 768px) {
  .directors-block .__cards .__content {
    padding: 2.4rem 1.6rem;
  }
}
.directors-block .__cards .__content .__designation {
  color: #2E2E2E;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 120%;
}
.directors-block .__cards .__content .__bio {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s ease, opacity 0.4s ease, transform 0.4s ease;
  opacity: 0;
  transform: translateY(-10px);
}
.directors-block .__cards .__content .__bio .__in {
  border-top: 1px solid #CCC;
  padding-top: 1.6rem;
  margin-top: 1.6rem;
}
.directors-block .__cards:hover {
  background-color: #C5C6C7;
}
.directors-block .__cards:hover figure img {
  filter: blur(2px);
}
.directors-block .__cards:hover .__bio {
  max-height: 500px; /* Adjust based on your content */
  opacity: 1;
  transform: translateY(0);
}/*# sourceMappingURL=style.css.map */