/*!
 * Work Lawyers: the guides index (/articles/all/).
 *
 * Loaded only by page-templates/template-all-guides.php. Reuses the
 * article sidebar's .side-card components (defined in
 * article-refresh.css) for the bio and consultation panels, and adds
 * the index list plus its two-column layout. Everything is spent from
 * the existing token budget: no new colors, faces, or shadows.
 *
 * CONTENTS
 *  1. Layout (index + sidebar)
 *  2. The index list
 *  3. Sidebar: bio panel
 *  4. Print
 */

/* ------------------------------------------------------------------
   1. LAYOUT
------------------------------------------------------------------ */
.guides-index {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--s-7);
  padding-bottom: var(--s-8);
}
.guides-index__aside {
  display: flex;
  flex-direction: column;
  gap: var(--s-5);
}

@media (min-width: 60em) {
  .guides-index {
    grid-template-columns: minmax(0, 1fr) 20rem;
    gap: var(--s-8);
    align-items: start;
  }
}

/* ------------------------------------------------------------------
   2. THE INDEX LIST
   A plain, scannable list: a mono category label, the title, and a
   one-line dek, divided by the same hairline the guide cards use.
   No media, so it reads as an index rather than a wall of cards.
------------------------------------------------------------------ */
.guide-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.guide-list__item {
  border-top: 1px solid var(--rule-strong);
  padding-block: var(--s-4);
}
.guide-list__item:first-child {
  border-top: 0;
  padding-top: 0;
}
.guide-list__cat {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: var(--s-2);
}
.guide-list__cat a { color: var(--brand-deep); text-decoration: none; }
.guide-list__cat a:hover { color: var(--brand); }
.guide-list__title {
  font-size: var(--text-xl);
  margin: 0 0 var(--s-2);
  text-wrap: balance;
}
.guide-list__title a { color: inherit; text-decoration: none; }
.guide-list__title a:hover { color: var(--brand-deep); text-decoration: underline; }
.guide-list__dek {
  max-width: 46rem;
  margin: 0;
  color: var(--ink-2);
  font-size: clamp(1rem, 0.9rem + 0.4vw, 1.0625rem);
  line-height: 1.6;
  text-wrap: pretty;
}
/* Each entry carries the same "Read More" pill as the guide cards
   (styled in site-refinements.css). In this block context the pill's
   margin-top:auto collapses to 0, so add real space above it. */
.guide-list__item .card__more { margin-top: var(--s-3); }

/* ------------------------------------------------------------------
   3. SIDEBAR: BIO PANEL
   The bio-panel styles (.side-card--bio, .side-card__bio, and the
   "More About Me" button .side-card__biolink) now live in
   site-refinements.css so the Page with Sidebar template shares them.
   Card chrome still comes from .side-card in article-refresh.css.
------------------------------------------------------------------ */

/* ------------------------------------------------------------------
   4. PRINT
------------------------------------------------------------------ */
@media print {
  .guides-index { grid-template-columns: 1fr; }
  .guides-index__aside { display: none; }
}