/* ==========================================================================
   Accessibility - colour contrast (WCAG 2.1 AA, 4.5:1 for normal text)
   Loaded last on every page. Found with axe-core; every rule below fixes a reported "color-contrast" failure.

   1. Brand red used for SMALL text (#ed1c24 on white = 4.38:1) becomes #e01a22 (4.84:1) - visually the same red.
   2. Scroll-dimmed items (inactive cards / list items) used 15-55% opacity (contrast 1.2-3:1). They now keep full
      opacity and use grey text (#6f6f6f = 5.0:1 on white) instead, so inactive vs. active is still clearly
      distinguishable (grey vs. near-black + border/ticks) but remains readable.
   To go back to the faint look, remove the <link> to this file - nothing else depends on it.
   ========================================================================== */

:root {
  --mkb-red-text: #e01a22;
  --mkb-dim-text: #6f6f6f;
}

/* ---- 1. small red text ---- */
html body .nav-flip-link.active .nav-text-top,
html body .header-nav-drawer .nav-flip-link.active .nav-text-top,
html body .strategic-card-num,
html body .strategic-card.active .strategic-card-num,
html body .technology-service-card .card-eyebrow,
html body .eyebrow-inner {
  color: var(--mkb-red-text) !important;
}

/* ---- 2a. strategic cards (Strategy / Implementation / Sectors services) ---- */
html body .strategic-card,
html body .strategic-card[data-sr].sr-visible:not(.active) {
  opacity: 1 !important;
}

html body .strategic-card:not(.active) .strategic-card-title,
html body .strategic-card:not(.active) .strategic-card-desc {
  color: var(--mkb-dim-text) !important;
}

html body .strategic-card:not(.active) .strategic-card-num {
  color: #b3141b !important;
}

/* ---- 2b. perspectives topics ---- */
html body .thinking-topic-card,
html body .thinking-topic-card[data-sr].sr-visible:not(.active):not(.is-active) {
  opacity: 1 !important;
}

html body .thinking-topic-card:not(.active):not(.is-active) .thinking-topic-heading,
html body .thinking-topic-card:not(.active):not(.is-active) .thinking-topic-text {
  color: var(--mkb-dim-text) !important;
}

/* ---- 2c. L'Esprit MKB principle cards ---- */
html body .lesprit-card,
html body .lesprit-card[data-sr].sr-visible:not(.active) {
  opacity: 1 !important;
}

html body .lesprit-card:not(.active) .card-eyebrow,
html body .lesprit-card:not(.active) .card-title {
  color: var(--mkb-dim-text) !important;
}

/* ---- 2d. home: capability list ---- */
html body .cap-card-box {
  opacity: 1 !important;
}

html body .cap-card-box:not(.active):not(.flicker-dark) .cap-card-num,
html body .cap-card-box:not(.active):not(.flicker-dark) .cap-card-title,
html body .cap-card-box:not(.active):not(.flicker-dark) .cap-card-desc {
  color: var(--mkb-dim-text) !important;
}

html body .cap-card-box.active .cap-card-desc {
  color: #5e5e5e !important;
}

/* ---- 2e. home: depth cards ---- */
html body #depth .depth-card,
html body .depth-card {
  opacity: 1 !important;
}

html body #depth .depth-card:not(.is-active) .depth-card-body,
html body .depth-card:not(.is-active) .depth-card-body {
  opacity: 1 !important;
}

html body .depth-card:not(.is-active) .depth-card-title {
  color: #5e5e5e !important;
}

html body .depth-card:not(.is-active) .depth-card-desc {
  color: var(--mkb-dim-text) !important;
}

/* ---- 2f. technology: principles checklist (before an item is checked / active) ---- */
html body .technology-capability-item:not(.is-active):not(.is-checked):not(:hover) .item-text {
  color: var(--mkb-dim-text) !important;
}

/* ---- 3. other small grey text ---- */
html body .hero-prop-text,
html body .hero-copy p.hero-prop-text {
  color: #66666b !important;
}

/* ==========================================================================
   Touch targets on phones/tablets (WCAG 2.2 target size: at least 24 x 24 CSS px)
   ========================================================================== */
@media (max-width: 1024px) {
  html body .mobile-menu-btn {
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 12px 8px !important;
    box-sizing: border-box !important;
    justify-content: space-between !important;
  }

  html body footer a,
  html body .footer-col a {
    display: inline-block !important;
    padding: 5px 0 !important;
    min-height: 28px !important;
  }

  html body .mkb-breadcrumb-link {
    padding: 6px 0 !important;
    min-height: 26px !important;
    box-sizing: border-box !important;
  }

  html body .form-consent-checkbox {
    min-width: 24px !important;
    min-height: 24px !important;
  }

  html body .form-consent-text a {
    display: inline-block !important;
    padding: 4px 0 !important;
  }
}

/* the off-screen anti-spam honeypot is still reported as a tiny control */
#_mkb_sec_hp {
  width: 24px !important;
  height: 24px !important;
}
