/* =============================================================================
   Nos marques — annuaire des marques (product_brand)
   ============================================================================= */

.ps-brands { background: #fff; }
.ps-brands__inner {
  max-width: var(--ps-content);
  margin: 0 auto;
  padding: 28px 20px 72px;
  box-sizing: border-box;
}
.ps-brands__inner * { box-sizing: border-box; }

/* Fil d'ariane (réutilise le style produit) */
.ps-brands .ps-breadcrumb { font-size: 13px; color: var(--ps-muted); margin-bottom: 26px; }
.ps-brands .ps-breadcrumb a { color: var(--ps-muted); text-decoration: none; }
.ps-brands .ps-breadcrumb a:hover { color: var(--ps-gold); }
.ps-brands .ps-breadcrumb .sep { margin: 0 8px; color: var(--ps-line); }

/* En-tête */
.ps-brands__head { text-align: center; max-width: 640px; margin: 0 auto 40px; }
.ps-brands__head .ps-eyebrow {
  display: inline-block; font-size: 12px; font-weight: 600; letter-spacing: .18em;
  text-transform: uppercase; color: var(--ps-gold-dark); margin-bottom: 12px;
}
.ps-brands__title { font-family: var(--ps-font-heading); font-size: clamp(30px, 4vw, 46px); line-height: 1.08; color: var(--ps-ink); margin: 0 0 14px; }
.ps-brands__sub { font-size: 15px; line-height: 1.65; color: var(--ps-body); margin: 0; }

/* Filtre A-Z */
.ps-brands__az {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 8px;
  margin: 0 auto 36px; padding-bottom: 4px;
}
.ps-brands__letter {
  min-width: 40px; height: 40px; padding: 0 12px;
  border: 1px solid var(--ps-line); border-radius: var(--ps-radius-pill);
  background: #fff; color: var(--ps-ink); font-size: 14px; font-weight: 600;
  cursor: pointer; transition: border-color .15s, background .15s, color .15s;
}
.ps-brands__letter:hover { border-color: var(--ps-gold); }
.ps-brands__letter.is-active { background: var(--ps-gold); border-color: var(--ps-gold); color: #fff; }

/* Grille de marques */
.ps-brands__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.ps-brand {
  display: flex; flex-direction: column;
  border: 1px solid var(--ps-line); border-radius: var(--ps-radius);
  background: #fff; text-decoration: none; overflow: hidden;
  transition: border-color .18s, box-shadow .18s, transform .18s;
}
.ps-brand:hover { border-color: var(--ps-gold); box-shadow: 0 10px 26px rgba(var(--ps-gold-rgb), .12); transform: translateY(-3px); }

/* Zone logo / nom */
.ps-brand__media {
  display: flex; align-items: center; justify-content: center;
  aspect-ratio: 16 / 10; padding: 22px; background: var(--ps-cream-soft);
  border-bottom: 1px solid var(--ps-line);
}
.ps-brand__logo { max-width: 100%; max-height: 88px; width: auto; height: auto; object-fit: contain; mix-blend-mode: multiply; }
.ps-brand__initial {
  font-family: var(--ps-font-heading); font-size: clamp(20px, 2.4vw, 28px);
  color: var(--ps-ink); text-align: center; line-height: 1.1; letter-spacing: .01em;
}

/* Libellé */
.ps-brand__label { display: flex; flex-direction: column; gap: 3px; padding: 14px 16px 16px; text-align: center; }
.ps-brand__name { font-size: 15px; font-weight: 600; color: var(--ps-ink); }
.ps-brand__count { font-size: 12px; color: var(--ps-muted); }

.ps-brands__empty-letter { text-align: center; color: var(--ps-muted); padding: 30px 0; }

/* État vide (aucune marque) */
.ps-brands__placeholder { text-align: center; max-width: 460px; margin: 20px auto 0; padding: 40px 24px; }
.ps-brands__placeholder svg { width: 48px; height: 48px; color: var(--ps-olive); margin-bottom: 16px; }
.ps-brands__placeholder h2 { font-family: var(--ps-font-heading); font-size: 24px; color: var(--ps-ink); margin: 0 0 10px; }
.ps-brands__placeholder p { font-size: 15px; color: var(--ps-body); margin: 0 0 22px; }

/* Responsive */
@media (max-width: 991px) {
  .ps-brands__grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 700px) {
  .ps-brands__grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .ps-brands__inner { padding-bottom: 52px; }
}
@media (max-width: 380px) {
  .ps-brands__grid { grid-template-columns: 1fr; }
}
