.ls-directory-group { margin-block: 2.35rem; }
.ls-directory-group > h2 {
  display: flex; align-items: center; gap: .65rem; margin: 0 0 .7rem;
  font-size: clamp(1.28rem, 1.1rem + .45vw, 1.55rem); line-height: 1.25;
}
.ls-directory-icon {
  display: grid; place-items: center; flex: 0 0 2rem; block-size: 2rem;
  border: 1px solid var(--ls-line, #cddbd6); border-radius: 50%;
  color: var(--ls-accent, #245d58); background: var(--ls-current, #eaf1ed);
}
.ls-directory-icon svg { inline-size: 1rem; block-size: 1rem; }
.ls-directory-group .ls-directory-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px; margin: 0; padding: 0; list-style: none;
}
.ls-directory-grid > li { display: flex; min-inline-size: 0; }
.ls-directory-group .ls-directory-card {
  display: flex; box-sizing: border-box; flex-direction: column; inline-size: 100%;
  min-inline-size: 0; overflow-wrap: anywhere; gap: 0;
  padding: 19px 20px; border: 1px solid var(--ls-line, #cddbd6);
  border-block-start: 3px solid var(--ls-top, #c4d8cc); border-radius: 6px;
  background: var(--ls-card, #fff); color: var(--ls-ink, #17364b);
  text-decoration: none; font-weight: 400;
}
.ls-directory-group--health { --ls-top: #c4d3db; }
.ls-directory-group--public { --ls-top: #dfd4b9; }
.ls-directory-group .ls-directory-current { background: var(--ls-current, #eaf1ed); }
.ls-directory-group a.ls-directory-card:is(:visited,:hover,:active,:focus) { text-decoration: none; }
.ls-directory-group a.ls-directory-card:hover { background: var(--ls-current, #eaf1ed); }
.ls-directory-group a.ls-directory-card:focus-visible { outline: 2px solid var(--ls-accent, #245d58); outline-offset: 3px; }
.ls-directory-card h3 {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between;
  gap: .45rem; margin: 0 0 .25rem; color: inherit; font-size: 1.2rem; line-height: 1.3;
}
.ls-directory-card p { margin: 0 0 .6rem; color: inherit; font-size: 1rem; line-height: 1.42; }
.ls-directory-card .ls-directory-host { margin-block: auto 0; color: var(--ls-muted, #46636a); font-size: .88rem; }
.ls-directory-card .ls-directory-badge { color: var(--ls-accent, #245d58); font-size: .85rem; font-weight: 600; }
@media (max-width: 760px) {
  .ls-directory-group .ls-directory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .ls-directory-group { margin-block: 1.7rem; }
  .ls-directory-group .ls-directory-grid { grid-template-columns: 1fr; }
  .ls-directory-group .ls-directory-card { padding: 13px 15px; }
}