/* Reserve the frame and reveal only decoded pixels, without moving the card. */
#insights .insight-thumbnail { position: relative; aspect-ratio: 4 / 3; background: var(--heroBg); contain: paint; }
#insights .insight-thumbnail-image { display: block; width: 100%; height: 100%; opacity: 0; object-fit: cover; transform: none !important; scale: 1 !important; transition: opacity 180ms ease-out !important; }
#insights .insight-thumbnail-image.is-ready { opacity: 1; }
#insights .insight-thumbnail[data-image-error]::after { content: 'Afbeelding niet beschikbaar'; position: absolute; inset: 0; display: grid; place-items: center; font-size: 13px; opacity: .6; }
#insights .insight-card-line { transform-origin: left; transition: transform 180ms ease-out; }
@media (hover: hover) { #insights .insight-card:hover .insight-card-line { transform: scaleX(1.6667); } }
@media (prefers-reduced-motion: reduce) { #insights .insight-thumbnail-image, #insights .insight-card-line { transition: none !important; } }