.breadcrumb {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: var(--space-2) var(--container-pad) var(--space-2);
  font-size: 0.75rem;
  color: var(--text-muted);
}
.breadcrumb a {
  color: var(--text-muted);
  text-decoration: none;
  transition: color var(--transition-fast);
}
.breadcrumb a:hover {
  color: var(--text-primary);
}
.breadcrumb-sep {
  margin: 0 0.4rem;
}

@media (max-width: 900px) {
  .breadcrumb {
    padding: var(--space-2) var(--container-pad-mobile) var(--space-2);
  }
}

/* Mobile : masquer le breadcrumb complet — l'image + le titre suffisent */
@media (max-width: 600px) {
  .breadcrumb {
    display: none;
  }
}