/* a11y round 8 (2026-10-31). Replaces a11y-r3.css, a11y-r4.css a11y-r5.css, a11y-r6.css and a11y-r7.css (their rules are repeated here, so pages link only this file).
   Keep this file name; bump it if you edit it, because CSS is cached as immutable. */
.site-social a{display:inline-block;min-width:24px;min-height:24px;line-height:24px;text-align:center}
.ld-opt input[type=radio]{width:24px;height:24px}
.table-wrap th a,.table-wrap td a{display:inline-block;padding-block:.2rem}
.price-callout.tier-better .tier-note,.tier.featured .tier-note{color:#dbe5ef}
@media(max-width:720px){.site-nav{margin:0;max-width:100%}}
.actions .link{display:inline-block;padding-block:.35rem}
/* r4: form fields keep the solid 3px focus outline (aligned.css replaced it with outline:none plus a soft shadow). */
.ld-field input:focus-visible,
.ld-field select:focus-visible,
.ld-field textarea:focus-visible,
.nl-field input:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
/* r5: on a phone the primary nav wraps to two rows. It used to scroll sideways, which hid About and Contact off the right edge with no cue. */
@media(max-width:720px){.site-nav{flex-wrap:wrap;overflow-x:visible;gap:2px 4px}.site-nav a{padding:8px 11px}}
/* r5: small labels and table headings were 11.5 to 12.5px; none go below 13px now. */
.btn .lab{font-size:.8125rem}
.kicker{font-size:.84rem}
.tier-label,.tier .tier-label{font-size:.84rem!important}
.work-card__kind{font-size:.84rem}
.table-wrap thead th{font-size:.875rem}
.disclosure{font-size:.875rem}
/* r6 (r6 itself shipped without the r5 phone rules above, so r7 repairs it): six nav links no longer fit beside the brand and the button, so Contact wrapped under the others. Below 1100px the header stacks (brand and button, then the nav on its own row); above it the nav sits between them. The header is not sticky on a phone, where it is two rows tall and the bottom bar already carries the call and message buttons. */
@media(max-width:1100px){.site-header .wrap{grid-template-columns:1fr auto;grid-template-areas:"brand mail" "nav nav";row-gap:6px}}
@media(min-width:1101px){.site-header .wrap{grid-template-columns:auto 1fr auto;grid-template-areas:"brand nav mail"}.site-nav{justify-content:center;overflow:visible}}
@media(max-width:720px){.site-header{position:static}}
/* r7: at 320 to 360px the brand name and the Message button together were wider than the screen (a sideways scroll bar). The brand wraps to two lines. */
@media(max-width:380px){.brand{white-space:normal;font-size:1.1rem;line-height:1.15}.mast-mail{white-space:nowrap}}
/* r7: the contact page's email button ran 18px past the screen at 320px; the address may now shrink and wrap. */
@media(max-width:380px){.btn .bt{min-width:0}.btn .addr{font-size:.88rem;overflow-wrap:anywhere}}
/* r7: the bot-check widget is a fixed 300px wide and the form column is 288px at 320px; scaled to fit (the widget stays fully visible and usable). */
@media(max-width:340px){.cf-turnstile{transform:scale(.94);transform-origin:0 0;margin-bottom:-4px}}
/* r8: the brand link was 20px tall (target size), and two labels in the home page's phone specimen were 11.5 and 12.5px. */
.brand{display:inline-block;min-height:24px;padding-block:3px}
.s-sub,.stage .cap{font-size:.8125rem}