Trigger each iteration individually + staggering?

I'm building a broad Fade Up animation that will be used for various elements across the website.

For example, I might apply it to a section's inner container (ex. ct-section-inner-wrap) so that every section fades up across the site.

I also wanted to apply it to elements that are nested a bit deeper - like an icon box.

Since icon boxes are usually in a row, I'd want those to stagger.

I've tried enabling Trigger each iteration individually + Staggering, but it hasn't had the desired effect.

I can understand why that wouldn't work. It's probably animating all elements on the page once the first element is triggered.

Is there a better way to stagger only the elements in view?

Or should I create one animation for sections and one animation for icon boxes (even though the animations would be identical)?

Thanks!