/* patch-4.css - image framing
   Featured artwork on these titles is 16:9. The card and hero frames were
   cropping it (16/10, 4/3, 21/9), which cut off part of every picture.
   These frames match the artwork, so the whole image is shown. */
.card__media,
.pub-docketjournal .card__media,
.pub-siteworkjournal .card__media,
.pub-servicecallwire .card__media,
.pub-headcountjournal .card__media,
.pub-throughputjournal .card__media,
.pub-warehousebrief .card__media{aspect-ratio:16/9}

.hero__media,
.pub-docketjournal .hero__media,
.pub-siteworkjournal .hero__media,
.pub-servicecallwire .hero__media,
.pub-headcountjournal .hero__media,
.pub-throughputjournal .hero__media,
.pub-warehousebrief .hero__media{aspect-ratio:16/9}

.card__media img,
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:center}

/* Failsafe for the scroll-driven reveals (animation-timeline: view()).
   When one of these sections sits at the very bottom of the document its view()
   range never resolves, so it holds its opening keyframe - opacity 0 - for every
   visitor. On throughputjournal.com this left a section heading and the working
   newsletter form permanently invisible. Content must never be hidden like that:
   readers cannot see it, and to a search engine it reads as hidden text. */
.rv,
.rv-rule,
.rv-stack > *,
.section__head{opacity:1}

.signup,
.signup.rv{animation:none !important;transition:none !important;opacity:1 !important;transform:none !important}
/* The hero entrance animation ("settle") never starts in current Chrome: the
   animation reports playState "running" but its clock stays at 0, and with
   animation-fill-mode: both it holds the opening keyframe, opacity 0, forever.
   That left the homepage lead link, standfirst and spec strip invisible to every
   reader. The entrance flourish is not worth losing the first paragraph a visitor
   sees, so these elements are simply shown. */
.hero-in,
.hero-in--1,
.hero-in--2,
.hero-in--3{animation:none !important;opacity:1 !important;transform:none !important}
/* Every entrance reveal in this theme is frozen in current Chrome: each animation
   reports playState "running" while its clock stays at 0, and with
   animation-fill-mode: both it holds the opening keyframe - opacity 0 - forever.
   Verified stuck: the hero dek and byline, the newsletter panel, the "Filed"
   list, the homepage cards and the stat blocks. None of that text ever reached a
   reader. Showing the content matters more than the flourish, so the reveals are
   neutralised until they can be rebuilt. */
.hero-in,
.hero-in--1,
.hero-in--2,
.hero-in--3,
.rv,
.rv-rule,
.rv-stack > *,
.signup,
.signup.rv,
.section__head,
.filed li,
.launch__list li,
.card,
dl div{animation:none !important;opacity:1 !important;transform:none !important}
/* Same frozen-reveal defect on the roster list. */
.roster li,
ol.roster > li,
.roster__row{animation:none !important;opacity:1 !important;transform:none !important}
/* ============================================================
   Accessibility patch - 2026-09-25 - marker: PUBXA11Y20260925
   ============================================================ */

/* WCAG 2.4.7 / 1.4.11 - two-tone focus ring.
   app.css already drew outline:2px solid var(--focus), but --focus is the
   publication accent, so the ring vanished wherever a control sits ON that
   accent (measured 1.00:1) or on the dark navy panel (1.11:1). A dark
   outline plus a white inner ring keeps one of the two visible on any
   surface. Specificity (0,1,1) beats the :where() rule with no !important. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible{
  outline:3px solid #10141A;
  outline-offset:2px;
  box-shadow:0 0 0 2px #FFFFFF;
  border-radius:2px;
}

/* Mouse and touch keep a clean press; keyboard keeps the ring. Guarded so
   engines without :focus-visible never lose their indicator entirely. */
@supports selector(:focus-visible){
  a:focus:not(:focus-visible),
  button:focus:not(:focus-visible),
  input:focus:not(:focus-visible),
  select:focus:not(:focus-visible),
  textarea:focus:not(:focus-visible),
  summary:focus:not(:focus-visible),
  [tabindex]:not([tabindex="-1"]):focus:not(:focus-visible){outline:none}
}

/* Windows high-contrast: let the OS choose the colour. */
@media (forced-colors: active){
  a:focus-visible,button:focus-visible,input:focus-visible,
  select:focus-visible,textarea:focus-visible,summary:focus-visible,
  [tabindex]:not([tabindex="-1"]):focus-visible{outline-color:Highlight}
}

/* WCAG 1.4.3 - the "Editor's pick" badge in Writon quick-pick tables ships
   #FFFFFF on #6C63FF = 4.32:1 as an inline style attribute, so overriding it
   requires !important. #6058F0 is the same violet darkened to 5.06:1. */
.writon-quick-picks span[style*="6C63FF"]{background:#6058F0 !important}