/* ==========================================================================
   REFONTE ÉQUIPE — déploiement par famille (phase 5C)
   Feuille additive. Deux scopes strictement séparés :
     - body.qds-equipe-hub    : l'index « notre-equipe.html » (grille .member-card)
     - body.qds-equipe-profil : les 8 profils individuels (.profile-card)
   Aucun sélecteur nu (.member-*, .profile-*, etc.) : tout est préfixé par un
   scope de body. Aucun contenu, lien, formulaire ou attribut modifié.
   Dépend de refonte-tokens.css.
   ========================================================================== */

/* ==========================================================================
   1. INDEX ÉQUIPE — body.qds-equipe-hub (notre-equipe.html)
   ========================================================================== */

body.qds-equipe-hub {
  background-color: var(--qds-ivoire);
}

body.qds-equipe-hub #navbar {
  border-top: 3px solid var(--qds-brique);
}

/* --- Fil d'Ariane --- */
body.qds-equipe-hub nav.breadcrumb-nav::before {
  background: rgba(250, 247, 242, 0.98);
  border-bottom: 1px solid var(--qds-ardoise-100);
}
body.qds-equipe-hub nav.breadcrumb-nav a {
  color: var(--qds-brique-profond);
}

/* --- Hero --- */
body.qds-equipe-hub .hero {
  background:
    linear-gradient(90deg, rgba(28, 42, 64, 0.035) 1px, transparent 1px),
    linear-gradient(rgba(28, 42, 64, 0.035) 1px, transparent 1px),
    linear-gradient(to bottom, var(--qds-chaux), var(--qds-ivoire));
  background-size: 2.5rem 2.5rem, 2.5rem 2.5rem, 100% 100%;
  border-bottom: 1px solid var(--qds-ardoise-100);
  position: relative;
}
@media (min-width: 1024px) {
  body.qds-equipe-hub .hero::before {
    content: "";
    position: absolute;
    right: max(0.75rem, env(safe-area-inset-right, 0px));
    top: 0.75rem;
    width: 4rem;
    height: 4rem;
    background: url("../images/refonte/repere-du-nord-discret.svg") no-repeat center / contain;
    pointer-events: none;
  }
}

/* --- Titres de section --- */
body.qds-equipe-hub .section-title-local::after {
  background: var(--qds-brique);
  height: 3px;
  box-shadow: 84px 0 0 0 var(--qds-ambre);
}
body.qds-equipe-hub .section-local-tone {
  background-color: var(--qds-pierre) !important;
}

/* --- Cartes membres --- */
body.qds-equipe-hub .member-card {
  background-color: var(--qds-blanc);
  border: 1px solid var(--qds-ardoise-100);
  border-top: 3px solid var(--qds-brique);
  border-radius: var(--qds-r-grand);
  box-shadow: var(--qds-ombre-1);
}
body.qds-equipe-hub .member-name {
  color: var(--qds-ardoise-900);
  letter-spacing: -0.01em;
}
body.qds-equipe-hub .member-role {
  color: var(--qds-brique-profond);
}
body.qds-equipe-hub .member-avatar img {
  border-radius: 50%;
  box-shadow: var(--qds-ombre-1);
}
body.qds-equipe-hub .btn-cv {
  border-radius: var(--qds-r-moyen);
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* --- Pied de page --- */
body.qds-equipe-hub footer.footer-lille-legal-test {
  background-color: var(--qds-ardoise-950) !important;
  border-top: 3px solid var(--qds-brique);
}
body.qds-equipe-hub footer.footer-lille-legal-test h3 {
  color: var(--qds-ambre);
  font-size: 1.05rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* --- Focus visibles --- */
body.qds-equipe-hub a:focus-visible,
body.qds-equipe-hub button:focus-visible,
body.qds-equipe-hub summary:focus-visible,
body.qds-equipe-hub input:focus-visible,
body.qds-equipe-hub label:focus-visible {
  outline: var(--qds-focus);
  outline-offset: var(--qds-focus-decalage);
}
body.qds-equipe-hub footer.footer-lille-legal-test a:focus-visible {
  outline-color: var(--qds-ambre);
}

@media (prefers-reduced-motion: reduce) {
  body.qds-equipe-hub * {
    transition-duration: 0.01ms !important;
    animation: none !important;
  }
}

/* ==========================================================================
   2. PROFILS INDIVIDUELS — body.qds-equipe-profil (8 pages)
   ========================================================================== */

body.qds-equipe-profil {
  background-color: var(--qds-ivoire);
}

body.qds-equipe-profil #navbar {
  border-top: 3px solid var(--qds-brique);
}

body.qds-equipe-profil nav.breadcrumb-nav::before {
  background: rgba(250, 247, 242, 0.98);
  border-bottom: 1px solid var(--qds-ardoise-100);
}
body.qds-equipe-profil nav.breadcrumb-nav a {
  color: var(--qds-brique-profond);
}

body.qds-equipe-profil .hero {
  background:
    linear-gradient(90deg, rgba(28, 42, 64, 0.035) 1px, transparent 1px),
    linear-gradient(rgba(28, 42, 64, 0.035) 1px, transparent 1px),
    linear-gradient(to bottom, var(--qds-chaux), var(--qds-ivoire));
  background-size: 2.5rem 2.5rem, 2.5rem 2.5rem, 100% 100%;
  border-bottom: 1px solid var(--qds-ardoise-100);
  position: relative;
}
@media (min-width: 1024px) {
  body.qds-equipe-profil .hero::before {
    content: "";
    position: absolute;
    right: max(0.75rem, env(safe-area-inset-right, 0px));
    top: 0.75rem;
    width: 4rem;
    height: 4rem;
    background: url("../images/refonte/repere-du-nord-discret.svg") no-repeat center / contain;
    pointer-events: none;
  }
}

body.qds-equipe-profil .section-title-local::after {
  background: var(--qds-brique);
  height: 3px;
  box-shadow: 84px 0 0 0 var(--qds-ambre);
}
body.qds-equipe-profil .section-local-tone {
  background-color: var(--qds-pierre) !important;
}

/* --- Carte profil --- */
body.qds-equipe-profil .profile-card {
  background-color: var(--qds-blanc);
  border: 1px solid var(--qds-ardoise-100);
  border-top: 4px solid var(--qds-brique);
  border-radius: var(--qds-r-grand);
  box-shadow: var(--qds-ombre-2);
}
body.qds-equipe-profil .profile-photo img {
  border-radius: var(--qds-r-grand);
  box-shadow: var(--qds-ombre-1);
}
body.qds-equipe-profil .profile-badge {
  background-color: var(--qds-blanc);
  border: 1px solid var(--qds-ardoise-100);
  border-left: 3px solid var(--qds-ambre);
  border-radius: var(--qds-r-moyen);
  box-shadow: var(--qds-ombre-1);
}
body.qds-equipe-profil .profile-header h2 {
  color: var(--qds-ardoise-900);
  letter-spacing: -0.01em;
}
body.qds-equipe-profil .profile-subtitle {
  color: var(--qds-brique-profond);
}
body.qds-equipe-profil .profile-section h3 {
  color: var(--qds-brique-profond);
}
body.qds-equipe-profil .hero-local-card,
body.qds-equipe-profil .card {
  background-color: var(--qds-blanc);
  border: 1px solid var(--qds-ardoise-100);
  border-top: 3px solid var(--qds-brique);
  box-shadow: var(--qds-ombre-1);
}

body.qds-equipe-profil .btn {
  border-radius: var(--qds-r-moyen);
}

body.qds-equipe-profil footer.footer-lille-legal-test {
  background-color: var(--qds-ardoise-950) !important;
  border-top: 3px solid var(--qds-brique);
}
body.qds-equipe-profil footer.footer-lille-legal-test h3 {
  color: var(--qds-ambre);
  font-size: 1.05rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

body.qds-equipe-profil a:focus-visible,
body.qds-equipe-profil button:focus-visible,
body.qds-equipe-profil summary:focus-visible,
body.qds-equipe-profil input:focus-visible,
body.qds-equipe-profil label:focus-visible {
  outline: var(--qds-focus);
  outline-offset: var(--qds-focus-decalage);
}
body.qds-equipe-profil footer.footer-lille-legal-test a:focus-visible {
  outline-color: var(--qds-ambre);
}

@media (prefers-reduced-motion: reduce) {
  body.qds-equipe-profil * {
    transition-duration: 0.01ms !important;
    animation: none !important;
  }
}