/* ============================================================
   70-hub — simple index grid for the Blog and Spotlight Series
   hub pages. Scoped under .sec-70-hub.
   ============================================================ */
.sec-70-hub__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: clamp(1.25rem, 2vw, 2rem);
}

.sec-70-hub__card {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  background: var(--white);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-soft);
  padding: 1.75rem;
  text-decoration: none;
  color: inherit;
  transition: box-shadow 300ms var(--ease-out), transform 300ms var(--ease-out);
}
.sec-70-hub__card:hover {
  box-shadow: var(--shadow-lift);
  transform: translateY(-3px);
}
.sec-70-hub__card h2 {
  font-size: var(--fs-h4);
  color: var(--text-on-bone);
}
.sec-70-hub__card p {
  color: var(--text-on-bone-dim);
  flex-grow: 1;
}
.sec-70-hub__link {
  font-family: var(--font-display);
  font-weight: 600;
  /* --accent (brand cyan) is 2.11:1 on this white card, failing 4.5:1.
     --accent-strong reaches 5.27:1. Background fills of --accent are
     unaffected by this — only this text usage changes. */
  color: var(--accent-strong);
}
