/* Referanslar üst şerit */
.ref-hero{
  padding: 28px 0 6px;
  background: #f6f7fb; /* istersen kaldır */
}

/* Grid */
.brand-grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 22px;
}

/* Kart */
.brand-card{
  background: #fff;
  border-radius: 14px;
  border: 1px solid rgba(17,24,39,.12);
  box-shadow: 0 8px 26px rgba(17,24,39,.06);
  padding: 18px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.brand-card:hover{
  transform: translateY(-2px);
  border-color: rgba(45,61,223,.35);
  box-shadow: 0 12px 32px rgba(45,61,223,.16);
}

/* Logo kutusu */
.brand-logo{
  display: block;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}

/* Logo görseli */
.brand-logo img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  /* SİYAH-BEYAZ default */
  filter: grayscale(1) saturate(0) brightness(.95) contrast(1.05);
  opacity: .9;
  transition: filter .25s ease, opacity .25s ease, transform .25s ease;
}

/* Hover: renklensin */
.brand-card:hover img{
  filter: none;
  opacity: 1;
  transform: scale(1.02);
}

/* Küçük ekran ayarı */
@media (max-width: 575.98px){
  .brand-grid{ gap: 16px; }
  .brand-card{ padding: 14px; border-radius: 12px; }
}