.image {
    container-type: size;
    display: block;
    width: 100%;
    height: 100%;
    contain: paint;

    img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: var(--object-fit, cover);
        --position-left: calc(50cqw - 1cqh * var(--focal-x, 50) * var(--aspect-ratio, 1));
        --position-top: calc(50cqh - 1cqw * var(--focal-y, 50) / var(--aspect-ratio, 1));
        object-position: clamp(100%, var(--position-left), 0%) clamp(100%, var(--position-top), 0%);
    } 
}

@container style(--object-fit) and (not style(--object-fit: cover)) {
    .image {
        img {
            object-position: center;
        }
    }
}