/* ==========================================================================
   Member directory — list, filters, cards
   ========================================================================== */

/* tabs */
.dir-tabs{ display:flex; gap:4px; border-bottom:1px solid var(--line); margin-bottom:20px; flex-wrap:wrap }
.dir-tab{
  appearance:none; background:none; border:0; border-bottom:2px solid transparent;
  padding:10px 14px; margin-bottom:-1px; font:inherit; font-size:14px; font-weight:600;
  color:var(--muted,#6b7385); cursor:pointer; transition:color .16s, border-color .16s;
}
.dir-tab:hover{ color:var(--ink) }
.dir-tab.is-on{ color:var(--brand-600,#0d9488); border-bottom-color:var(--brand-600,#0d9488) }
.dir-tab--risk.is-on{ color:#b42318; border-bottom-color:#b42318 }

/* filter bar */
.dir-filters{
  display:flex; gap:12px; align-items:flex-end; flex-wrap:wrap;
  padding:16px; border:1px solid var(--line); border-radius:14px; background:#fff;
  box-shadow:0 1px 2px rgba(16,19,25,.04);
}
.dir-field{ display:flex; flex-direction:column; gap:6px; min-width:150px }
.dir-field--grow{ flex:1 1 200px }
.dir-field label{ font-size:12px; font-weight:600; color:var(--muted,#6b7385) }
.dir-field select,.dir-field input{
  height:38px; padding:0 11px; border:1px solid var(--line); border-radius:9px;
  background:#fff; font:inherit; font-size:13.5px; color:var(--ink);
}
.dir-field select:focus,.dir-field input:focus{ outline:none; border-color:var(--brand-600,#0d9488); box-shadow:0 0 0 3px rgba(13,148,136,.14) }
.dir-go,.dir-reset{ height:38px }
.dir-reset{ border-color:var(--line) }

/* meta row */
.dir-meta{ display:flex; justify-content:space-between; gap:16px; align-items:baseline; margin:18px 0 14px; flex-wrap:wrap }
.dir-meta p{ margin:0; font-size:13.5px; color:var(--ink-2,#3d444f) }
.dir-note{ color:var(--muted,#6b7385); font-size:12.5px; max-width:56ch }

/* grid + cards */
.dir-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); gap:14px }
.member-card{
  background:#fff; border:1px solid var(--line); border-radius:14px; padding:16px 16px 14px;
  display:flex; flex-direction:column; gap:12px;
  transition:border-color .16s, box-shadow .18s, transform .18s;
}
.member-card:hover{ border-color:#d7dae1; box-shadow:0 10px 26px -18px rgba(16,19,25,.35); transform:translateY(-1px) }
.member-head{ display:flex; align-items:center; gap:10px }
.member-logo{
  width:40px; height:40px; border-radius:10px; flex:none;
  display:grid; place-items:center; font-size:14px; font-weight:800; letter-spacing:-.02em;
  background:#eef2f6; color:#334155; border:1px solid var(--line);
}
.member-flag{
  margin-left:auto; font-size:11px; font-weight:700; letter-spacing:.02em;
  padding:3px 8px; border-radius:99px; background:#f1f3f6; color:#5b6472; border:1px solid var(--line);
}
.member-flag--ok{ background:#e8f6ef; color:#0d7a52; border-color:#bfe6d3 }
.member-flag--risk{ background:#fdeceb; color:#b42318; border-color:#f6c9c4 }
.member-body{ display:flex; flex-direction:column; gap:4px }
.member-name{ font-size:15.5px; font-weight:700; letter-spacing:-.015em; margin:0 }
.member-num{ margin:0; font-family:var(--mono,ui-monospace,Menlo,monospace); font-size:11.5px; color:var(--muted,#6b7385); letter-spacing:.02em }
.member-meta{ margin:2px 0 0; font-size:13px; color:var(--ink-2,#3d444f) }
.member-services{ display:flex; flex-wrap:wrap; gap:6px; list-style:none; padding:0; margin:8px 0 0 }
.member-services li{
  font-size:11.5px; font-weight:600; color:#334155;
  background:#f4f6f8; border:1px solid var(--line); border-radius:7px; padding:3px 8px;
}
.member-acts{ display:flex; gap:14px; margin-top:10px }
.member-link{ font-size:13px; font-weight:600; color:var(--brand-600,#0d9488) }
.member-link--muted{ color:#5b6472; font-weight:500 }
.member-link:hover{ text-decoration:underline; text-underline-offset:.2em }
.member-warn{ margin:8px 0 0; font-size:12.5px; color:#b42318; line-height:1.5 }

/* empty / more */
.dir-empty{ padding:36px 20px; text-align:center; border:1px dashed var(--line); border-radius:14px; background:#fafbfc }
.dir-empty p{ margin:0 0 8px; font-size:14px; color:var(--ink-2,#3d444f); max-width:56ch; margin-inline:auto }
.dir-empty b{ color:var(--ink) }
.dir-more{ display:flex; justify-content:center; margin-top:20px }

/* join strip */
.join-strip{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  border:1px solid var(--line); border-radius:16px; padding:24px; background:#fff;
  box-shadow:0 1px 2px rgba(16,19,25,.04);
}
.join-strip h2{ margin:0 0 6px; font-size:20px; letter-spacing:-.02em }
.join-strip p{ margin:0; font-size:14px; color:var(--ink-2,#3d444f); max-width:60ch }
@media (max-width:760px){
  .join-strip{ flex-direction:column; align-items:flex-start }
  .dir-grid{ grid-template-columns:1fr }
  .dir-field{ min-width:0; width:100% }
  .dir-go,.dir-reset{ width:100% }
}

/* directory switcher */
.dir-switch{ display:flex; gap:6px; padding:6px; border:1px solid var(--line); border-radius:12px; background:#fff; width:max-content; margin:0 0 22px }
.dir-switch-item{ padding:8px 14px; border-radius:8px; font-size:13.5px; font-weight:600; color:#5b6472 }
.dir-switch-item:hover{ color:var(--ink); background:#f4f6f8 }
.dir-switch-item.is-on{ background:#0f2740; color:#fff }