/* IQ Accessibility — WCAG 2.1 AA baseline Load this LAST in every , after all page CSS. Do not add per-component :focus rules elsewhere. */ /* Skip link — visible only on keyboard focus */ .skip-link { position: absolute; top: -44px; left: 1rem; padding: 0.5rem 1rem; background: var(--accent, #e8562a); color: #fff; font-size: 0.875rem; border-radius: var(--r, 4px); text-decoration: none; z-index: 9999; transition: top 0.1s; } .skip-link:focus { top: 0.5rem; } /* Global focus ring — keyboard users only */ :focus-visible { outline: 2px solid var(--accent, #e8562a); outline-offset: 3px; } :focus:not(:focus-visible) { outline: none; } /* Visually-hidden but screen-reader-accessible */ .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } /* Suppress all animation for users who prefer reduced motion */ @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; } }