/* Espace membres : page « Nos membres », connexion, envoi de photo (complète doc.css) */
.mb-bar { display: flex; align-items: center; gap: var(--space-md); min-width: 0; }
.mb-bar form { margin: 0; }
.mb-bar__l, .mb-who { font-size: var(--text-label); font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; text-decoration: none; white-space: nowrap; }
.mb-bar__l:hover { color: var(--color-accent); }
.mb-who { color: var(--color-accent); }
.mb-out { min-height: 2.5rem; padding: 0 var(--space-sm); }

.mb { max-width: var(--max); margin: 0 auto; padding: var(--space-3xl) var(--gutter) var(--space-4xl); }
.mb-head { display: grid; gap: var(--space-lg); max-width: 56rem; margin-bottom: var(--space-2xl); }
.mb-title { font-family: var(--font-display); font-weight: 200; font-size: var(--text-display); line-height: 0.95; color: var(--color-accent); overflow-wrap: anywhere; min-width: 0; }
.mb-title--sm { font-size: var(--text-2xl); }
.mb-lead { max-width: 36rem; font-size: var(--text-lg); line-height: 1.35; }
.mb-note { font-size: var(--text-sm); color: var(--color-text-soft); }
.mb-note a, .mb-lead a { color: var(--color-ink); }

.mb-me {
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--space-sm) var(--space-xl);
  padding: var(--space-md) 0; margin-bottom: var(--space-2xl);
  border-top: 1px solid var(--color-line); border-bottom: 1px solid var(--color-line);
}
.mb-empty { padding: var(--space-3xl) 0; font-family: var(--font-display); font-weight: 200; font-size: var(--text-xl); color: var(--color-text-soft); }

/* Grille */
.mb-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); gap: var(--space-2xl) var(--space-lg); }
.mb-card { display: grid; align-content: start; gap: var(--space-2xs); min-width: 0; }
.mb-card__pic, .mb-photo__frame {
  position: relative; aspect-ratio: 4 / 5; overflow: hidden; margin-bottom: var(--space-sm);
  display: grid; place-items: center; background: var(--color-paper-2);
}
.mb-card__pic img, .mb-photo__img { width: 100%; height: 100%; object-fit: cover; }
.mb-card__pic span, .mb-photo__frame span { font-family: var(--font-display); font-weight: 200; font-size: clamp(3rem, 2rem + 4vw, 5rem); color: var(--color-accent); }
.mb-card__name { hyphens: auto; font-family: var(--font-display); font-weight: 500; font-size: var(--text-lg); line-height: 1.1; color: var(--color-accent); overflow-wrap: anywhere; }
.mb-card__role { line-height: 1.4; }
.mb-card__meta { font-size: var(--text-label); font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase; color: var(--color-text-soft); line-height: 1.5; }
.mb-card__links { list-style: none; margin: var(--space-xs) 0 0; padding: 0; display: grid; gap: var(--space-2xs); font-size: var(--text-sm); min-width: 0; }
.mb-card__links a { color: var(--color-ink); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.2em; overflow-wrap: anywhere; }
.mb-card__links a:hover { color: var(--color-accent); }

/* Connexion / photo */
.mb-login { max-width: 40rem; display: grid; gap: var(--space-lg); padding-top: var(--space-xl); }
.mb-form { display: grid; gap: var(--space-xl); margin-top: var(--space-md); }
.mb-form .btn { justify-self: start; }
.mb-alert { padding: var(--space-sm) var(--space-md); border-left: 2px solid var(--color-ink); background: var(--color-paper-2); color: var(--color-ink); font-weight: 500; }
.mb-photo { display: grid; grid-template-columns: minmax(0, 12rem) minmax(0, 1fr); gap: var(--space-xl); align-items: end; }
.mb-photo__frame { margin: 0; }
.mb-photo__pick { display: grid; gap: var(--space-sm); justify-items: start; }
.mb-photo__pick .btn { cursor: pointer; }
.mb-photo__pick input:focus-visible + .mb-note, .mb-photo__pick:focus-within .btn { outline: 2px solid var(--color-focus); outline-offset: 3px; }
.mb-photo__img--done { max-width: 12rem; aspect-ratio: 4 / 5; }
.mb-check { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-sm); align-items: start; font-size: var(--text-sm); line-height: 1.5; cursor: pointer; }
.mb-check input { width: 1.25rem; height: 1.25rem; margin: 0.1rem 0 0; accent-color: var(--color-accent); }
.mb-check a { color: var(--color-ink); }
.mb-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-lg); }

@media (max-width: 40rem) {
  .doc-bar { gap: var(--space-sm); }
  .mb-bar { gap: var(--space-sm); }
  .mb-bar__l { display: none; }
  .doc-bar .pill { display: inline-flex; }
  .mb-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-xl) var(--space-md); }
  .mb-card__role, .mb-card__links { font-size: 0.875rem; }
  .mb-card__meta { letter-spacing: 0.1em; }
  .mb-photo { grid-template-columns: minmax(0, 1fr); }
  .mb-photo__frame { max-width: 12rem; }
}
@media (max-width: 22rem) {
  .mb-grid { grid-template-columns: minmax(0, 1fr); }
}

/* Section « Nos membres » de l'accueil */
.home-mb { max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter) var(--space-5xl); }
.home-mb__head { display: grid; gap: var(--space-xl); max-width: 56rem; margin-bottom: var(--space-3xl); }
.home-mb__grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 13rem), 1fr)); }
.home-mb__more { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-md) var(--space-xl); margin-top: var(--space-2xl); }
@media (max-width: 40rem) {
  .home-mb__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}