/* ═══════════════════════════════════════════════════════════
   Contrast option (WCAG)
   1. Toggle button, shown on every page.
   2. html[data-contrast="high"]: an AAA palette (7:1 for text,
      3:1 or better for borders and controls, visible focus rings).
   Loaded last on every page so it wins over the page stylesheet.
═══════════════════════════════════════════════════════════ */

/* ── 0. Visually-hidden utility (headings for screen-reader structure) ── */
.sr-only {
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* ── Skip-to-content link: hidden until keyboard-focused ── */
.skip-link {
  position:absolute; top:-60px; left:12px; z-index:1000;
  background:#111; color:#fff; padding:12px 20px; border-radius:8px;
  font:600 14px/1 inherit; text-decoration:none;
  transition:top .15s;
}
.skip-link:focus { top:12px; outline:3px solid #FFD400; outline-offset:2px; }

/* ── 1. Toggle button ── */
.a11y-toggle {
  display:inline-flex; align-items:center; gap:8px;
  padding:7px 14px 7px 11px;
  border:1.5px solid #767676; border-radius:100px;
  background:transparent; color:#0D0C09;
  font-family:inherit; font-size:12.5px; font-weight:600; line-height:1; letter-spacing:.01em;
  cursor:none; white-space:nowrap;
  transition:background .2s, color .2s, border-color .2s;
}
.a11y-toggle:hover { background:rgba(13,12,9,.06); }
.a11y-toggle:focus-visible { outline:2px solid #556B51; outline-offset:3px; }
.a11y-toggle[aria-pressed="true"] { background:#000; color:#fff; border-color:#000; }
.a11y-toggle-m { width:100%; max-width:320px; justify-content:center; margin-top:18px; padding:13px 20px; font-size:15px; }
.a11y-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
@media (hover:none) { .a11y-toggle { cursor:pointer; } }

/* ── 2. High-contrast palette ── */
html[data-contrast="high"] {
  --bg:#FFFFFF; --bg2:#F5F5F5; --bg3:#E8E8E8; --white:#FFFFFF;
  --ink:#000000;
  --ink-70:#1A1A1A;             /* 14:1 or better on every surface */
  --ink-50:#3A3A3A;             /* 9:1 */
  --ink-30:#474747;             /* 7.6:1 */
  --ink-15:#6E6E6E;             /* borders: 4.2:1 or better */
  --rule:#6E6E6E;
  --rule-lt:#8C8C8C;
  /* accent: sage, darkened to 8.6:1 on white */
  --coral:#3A5236; --coral-dk:#2A3F27; --coral-md:#D5E3D1;
  --sage:#3A5236;  --sage-bd:rgba(58,82,54,.75); --sage-fill:rgba(58,82,54,.9);
  --nav-accent:#3A5236; --nav-accent-dk:#2A3F27;
  --shadow-coral:0 8px 28px rgba(0,0,0,.25);
  /* secondary accents */
  --indigo:#2E2596; --green:#0B4F25; --amber:#7A3705;
}
html[data-contrast="high"] body { background:#fff; color:#000; }

/* solid navigation, no blur */
html[data-contrast="high"] .nav { background:#fff; -webkit-backdrop-filter:none; backdrop-filter:none; border-bottom:2px solid #000; }
html[data-contrast="high"] .nav-mobile { background:#fff; -webkit-backdrop-filter:none; backdrop-filter:none; }
html[data-contrast="high"] .nav-link { color:#000; text-decoration:underline; text-underline-offset:5px; }
html[data-contrast="high"] .nav-link::after { display:none; }

/* links inside content are underlined */
html[data-contrast="high"] :is(p, li, dd, .footer-nav) a:not([class*="btn"]):not([class*="cta"]) {
  text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:2px;
}

/* buttons: white text on the dark accent, plus a visible edge */
html[data-contrast="high"] :is(.btn-primary, .nav-cta, .nm-cta, .proj-btn) { color:#fff !important; text-decoration:none; }
html[data-contrast="high"] :is(.btn-secondary) { border:2px solid #000; color:#000; }
html[data-contrast="high"] .a11y-toggle { border-color:#000; color:#000; cursor:pointer; }
html[data-contrast="high"] .a11y-toggle[aria-pressed="true"] { background:#000; color:#fff; }

/* focus ring visible on light and dark surfaces */
html[data-contrast="high"] :focus-visible {
  outline:3px solid #FFD400 !important; outline-offset:0 !important;
  box-shadow:0 0 0 6px #000 !important;
}

/* use the normal system cursor */
html[data-contrast="high"] #cursor { display:none !important; }
html[data-contrast="high"] *, html[data-contrast="high"] *::before, html[data-contrast="high"] *::after { cursor:auto !important; }
html[data-contrast="high"] :is(a, button, [role="button"], summary, label, select) { cursor:pointer !important; }

/* no text shadows or faded text */
html[data-contrast="high"] * { text-shadow:none !important; }

/* ── Generated: hard-coded text colours that miss 7:1, raised for high-contrast mode ── */
html[data-contrast="high"] .eyebrow.on-dark,
html[data-contrast="high"] .np-label,
html[data-contrast="high"] .np-sub,
html[data-contrast="high"] .hs-navbar-links span,
html[data-contrast="high"] .hs-msg-head-sub,
html[data-contrast="high"] .ds-close-stat .ts-lbl,
html[data-contrast="high"] .cta-eyebrow,
html[data-contrast="high"] .cta-social,
html[data-contrast="high"] .cs-breadcrumb,
html[data-contrast="high"] .cs-breadcrumb a,
html[data-contrast="high"] .cs-breadcrumb span,
html[data-contrast="high"] .cs-hero-hl .sub,
html[data-contrast="high"] .cs-hero-sub,
html[data-contrast="high"] .cs-meta-lbl,
html[data-contrast="high"] .w-dark .w-lead,
html[data-contrast="high"] .w-dark .w-legend span,
html[data-contrast="high"] .w-dark .w-sub p,
html[data-contrast="high"] .w-sim p.sm,
html[data-contrast="high"] .w-hero-facts dt,
html[data-contrast="high"] .admin-feature-desc,
html[data-contrast="high"] .ds-a11y-stat .ts-lbl,
html[data-contrast="high"] .imp-desc,
html[data-contrast="high"] .ps-snap-card.is-problem .ps-snap-label,
html[data-contrast="high"] .ps-snap-card.is-problem .ps-snap-body,
html[data-contrast="high"] .ps-snap-tag,
html[data-contrast="high"] .screens-header .eyebrow,
html[data-contrast="high"] .screens-subline,
html[data-contrast="high"] .sc-index,
html[data-contrast="high"] .sc-desc,
html[data-contrast="high"] .sc-img-tag,
html[data-contrast="high"] .screens-note-icon,
html[data-contrast="high"] .screens-note-text,
html[data-contrast="high"] .figma-tree,
html[data-contrast="high"] .figma-tree .branch,
html[data-contrast="high"] .figma-tree .leaf-note,
html[data-contrast="high"] .oc-body { color:#FFFFFF !important; }
html[data-contrast="high"] .amv-mock .status-chip.cancel { color:#7B382C !important; }
html[data-contrast="high"] .amv-mock .wfp-card h4,
html[data-contrast="high"] .amv-mock .wfp-pill,
html[data-contrast="high"] .amv-mock .wfp-badge,
html[data-contrast="high"] .amv-mock .wfp-addr,
html[data-contrast="high"] .amv-mock .wfp-cta { color:#474A4C !important; }
html[data-contrast="high"] .amv-mock .wfp-note { color:#454748 !important; }
html[data-contrast="high"] .work-feature-tag.violet,
html[data-contrast="high"] .work-caption-tag.violet,
html[data-contrast="high"] .hs-status.violet { color:#5D22B8 !important; }
html[data-contrast="high"] .cts-pill .cts-wcag { color:#0E5328 !important; }
html[data-contrast="high"] .cts-pill .cts-wcag.fail,
html[data-contrast="high"] .hs-status.amber,
html[data-contrast="high"] .flow-step.trust,
html[data-contrast="high"] .flow-vnode.trust .flow-vnode-dot { color:#644600 !important; }
html[data-contrast="high"] .hs-status.lav,
html[data-contrast="high"] .flow-step.check,
html[data-contrast="high"] .flow-vnode.check .flow-vnode-dot { color:#5729A6 !important; }
html[data-contrast="high"] .mw-url span,
html[data-contrast="high"] .mw-k { color:#000000 !important; }
html[data-contrast="high"] .add { color:#624800 !important; }
html[data-contrast="high"] .vi-status.purple { color:#6026A4 !important; }
html[data-contrast="high"] .cts-pill .cts-wcag.fail { color:#793902 !important; }
@media print {
html[data-contrast="high"] .ats-loc,
html[data-contrast="high"] .ats-products { color:#484848 !important; }
}