/*
 * Accessibility layer for the landing page: the skip link, the main landmark, the attribution line under the
 * tool row, and focus and target-size fixes found by the axe-core audit. Loaded after the other stylesheets.
 */

/* <main id="content"> wraps the sections and the closing call to action; the exported layout is untouched. */
#content { display: contents; }

/* Skip link: first focusable element, hidden until it has focus. */
.crux-skip {
  position: fixed; left: 16px; top: 12px; z-index: 10000;
  padding: 11px 16px; border-radius: 10px;
  background: #0a58ff; box-shadow: inset 0 0 0 1px #ffffff3d, inset 0 0 14px 0 #ffffff4d;
  color: #fff; font: 500 14px/1 Geist, -apple-system, BlinkMacSystemFont, system-ui, sans-serif; letter-spacing: -.01em; text-decoration: none;
  transform: translateY(-220%); transition: transform 160ms ease;
}
.crux-skip:focus { transform: none; outline: 2px solid #a5d8ff; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .crux-skip { transition: none; } }

/* Attribution under the tool row: quiet, centred, linked. */
.crux-credit { margin: 0; padding: 0 24px; color: #8d97a8; font: 400 12.5px/1.6 Geist, -apple-system, BlinkMacSystemFont, system-ui, sans-serif; text-align: center; }
.crux-credit a { color: #b4bfd0; text-decoration: underline; text-decoration-color: #ffffff3d; text-underline-offset: 3px; }
.crux-credit a:hover { color: #fff; text-decoration-color: #ffffff80; }
.crux-credit a:focus-visible { outline: 2px solid #a5d8ff; outline-offset: 3px; border-radius: 3px; }

/* macOS is a typed name (no Apple logo): set like a wordmark so it holds its own beside the lockups. */
.framer-olbck2 .crux-logo--macos { --pl: 0px; }
.framer-olbck2 .crux-logo--macos .crux-logo-name { font-size: calc(22px * var(--s)); font-weight: 600; letter-spacing: -.02em; }

/* Hero subhead sits on the binary artwork; its grey (#c8cbd7) fell to 3:1 against the brightest glyphs, so it is white
   (4.8:1 at worst, far higher over most of the artwork). */
[data-framer-name="Hero Section"] .framer-b49080 p,
[data-framer-name="Hero Section"] .framer-b49080 p span { color: #fff !important; -webkit-text-fill-color: #fff !important; }

/* Pause button for the scrolling logo row (WCAG 2.2.2). Quiet, top right of the section, hidden when motion is off. */
.framer-olbck2 { position: relative; }
.crux-ticker-pause { position: absolute; top: 14px; right: 16px; z-index: 3; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 0; border: 1px solid #ffffff24; border-radius: 50%; background: #ffffff0d; color: #b4bfd0; cursor: pointer; transition: color 160ms ease, border-color 160ms ease; }
.crux-ticker-pause:hover { color: #fff; border-color: #ffffff4d; }
.crux-ticker-pause:focus-visible { outline: 2px solid #a5d8ff; outline-offset: 2px; }
.crux-ticker-pause-ic { width: 12px; height: 12px; fill: currentColor; }
.crux-ticker-pause-ic .pl { display: none; }
.crux-ticker-pause[aria-pressed="true"] .crux-ticker-pause-ic .p { display: none; }
.crux-ticker-pause[aria-pressed="true"] .crux-ticker-pause-ic .pl { display: inline; }
.framer-olbck2 .crux-ticker-track.is-paused { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) { .crux-ticker-pause { display: none; } }