/* Shared V2 accessibility corrections; keep the existing design and framework. */
body { padding-top:var(--v2-header); }
.masthead { position:fixed; top:0; left:0; right:0; width:100%; padding-block:0; }
.masthead--utility > .wrap { display:flex; align-items:center; min-height:var(--v2-header); }
.skip-link { position:fixed; z-index:110; }
:where([id]) { scroll-margin-top:calc(var(--v2-header) + 24px); }
/* The white inner ring and dark outer ring remain visible on either palette. */
body :is(a,button,summary,input,select,textarea,[tabindex]):focus-visible {
  outline:3px solid #191640 !important;
  outline-offset:3px !important;
  box-shadow:0 0 0 3px #fff !important;
  scroll-margin-top:calc(var(--v2-header) + 24px);
  scroll-margin-bottom:24px;
}
/* A <video controls> never matches :focus-visible in any of the three engines, so the
   rule above skips it and the browser's own default ring shows instead: a thin blue
   one in Chromium, nothing like the navy and white ring every other stop draws. Plain
   :focus is the only selector that reaches the host. This is a consistency fix, not an
   accessibility one, and it is deliberately not !important-free: the UA ring is what it
   replaces. A mouse click focuses the player too, so the ring shows then as well.
   Measured on Family access in all three engines, 17 September 2026. */
body video:focus {
  outline:3px solid #191640 !important;
  outline-offset:3px !important;
  box-shadow:0 0 0 3px #fff !important;
}

@media (forced-colors:active) {
 body :is(a,button,summary,input,select,textarea,[tabindex]):focus-visible,
 body video:focus {
  outline-color:Highlight !important;
  box-shadow:none !important;
 }
}

/* Keep the purple backgrounds; strengthen only their foreground text. */
.v2-card--purple :is(h2,h3) { color:#fff; }
.v2-hero .v2-eyebrow { color:#191640; }
