.of-sites{max-width:1040px;margin-inline:auto}
.of-sites h1{margin-block:8px 8px}
.of-sites-intro{margin:0 0 24px}
.of-sites-group+ .of-sites-group{margin-top:24px}
.of-sites-group h2{margin:0 0 10px}
.of-sites-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:12px;list-style:none;margin:0;padding:0}
.of-sites-grid li{min-width:0}
#IFBody .of-sites .of-sites-card{height:100%;display:flex;flex-direction:column;gap:6px;padding:14px 16px;border:1px solid #cadbea;border-radius:6px;background:#fff;color:inherit}
#IFBody .of-sites .of-sites-card:hover{background:#f3f8fc;border-color:#88aecb}
#IFBody .of-sites .of-sites-card:focus-visible{outline:2px solid #21629b;outline-offset:3px}
.of-sites-card h3{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:0;color:#174e78}
.of-sites-card p{margin:0}
.of-sites-host{margin-top:auto;color:#435d71;font-size:.9em;overflow-wrap:anywhere}

.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; }
}

.of-sites{--ls-accent:#174e78;--ls-current:#eaf3fa;}