/* =========================================================
   category_list.css — lista editorial de categorías
   ========================================================= */

.cat__list {
  border-top: 1px solid var(--line);
}

.cat__row {
  border-bottom: 1px solid var(--line);
}

.cat__row a {
  display: grid;
  grid-template-columns: 44px 1fr auto;
  align-items: center;
  gap: 1.2rem;
  padding: 1.1rem 0.6rem;
  transition: background var(--dur-fast);
}

.cat__row:hover a {
  background: var(--accent);
  color: var(--accent-ink);
}

.cat__idx {
  font-family: var(--font-mono);
  font-size: var(--size-xs);
  color: var(--dim);
  transition: color var(--dur-fast);
}

.cat__row:hover .cat__idx {
  color: var(--accent-ink);
}

.cat__name {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(1.15rem, 2.4vw, 1.7rem);
  letter-spacing: -0.01em;
  transition: transform var(--dur-base);
}

.cat__row:hover .cat__name {
  transform: translateX(8px);
}

.cat__count {
  display: none;
  font-family: var(--font-mono);
  font-size: var(--size-xs);
  letter-spacing: 0.1em;
  color: var(--dim);
  transition: color var(--dur-fast);
}

.cat__row:hover .cat__count {
  color: var(--accent-ink);
}

.cat__arrow {
  padding: 0.4rem;
  transition: transform var(--dur-fast);
  justify-self: end;
}

.cat__row:hover .cat__arrow {
  transform: translate(3px, -3px);
}

.cat__arrow [data-lucide] {
  width: 20px;
  height: 20px;
}

@media (min-width: 520px) {
  .cat__row a {
    grid-template-columns: 64px 1fr auto auto;
    padding: 1.35rem 0.6rem;
  }

  .cat__count {
    display: inline;
  }
}
