/* Team grid/cards */
.team-grid {
  list-style: none;
  padding: 0;
  margin: 2rem 0 0 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 2rem;
}

.team-card {
  text-align: center;
  padding: 1.75rem;
  border-radius: 0.6rem;
  border: 1px solid rgba(255,255,255,0.15);
  background: rgba(255,255,255,0.03); /* works on light/dark themes */
}

/* Headshots */
.team-card .avatar {
  width: 140px;
  height: 140px;
  border-radius: 50%;      /* make round; change to .75rem for rounded squares */
  object-fit: cover;       /* keep faces centered */
  display: block;
  margin: 0 auto 1rem auto;
}

/* Text bits */
.team-card h3 {
  margin: 0 0 .25rem 0;
}

.team-card .meta {
  opacity: 0.8;
  font-size: 0.95em;
  margin: 0 0 .4rem 0;
}

.team-card .interests {
  font-size: 0.95em;
  margin: 0 0 .6rem 0;
}

/* Linked icons row */
.team-card .links .icon {
  font-size: 1.2rem;   /* bump LinkedIn icon a bit */
  margin: 0 .25rem;
  text-decoration: none;
}


/* Make the "About" image smaller */
#intro .image.main img {
    max-width: 400px;   
    width: 100%;       
    height: auto;
    margin: 0 auto;     
    display: block;
}

/* Increase the paragraph font size */
#intro p {
    font-size: 1.3rem;   
    line-height: 1.6;    
}

/* Center landing page logo on mobile */
@media screen and (max-width: 600px) {
  .uilogo {
    display: block;
    margin: 0 auto;      /* centers horizontally */
    max-width: 200px;    /* keep it smaller */
    width: auto;         /* prevent it from filling the whole width */
  }

  #header .content .inner {
    padding: 1.5rem 1rem; /* reduce top/bottom padding */
    display: flex;
    flex-direction: column;
    align-items: center; /* force center align */
    justify-content: center;
  }
}