[data-role="footer"] {
  background: var(--warm);
  border-top: 8px solid var(--red);
  padding: 4rem max(2rem, calc((100% - 1280px) / 2));
}
[data-role="directory-heading"] { margin-bottom: 3rem; }
[data-role="directory-heading"] h2 { margin-top: 1rem; font-size: clamp(2rem, 1.6rem + 1.5vw, 3.25rem); line-height: 1; font-weight: 900; }
[data-role="directory"] { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space); }
[data-role="directory-group"] { min-width: 0; }
[data-role="directory-group"] h3 { margin-bottom: 1rem; max-width: 20ch; min-height: 2.75rem; }
[data-role="directory-group"] ul { padding: 0; list-style: none; }
[data-role="directory-group"] a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
  padding: 0.75rem 0;
  min-height: 48px;
  text-decoration: none;
  border-top: 1px solid var(--ink);
}
[data-role="directory-group"] a[aria-current="page"] { font-weight: 700; }
[data-role="directory-group"] a[aria-current="page"] span { color: var(--red); }
[data-role="directory-group"] a:hover { color: var(--red); }
[data-role="footer-note"] {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: var(--space);
  margin-top: 3rem;
  border-top: 2px solid var(--ink);
  padding-top: var(--space);
}
[data-role="footer-note"] p { max-width: 65ch; }
[data-role="footer-link"] { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 48px; padding: 0.75rem 0; white-space: nowrap; }

@media (max-width: 960px) {
  [data-role="directory"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  [data-role="footer-note"] { flex-direction: column; gap: 1rem; }
}
@media (max-width: 760px) {
  [data-role="footer"] { padding: var(--space) 1rem; }
  [data-role="directory-heading"] { margin-bottom: var(--space); }
  [data-role="directory"] { gap: var(--space) 1rem; }
  [data-role="directory-group"] h3 { font-size: 1.125rem; }
  [data-role="footer-note"] { margin-top: var(--space); }
}
@media (max-width: 350px) {
  [data-role="directory"] { grid-template-columns: 1fr; }
}