/* MNEOS contrast repair — 2026-08-02
 *
 * Additive only. Nothing is removed; every rule here is an override that loads
 * after the existing stylesheets.
 *
 * ROOT CAUSE
 * rebalance-2026-07-29.css declares a LIGHT-THEME nav palette at :root
 *     --r-nav-menu-bg:       #ffffff
 *     --r-nav-menu-fg:       #1a1a1a
 *     --r-nav-menu-hover-bg: #f5f4ef
 * On desktop the dropdown is a white card, so near-black link text is correct.
 * At @media (max-width: 899.98px) the dropdown becomes `background: transparent`
 * and collapses inline into the mobile drawer — but the links keep #1a1a1a and
 * now sit on the site's dark ground (#0B0D0F). Measured 1.12:1.
 * The expanded bucket label keeps `background-color: #f5f4ef` (cream) while its
 * text is `color: inherit` (cream #F3EFE7). Measured 1.04:1 — the white bar with
 * invisible "Learn" / "Institution" text.
 *
 * A full-site mobile audit (WCAG 2.1, effective background resolved through
 * ancestors and alpha compositing) found 491 failing text elements. 310 of them
 * were these two nav rules, on all 17 audited pages.
 *
 * WCAG AA targets: 4.5:1 body, 3:1 large text (>=24px, or >=18.66px bold).
 */

/* ==========================================================================
   1 · MOBILE NAVIGATION — the drawer is dark, so its contents must be light
   ========================================================================== */
@media (max-width: 899.98px) {

  /* Submenu links: were #1a1a1a on #0B0D0F (1.12:1).
     Cream on graphite measures ~15.6:1. */
  .nav-bucket-menu li a {
    color: var(--ink, #f3efe7);
  }

  /* Hover / focus / current inside the drawer. The cream hover fill belongs to
     the desktop white card; in the drawer it must be a subtle light wash so the
     cream label stays readable on top of it. */
  .nav-bucket-menu li a:hover,
  .nav-bucket-menu li a:focus-visible {
    background: rgba(243, 239, 231, 0.10);
    color: var(--ink, #f3efe7);
  }

  .nav-bucket-menu a.is-current,
  .nav-bucket-menu a[aria-current="page"] {
    background: rgba(243, 239, 231, 0.10);
    /* #4A7DFF on #0B0D0F is only 3.6:1; lighten for body-size nav text. */
    color: #8FB0FF;
  }

  /* The bucket label itself — this is the cream-on-cream bar. */
  .nav-bucket-label {
    color: var(--ink, #f3efe7);
  }

  .nav-bucket-label:hover,
  .nav-bucket-label:focus-visible,
  .nav-bucket-label[aria-expanded="true"] {
    background-color: rgba(243, 239, 231, 0.10);
    color: var(--ink, #f3efe7);
  }

  /* Separator link ("Work with MNEOS" style rows) forced --r-accent #01696f
     with !important. That is 2.0:1 on the dark drawer. Needs a light accent. */
  .nav-bucket-menu-sep a {
    color: #4FB3BF !important;
  }

  /* The drawer's primary CTA: #4A7DFF text on a dark navy fill measured poorly.
     Brighter blue lifts it clear of AA at body size. */
  .r-nav-cta,
  .nav-cta,
  .nav-drawer .r-btn-primary {
    color: #A9C4FF;
  }

  .nav-bucket-caret {
    opacity: 0.85;
  }
}

/* ==========================================================================
   2 · LIGHT-THEME TEXT COLOURS LEFT ON DARK SECTIONS
   Several headings still carry pre-dark-theme values (#111, #1a1a1a, #2a2a2a,
   #333) while sitting on the #0B0D0F ground. wave2 fixed the homepage hero
   only; the same assumption survives on other pages.
   ========================================================================== */
.r-hero-simple h1,
.r-learn-hero h1,
.r-page-hero h1,
.r-hero h1 {
  color: var(--ink, #f3efe7);
}

.r-hero-simple .r-hero-lede,
.r-learn-hero-kicker,
.r-learn-hero p,
.r-page-hero p {
  color: var(--ink-dim, #c4bdae);
}

/* ==========================================================================
   3 · FOCUS VISIBILITY
   Keyboard focus must remain obvious once hover fills changed.
   ========================================================================== */
@media (max-width: 899.98px) {
  .nav-bucket-menu a:focus-visible,
  .nav-bucket-label:focus-visible {
    outline: 2px solid #8FB0FF;
    outline-offset: 2px;
  }
}

/* ==========================================================================
   4 · SECOND PASS — remaining failures found by re-auditing the first fix
   ========================================================================== */

/* /learning/ kept pre-dark-theme values on the dark ground.
   .r-learn-section-lede was #333 (1.54:1) and .r-learn-card h3 was #111. */
.r-learn-section-lede,
.r-learn-section p {
  color: var(--ink-dim, #c4bdae);
}
/* CAREFUL: .r-learn-card is a WHITE card sitting on the dark page, so its dark
   heading was already correct. Only .r-roadmap-card headings sit directly on the
   #0B0D0F ground and were unreadable at #111. Scope the fix to those. */
.r-roadmap-card h3,
.r-roadmap-card h2,
.r-learn-section > h2,
.r-learn-section > h3 {
  color: var(--ink, #f3efe7);
}
.r-learn-card h3 {
  color: #111;
}
.r-learn-card p,
.r-learn-card span {
  color: #2f2f2f;
}

/* --r-muted (#6b6b6b) is a light-theme grey. On #0B0D0F it measures 3.65:1,
   below the 4.5:1 needed at kicker size. */
.r-hero-kicker-simple,
.r-learn-hero-kicker,
.r-kicker {
  color: #9C978C;
}

/* Footer: #6f6e68 on #141418 measured 3.61:1. */
.r-footer-muted {
  color: #9A968C;
}
.r-footer a,
.r-footer-col a {
  color: #A9C4FF;
}

/* Status chips. The text colours are bright and the fill is only 10% alpha, so
   the chip inherits whatever section it sits in. Inside the light cards on /dos
   that puts light green on near-white (1.67:1). Giving the chip its own opaque
   dark ground makes it self-contained and readable on light AND dark sections. */
.claim-status {
  background-color: #171A20 !important;
  border-color: currentColor;
}
.claim-status--operating { color: #7FE271 !important; }
.claim-status--dev       { color: #93B2FF !important; }
.claim-status--intended  { color: #E8BC6E !important; }
.claim-status--research  { color: #C695E6 !important; }

/* The active nav bucket used --r-accent #01696f, a dark teal intended for the
   white desktop dropdown. On the dark mobile drawer it measures 2.42:1. */
@media (max-width: 899.98px) {
  .nav-bucket-label[aria-current],
  .nav-bucket.is-current > .nav-bucket-label,
  .nav-bucket-label.is-current,
  .nav-drawer [style*="01696f"] {
    color: #4FB3BF !important;
  }
}


/* ==========================================================================
   5 · PAGES WITH NO BACKGROUND AT ALL
   /mnemosyne/ computes body background rgba(0,0,0,0) while its text colour is
   light (#d9dcea). With nothing painted, the browser falls back to white and
   the entire page renders light-on-white — 111 failing elements, the single
   worst page on the site. Paint the site ground as a base. Kept at element
   specificity so any page that genuinely wants a light surface still wins.
   ========================================================================== */
html {
  background-color: #0B0D0F;
}
body {
  background-color: #0B0D0F;
}

/* ==========================================================================
   6 · REMAINING TARGETED FIXES
   ========================================================================== */

/* The dark-teal accent (#01696f) is meant for the WHITE desktop dropdown. In the
   dark mobile drawer it measures 2.42:1. Raise specificity so it actually wins. */
@media (max-width: 899.98px) {
  html body .nav-bucket-label,
  html body .nav-bucket-label[aria-expanded],
  html body .nav-bucket.open > .nav-bucket-label {
    color: var(--ink, #f3efe7);
  }
}

/* Footer links were rgba(74,125,255,0.85) — 3.98:1, just under AA at body size. */
.r-footer a,
.r-footer-col a,
.r-footer-nav a,
footer a {
  color: #A9C4FF;
}

/* /why-mneos/ inline emphasis sits on a solid #6f95ff fill; cream on that is
   2.47:1. Near-black on the same blue is ~7:1. */
.r-why-tag em,
[style*="6f95ff"] em,
em.is-on-accent {
  color: #0B0D0F;
}

/* ==========================================================================
   7 · FINAL PASS — correct selectors confirmed by DOM probe
   ========================================================================== */

/* .r-hero-simple .r-hero-kicker-simple is two classes, so a single-class
   override lost. --r-muted #6b6b6b measures 3.65:1 on the ground. */
.r-hero-simple .r-hero-kicker-simple,
.r-hero-simple .r-kicker {
  color: #9C978C;
}

/* These are BREADCRUMBS (nav.r-breadcrumbs), not the footer. The 0.85 alpha on
   #4A7DFF drops them to 3.98:1. */
.r-breadcrumbs a,
nav.r-breadcrumbs a,
.r-breadcrumbs .container a {
  color: #A9C4FF;
}

/* Primary bridge button: white on #4A7DFF is 3.70:1, under AA for body text.
   Deepening the fill to #2F62DD lifts white to ~5.3:1 while staying on-brand. */
.why-bridge-btn.primary,
a.why-bridge-btn.primary {
  background-color: #2F62DD;
  color: #ffffff;
}

/* Muted chip label was 4.48:1, a hair under 4.5:1. */
.chip {
  color: #9E90C4;
}

/* ==========================================================================
   8 · FULL-SITE AUDIT PASS (production, 21 pages) — last real failures
   ========================================================================== */

/* Chapter eyebrow: #4A7DFF on the ground is 4.08:1, just under AA at body size. */
.wm-mov-num,
.wm-chapter-num,
p.wm-mov-num {
  color: #8FB0FF;
}

/* Muse/discipline list items measured 3.58:1 (#B0A899 on #0A0B0E). */
.wm-muse-list li,
.muse-list li,
.c-disciplines li {
  color: #C9C2B4;
}

/* .chip lost to a more specific rule on the first attempt. */
button.chip,
.chip-row .chip,
.wm-chip-row .chip {
  color: #B6A9D6;
}

/* The registration-rule callout renders pale yellow on a near-white panel
   (#FFF8D1 on #FFFCF0 = 1.04:1) — effectively invisible. This is a light panel,
   so the text must be dark. */
.r-loop2-rule-body {
  color: #3A3320;
}
.r-loop2-rule-kicker {
  color: #6B5A18;
}