/*
    utilities.css
    Small, cross-cutting helper rules used in more than one component.
    Kept deliberately minimal: only classes actually referenced in
    index.html live here, to avoid unused/dead CSS.
*/

/* Visually hides content while keeping it available to assistive
   technology (used for the mobile nav toggle's "Menu" label). */
.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;
}

/* Visible keyboard focus, tuned per background context. Verified
   against WCAG AA 3:1 UI-component contrast in both contexts — see
   contrast_check.py. */
a:focus-visible,
button:focus-visible {
    outline: var(--border-width-thick) solid var(--color-focus-ring-light);
    outline-offset: 2px;
    border-radius: var(--radius-sm);
}

.site-header a:focus-visible,
.site-header button:focus-visible,
.site-footer a:focus-visible,
.site-footer button:focus-visible {
    outline-color: var(--color-focus-ring-dark);
}