@layer components {
  .sitemap-grid {
    display: flex;
    flex-direction: column;
    gap: clamp(2rem, 4vw, 3rem);
  }

  .sitemap-group__title {
    margin-block-end: 1rem;
    padding-block-end: .6rem;
    border-block-end: 1px solid var(--pw-border);
    font-size: var(--pw-fs-md);
  }

  .sitemap-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
    gap: .3rem clamp(1.5rem, 3vw, 2.5rem);
    font-size: var(--pw-fs-sm);

    & a {
      color: var(--pw-fg-meta);
      transition: color .2s;
      &:hover { color: var(--pw-primary-soft); }
    }
  }
}