@layer pages {
/* Hub and reference pages: /guides, /methodology, /disclosures, /data */
.hub { padding-bottom: var(--section-y-tight); }
.hub > section + section, .hub > section + article, .hub > .page-intro + * { margin-top: var(--section-y-tight); }
.hub > .page-intro + * { margin-top: 0; }
.hub section > h2 { margin-bottom: var(--block-gap); }

.hub-grid { display: grid; gap: var(--grid-gap); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) { .hub-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .hub-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.hub-card { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--card-pad); }
.hub-card h3 { font-size: var(--fs-title); line-height: var(--lh-title); }
.hub-card p { color: var(--text-muted); }
.hub-card ul { display: grid; gap: var(--space-2); padding: var(--space-2) 0 0; list-style: none; border-top: 1px solid var(--border); padding-top: var(--space-3); }
.hub-card li a::after { content: " →"; }
.hub-tools ul { display: grid; gap: var(--space-2); padding-left: 1.2em; }
.hub-card li a, .hub-tools a { color: var(--primary); font-weight: var(--fw-semibold); text-decoration: underline; text-decoration-color: color-mix(in oklab, var(--primary) 35%, transparent); text-underline-offset: 3px; }
.hub-card li a:hover, .hub-tools a:hover { text-decoration-color: currentColor; }

.hub-list { display: grid; gap: var(--space-3); }
.hub-list li { display: grid; gap: var(--space-2); padding: var(--card-pad); }
.hub-title { font-size: var(--fs-title); line-height: var(--lh-title); font-weight: var(--fw-bold); }
.hub-title:hover { color: var(--primary); }
.hub-list p { color: var(--text-muted); }
.hub-meta { font-size: var(--fs-meta); }
.hub-tools { padding: var(--card-pad); }
.hub-tools h2 { font-size: var(--fs-h3); line-height: var(--lh-h3); margin-bottom: var(--space-4) !important; }

/* Topic hubs (/topics/<id>) */
.topic .page-intro { padding-bottom: var(--space-6); }
.topic-status { margin-top: var(--space-5) !important; }
.topic-overview { display: grid; gap: var(--grid-gap); grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 1024px) { .topic-overview { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-12); } }
.topic-intro { max-width: 68ch; font-size: var(--fs-lede); line-height: var(--lh-lede); }
.topic-intro > * + * { margin-top: var(--space-4); }
.topic-tools { padding: var(--card-pad); }
.topic-tools ul { display: grid; gap: var(--space-4); margin-top: var(--space-4); padding: 0; list-style: none; }
.topic-tools li { display: grid; gap: var(--space-1); padding-top: var(--space-4); border-top: 1px solid var(--border); }
.topic-tools li:first-child { padding-top: 0; border-top: 0; }
.topic-tools a { font-weight: var(--fw-bold); color: var(--primary); text-decoration: underline; text-underline-offset: 3px; }
.topic-tools span { font-size: var(--fs-small); color: var(--text-muted); }
.topic-table td:first-child { font-weight: var(--fw-semibold); }
.topic-table a { color: var(--primary); text-decoration: underline; text-underline-offset: 3px; }
.topic-planned { max-width: 68ch; padding: var(--card-pad); border: 1px dashed var(--border-strong); border-radius: var(--radius-lg); background: var(--card); }
.topic-planned--after { margin-top: var(--block-gap); }
.topic-planned > * + * { margin-top: var(--space-3); }
.topic-planned p { color: var(--text-muted); }
.topic-planned ul { display: grid; gap: var(--space-2); padding-left: 1.1em; list-style: disc; }
.topic-sources a { text-decoration: underline; text-underline-offset: 3px; }
}