/* Purpose: Sitemap page — grouped link lists (same content as live) themed to the site's
   fonts/colours. First heading = page title; others = section groups. Mobile-first. */

.sitemap { background: #fafaf6; padding: 48px 0; }
.sitemap-content { max-width: 1180px; margin-inline: auto; }

/* Page title (first heading). */
.sitemap-content > h2:first-child,
.sitemap-content > h1:first-child {
    font-family: var(--font-display);
    font-weight: var(--weight-regular);
    font-size: clamp(34px, 5vw, 54px);
    line-height: 1.18;
    color: var(--color-primary);
    text-transform: capitalize;
    margin: 0 0 8px;
}

/* Section group headings. */
.sitemap-content h2 {
    font-family: var(--font-display);
    font-weight: var(--weight-regular);
    font-size: 24px;
    line-height: 32px;
    color: var(--color-primary);
    text-transform: capitalize;
    margin: 40px 0 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e7e8eb;
}

/* Link grid. */
.sitemap-content ul {
    display: grid;
    grid-template-columns: 1fr;
    gap: 4px 24px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.sitemap-content li { margin: 0; }
.sitemap-content li a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    font-family: var(--font-body);
    font-weight: var(--weight-regular);
    font-size: 16px;
    line-height: 24px;
    color: var(--color-text);
    text-decoration: none;
    transition: color var(--duration-base) var(--ease-out);
}
.sitemap-content li a:hover { color: var(--color-gold); }
/* Gold bullet via CSS (WordPress strips inline <svg> from saved content, so don't rely on it). */
.sitemap-content li a svg { display: none; }
.sitemap-content li a::before {
    content: "";
    flex-shrink: 0;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--color-gold);
    transition: transform var(--duration-base) var(--ease-out);
}
.sitemap-content li a:hover::before { transform: scale(1.4); }
/* Empty paragraphs left behind when the sanitizer stripped the old bullet svgs. */
.sitemap-content li a p:empty { display: none; }

@media (min-width: 600px)  { .sitemap-content ul { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) {
    .sitemap { padding: 80px 0; }
    .sitemap-content ul { grid-template-columns: repeat(3, 1fr); }
}
