.brands-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:18px;
}

@media (max-width: 1024px){
  .brands-grid{ grid-template-columns: repeat(3,1fr); }
}
@media (max-width: 640px){
  .brands-grid{ grid-template-columns: repeat(2,1fr); }
}

/* ===== Brand Cards Premium ===== */

.brand-card{
  position:relative;
  display:block;
  height:180px;
  border-radius:18px;
  overflow:hidden;
  background:#000;
  box-shadow: 0 12px 32px rgba(11,15,20,.10);
  transition: transform .25s ease, box-shadow .25s ease;
}

/* Imagen cubre toda la card */
.brand-card img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transition: transform .4s ease;
}

/* Franja inferior para el nombre */
.brand-card span{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:10px 14px;
  background:linear-gradient(
    to top,
    rgba(0,0,0,.70),
    rgba(0,0,0,.30),
    rgba(0,0,0,0)
  );
  color:#fff;
  font-weight:600;
  font-size:13.5px;
  letter-spacing:.4px;
  text-align:left;
}

/* Hover premium */
.brand-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 40px rgba(11,15,20,.16);
}

.brand-card:hover img{
  transform: scale(1.05);
}