/* ===============================
            BANNER SPONSORS
   =============================== */

.banner-sponsors {
  background-color: #f5f5f5; /* Color de fons suau (gris clar) */
  padding: 30px 20px;        /* Espai interior superior/inferior 30px, lateral 20px */
  text-align: center;        /* Centra el contingut horitzontalment */
}

.banner-sponsors h2 {
  margin-bottom: 20px;            
  margin-top: 20px;            
  font-family: 'Teko', sans-serif; /* Tipus de lletra decorativa */
  font-size: 2rem;                /* Mida de la lletra relativament gran */
  color: #003366;                 /* Color blau fosc */
}

.logos-sponsors {
  display: flex;             
  justify-content: center;   
  flex-wrap: wrap;           
  gap: 100px;                 /* Espai entre logos */
  align-items: center;       
}

.logos-sponsors img {
  max-height: 80px;
  width: auto;
  filter: grayscale(100%) contrast(180%) brightness(90%);
  transition: filter 0.3s ease, transform 0.3s ease;
  cursor: pointer;
}

.logos-sponsors a {
  display: inline-block; 
}

.logos-sponsors img:hover {
  filter: none; 
  transform: translateY(-4px);
}

/* ===============================
        ADAPTACIÓ A MÒBILS
   =============================== */

@media (max-width: 600px) {
  .banner-sponsors {
    padding: 20px 10px;
  }

  .banner-sponsors h2 {
    margin-bottom: 15px;
    font-size: 1.5rem;
  }

  .logos-sponsors {
    gap: 15px;           /* Redueix l’espai entre logos */
    justify-content: center;
  }

  .logos-sponsors img {
    max-height: 60px;    /* Redueix la mida dels logos per adaptar-se millor a pantalles petites */
  }
}