/*
 * v6.6.4
 * Work-list cover centering.
 * Kept in a uniquely named file to bypass previous CSS caches.
 */

.work-grid .work-card > .work-cover-landscape,
.work-grid .work-card .work-cover-landscape {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    isolation: isolate !important;
    background: #65536c !important;
}

.work-grid .work-card .work-cover-landscape > .work-cover-landscape-blur {
    position: absolute !important;
    inset: -36px !important;
    z-index: -2 !important;
    display: block !important;
    background-image: var(--work-cover) !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    filter: blur(28px) saturate(.95) !important;
    transform: scale(1.16) !important;
}

.work-grid .work-card .work-cover-landscape::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    background: rgba(25, 20, 29, .18) !important;
}

/*
 * Do not depend on grid alignment. This forcibly centers the portrait cover
 * inside the 16:9 visual in both axes.
 */
.work-grid .work-card .work-cover-landscape > img {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;

    display: block !important;
    width: auto !important;
    height: 82% !important;
    max-width: 44% !important;
    max-height: 82% !important;

    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
    object-position: center !important;

    transform: translate(-50%, -50%) !important;
    transform-origin: center center !important;

    border-radius: 2px !important;
    box-shadow: 0 13px 30px rgba(15, 10, 20, .34) !important;
}

.work-grid .work-card .work-cover-landscape:hover > img {
    transform: translate(-50%, -50%) scale(1.015) !important;
}

@media (max-width: 700px) {
    .work-grid .work-card .work-cover-landscape > img {
        height: 78% !important;
        max-width: 50% !important;
        max-height: 78% !important;
    }
}
