/* 5 col en ≥1400px (Bootstrap no trae 20% por defecto) */
@media (min-width: 1400px){
  .col-xxl-2-5 { flex: 0 0 20%; max-width: 20%; }
}

/* Tarjeta compacta de especialidad */
.specialty-card{
  position: relative;
  display: block;
  border-radius: 14px;
  overflow: hidden;
  background: #f4f6f8;
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  transition: transform .25s ease, box-shadow .25s ease;
}
.specialty-card img{
  width: 100%;
  height: 160px;               /* alto parejo y compacto */
  object-fit: cover;
  display: block;
  transition: transform .4s ease, filter .4s ease;
}
.specialty-card span{
  position: absolute;
  left: 10px; right: 10px; bottom: 10px;
  display: inline-block;
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(0,0,0,.45);
  color: #fff;
  font-weight: 600;
  font-size: .95rem;
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
}

/* Hover efecto: zoom suave + realce */
.specialty-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 10px 26px rgba(0,0,0,.10);
}
.specialty-card:hover img{
  transform: scale(1.06);
  filter: saturate(1.05) contrast(1.02);
}

/* Ajustes responsivos */
@media (max-width: 991.98px){    /* md-lg */
  .specialty-card img{ height: 150px; }
}
@media (max-width: 575.98px){    /* xs-sm */
  .specialty-card img{ height: 140px; }
  .specialty-card span{ font-size: .9rem; padding: 7px 9px; }
}
