/* rip-a11y.css — accessibility for every page under /rip/.
 *
 * Aaron, 2026-08-07: "consider accessibility and neuro diversity on every
 * page. ADHD, focus etc."
 *
 * The floor, and only the floor: a skip link, a visible focus ring on
 * everything focusable, and the operating system's reduce-motion setting
 * honoured globally. All of it is always on — there is no toggle, and there
 * should not be one. Sizing and spacing are handled where they belong, in the
 * components themselves.
 *
 * Loaded next to rip-header.css / rip-footer.css on every /rip/ page. Kept
 * separate from rip-ui.css because rip-ui.css is the look; this is the floor
 * under it, and the floor should never be something a restyle can move.
 */

/* ── 1. LANDMARKS AND FOCUS ──────────────────────────────────────────────── */

/* Screen-reader-only, but focusable. The standard clip-rect version, not
   display:none — a hidden element cannot receive focus, which defeats the
   point of a skip link. */
.rip-sr{
    position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
    overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;
}

/* Skip to content. Injected by rip-header.js as the first focusable thing on
   the page, so a keyboard or switch user does not tab through the whole nav
   on every single page load. Invisible until focused. */
.rip-skip{
    position:fixed; top:8px; left:8px; z-index:9999;
    transform:translateY(-160%);
    display:inline-flex; align-items:center; min-height:46px; padding:0 20px;
    border-radius:10px; text-decoration:none;
    background:var(--rip-act); color:var(--rip-act-ink);
    font-family:var(--rip-body); font-size:15px; font-weight:800;
    box-shadow:var(--rip-shadow);
    transition:transform .16s;
}
.rip-skip:focus{ transform:translateY(0) }
/* rip-ui.css repaints every anchor — (0,2,1) beats a bare class, same trap the
   header hit. This has to stay readable on its own cyan fill. */
a.rip-skip:not(.rip-btn),a.rip-skip:not(.rip-btn):hover{
    color:var(--rip-act-ink); text-decoration:none;
}

/* The target the skip link lands on. Programmatically focusable so focus
   really moves there rather than only the scroll position; no ring, because
   the user did not tab to it. */
[tabindex="-1"]:focus{ outline:none }

/* A visible focus ring on everything that takes focus. Several /rip/ surfaces
   set `outline:none` on their own controls; :focus-visible only fires for
   keyboard/AT users, so this costs mouse users nothing. */
.rip-ui a:focus-visible,
.rip-ui button:focus-visible,
.rip-ui input:focus-visible,
.rip-ui select:focus-visible,
.rip-ui textarea:focus-visible,
.rip-ui [tabindex]:focus-visible,
body > .wrap a:focus-visible,
body > .wrap button:focus-visible,
body > .wrap input:focus-visible,
body > .wrap select:focus-visible,
body > .wrap textarea:focus-visible{
    outline:2px solid var(--rip-act); outline-offset:2px; border-radius:4px;
}

/* The OS setting, honoured globally rather than component by component. A
   pack simulator is built out of motion — reveals, sheens, particle bursts —
   so the pages that most need this are the ones most likely to be missed. */
@media(prefers-reduced-motion:reduce){
    *,*::before,*::after{
        animation-duration:.001ms!important;
        animation-delay:0ms!important;
        animation-iteration-count:1!important;
        transition-duration:.001ms!important;
        transition-delay:0ms!important;
        scroll-behavior:auto!important;
    }
}

/* ── 2. PRINT ────────────────────────────────────────────────────────────── */
@media print{
    .rh,.rh-menu,.rip-skip,.rip-pv-tag,#sticky-open-bar{ display:none!important }
    body{ padding-top:0!important }
}