/* ------------------------------------------------------------------ *
 * Kategori-arkiv — post-kort-listning (quizfragor-pendant til          *
 * sporthopps sh-hubcard). Ligger i /public (uhashet, uden for bundlen) *
 * så den IKKE ændrer CSS-hashen på øvrige sider. Bruger quizfragors    *
 * egne --sh-*-tokens. Kun /category/<x>/-sider loader den.             *
 * ------------------------------------------------------------------ */

.qf-hub { max-width: var(--sh-maxw); }
.qf-hub__list { display: grid; gap: var(--sh-space-6); }

/* Post-kort: thumbnail venstre (260px) + tekst højre. */
.qf-hubcard {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  background: var(--sh-surface);
  border: 1px solid var(--sh-slate-200);
  border-radius: var(--sh-radius-lg);
  overflow: hidden;
}
.qf-hubcard--nothumb { grid-template-columns: 1fr; }

.qf-hubcard__thumb { display: block; aspect-ratio: 16 / 10; background: var(--sh-slate-100); }
.qf-hubcard__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

.qf-hubcard__body {
  padding: var(--sh-space-6);
  display: flex; flex-direction: column; gap: var(--sh-space-2);
  min-width: 0;
}
.qf-hubcard__title { font-size: 20px; font-weight: 700; line-height: 1.25; margin: 0; }
.qf-hubcard__title a { color: var(--sh-ink-950); text-decoration: none; }
.qf-hubcard__title a:hover { color: var(--sh-slate-700); }
.qf-hubcard__excerpt {
  font-size: 15px; line-height: 1.5; color: var(--sh-slate-700);
  margin: 0; overflow-wrap: anywhere;
}
.qf-hubcard__more {
  align-self: flex-start; margin-top: var(--sh-space-1);
  font-size: 15px; font-weight: 600; color: var(--sh-ink-950);
  text-decoration: none; border-bottom: 1px solid var(--sh-slate-300);
}
.qf-hubcard__more:hover { border-bottom-color: var(--sh-ink-950); }

/* Paginering (URL'er bevaret 1:1 fra arkivet). */
.qf-pagination { display: flex; flex-wrap: wrap; gap: var(--sh-space-2); align-items: center; margin-top: var(--sh-space-8); }
.qf-pagination__num {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 44px; min-height: 44px; padding-inline: 12px;
  border: 1px solid var(--sh-slate-200); border-radius: var(--sh-radius-sm);
  background: var(--sh-surface); color: var(--sh-ink-950);
  font-size: 15px; font-weight: 600; text-decoration: none;
}
a.qf-pagination__num:hover { background: var(--sh-slate-100); }
.qf-pagination__num--current { background: var(--sh-lime-400); border-color: var(--sh-lime-400); color: var(--sh-ink-950); }

/* Mobil: thumbnail stables øverst. */
@media (max-width: 720px) {
  .qf-hubcard { grid-template-columns: 1fr; }
  .qf-hubcard__thumb { aspect-ratio: 16 / 9; }
}