/* 品牌列表页面样式 - 从 Brandquery.vue 转换 */
.image-grid-container {
  width: 80vw; max-width: var(--max-width-view); margin: 0 auto;
  display: grid; grid-template-columns: repeat(6, 1fr); grid-gap: 10px;
  padding: 10px; background-color: #fff;
}
.image-item {
  width: 100%; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 4px;
  box-shadow: 0 0 4px rgba(0,0,0,0.2); position: relative;
  display: flex; justify-content: center; align-items: center;
}
.image-item img { width: 100%; height: auto; object-fit: cover; }
.image-item .image-text {
  display: none; width: 100%; height: 100%; background-color: rgba(0,0,0,0.4);
  position: absolute; top: 0; color: #fff; justify-content: end; align-items: center;
  padding: 35px 0; cursor: pointer;
}
.image-item .image-text .image-text-more {
  position: absolute; bottom: 15%; display: flex; justify-content: space-between;
  padding: 5px 15px; width: 60%; border-radius: 20px;
  border: var(--primary-color) 1px solid; color: #fff !important; background-color: #fe9906;
}
.image-item:hover .image-text { display: flex; flex-direction: column; justify-content: end; }
@media (max-width: 768px) {
  .image-grid-container { width: 95vw; grid-template-columns: repeat(2, 1fr); }
}