/* A centered starting point, followed by a compact, readable town directory. */
.community-directory > .headline-pair {
  max-width:900px;
  margin:0 auto;
  text-align:center;
}
.community-directory .directory-search {
  display:block;
  width:100%;
  max-width:650px;
  margin:32px auto 16px;
  text-align:center;
  font-size:18px;
  line-height:1.5;
}
.community-directory .directory-search input {
  text-align:center;
  border-radius:8px;
  margin-top:12px;
  min-height:56px;
  padding:14px 18px;
}
.community-directory #directory-count {
  max-width:none;
  margin:0 auto 32px;
  text-align:center;
  font-size:16px;
  line-height:1.5;
  color:var(--dv-muted);
  font-variant-numeric:tabular-nums;
}
.community-directory .town-grid {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:20px;
  max-width:1400px;
  margin:0 auto;
}
.community-directory .town-card {
  min-width:0;
  padding:24px 18px;
}
.community-directory .town-card small {
  display:block;
  font-size:11px;
  line-height:1.5;
  letter-spacing:.08em;
}
.community-directory .town-card h2 {
  font-size:clamp(28px,2.25vw,34px);
  line-height:1.12;
  margin:20px 0 12px;
  overflow-wrap:anywhere;
  text-wrap:balance;
}
.community-directory .town-card p {
  margin:0;
  font-size:16px;
  line-height:1.55;
  overflow-wrap:break-word;
}
@media(max-width:1100px) {
  .community-directory .town-grid {grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;}
  .community-directory .town-card {padding:24px 16px;}
  .community-directory .town-card h2 {font-size:30px;}
}
@media(max-width:900px) {
  .community-directory .town-grid {grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media(max-width:700px) {
  .community-directory .town-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}
  .community-directory .town-card h2 {font-size:30px;}
  .community-directory .directory-search {margin-top:28px;font-size:17px;}
  .community-directory .directory-search input {font-size:16px;padding-inline:12px;}
  .community-directory #directory-count {margin-bottom:28px;}
}
@media(max-width:480px) {
  .community-directory .town-grid {grid-template-columns:minmax(0,1fr);gap:16px;}
  .community-directory .town-card {padding:24px;}
  .community-directory .town-card h2 {font-size:34px;margin-top:14px;}
  .community-directory .town-card p {font-size:18px;line-height:1.5;}
}