/* Phase 6 reuses the approved foundation and card/CTA tokens. */
.lp-resource-reading { max-inline-size: var(--lp-container-narrow); margin-inline: auto; padding: var(--lp-space-xl) var(--lp-gutter); }
.lp-resource-header { margin-block-end: var(--lp-space-xl); }
.lp-resource-article h1, .page .entry-header h1 { font-size: var(--wp--preset--font-size--lp-h-1); }
.lp-resource-article h2, .lp-resource-hub h2 { font-size: var(--wp--preset--font-size--lp-h-2); }
.lp-resource-article h3 { font-size: var(--wp--preset--font-size--lp-h-3); }
.lp-resource-meta { display: flex; flex-wrap: wrap; gap: var(--lp-space-sm) var(--lp-space-lg); }
.lp-resource-toc, .lp-resource-inline-cta { padding: var(--lp-space-lg); background: var(--lp-color-bg-alt); color: var(--lp-color-text); margin-block: var(--lp-space-xl); border: 1px solid var(--lp-color-border); border-radius: var(--lp-radius-sm); }
.lp-resource-toc ul { list-style: none; margin: 0; padding: 0; }
.lp-resource-toc a { display: inline-flex; align-items: center; min-block-size: 44px; }
.lp-toc-level-3 { padding-inline-start: var(--lp-space-lg); }
.lp-resource-article :where(h2,h3)[id] { scroll-margin-block-start: var(--lp-space-xl); }
.lp-resource-image { display: grid; place-content: center; aspect-ratio: 3 / 2; background: var(--lp-color-bg-alt); border: 1px solid var(--lp-color-border); padding: var(--lp-space-lg); text-align: center; margin-block: var(--lp-space-xl); }
.lp-resource-image p { margin: 0; }
.lp-resource-featured { display: block; max-inline-size: 100%; block-size: auto; margin-block-end: var(--lp-space-xl); }
.lp-resource-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--lp-space-lg); }
.lp-resource-card { min-inline-size: 0; }
.lp-resource-card h3 { font-size: var(--wp--preset--font-size--lp-h-4); }
.lp-resource-related .lp-resource-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lp-resource-article .entry-content { margin-block-start: 0; }
.lp-resource-article .wp-block-table { overflow-x: auto; }
@media (max-width: 767px) {
  .lp-resource-grid, .lp-resource-related .lp-resource-grid { grid-template-columns: 1fr; }
}