Focus Not Obscured (Minimum)
When a user-interface component receives keyboard focus, it must not be entirely hidden by author-created sticky content (sticky headers, footers, drawers).
What it requires
Sticky headers and announcement bars often cover the upper portion of the viewport. When a keyboard user tabs to a link in the navigation, that link is sometimes scrolled into the area now covered by the sticky header — the focus indicator is hidden, the user is lost.
2.4.11 is "Minimum" — it requires the focused element to be at least partially visible. 2.4.12 (Enhanced, AAA) requires the entire focused element to be visible.
Common Shopify failure
Cart drawer overlay covers the entire viewport, but Tab still moves focus through links underneath the drawer. Sticky announcement bar covers the top 60px, hiding the first row of newly-focused header links.
How to fix it
Add `scroll-margin-top` equal to the sticky header height on focusable elements, or use `scroll-padding-top` on the scrolling container. AccessComply's FocusObscuringAgent computes the sticky offsets and writes the rule.
Primary source: W3C — WCAG 2.2 Understanding 2.4.11