Have you ever tried using position: sticky with a child of a grid container? The default behavior for grid items is to stretch. As a result, the aside element in the example below is equal to the main section height.

To make it work as expected, you need to reset align-self property.

aside {
    align-self: start;
    position: sticky;
    top: 1rem;
}

I wrote about that topic in detail on my blog, if you're interested.

Examples and use cases

Main and Aside