
fl-image-grower {
    display: block;
    width: 100%;
    overflow: hidden;
}

:where(fl-image-grower) {
    .scroll-wrapper {
        place-content: center;
        display: grid;
        height: auto;
        width: 100%;
        justify-content: center;
        justify-items: center;
        aspect-ratio: 1.5;
    }

    .img-box__outer {
        overflow: hidden;
        height: 100%;
        width: auto;
        /*aspect-ratio: var(--img-ratio, 1.5); */
        aspect-ratio: 1.5;
        margin: auto;
    }

    .img-box__inner {
        display: grid;
        grid-template-areas: "img";
        grid-auto-rows: 100%;
        height: 100%;
        width: 100%;
        justify-content: center;

        & > * {
            grid-area: img;
        }
    }

    img {
        height: 100%;
        width: auto;
        max-width: none;
        max-height: none;
        border-radius: inherit;
        will-change: transform;
    }
}