picture.c {
    display:block;  position: relative; overflow: hidden;
}
picture.c img {
    object-fit: cover;
    width: var(--overflow);
    height: var(--overflow);
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
    transition: transform 0.2s ease-out;
}


article:has(a.cardlink:is(:hover,:focus-visible)) picture.c img,
a:is(:hover,:focus-visible) picture.c img { transform:translate(-50%, -50%) scale(1.05,1.05); }
a:is(:hover,:focus-visible) .meta picture.c img { transform: translate(-50%, -50%); }


picture.con {
    display:inline-block;  position: relative; overflow: hidden;
}
picture.con img {
    object-fit: contain;
    width: auto;
    height: 100%;

}