/* List pages in the selling-page look: /research/ and its sections, /guides/, each topic's /articles/. Loaded after home.css, topic-pitch.css and knowledge-hub.css; reuses their kn- hero, search and jump chips. */

.brand-list [hidden] { display: none !important; }

/* Section links (research library): the current one is filled */
.page-home .bl-nav a[aria-current="page"] { background: var(--primary); border-color: var(--primary); color: var(--on-primary); }
.bl-meta { margin-top: 1rem; color: var(--hm-muted); font-size: .875rem; }
.bl-meta time { font-variant-numeric: tabular-nums; }

/* Section head with a count or a side link on the right */
.bl-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1.5rem; margin-bottom: 1.75rem; }
.page-home .bl-head h2 { font-size: clamp(1.625rem, 3vw, 2.125rem); }
.bl-head p:not(.kn-group-count) { max-width: 36rem; margin-top: .5rem; color: var(--hm-muted); line-height: 1.75; }
.bl-head-link { flex: 0 0 auto; color: var(--hm-jade-ink); font-size: .9375rem; font-weight: 700; white-space: nowrap; }
.bl-head-link:hover { text-decoration: underline; text-underline-offset: .1875rem; }

/* One article per row, across the content width; text keeps a reading measure */
.bl-list { list-style: none; padding: 0; margin: 0; border-top: .0625rem solid var(--hm-line-strong); }
.bl-row { display: grid; grid-template-columns: 10rem minmax(0, 1fr) auto; gap: .375rem 2rem; align-items: baseline; padding: 1.5rem 0; border-bottom: .0625rem solid var(--hm-line); color: var(--hm-text); }
.bl-row-meta { grid-column: 1; grid-row: 1 / span 3; color: var(--hm-gold-ink); font-size: .8125rem; font-weight: 700; line-height: 1.7; }
.page-home .bl-row h3 { grid-column: 2; grid-row: 1; max-width: 30em; font-size: 1.25rem; line-height: 1.5; }
.bl-row-summary { grid-column: 2; max-width: 46rem; color: var(--hm-muted); font-size: .9375rem; line-height: 1.75; }
.bl-row-foot { grid-column: 2; color: var(--hm-muted); font-size: .8125rem; }
.bl-row-meta span { white-space: nowrap; }
.bl-row-arrow { grid-column: 3; grid-row: 1; color: var(--hm-jade-ink); transition: transform .2s; }
.bl-row:hover h3 { color: var(--hm-jade-ink); }
.bl-row:hover .bl-row-arrow { transform: translateX(.25rem); }

/* Compact groups inside one band (topic article lists) */
.bl-group { scroll-margin-top: 4.5rem; }
.bl-group + .bl-group { margin-top: 3.5rem; }
.bl-group .bl-head { margin-bottom: 1rem; }
.page-home .bl-group .bl-head h2 { font-size: 1.5rem; }

/* Need cards (/guides/) */
.bl-cards { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.bl-cards li { scroll-margin-top: 4.5rem; }
.bl-cards .kn-card-summary { -webkit-line-clamp: 4; }
.bl-callout { max-width: 46rem; margin-top: 2rem; padding: 1.25rem 1.5rem; border-radius: var(--hm-radius-sm); background: var(--hm-surface); border: .0625rem solid var(--hm-line); color: var(--hm-muted); font-size: .9375rem; line-height: 1.8; }
.bl-callout strong { color: var(--hm-text); }

/* Closing note: scope of the library, or what the App offers for this topic */
.bl-note { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1.5rem 3rem; align-items: center; }
.bl-note p { max-width: 46rem; margin-top: .625rem; color: var(--hm-muted); font-size: .9375rem; line-height: 1.8; }
.bl-note p a { color: var(--hm-jade-ink); text-decoration: underline; text-underline-offset: .1875rem; }
.bl-note-actions { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; align-items: center; }
.bl-note-actions a { color: var(--hm-jade-ink); font-weight: 700; white-space: nowrap; }
.bl-note-actions a:hover { text-decoration: underline; text-underline-offset: .1875rem; }

@media (max-width: 60em) {
  .bl-cards { grid-template-columns: repeat(2, 1fr); }
  .bl-note { grid-template-columns: 1fr; }
}

@media (max-width: 40em) {
  .bl-head { flex-direction: column; gap: .375rem; margin-bottom: 1.25rem; }
  .bl-nav { flex-wrap: wrap; overflow: visible; margin: 1rem 0 0; padding: 0; }
  .page-home .bl-head h2 { font-size: 1.5rem; }
  .bl-row { grid-template-columns: minmax(0, 1fr) auto; gap: .25rem 1rem; padding: 1.25rem 0; }
  .bl-row-meta { grid-column: 1 / -1; grid-row: 1; }
  .page-home .bl-row h3 { grid-column: 1; grid-row: 2; font-size: 1.0625rem; }
  .bl-row-arrow { grid-column: 2; grid-row: 2; }
  .bl-row-summary, .bl-row-foot { grid-column: 1 / -1; }
  .bl-row-summary { font-size: .875rem; }
  .bl-group + .bl-group { margin-top: 2.5rem; }
  .page-home .bl-group .bl-head h2 { font-size: 1.25rem; }
  .bl-group .bl-head { flex-direction: row; }
  .bl-cards { grid-template-columns: 1fr; gap: .75rem; }
  .bl-callout { padding: 1rem 1.125rem; font-size: .875rem; }
}