/*
 * Club Millionaire public-site accessibility remediation.
 * Loaded after legacy styles so the accessible colour system wins consistently.
 * Colour pair checks: #4A2C1A / #FFFFFF = 12.60:1; #242424 / #FFFFFF = 15.37:1.
 */
:root {
  --cm-ink: #242424;
  --cm-brand: #4a2c1a;
  --cm-brand-strong: #1e0e05;
  --cm-paper: #ffffff;
  --cm-soft: #f5ebe2;
  --cm-muted: #595959;
  --cm-danger: #8b0000;
  --cm-focus: #1e0e05;
}

html { scroll-behavior: auto; }
body { color: var(--cm-ink); background: var(--cm-paper); }
p, li, label, input, textarea, select { color: var(--cm-ink); }

/* Links retain their purpose without relying on colour alone. */
a:not(.carousel-control) {
  color: var(--cm-brand);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}
a:not(.carousel-control):hover,
a:not(.carousel-control):focus { color: var(--cm-brand-strong); text-decoration-thickness: 2px; }

/* Clear keyboard focus without permanent boxes around controls. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex="0"]:focus-visible {
  outline: 3px solid #005fcc !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 2px #fff !important;
}

/* Header, search and page title. */
.top-right .login,
.top-right .login:visited { color: var(--cm-brand) !important; }
.top-right .login:hover,
.top-right .login:focus { color: var(--cm-brand-strong) !important; }
.top-navbar a,
.top-navbar a:hover,
.top-navbar a:focus { color: #fff !important; }
#site-search {
  color: var(--cm-ink) !important;
  background: #fff !important;
  border: 2px solid var(--cm-brand) !important;
}
#site-search::placeholder { color: var(--cm-muted) !important; opacity: 1 !important; }
#search-toggle { min-width: 44px; min-height: 44px; }

.page-title .inner { background: var(--cm-brand) !important; }
.page-title h1,
.page-title h3 { color: #fff !important; font-family: 'Titillium Web', Arial, sans-serif; font-size: 35px; line-height: 1.25; }

/* Carousel: solid caption panel and compact controls — never full-height click boxes. */
.carousel-caption {
  background: var(--cm-brand-strong) !important;
  padding: 18px 22px !important;
  max-width: min(760px, 72vw);
}
.carousel-caption h2 { color: #fff !important; text-shadow: none !important; }
#myCarousel .carousel-control {
  position: absolute !important;
  top: 50% !important;
  bottom: auto !important;
  z-index: 5 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  padding: 0 !important;
  transform: translateY(-50%) !important;
  border: 2px solid #fff !important;
  border-radius: 50% !important;
  background-color: var(--cm-brand-strong) !important;
  background-image: none !important;
  color: #fff !important;
  opacity: 1 !important;
  line-height: 1 !important;
  text-shadow: none !important;
}
#myCarousel .carousel-control.left { left: 22px !important; right: auto !important; }
#myCarousel .carousel-control.right { right: 22px !important; left: auto !important; }
#myCarousel .carousel-control:hover,
#myCarousel .carousel-control:focus { background-color: var(--cm-brand) !important; }
#myCarousel .carousel-control .glyphicon-chevron-left,
#myCarousel .carousel-control .glyphicon-chevron-right,
#myCarousel .carousel-control .icon-next,
#myCarousel .carousel-control .icon-prev {
  position: static !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  width: 20px !important;
  height: 20px !important;
  max-width: 20px !important;
  margin: 0 !important;
}
#home-carousel-pause,
.carousel-pause-btn {
  position: absolute !important;
  z-index: 5 !important;
  bottom: 16px !important;
  left: 50% !important;
  width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  padding: 0 !important;
  transform: translateX(-50%) !important;
  border: 2px solid #fff !important;
  border-radius: 50% !important;
  background: var(--cm-brand-strong) !important;
  color: #fff !important;
  box-shadow: none !important;
}
#home-carousel-pause::before,
.carousel-pause-btn::before {
  content: '❚❚';
  display: inline-block;
  color: #fff;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  transform: translateX(1px);
}
#home-carousel-pause[aria-pressed="true"]::before,
.carousel-pause-btn[aria-pressed="true"]::before {
  content: '▶';
  font-size: 16px;
  letter-spacing: 0;
  transform: translateX(1px);
}
#home-carousel-pause:hover,
#home-carousel-pause:focus,
.carousel-pause-btn:hover,
.carousel-pause-btn:focus { background: var(--cm-brand) !important; color: #fff !important; }

/* Main cards and current hover state. */
.single-icon-box:hover,
.single-icon-box:focus-within { background-color: var(--cm-brand) !important; }
.single-icon-box:hover h2,
.single-icon-box:hover p,
.single-icon-box:hover li,
.single-icon-box:hover .home-card-title,
.single-icon-box:focus-within h2,
.single-icon-box:focus-within p,
.single-icon-box:focus-within li,
.single-icon-box:focus-within .home-card-title { color: #fff !important; }
.single-icon-box:hover svg,
.single-icon-box:focus-within svg { fill: #fff !important; }
.single-icon-box:hover li::before,
.single-icon-box:focus-within li::before { color: #fff !important; }

/* Remove every legacy gold-on-white or white-on-gold pair. */
.careers-wrap h5 a,
.single-contact i,
.career-contact-link,
.job-modal-trigger,
.timeline-year,
.investment-wrap h2,
.portfolio-wrap h4,
.map-wrap h3,
.single-team h3,
.single-team h5,
.experince-text h5,
.option-single h3,
.option-single h5,
.option-single .option-label,
.option-single .option-title,
.circle-h3,
.home-card-title,
.single-icon-box h2,
.single-cross-icons h4,
.investment-single-counter p { color: var(--cm-brand) !important; }
.careers-wrap h5 a:hover,
.career-contact-link:hover,
.job-modal-trigger:hover,
.job-modal-trigger:focus { color: var(--cm-brand-strong) !important; }

/* Forms: text, placeholder, error text, borders and buttons all pass AA. */
.form-control,
input,
textarea,
select {
  color: var(--cm-ink) !important;
  background: #fff !important;
  border: 2px solid var(--cm-brand) !important;
}
.form-control::placeholder,
input::placeholder,
textarea::placeholder { color: var(--cm-muted) !important; opacity: 1 !important; }
.required-note { color: var(--cm-ink) !important; }
.required-star,
.field-error,
.form-control[aria-invalid="true"] + .field-error { color: var(--cm-danger) !important; }
.form-control[aria-invalid="true"] { border-color: var(--cm-danger) !important; }
.btn-default,
button.btn-default,
input[type="submit"],
input[type="button"] {
  color: #fff !important;
  background: var(--cm-brand) !important;
  border: 2px solid var(--cm-brand) !important;
  min-height: 44px;
}
.btn-default:hover,
.btn-default:focus,
button.btn-default:hover,
button.btn-default:focus,
input[type="submit"]:hover,
input[type="submit"]:focus { background: var(--cm-brand-strong) !important; border-color: var(--cm-brand-strong) !important; }

/* FAQ/callout cards have one consistent AA colour pair. */
.faq-wrap .single-faq,
.single-faq0,
.single-faq1,
.single-faq2,
.single-faq3,
.single-faq4,
.single-faq5,
.single-faq6 {
  background: var(--cm-brand) !important;
  color: #fff !important;
  border: 2px solid var(--cm-brand) !important;
}
.faq-wrap .single-faq h1,
.faq-wrap .single-faq h2,
.faq-wrap .single-faq h3,
.faq-wrap .single-faq h4,
.faq-wrap .single-faq p,
.faq-wrap .single-faq li,
.faq-wrap .single-faq b,
.faq-wrap .single-faq a,
.single-faq0 h1,
.single-faq0 h2,
.single-faq0 h3,
.single-faq0 h4,
.single-faq0 p,
.single-faq0 li,
.single-faq0 b,
.single-faq0 a,
.single-faq1 h1,
.single-faq1 h2,
.single-faq1 h3,
.single-faq1 h4,
.single-faq1 p,
.single-faq1 li,
.single-faq1 b,
.single-faq1 a,
.single-faq2 h1,
.single-faq2 h2,
.single-faq2 h3,
.single-faq2 h4,
.single-faq2 p,
.single-faq2 li,
.single-faq2 b,
.single-faq2 a,
.single-faq3 h1,
.single-faq3 h2,
.single-faq3 h3,
.single-faq3 h4,
.single-faq3 p,
.single-faq3 li,
.single-faq3 b,
.single-faq3 a,
.single-faq4 h1,
.single-faq4 h2,
.single-faq4 h3,
.single-faq4 h4,
.single-faq4 p,
.single-faq4 li,
.single-faq4 b,
.single-faq4 a,
.single-faq5 h1,
.single-faq5 h2,
.single-faq5 h3,
.single-faq5 h4,
.single-faq5 p,
.single-faq5 li,
.single-faq5 b,
.single-faq5 a,
.single-faq6 h1,
.single-faq6 h2,
.single-faq6 h3,
.single-faq6 h4,
.single-faq6 p,
.single-faq6 li,
.single-faq6 b,
.single-faq6 a {
  color: #fff !important;
}
.faq-wrap .single-faq a,
.single-faq0 a,
.single-faq1 a,
.single-faq2 a,
.single-faq3 a,
.single-faq4 a,
.single-faq5 a,
.single-faq6 a { text-decoration: underline !important; }
.faq-wrap .single-faq li::before,
.single-faq0 li::before,
.single-faq1 li::before,
.single-faq2 li::before,
.single-faq3 li::before,
.single-faq4 li::before,
.single-faq5 li::before,
.single-faq6 li::before { color: #fff !important; }

/* The circular fee callout contains text, so it cannot depend on its image. */
.circle-wrap { background-image: none !important; background-color: var(--cm-brand) !important; }
.circle-wrap h2,
.fee-structure-callout { color: #fff !important; }

/* Dialog content and document links. */
.modal-content,
.cm-image-dialog__panel { color: var(--cm-ink) !important; background: #fff !important; }
.modal-header,
.modal-title { color: var(--cm-brand-strong) !important; }
.modal-body a { color: var(--cm-brand) !important; }
.cm-image-dialog__close,
.cm-image-dialog__nav { color: var(--cm-brand-strong) !important; border-color: var(--cm-brand) !important; }

/* Footer overrides must keep white text and underlines on a dark surface. */
footer,
.bottom-footer { background-color: var(--cm-brand-strong) !important; background-image: none !important; color: #fff !important; }
footer p,
footer li,
footer h2,
footer a,
.footer-legal-links,
.bottom-footer p,
.bottom-footer a { color: #fff !important; }
footer a,
.bottom-footer a { text-decoration: underline !important; text-underline-offset: 2px; }
footer a:hover,
footer a:focus,
.bottom-footer a:hover,
.bottom-footer a:focus { color: #fff !important; text-decoration-thickness: 2px; }

/* The document-type disclosure is visible to assistive technologies only. */
.cm-file-meta { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }

/* BSE-style compact accessibility toolbar: normal document flow; no floating overlay. */
.cm-a11y-toolbar {
  width: 100%;
  min-height: 42px;
  background: #fff;
  border-bottom: 1px solid #dedede;
  color: #111;
  font-family: Arial, Helvetica, sans-serif;
}
.cm-a11y-toolbar__inner {
  display: flex;
  align-items: center;
  min-height: 42px;
  width: 100%;
  padding: 0 12px;
  box-sizing: border-box;
  gap: 2px;
}
.cm-a11y-toolbar a.cm-skip-link {
  display: inline-flex;
  box-sizing: border-box;
  align-items: center;
  min-height: 42px;
  padding: 8px 12px 8px 0;
  color: #111 !important;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none !important;
}
.cm-a11y-toolbar a.cm-skip-link:hover { text-decoration: underline !important; }
.cm-a11y-toolbar__divider {
  width: 1px;
  height: 22px;
  margin: 0 6px 0 4px;
  background: #c7c7c7;
}
.cm-a11y-toolbar__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  min-height: 32px;
  margin: 0;
  padding: 4px 5px;
  border: 0;
  border-radius: 2px;
  background: transparent;
  color: #111;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 17px;
  line-height: 1;
  cursor: pointer;
}
.cm-a11y-toolbar__button:hover { background: #f2f2f2; color: #000; }
.cm-a11y-toolbar__button.is-active { background: #111; color: #fff; }
.cm-a11y-toolbar__contrast { font-size: 23px; }
.cm-a11y-toolbar__text { font-size: 17px; }
.cm-a11y-toolbar__text--reset {
  color: #b00020;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}
.cm-a11y-toolbar__button:focus-visible,
.cm-a11y-toolbar a.cm-skip-link:focus-visible {
  outline: 3px solid #005fcc !important;
  outline-offset: -2px !important;
  box-shadow: none !important;
}
.cm-a11y-status {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Toolbar modes. The toolbar itself remains stable and usable in every mode. */
html.cm-a11y-font-small body > *:not(.cm-a11y-toolbar) { font-size: 87.5%; }
html.cm-a11y-font-large body > *:not(.cm-a11y-toolbar) { font-size: 112.5%; }
html.cm-a11y-high-contrast body > *:not(.cm-a11y-toolbar) { background-color: #fff !important; color: #000 !important; }
html.cm-a11y-high-contrast body > *:not(.cm-a11y-toolbar) * { background-color: #fff !important; color: #000 !important; border-color: #000 !important; text-shadow: none !important; box-shadow: none !important; }
html.cm-a11y-high-contrast body > *:not(.cm-a11y-toolbar) a { color: #0000a8 !important; text-decoration: underline !important; }
html.cm-a11y-high-contrast body > *:not(.cm-a11y-toolbar) img,
html.cm-a11y-high-contrast body > *:not(.cm-a11y-toolbar) svg { filter: grayscale(1) contrast(1.2) !important; }
html.cm-a11y-high-contrast .cm-a11y-toolbar { background: #000 !important; border-color: #fff !important; color: #fff !important; }
html.cm-a11y-high-contrast .cm-a11y-toolbar a.cm-skip-link,
html.cm-a11y-high-contrast .cm-a11y-toolbar__button { color: #fff !important; }
html.cm-a11y-high-contrast .cm-a11y-toolbar__divider { background: #fff !important; }
html.cm-a11y-high-contrast .cm-a11y-toolbar__button:hover,
html.cm-a11y-high-contrast .cm-a11y-toolbar__button.is-active { background: #fff !important; color: #000 !important; }
html.cm-a11y-high-contrast .cm-a11y-toolbar__text--reset { text-decoration-color: #fff !important; }

@media (max-width: 767px) {
  .cm-a11y-toolbar a.cm-skip-link { font-size: 14px; }
  #myCarousel .carousel-control.left { left: 12px !important; }
  #myCarousel .carousel-control.right { right: 12px !important; }
  .carousel-caption { max-width: calc(100vw - 110px); left: 55px !important; right: 55px !important; padding: 12px !important; }
  .carousel-caption h2 { font-size: 22px !important; line-height: 1.3 !important; letter-spacing: 0 !important; }
}