/*
 * Colour-contrast fixes over live's Webflow styles (Brent, 2026-10-06: fix
 * the contrast issues). Loaded after Webflow's stylesheet on every page
 * (src/layouts/WebflowLayout.astro). Each rule names the pairing it fixes,
 * measured by axe-core on 24 pages at 1440 and 390 (WCAG 2.2 AA, 4.5:1 for
 * text this size); the replacement colours are the brand's own
 * (reference: Rooted identity, 2026-09-25, whose three named fixes are the
 * first three below).
 */

/* 1. Cerulean #3275DB as text on light grounds: 4.46 on white, 4.20 on
 *    #F8F8F8, 3.13-3.68 on the pill tints. -> royal #3B3EDB (5.09-7.25). */
.paragraph.blue,
.paragraph-large.normal-blue,
.pill-text,
.blue-link,
.highlight-blue,
.label-medium.blue,
.back-link,
.back-link div,
.w-richtext a {
  color: #3b3edb;
}

/* ...except on the dark legal pages (#141414), where cerulean is 4.12 and
 *    royal would be darker still -> bright #408CFF (5.63). */
.privacy-body .w-richtext a,
.privacy-body .w-richtext a strong {
  color: #408cff;
}

/* 2. The gradient button (royal -> cerulean -> sky): white text over the sky
 *    end is 1.91. -> solid royal (white 7.25). */
.button:not(.primary):not(.secondary):not(.stroke):not(.stroke-small):not(.text-link) {
  background-image: none;
  background-color: #3b3edb;
}

/* 3. The mint button (mint -> sky under a 15% black wash): white text is
 *    2.23-2.51. -> ink text #141414 (7.35-8.25). */
.button.primary,
.button.primary .button-inner-text,
.button.primary .button-inner-text-hover,
.button.primary [class*="arrow"] {
  color: #141414;
}

/* 4. Mint #3EE280 as a label on light grounds: 1.59-1.69. -> deep mint,
 *    darkened to clear 4.5 on #F8F8F8 too: #137A42 (5.08 / 5.40). Light
 *    grounds are the sections Webflow marks color-mode="light"; on the dark
 *    ones mint is already fine (10.9) and deep mint would fail. */
[color-mode="light"] .label-big.green,
[color-mode="light"] .label-medium.green {
  color: #137a42;
}

/* 5. Bright #408CFF as a label on light grounds: 3.08-3.27. -> royal
 *    (on dark grounds bright is fine, 5.6, and royal would fail). */
[color-mode="light"] .label-big.blue {
  color: #3b3edb;
}

/* 6. Grey labels: "Industry:" etc., #858586 on white, 3.68 -> #6B6B6C
 *    (5.32); the footer's copyright line, #5B5B5B on #141414, 2.71 ->
 *    #8A8A8A (5.34). */
.case-study-item .label-medium:not(.white):not(.blue):not(.green) {
  color: #6b6b6c;
}
.reserved,
.reserved .copyright-year {
  color: #8a8a8a;
}

/* 7. The insights hub's "Browse the whole library" labels: the page's own
 *    style draws them in the text colour at 60% opacity, #999999 on #F8F8F8
 *    (2.68) -> #595959, full opacity (6.60). One more element in the
 *    selector, because that style comes later in the page. */
.hub-browse div.hub-browse-label {
  opacity: 1;
  color: #595959;
}

/* 8. Webflow's empty-list box ("No items found.", #F5F5F5 on #DDDDDD,
 *    1.24) is never content: an empty CMS list shows nothing. */
.w-dyn-empty {
  display: none;
}

/* 9. Tables in article bodies: Webflow's text colour for a table is the
 *    dark-theme white at 70%, so on an article's light page a table's text
 *    is invisible (#FDFDFD on #F8F8F8, 1.04; live has the same, found by the
 *    accessibility gate on what-is-ai-driven-talent-matching). -> the
 *    article paragraph colour, ink at 70% (5.9 on #F8F8F8). The dark legal
 *    pages keep their light text. */
.text-rich-text table {
  color: rgba(34, 34, 35, 0.7);
}
.privacy-body .text-rich-text table {
  color: inherit;
}