/* --- University Logo Slider Styles --- */

/* Add space between the section title and the slider */
.universitySection .sectionIntro {
  margin-bottom: 4rem;
}

/* Add space below the university section */
.universitySection {
  padding-bottom: 4rem;
}

/* Style the container for each logo slide */
.universitySlide {
  display: flex;
  align-items: center; /* Vertically center */
  justify-content: center; /* Horizontally center */
  height: 100px; /* Give a consistent height to each slide container */
  padding: 0 15px; /* Add horizontal spacing */
}

/* Style the logo images themselves */
.universitySlide img {
  max-height: 80px;  /* Set a max height for all logos */
  max-width: 100%;   /* Ensure logo does not overflow its container */
  width: auto;         /* Maintain aspect ratio */
  object-fit: contain; /* Ensure the whole logo is visible */
  filter: grayscale(100%); /* Optional: for a uniform, clean look */
  opacity: 0.8;
  transition: all 0.3s ease;
}

.universitySlide img:hover {
  filter: grayscale(0%);
  opacity: 1;
  transform: scale(1.05);
}

/* --- Responsive Adjustments --- */

/* Tablet */
@media screen and (max-width: 768px) {
  .universitySlide {
    height: 80px;
  }
  .universitySlide img {
    max-height: 60px;
  }
}

/* Mobile */
@media screen and (max-width: 480px) {
  .universitySection .sectionIntro {
    margin-bottom: 2.5rem;
  }
  .universitySection {
    padding-bottom: 3rem;
  }
  .universitySlide {
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
  }
  .universitySlide img {
    max-height: 50px;
    margin: 0 auto;
  }
}