/* Opmaak voor de silo kennis (v2). Enkel regels die de gedeelde stijl niet heeft. */

/* Groep artikels onder een kop (per doelgroep op de hub, per vak op een thema-hub). */
.kennis-group { max-width: var(--content-wide); margin: 0 auto; }
.kennis-group + .kennis-group { margin-top: var(--space-7); }
.kennis-group__title {
    font-size: var(--text-lg);
    margin: 0 0 var(--space-2);
    color: var(--color-text);
}
.kennis-group__title a { color: inherit; text-decoration: none; }
.kennis-group__title a::after { content: ' \203A'; color: var(--color-orange); }
.kennis-group__blurb { margin: 0; color: var(--color-text-muted); }
.kennis-group .hub-grid { margin: var(--space-4) 0 0; }
@media (hover: hover) {
    .kennis-group__title a:hover { color: var(--color-orange); }
}

/* Clustertegels: vier korte titels naast elkaar op desktop. */
.kennis-cluster-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.kennis-cluster-grid .tile { padding: var(--space-5); }
.kennis-cluster-grid .tile-title { font-size: var(--text-lg); margin: 0; }
.kennis-themes .tile-title { font-size: var(--text-xl); }

/* Alle artikels: een kolom per thema. */
.kennis-index {
    max-width: var(--content-wide);
    margin: var(--space-6) auto 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--space-6);
    text-align: left;
}
.kennis-index__theme h3 { font-size: var(--text-lg); margin: 0 0 var(--space-3); }
.kennis-index__theme h3 a { color: var(--color-text); text-decoration: none; }
.kennis-index__theme ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2); }
.kennis-index__theme li a { color: var(--color-text-secondary); text-decoration: none; line-height: 1.45; }
@media (hover: hover) {
    .kennis-index__theme h3 a:hover,
    .kennis-index__theme li a:hover { color: var(--color-orange); }
}

/* Artikelkaarten op een thema-hub: titel en omschrijving, links uitgelijnd. */
.kennis-cards .kennis-card { text-align: left; }

/* Vier thema's: vier naast elkaar op desktop, twee op een tablet, nooit 3 + 1. */
.hub-grid.kennis-themes { grid-template-columns: 1fr; }
@media (min-width: 560px) { .hub-grid.kennis-themes { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .hub-grid.kennis-themes { grid-template-columns: repeat(4, 1fr); } }

/* Gsm: de korte clustertitels twee naast elkaar, zodat een vak niet vier schermen lang wordt. */
@media (max-width: 599px) {
    .hub-grid.kennis-cluster-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
    .kennis-cluster-grid .tile { padding: var(--space-4); }
    .kennis-cluster-grid .tile-eyebrow { letter-spacing: 0.08em; margin-bottom: var(--space-2); }
    .kennis-cluster-grid .tile-title { font-size: var(--text-base); }
}
