/* =========================================================================
   VooX — correctifs d'affichage (audit). Rien n'est modifié dans voox.css :
   ce fichier ne fait que corriger ce qui était coupé ou illisible.
   ========================================================================= */

/* Le micro de la barre de recherche : un bouton rond, aussi large que haut,
   posé au bout du champ (le visuel de 44 px était rogné dans 40 px). */
.voox-search-btn{
  width:52px;height:52px;flex:0 0 52px;margin-left:-58px;align-self:center;
  background-size:30px auto;background-position:center;background-color:transparent;
  border-radius:50%;
}
.voox-search-wrap{position:relative}
.voox-search input[type=text]{padding-right:62px}

/* La bascule de la recherche : une seule pastille, posée sous la barre.
   L'assistant est le mode par défaut — la pastille est allumée d'entrée —
   et on l'éteint pour revenir à la recherche écrite, qui n'a pas besoin
   d'un bouton. Les couleurs restent celles de la charte.
   « width:100% » est nécessaire : le héros est une colonne centrée, et
   sans cela le conteneur se réduisait au texte du bouton. */
.voox-modes-un{display:flex;justify-content:center;width:100%;margin:0 auto}
/* Éteinte, la pastille est un jeton clair : elle propose sans s'imposer.
   Allumée, elle prend le noir de la charte — on voit d'un coup d'œil que
   l'assistant a la main. Les deux états devaient se distinguer : les deux
   dégradés de la charte sont presque identiques, et côte à côte seuls ils
   ne se lisaient plus. */
.voox-bascule-ia{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  height:50px;min-width:280px;padding:0 32px;cursor:pointer;
  border:1px solid var(--voox-line,rgba(11,15,20,.14));
  border-radius:var(--voox-radius-pill,9999px);
  background:#fff;color:var(--voox-title,#0B0F14);
  font-family:var(--voox-font-text,'Inter',sans-serif);font-size:16px;font-weight:500;letter-spacing:-.3px;
  transition:background .2s,border-color .2s,color .2s,box-shadow .2s,transform .12s;
}
.voox-bascule-ia svg{width:16px;height:16px}
.voox-bascule-ia:hover{border-color:var(--voox-title,#0B0F14);background:var(--voox-soft,#F2F5F9)}
.voox-bascule-ia[aria-pressed="true"]{
  border-color:transparent;color:#fff;
  background:var(--voox-dark-gradient,#0B0F14);box-shadow:0 4px 25px rgba(0,0,0,.25);
}
.voox-bascule-ia[aria-pressed="true"]:hover{background:var(--voox-btn-gradient,#0B0F14)}
.voox-bascule-ia:active{transform:translateY(1px)}
.voox-mode-note{margin:10px 0 0;font-size:13.5px;color:var(--voox-text,#46536A)}

@media (max-width:520px){
  .voox-bascule-ia{height:46px;min-width:0;width:100%;max-width:320px;padding:0 26px;font-size:15px}
}

/* En mode Standard, l'assistant s'efface et la recherche prend la main. */
body.voox-standard-mode .vs-waves,
body.voox-standard-mode .vs-equalizer,
body.voox-standard-mode .vs-status{display:none}
body.voox-standard-mode .voox-search{margin-top:22px}
body.voox-standard-mode .vs-subtitle{font-size:20px;opacity:.85}

/* VuVendu : une colonne sur mobile (le visuel passait au-dessus des produits). */
.vv-sujet{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:24px;align-items:start}
.vv-sujet-media{display:block;border-radius:18px;overflow:hidden;border:1px solid var(--voox-line,rgba(11,15,20,.12))}
.vv-sujet-media img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}

@media (max-width:820px){
  .vv-sujet{grid-template-columns:1fr;gap:16px}
  .vv-sujet-media img{aspect-ratio:16/9}
}

/* Carte des membres indisponible : un message, pas un cadre blanc. */
.voox-index-map-absente{
  display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;
  background:var(--voox-soft,#F2F5F9);border:1px dashed var(--voox-line,rgba(11,15,20,.2));
  border-radius:16px;color:var(--voox-text,#46536A);font-size:14.5px;
}

/* Pagination des listes. */
.voox-pages{
  display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:38px 0 8px;
}
.voox-pages-numeros{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.voox-pages-num,.voox-pages-fleche{
  display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 13px;
  border-radius:999px;border:1px solid var(--voox-line,rgba(11,15,20,.12));background:#fff;
  color:var(--voox-title,#0B0F14);text-decoration:none;font:600 14px/1 var(--voox-font-text,'Inter',sans-serif);
  transition:background .2s,border-color .2s,color .2s;
}
.voox-pages-num:hover,.voox-pages-fleche:hover{border-color:var(--voox-title,#0B0F14)}
.voox-pages-num.is-active{background:var(--voox-title,#0B0F14);border-color:var(--voox-title,#0B0F14);color:#fff}
.voox-pages-fleche.est-inactif{opacity:.4;pointer-events:none}
.voox-pages-coupure{padding:0 4px;color:var(--voox-text,#46536A)}
.voox-pages-compte{text-align:center;margin:0 0 10px;font-size:13.5px;color:var(--voox-text,#46536A)}

/* ------------------------------------------------------------------ */
/* Signalement : la modale de motif et celle de confirmation.          */
/* ------------------------------------------------------------------ */
.voox-signalement{max-width:520px;text-align:left}
.voox-signalement h3,.voox-signalement .voox-modal-sub{text-align:center}
.voox-signalement-motifs{border:0;margin:0 0 16px;padding:0;display:flex;flex-direction:column;gap:8px}
.voox-signalement-motifs legend{
  padding:0;margin:0 0 10px;font:600 13.5px/1.4 var(--voox-font-text,'Inter',sans-serif);color:var(--voox-title,#0B0F14);
}
.voox-signalement-motifs label{
  display:flex;align-items:center;gap:11px;padding:11px 14px;cursor:pointer;
  border:1px solid var(--voox-line,rgba(11,15,20,.12));border-radius:12px;
  font-size:14.5px;color:var(--voox-title,#0B0F14);transition:border-color .15s,background .15s;
}
.voox-signalement-motifs label:hover{border-color:var(--voox-title,#0B0F14);background:var(--voox-soft,#F2F5F9)}
.voox-signalement-motifs input{accent-color:var(--voox-title,#0B0F14);width:16px;height:16px;flex:0 0 auto}
.voox-signalement-motifs label:has(input:checked){border-color:var(--voox-title,#0B0F14);background:var(--voox-soft,#F2F5F9)}
.voox-signalement .voox-field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.voox-signalement .voox-field span{font:600 12.5px/1.4 var(--voox-font-text,'Inter',sans-serif);color:var(--voox-text,#46536A)}
.voox-signalement textarea,.voox-signalement input[type=email]{
  width:100%;border:1px solid var(--voox-line,rgba(11,15,20,.12));border-radius:12px;padding:11px 13px;
  font:400 14.5px/1.5 var(--voox-font-text,'Inter',sans-serif);color:var(--voox-title,#0B0F14);
  background:#fff;outline:none;resize:vertical;
}
.voox-signalement textarea:focus,.voox-signalement input[type=email]:focus{border-color:var(--voox-title,#0B0F14)}
.voox-signalement-note{margin:0 0 18px;font-size:12.5px;line-height:1.5;color:var(--voox-text,#46536A)}
.voox-signalement-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.voox-signalement-merci{text-align:center}
.voox-signalement-coche{
  display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;margin:0 auto 14px;
  border-radius:50%;background:#eaf7f0;color:#136b3e;font-size:26px;font-weight:700;
}

/* Espace équipe : les personnes et contenus signalés, du plus signalé au moins. */
.voox-admin-signales{display:flex;flex-direction:column;gap:10px;margin:0 0 26px;padding:0;list-style:none}
.voox-admin-signales li{
  display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;
  border:1px solid var(--voox-line,rgba(11,15,20,.12));border-radius:12px;padding:13px 16px;background:#fff;
}
.voox-admin-signales .voox-admin-detail{display:block}
.voox-admin-compte-signalements{
  display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:7px 14px;white-space:nowrap;
  font:700 13px/1 var(--voox-font-text,'Inter',sans-serif);background:#fdeeee;color:#8a2222;border:1px solid #f0c7c7;
}
.voox-admin-compte-signalements.est-traite{background:var(--voox-soft,#F2F5F9);color:var(--voox-text,#46536A);border-color:var(--voox-line,rgba(11,15,20,.12))}
.voox-admin-sous-titre{
  font:600 16px/1.3 var(--voox-font-title,'Oxanium',sans-serif);color:var(--voox-title,#0B0F14);
  margin:26px 0 12px;
}
.voox-admin-signales .voox-admin-detail{color:#5B6675;font-size:13px;margin-top:4px}

/* ------------------------------------------------------------------ */
/* Audit 2 — affichage                                                 */
/* ------------------------------------------------------------------ */

/* Recherche d'annonces : les champs respirent, et sur mobile ils ne
   s'étirent plus sur toute la hauteur de la carte (flex:1 en colonne). */
.voox-search-card{padding:24px 26px;gap:16px}
@media (max-width:768px){
  .voox-search-card{padding:20px;gap:14px}
  .voox-search-card .voox-field-inline,
  .voox-search-card .voox-field-grow{flex:0 0 auto;width:100%}
  .voox-search-card .voox-btn{width:100%}
}

/* Les onglets du fil (All · Photos · Posts · Videos) tiennent sur une
   ligne sur mobile : il y a la place, ils passaient sur deux. */
@media (max-width:700px){
  .voox-filters{flex-wrap:nowrap;gap:6px}
  .voox-filters li{
    margin:7px 0 0;padding:7px 15px;font-size:13px;letter-spacing:.03em;
    line-height:20px;white-space:nowrap;flex:0 1 auto;
  }
}
@media (max-width:380px){
  .voox-filters li{padding:7px 11px;font-size:12px}
}

/* Le titre d'une vignette du fil était coupé sur mobile
   (« Devenez Directeur(trice) Associé(e) »). */
@media (max-width:700px){
  .voox-tile .caption{padding:12px;gap:10px}
  .voox-tile .caption .title{font-size:13px;line-height:1.3;overflow-wrap:anywhere}
  .voox-masonry{columns:2;column-gap:12px}
}

/* Le bouton « Rechercher » de la carte était blanc sur blanc (règle du
   héros sombre) : on lui rend le contraste. */
.voox-listing-hero .voox-search-card .voox-btn{background:var(--voox-title,#0B0F14);color:#fff}
.voox-listing-hero .voox-search-card .voox-btn:hover{background:var(--sx-carbon,#161B22);color:#fff}

/* Page « S'inscrire » : les cartes des rôles tenaient sur trois colonnes
   figées, illisibles sur mobile (un mot par ligne). */
.voox-roles-cartes{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.voox-roles-cartes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.voox-roles-cartes{grid-template-columns:1fr}}

/* Mon compte sur mobile : les valeurs longues (e-mail, nom) débordaient de
   la carte au lieu de revenir à la ligne. */
.voox-detail-list li{flex-wrap:wrap}
.voox-detail-list li span{flex:0 0 auto}
.voox-detail-list li strong{min-width:0;overflow-wrap:anywhere;margin-left:auto}
@media (max-width:520px){
  .voox-compte .voox-b-card{padding-left:18px;padding-right:18px}
  .voox-detail-list li{font-size:13px;gap:10px}
}

/* Connexion Google : le bouton ne fonctionne pas encore, il le montre. */
/* Le bouton Google est devenu un lien : la charte le dessine comme un bouton,
   il ne lui manque que de ne pas se souligner. */
a.voox-google-btn{text-decoration:none}
.voox-google-note{margin:8px 0 0;font-size:12.5px;color:var(--voox-text,#46536A);text-align:center}

/* Les pastilles d'état (en attente · en ligne · non retenue), partagées par
   l'espace membre et le tableau de bord d'animation. */
.voox-etat{
  display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:6px 13px;
  font:600 12.5px/1 var(--voox-font-text,inherit);border:1px solid var(--voox-line,rgba(11,15,20,.12));white-space:nowrap;
}
.voox-etat::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.voox-etat-attente{color:#8a5a00;background:#fff8e8;border-color:#f0dcb0}
.voox-etat-ligne{color:#136b3e;background:#eaf7f0;border-color:#bfe3cf}
.voox-etat-refus{color:#8a2222;background:#fdeeee;border-color:#f0c7c7}

/* Fiche membre sur mobile : les trois boutons tenaient sur une seule ligne
   et sortaient de l'écran. */
@media (max-width:900px){
  .voox-profile{padding:20px}
  .voox-profile-actions{flex-wrap:wrap;justify-content:center;width:100%}
  .voox-profile-actions .voox-btn{flex:1 1 auto;min-width:0;white-space:normal;text-align:center}
}
@media (max-width:560px){
  .voox-profile-actions .voox-btn{flex:1 1 100%}
  .voox-profile-id h1{font-size:25px}
}

/* ------------------------------------------------------------------------
   Le bouton de partage flottant : son compteur rouge « 6 » se lisait comme
   des notifications alors qu'il ne compte que les réseaux sociaux. On le
   retire, et on l'allège un peu sur mobile pour qu'il pèse moins sur la page.
   ------------------------------------------------------------------------ */
.voox-social-float .voox-badge{display:none}

@media (max-width:900px){
  .voox-social-float{bottom:22px;right:16px;width:48px;height:48px}
  .voox-social-btn{width:48px;height:48px;font-size:18px;background:rgba(13,67,116,.9)}
  .voox-social-icons{bottom:60px}
  /* L'orbe de l'assistant, plus discret et plus bas. */
  .voox-assistant-fab{left:14px;bottom:20px}
  .voox-assistant-fab img{width:54px;height:54px}
}

/* La place dans le réseau, sur la fiche publique : une étiquette distincte du
   statut de l'annuaire, et la ligne qui dit l'annexe et le rattachement. */
.voox-tag-reseau{
  display:inline-flex;align-items:center;margin-left:8px;padding:5px 12px;border-radius:999px;
  background:var(--voox-title,#0B0F14);color:#fff;border:1px solid var(--voox-title,#0B0F14);
  font:700 11.5px/1 var(--voox-font-text,inherit);text-transform:uppercase;letter-spacing:.06em;
}
.voox-profile-reseau{margin-top:6px;font-size:13.5px}
.voox-profile-reseau a{color:inherit;text-decoration:underline}

/* Le bloc entreprise du formulaire d'onboarding : il n'apparaît que pour un
   XPro, et se lit comme une section à part plutôt que comme six champs de
   plus à la suite des autres. */
.voox-xpro{
  margin:6px 0 18px;padding:18px 18px 4px;
  border:1px solid var(--voox-line,rgba(11,15,20,.12));border-radius:16px;
  background:var(--voox-soft,#F2F5F9);
}
.voox-xpro[hidden]{display:none}
.voox-xpro-titre{
  margin:0 0 12px;font-family:var(--voox-font-title,'Oxanium',sans-serif);
  font-size:16px;font-weight:600;color:var(--voox-title,#0B0F14);
}
.voox-xpro .voox-field{margin-bottom:16px}
.voox-xpro-duo{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
@media (max-width:560px){
  .voox-xpro-duo{grid-template-columns:1fr}
  .voox-xpro{padding:16px 14px 4px}
}

/* -------------------------------------------------------------------------
   Community : chercher en deux champs — quoi, et où.
   Le bloc de recherche est le premier geste de la page : il est haut, large,
   et ses trois champs se lisent d'un coup d'œil. Il se replie champ par champ
   sur mobile, et les pastilles de statut défilent de côté.
   ------------------------------------------------------------------------- */
.voox-cherche{
  display:flex;align-items:stretch;gap:0;flex-wrap:wrap;margin:0 0 16px;
  padding:10px;border-radius:999px;background:#fff;
  border:1px solid var(--voox-line,rgba(11,15,20,.12));
  box-shadow:0 1px 2px rgba(11,15,20,.05),0 8px 26px rgba(11,15,20,.07);
}
.voox-cherche-champ{
  flex:1 1 200px;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:3px;
  padding:10px 26px;border-right:1px solid var(--voox-line,rgba(11,15,20,.1));
}
.voox-cherche-champ:last-of-type{border-right:0}
.voox-cherche-champ label{
  font-family:var(--voox-font-title,'Oxanium',sans-serif);
  font-size:12.5px;font-weight:600;color:var(--voox-title,#0B0F14);
}
.voox-cherche-champ input,
.voox-cherche-champ select{
  width:100%;border:0;background:none;padding:0;height:30px;
  font:400 16px/1 var(--voox-font-text,'Inter',sans-serif);color:var(--voox-title,#0B0F14);
}
.voox-cherche-champ input:focus,
.voox-cherche-champ select:focus{outline:none}
.voox-cherche-champ input::placeholder{color:var(--voox-text,#46536A);opacity:.6}
.voox-cherche>.voox-btn{flex:0 0 auto;align-self:center;margin-left:10px;height:56px;padding:0 34px;font-size:16px}

.voox-cherche-rappel{margin:-6px 0 16px;font-size:13.5px;color:var(--voox-text,#46536A)}
.voox-cherche-rappel a{margin-left:10px}

/* Les pastilles de statut, sous la barre : un peu plus grandes que les
   pastilles ordinaires, parce qu'elles filtrent toute la page. */
.voox-directory-filters{margin:0 0 24px}
.voox-directory-filters .voox-chip{height:40px;padding:0 18px;font-size:14.5px}
.voox-filtre-titre{
  margin:0 0 8px;font-family:var(--voox-font-title,'Oxanium',sans-serif);
  font-size:13px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;
  color:var(--voox-text,#46536A);
}
.voox-filtre-titre + .voox-filter-row{margin-bottom:16px}
/* Une annexe sans fiche reste cliquable — c'est une annexe du réseau — mais
   elle s'efface un peu pour ne pas attirer le clic en premier. */
.voox-directory-filters .voox-chip.est-vide{opacity:.5}
.voox-directory-filters .voox-chip.est-vide:hover{opacity:1}

@media (max-width:860px){
  .voox-cherche{border-radius:22px;padding:8px}
  .voox-cherche-champ{flex:1 1 100%;border-right:0;border-bottom:1px solid var(--voox-line,rgba(11,15,20,.1));padding:10px 16px}
  .voox-cherche-champ:last-of-type{border-bottom:0}
  .voox-cherche>.voox-btn{width:100%;margin:10px 0 0;height:50px}
}

/* Découvrir en image : une bande par famille — grande image à gauche, titre,
   phrase et bouton à droite. On descend ensuite d'un cran : les communautés,
   puis les annexes, puis la liste. Le compte reste en pastille sur l'image.
   Sans illustration prévue pour la famille, l'image est la mosaïque des
   visages du groupe, qui se renouvelle d'elle-même. */
.voox-decouvrir{margin:6px 0 30px}
.voox-decouvrir-titre{
  margin:0 0 16px;font-family:var(--voox-font-title,'Oxanium',sans-serif);
  font-size:22px;font-weight:600;letter-spacing:-.2px;color:var(--voox-title,#0B0F14);
}
.voox-bandes{display:grid;grid-template-columns:repeat(auto-fill,minmax(520px,1fr));gap:18px}
/* Sous les villes d'un métier : le lien qui montre tout d'un coup. */
.voox-decouvrir-apres{margin:14px 0 0}
.voox-decouvrir-apres a{
  font-weight:600;font-size:14px;color:var(--voox-title,#0B0F14);text-decoration:none;
  border-bottom:1px solid rgba(11,15,20,.18);padding-bottom:2px;
}
.voox-decouvrir-apres a:hover{border-bottom-color:currentColor}
/* Page 1 : les personnes à gauche, les organisations à droite. Les bandes
   passent alors sur une seule colonne dans chaque moitié. */
.voox-decouvrir-colonnes{display:grid;grid-template-columns:1fr 1fr;gap:0 30px;align-items:start}
.voox-decouvrir-colonnes .voox-bandes{grid-template-columns:1fr}
/* Une bande toute seule — « Découvrez nos XMembers » sur la page d'accueil —
   prend toute la largeur, avec une image plus généreuse. */
.voox-bandes.est-seule{grid-template-columns:1fr}
.voox-bandes.est-seule .voox-bande{grid-template-columns:420px 1fr}
.voox-bandes.est-seule .voox-bande-media{min-height:260px}
.voox-bandes.est-seule .voox-bande-titre{font-size:26px}
.voox-bandes.est-seule .voox-bande-description{font-size:16px}
@media (max-width:860px){
  .voox-bandes.est-seule .voox-bande{grid-template-columns:116px 1fr}
  .voox-bandes.est-seule .voox-bande-media{min-height:140px}
  .voox-bandes.est-seule .voox-bande-titre{font-size:18px}
  .voox-bandes.est-seule .voox-bande-description{font-size:14px}
}
@media (max-width:1100px){
  .voox-decouvrir-colonnes{grid-template-columns:1fr;gap:0}
}

.voox-bande{
  display:grid;grid-template-columns:240px 1fr;align-items:stretch;
  text-decoration:none;color:inherit;overflow:hidden;border-radius:20px;background:#fff;
  border:1px solid var(--voox-line,rgba(11,15,20,.12));
  box-shadow:0 1px 2px rgba(11,15,20,.05);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
/* Une communauté que le réseau prévoit mais où personne n'est encore
   inscrit : elle reste visible et cliquable, un ton en dessous. */
.voox-bande.est-vide{opacity:.62}
.voox-bande.est-vide:hover{opacity:1}
.voox-bande:hover{
  transform:translateY(-2px);border-color:rgba(11,15,20,.2);
  box-shadow:0 1px 2px rgba(11,15,20,.06),0 14px 32px rgba(11,15,20,.1);
}

.voox-bande-media{position:relative;display:block;overflow:hidden;background:#EEF1F6;min-height:182px}
.voox-bande-media > img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .35s ease;
}
.voox-bande:hover .voox-bande-media > img{transform:scale(1.05)}
.voox-bande-mosaique{position:absolute;inset:0;display:grid;gap:2px}
.voox-bande-mosaique.est-seul{grid-template-columns:1fr;grid-template-rows:1fr}
.voox-bande-mosaique.est-mosaique{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}
/* À deux ou trois visages, la première image prend toute la hauteur plutôt
   que de laisser un carré vide. */
.voox-bande-mosaique.est-mosaique img:first-child:nth-last-child(2),
.voox-bande-mosaique.est-mosaique img:first-child:nth-last-child(2) ~ img{grid-row:span 2}
.voox-bande-mosaique.est-mosaique img:first-child:nth-last-child(3){grid-row:span 2}
.voox-bande-mosaique img{width:100%;height:100%;object-fit:cover;display:block}
.voox-bande-compte{
  position:absolute;top:10px;right:10px;z-index:2;min-width:28px;height:28px;padding:0 9px;
  display:inline-flex;align-items:center;justify-content:center;border-radius:999px;
  background:rgba(11,15,20,.78);color:#fff;font-size:13px;font-weight:600;
}

.voox-bande-texte{display:flex;flex-direction:column;justify-content:center;gap:7px;padding:20px 24px}
.voox-bande-titre{
  font-family:var(--voox-font-title,'Oxanium',sans-serif);
  font-size:20px;font-weight:600;letter-spacing:-.2px;color:var(--voox-title,#0B0F14);
}
.voox-bande-description{font-size:14.5px;line-height:1.5;color:var(--voox-text,#46536A)}
.voox-bande-action{
  margin-top:4px;font-family:var(--voox-font-title,'Oxanium',sans-serif);
  font-size:14.5px;font-weight:600;color:var(--voox-title,#0B0F14);
}
.voox-bande:hover .voox-bande-action{text-decoration:underline}

@media (max-width:760px){
  .voox-bandes{grid-template-columns:1fr;gap:14px}
  .voox-bande{grid-template-columns:116px 1fr}
  .voox-bande-media{min-height:140px}
  .voox-decouvrir-titre{font-size:19px}
  .voox-bande-titre{font-size:17px}
  .voox-bande-description{font-size:13.5px}
  .voox-bande-texte{padding:14px 16px;gap:5px}
}

/* Community respire plus large que le reste du site : l'annuaire vit de ses
   bandes et de sa carte, et 1300 px les serraient. La charte n'est pas
   touchée — seule cette page s'élargit. */
.voox-page-community .voox-container{max-width:1560px}

/* La carte de l'annuaire reçoit un intitulé : on sait ce qu'on regarde et
   combien de fiches y figurent. C'est le bloc entier qui devient collant,
   la carte restant à sa place à l'intérieur — sans quoi le titre
   défilerait et la carte non. */
.voox-index-carte{
  position:sticky;z-index:1;
  top:calc(var(--voox-header-h,64px) + var(--voox-groupbar-h,0px) + 16px);
}
.voox-index-carte .voox-index-map{position:static;top:auto;height:676px}
.voox-carte-titre{
  display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:0 0 10px;
  font-family:var(--voox-font-title,'Oxanium',sans-serif);
  font-size:15px;font-weight:600;color:var(--voox-title,#0B0F14);
}
.voox-carte-titre span{
  font-family:var(--voox-font-text,'Inter',sans-serif);
  font-size:13.5px;font-weight:400;color:var(--voox-text,#46536A);
}
@media (max-width:1000px){
  .voox-index-carte{position:static;order:-1}
  .voox-index-carte .voox-index-map{height:380px}
}

/* Les portes commerciales d'une fiche de membre : Store, StorePro,
   mini-site, réseau multiniveaux, X360. Des pavés de même taille, qui
   s'alignent d'eux-mêmes et se replient en colonne sur un téléphone. Une
   porte sans destination reste visible, éteinte : la fiche dit aussi ce qui
   n'existe pas encore. */
.voox-portes{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(186px,1fr));
  gap:12px;margin-top:28px;
}
.voox-porte{
  display:flex;align-items:center;gap:12px;padding:14px 16px;
  border-radius:16px;background:#fff;text-decoration:none;color:inherit;
  border:1px solid var(--voox-line,rgba(11,15,20,.12));
  box-shadow:0 1px 2px rgba(11,15,20,.05);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
a.voox-porte:hover{
  transform:translateY(-2px);border-color:rgba(11,15,20,.22);
  box-shadow:0 1px 2px rgba(11,15,20,.06),0 12px 26px rgba(11,15,20,.1);
}
.voox-porte svg{flex:0 0 auto;color:var(--voox-title,#0B0F14)}
.voox-porte-texte{display:flex;flex-direction:column;gap:2px;min-width:0}
.voox-porte-nom{
  font-family:var(--voox-font-title,'Oxanium',sans-serif);
  font-size:15px;font-weight:600;color:var(--voox-title,#0B0F14);
}
.voox-porte-note{font-size:12.5px;line-height:1.35;color:var(--voox-text,#46536A)}
.voox-porte.est-eteinte{opacity:.5;box-shadow:none;background:transparent}
@media (max-width:560px){
  .voox-portes{grid-template-columns:1fr;gap:10px}
}

/* Le métier d'un membre, à côté de son statut : le statut dit sa place dans
   le réseau, le métier dit ce qu'il fait. On le distingue d'une teinte, pour
   qu'on ne confonde pas les deux. */
.voox-tag-activite{
  background:var(--voox-soft,#F2F5F9);
  border-color:var(--voox-line,rgba(11,15,20,.14));
  color:var(--voox-title,#0B0F14);font-weight:600;
}

/* Son secteur d'activité : la grande famille, à côté du métier. Il est
   cliquable et ramène à l'annuaire filtré dessus — le parcours se referme. */
.voox-tag-secteur{
  background:transparent;
  border:1px dashed var(--voox-line,rgba(11,15,20,.22));
  color:var(--voox-text,#46536A);font-weight:600;text-decoration:none;
  transition:border-color .2s,color .2s;
}
.voox-tag-secteur:hover{
  border-style:solid;border-color:var(--voox-title,#0B0F14);
  color:var(--voox-title,#0B0F14);
}

/* Le bloc entreprise du formulaire d'embasement est toujours offert et jamais
   exigé : son titre le dit, pour qu'on ne le remplisse pas par obligation. */
.voox-xpro-note{
  margin-left:8px;padding:3px 9px;border-radius:999px;
  background:var(--voox-soft,#F2F5F9);color:var(--voox-text,#46536A);
  font:500 11.5px/1 var(--voox-font-text,inherit);
  letter-spacing:.04em;text-transform:uppercase;vertical-align:1px;
}
