/* Fallback voor Squarespace-gallerijscripts die niet meegekopieerd konden worden:
   masonry via CSS-kolommen en de fade-in-animatie direct zichtbaar maken. */
.gallery-masonry-item-wrapper{opacity:1 !important}
.gallery-masonry-wrapper{column-count:3;column-gap:14px;height:auto !important}
.gallery-masonry-item{position:static !important;transform:none !important;width:auto !important;break-inside:avoid;margin:0 0 14px}
.gallery-masonry-item img{position:static !important;width:100% !important;height:auto !important;object-fit:cover}
@media (max-width:900px){.gallery-masonry-wrapper{column-count:2}}
@media (max-width:560px){.gallery-masonry-wrapper{column-count:1}}
/* Squarespace-onthullingsanimaties (opacity 0 tot JS ze triggert) uitzetten */
[data-animation-role]{opacity:1 !important;transform:none !important}

/* Portfolio-categorie-overlays: op desktop verschijnt de titel alleen bij hover, maar op
   touch-apparaten bestaat hover niet, waardoor de link onzichtbaar/onduidelijk klikbaar was.
   Op smalle schermen tonen we de titel daarom altijd, met een leesbare gradient erachter. */
@media (max-width:900px){
  .portfolio-text{
    opacity:1 !important;
    background:linear-gradient(to top, rgba(0,0,0,.72) 0%, rgba(0,0,0,.35) 45%, rgba(0,0,0,0) 75%) !important;
    justify-content:flex-end !important;
    align-items:center !important;
    padding:24px !important;
  }
  .portfolio-text .portfolio-title{
    color:#fff !important;
    font-family:Anton,sans-serif !important;
    text-transform:uppercase !important;
    font-size:22px !important;
    text-shadow:0 2px 8px rgba(0,0,0,.5);
  }
}
