/* Asbestverwijdering.be — /projecten/ en /projecten/categorie/*.
   Aanvulling op /site/paginas.css (.filterbalk, .projectgrid, .projectkaart).
   Maten gemeten op het live origineel op 390 / 768 / 1000 / 1366 / 1920 px. */

/* De naamsbotsing met de projectenschuif op de home is in de afwerkingsronde
   in site.css opgelost: die kaartjes heten nu .schuifkaart. De 20px
   tussenruimte in de filterbalk staat sinds diezelfde ronde in
   /site/paginas.css §8, samen met .projectkaart[hidden]. */

/* De filterbalk staat 55px onder de bovenkant van de rij (Divi-modulemarge),
   het raster 20px onder de filterbalk. */
.projectenlijst .filterbalk { margin-top: 55px; }

/* 31px = 10px onder de laatste kaart + 21px sectie-opvulling van het origineel. */
.projectenlijst .projectgrid { margin: 20px 0 31px; }

/* Metselwerk-raster: elke kaart schuift onder de kortste kolom, net als in het
   origineel (Masonry). projecten.js zet per kaart een overspanning van
   1px-rijen; zonder JS blijft het een gewoon raster met gelijke rijen. */
.projectgrid.metselwerk {
    grid-auto-rows: 1px;
    grid-auto-flow: row dense;
    row-gap: 0;
}

/* Titel mag niet uit de zwarte kaart lopen. */
.projectkaart-titel { overflow-wrap: break-word; }

/* Zichtbare focus (het origineel heeft die niet). */
.filterbalk a:focus-visible { outline: 2px solid var(--geel); outline-offset: -2px; }
.filterbalk .actief:focus-visible { outline-color: var(--inkt); }
.projectgrid .knop-vol:focus-visible { outline: 2px solid var(--wit); outline-offset: 2px; }

.filterbalk a:hover { color: var(--wit); }
.filterbalk .actief:hover { color: var(--inkt); }

/* De witte 20px-strook die het origineel hier op telefoon tussen het raster
   en het vragenblok zette, is bewust weggelaten: hij las als een breuk in de
   grijze paginagrond (weggehaald op verzoek). */