/* ==========================================================================
   UBM: /sitemap, the sitemap for people. sitemap.php
   Titled groups of links in columns; one column on a phone.
   ========================================================================== */

.sitemap {
  display: grid;
  gap: var(--sp-8) var(--sp-7);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
  align-items: start;
}
.sitemap__group { display: grid; gap: var(--sp-4); align-content: start; }
.sitemap__title {
  margin: 0;
  padding-block-end: var(--sp-3);
  border-block-end: var(--bw) solid var(--line-gold);
}
.sitemap__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-1); }
.sitemap__list a {
  display: block;
  padding-block: .4rem;
  color: var(--text);
  text-decoration: none;
  line-height: 1.4;
  transition: color var(--d-fast) var(--e-out);
}
.sitemap__list a:hover { color: var(--accent-text); text-decoration: underline; text-underline-offset: .2em; }
.sitemap__more { margin: 0; font-size: var(--fs-sm); }
/* The group is clipped while it reveals (base.css [data-reveal]), which would
   cut a focus ring drawn outside the link. Draw it just inside instead. */
.sitemap__list a:focus-visible,
.sitemap__more a:focus-visible { outline-offset: -2px; }
.sitemap__xml { margin-block-start: var(--sp-9); }