/* partials/hub_cards.html — layout only. Colors from skins/*.css */

.hub-cards {
  max-width: var(--hub-max, 960px);
  margin: 0 auto;
  counter-reset: hub-section;
}

.hub-cards__section + .hub-cards__section {
  margin-top: 2.5rem;
}

.hub-cards__heading {
  margin: 0 0 0.35rem;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
  counter-increment: hub-section;
}

.hub-cards__heading::before {
  content: counter(hub-section) ". ";
}

.hub-cards__blurb {
  margin: 0 0 0.85rem;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--color-text);
}

.hub-cards__list {
  display: grid;
  gap: 0.75rem;
  margin: 0;
  padding: 0;
  list-style: none;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.hub-cards__list--grouped {
  padding: 0.75rem;
  border: 0;
}

.hub-cards__card {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 1rem 1.25rem;
  border-left-width: 2px;
  border-left-style: solid;
  border-radius: var(--radius-md);
  outline: 1px solid var(--color-hub-card-line);
  background: var(--color-hub-card-wash);
  transition: background var(--motion-fast);
}

a.hub-cards__card:hover {
  background: var(--color-hub-card-hover);
}

.hub-cards__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.hub-cards__title {
  display: block;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.4;
}

.hub-cards__level {
  flex: 0 0 auto;
}

.hub-cards__meta {
  display: block;
  margin-top: 0.35rem;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--color-text);
}

.hub-cards__cta {
  display: block;
  margin-top: auto;
  padding-top: 0.75rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-cta);
}

.hub-cards__links {
  display: block;
  margin-top: auto;
  padding-top: 0.75rem;
}

.hub-cards__links .hub-cards__cta {
  display: inline;
  margin-top: 0;
  padding-top: 0;
}