.koi-hero {
    --overlay-bottom: 1rem;
    --overlay-right: 1rem;
    --overlay-width: 157px;

    @media (min-width: 48rem) {
        --overlay-bottom: 4rem;
        --overlay-right: 4rem;
        --overlay-width: 556px;
    }

    position: relative;

    picture {
        display: contents;
    }

    .koi-hero-image {
        width: 100%;
    }

    .koi-hero-overlay {
        position: absolute;
        bottom: var(--overlay-bottom);
        right: var(--overlay-right);

        width: min(var(--overlay-width), 40dvw);
    }
}