/* /blog — the topic index, set like the index of a book: letter, topic, dotted leader, count. */
.blg-ix{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--bdh-gap);row-gap:44px}
.blg-ix__az{grid-column:1 / span 8;columns:2;column-gap:clamp(28px,4vw,64px)}
.blg-ix__grp{display:grid;grid-template-columns:48px minmax(0,1fr);column-gap:10px;padding:14px 0 10px;border-top:1px solid var(--line);break-inside:avoid}
.blg-ix__l{padding-top:3px;font-family:var(--f-h);font-size:1.75rem;font-weight:500;line-height:1;letter-spacing:-.02em;color:var(--ink)}
.blg-ix__list{display:flex;flex-direction:column}
.blg-ix__a{display:flex;align-items:baseline;gap:10px;min-height:38px;padding:7px 0;color:var(--txt)}
.blg-ix__t{font-size:var(--t-body);line-height:1.35;transition:color var(--d1) var(--e-io)}
.blg-ix__dots{flex:1;min-width:18px;border-bottom:1px dotted var(--line-3);transform:translateY(-4px)}
.blg-ix__n{font-family:var(--f);font-size:var(--t-xs);color:var(--muted);font-variant-numeric:tabular-nums}
.blg-ix__a:hover .blg-ix__t{color:var(--ink);text-decoration:underline;text-decoration-color:var(--blue-line);text-underline-offset:3px}
.blg-ix__a:hover .blg-ix__n{color:var(--blue-d)}
.blg-ix__side{grid-column:10 / 13;display:flex;flex-direction:column}
.blg-ix__h{padding-bottom:10px;border-bottom:1px solid var(--ink);font-family:var(--f);font-size:var(--t-lbl);font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--ink)}
.blg-ix__side .blg-ix__list{margin-bottom:34px}
.blg-ix__side .blg-ix__a{border-bottom:1px solid var(--line-2)}

@media (max-width:1100px){
  .blg-ix__az{grid-column:1 / -1}
  .blg-ix__side{grid-column:1 / -1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--bdh-gap-l)}
  .blg-ix__side .blg-ix__h:nth-of-type(2){grid-column:2;grid-row:1}
  .blg-ix__side .blg-ix__list:last-child{grid-column:2;grid-row:2}
}
@media (max-width:680px){
  .blg-ix__az{columns:1}
  .blg-ix__side{display:flex}
  .blg-ix__a{min-height:44px}
}

/* touch screens (phones and tablets): 44px tap targets (integrator, responsive pass) */
@media (pointer:coarse){
  .blg-ix__a{min-height:44px;align-items:center}
}
