/* change menu button color | KS-20648042-hc */
#top nav > ul > .button_solid_color > a:before {
    background: yellow !important;
}
#header-outer[data-lhe="animated_underline"] #top nav >ul >li[class*="button_solid_color"] >a {
    color: #000 !important;
}
/*Change link color on covid-19 support page HC-20674580 */

body.page-id-6140 .vc_column-inner a{
    color:#444444;
}
/* Prevent word breaks globally */
* {
    word-break: normal;
    overflow-wrap: break-word;
    -webkit-hyphens: none;
    -moz-hyphens: none;
    -ms-hyphens: none;
    hyphens: none;
}
/* Resolves issue with mobile container */

@media only screen and (min-width :1px) and (max-width :999px) {
.container{max-width: var(--mobile-container-width) !important;}
}/* Protect images only */
img {
  pointer-events: none;
  -webkit-user-drag: none;
  user-select: none;
  -webkit-user-select: none;
}

/* ============================================
   Methodology page (12517) fine-tunes | LP 2026-06-01
   - Uniform 4:5 card images via .vc_col-sm-3 (only the cards row uses sm-3)
   - Soft purple outline on white diagrams so radius reads
   - Innovation Lab portrait via object-position
   - Pin Explore buttons to bottom of cards (flex)
   - Tighter dark-purple H2 highlight band
   ============================================ */

/* Cards row: uniform 4:5 portrait crop on all four card images */
body.page-id-12517 .vc_col-sm-3 img.img-with-animation {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 5 !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 20px !important;
}

/* Innovation Lab portrait crop: shift focus up so we see people, not floor */
body.page-id-12517 .vc_col-sm-3 img[src*="EventPhotography"] {
  object-position: center 30% !important;
}

/* White diagrams: soft purple outline so 20px radius is visible */
body.page-id-12517 .vc_col-sm-3 img[src*="OPEN-Method"],
body.page-id-12517 .vc_col-sm-3 img[src*="DISTIL-Method"],
body.page-id-12517 .vc_col-sm-3 img[src*="AFAR-Framework"],
body.page-id-12517 .vc_col-sm-3 img[src*="AFAR-Method"] {
  box-shadow: 0 0 0 1px rgba(91, 33, 182, 0.18), 0 2px 8px rgba(91, 33, 182, 0.06) !important;
}

/* Same outline on the larger OPEN diagram further up */
body.page-id-12517 .img-with-animation[src*="OPEN-Method"]:not(.vc_col-sm-3 *) {
  box-shadow: 0 0 0 1px rgba(91, 33, 182, 0.18), 0 4px 16px rgba(91, 33, 182, 0.08) !important;
}

/* Pin Explore button to the bottom of each card (uniform line) */
body.page-id-12517 .vc_col-sm-3 > .vc_column-inner {
  display: flex !important;
  flex-direction: column !important;
}
body.page-id-12517 .vc_col-sm-3 > .vc_column-inner > .wpb_wrapper {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
}
/* Make the wpb_text_column a flex container too, so the button inside can margin-top:auto */
body.page-id-12517 .vc_col-sm-3 .wpb_text_column {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
}
body.page-id-12517 .vc_col-sm-3 .wpb_text_column > a.nectar-button,
body.page-id-12517 .vc_col-sm-3 a.nectar-button {
  margin-top: auto !important;
}

/* Dark purple highlight band on the methods H2 — tighter padding */
body.page-id-12517 .nectar-highlighted-text[data-style="full_text"] {
  background-color: transparent !important;
  padding: 2px 10px !important;
  border-radius: 6px !important;
  display: inline-block !important;
  color: #7E22CE !important;
  box-decoration-break: clone !important;
  -webkit-box-decoration-break: clone !important;
  line-height: 1.15 !important;
}
body.page-id-12517 .nectar-highlighted-text[data-style="full_text"] h2 {
  color: #7E22CE !important;
}


/* Drop the methods H2 font size so the band fits on one line (was font_size_4vw) */
body.page-id-12517 .nectar-highlighted-text[data-style="full_text"].font_size_4vw {
  font-size: 2.4vw !important;
}
body.page-id-12517 .nectar-highlighted-text[data-style="full_text"].font_size_4vw h2 {
  font-size: 2.4vw !important;
  line-height: 1.2 !important;
}
@media (max-width: 999px) {
  body.page-id-12517 .nectar-highlighted-text[data-style="full_text"].font_size_4vw,
  body.page-id-12517 .nectar-highlighted-text[data-style="full_text"].font_size_4vw h2 {
    font-size: 28px !important;
  }
}


/* Methodology top image - keep square so it doesn't overflow text column | Claude */
body.page-id-12517 .first-section .hover-wrap-inner img { aspect-ratio: 1 / 1; width: 100%; height: auto; object-fit: cover; object-position: left center; }

/* Methodology page (12517) - 'Which method is right for you' image slim rectangle (top of image) | 2026-06-04 */
body.page-id-12517 img[src*="ian-kim"] {
    aspect-ratio: 2 / 1;
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center top;
}

/* GCX image fixes - dancing image anchor top + key image full/rounded */
img[src*="125A4867"] { object-fit: cover !important; object-position: top center !important; }
img[src*="2026/05/4.png"] { width: 100% !important; max-width: 100% !important; height: auto !important; border-radius: 16px !important; }
.wpb_column:has(img[src*="2026/05/4.png"]) .img-with-aniamtion-wrap, .wpb_column:has(img[src*="2026/05/4.png"]) .img-with-aniamtion-wrap .inner, .wpb_column:has(img[src*="2026/05/4.png"]) .hover-wrap, .wpb_column:has(img[src*="2026/05/4.png"]) .hover-wrap-inner { width: 100% !important; }
.wpb_column:has(img[src*="2026/05/4.png"]) .column-bg-overlay { background-color: transparent !important; background-image: none !important; }

/* Keep headings from breaking mid-word | fix */
h1, h2, h3, h4, h5, h6, .nectar-highlighted-text { overflow-wrap: normal !important; word-wrap: normal !important; word-break: keep-all !important; }

/* Password-protected pages: calm the password field (was theme pink) */
.post-password-form input[type="password"] { background: #f7f8fb !important; border: 1px solid #cfd4d8 !important; color: #222222 !important; border-radius: 4px; padding: 12px 14px; }
.post-password-form input[type="password"]:focus { border-color: #2DB9E8 !important; outline: none; background: #ffffff !important; }

/* === Silence of the System landing page (13243). Lives here so WPBakery cannot strip it. === */
.page-id-13243 .gcx-lp-hero img, .page-id-13243 .wpb_row.top-level img.img-with-animation { max-height: 400px; width: 100%; object-fit: cover; object-position: center 42%; border-radius: 8px; }
.page-id-13243 .gcx-mobile-cta { display: none; }
.page-id-13243 .gcx-mobile-cta a { display: block; text-align: center; background: #2DB9E8; color: #ffffff !important; padding: 14px 20px; border-radius: 6px; font-weight: 600; font-size: 17px; text-decoration: none; }
@media (max-width: 999px) {
.page-id-13243 .wpb_row.top-level img.img-with-animation { max-height: 150px; width: 100%; object-fit: cover; object-position: center 38%; border-radius: 8px; }
.page-id-13243 .gcx-mobile-cta { display: block; margin: 14px 0 10px; }
.page-id-13243 .gcx-mobile-cta a { padding: 17px 20px; line-height: 1.2; min-height: 54px; box-sizing: border-box; }
}
.page-id-13243 .gcx-lp-left { padding-right: 56px; }
.page-id-13243 .gcx-lp-left .wpb_wrapper { max-width: 640px; }
.page-id-13243 .gcx-lp-form > .vc_column-inner > .wpb_wrapper { background: #f7f8fb; border: 1px solid #e6e9ef; border-radius: 12px; padding: 30px 28px; position: sticky; top: 110px; }
@media (max-width: 999px) {
.page-id-13243 .gcx-lp-left { padding-right: 0; }
.page-id-13243 .gcx-lp-left .wpb_wrapper { max-width: none; }
.page-id-13243 .gcx-lp-form > .vc_column-inner > .wpb_wrapper { position: static; }
}
.page-id-13243 .mc4wp-form-fields input[type="text"], .page-id-13243 .mc4wp-form-fields input[type="email"] { background: #ffffff !important; border: 1px solid #cfd4d8 !important; color: #222222 !important; padding: 12px 14px; width: 100%; border-radius: 4px; box-shadow: none !important; font-size: 16px; }
.page-id-13243 .mc4wp-form-fields input[type="text"]:focus, .page-id-13243 .mc4wp-form-fields input[type="email"]:focus { border-color: #2DB9E8 !important; outline: none; }
.page-id-13243 .mc4wp-form-fields label { display: block; margin-bottom: 6px; font-weight: 500; color: #222222; }
.page-id-13243 .mc4wp-form-fields p { margin-bottom: 16px; }
.page-id-13243 .mc4wp-form-fields input[type="submit"] { width: 100%; padding: 14px 18px; font-weight: 600; margin-top: 6px; }
.page-id-13243 .gcx-lp-form .mc4wp-form { margin-bottom: 0; }
.page-id-13243 .gcx-lp-form .mc4wp-form + p { margin-top: 24px; padding-top: 18px; border-top: 1px solid #e6e9ef; }
.page-id-13243 .gcx-eyebrow { font-size: 18px !important; line-height: 28px !important; color: #000000 !important; font-weight: 600 !important; text-align: left; margin: 0 0 10px !important; }
.page-id-13243 .gcx-lp-title { font-size: 34px !important; line-height: 44px !important; font-weight: 600 !important; color: #4ac4ff !important; text-align: left; margin: 0 0 10px !important; }
.page-id-13243 .gcx-rule { width: 120px; height: 8px; background: #dddddd; margin: 50px 0; }
@media (max-width: 999px) {
.page-id-13243 .gcx-eyebrow { font-size: 16px !important; line-height: 25px !important; }
.page-id-13243 .gcx-lp-title { font-size: 28px !important; line-height: 36px !important; }
.page-id-13243 .gcx-rule { margin: 32px 0; }
}
.page-id-13243 .gcx-consent { margin-bottom: 18px !important; }
.page-id-13243 .gcx-consent label { display: flex !important; align-items: flex-start; gap: 10px; font-weight: 400 !important; font-size: 14px; line-height: 1.5; color: #444444; cursor: pointer; margin-bottom: 0; }
.page-id-13243 .gcx-consent input[type="checkbox"] { width: 18px; height: 18px; min-width: 18px; margin: 2px 0 0; accent-color: #2DB9E8; cursor: pointer; }
.page-id-13243 .gcx-lp-form .mc4wp-form + p small { display: block; font-size: 13px; line-height: 1.6; color: #5a6170; }
.page-id-13243 .mc4wp-success { display: none !important; }
.page-id-13243 #gcx-modal-backdrop { position: fixed; inset: 0; background: rgba(20, 30, 40, 0.55); z-index: 99998; display: none; align-items: center; justify-content: center; padding: 20px; }
.page-id-13243 #gcx-modal-backdrop.gcx-open { display: flex; }
.page-id-13243 #gcx-modal-box { background: #ffffff; border-radius: 12px; max-width: 520px; width: 100%; padding: 40px 40px 34px; box-shadow: 0 20px 60px rgba(0,0,0,0.25); position: relative; font-family: inherit; text-align: left; }
.page-id-13243 #gcx-modal-box h2 { margin: 0 0 14px; font-size: 26px; line-height: 1.2; color: #1a1a1a; }
.page-id-13243 #gcx-modal-box p { margin: 0 0 22px; font-size: 16px; line-height: 1.55; color: #333; }
.page-id-13243 #gcx-modal-box .gcx-download-btn { display: inline-block; background: #2DB9E8; color: #ffffff !important; padding: 14px 26px; border-radius: 6px; font-weight: 600; font-size: 16px; text-decoration: none; transition: background 0.15s ease; }
.page-id-13243 #gcx-modal-box .gcx-download-btn:hover { background: #1aa5d4; color: #ffffff !important; }
.page-id-13243 #gcx-modal-box .gcx-fine { margin-top: 22px; font-size: 13px; color: #666; line-height: 1.5; }
.page-id-13243 #gcx-modal-close { position: absolute; top: 12px; right: 16px; background: transparent; border: none; font-size: 26px; line-height: 1; color: #888; cursor: pointer; padding: 4px 8px; }
.page-id-13243 #gcx-modal-close:hover { color: #333; }

/* Download button on Silence of the System - participant copy (13439): darker brand blue from Liz's logo palette | Claude 2026-09-02 */
body.page-id-13439 .nectar-button.accent-color {
  background-color: #2595e7 !important;
  border-color: #2595e7 !important;
}
body.page-id-13439 .nectar-button.accent-color:hover {
  background-color: #1281d3 !important;
  border-color: #1281d3 !important;
}

/* Image corner radius: render the data-border-radius value Salient writes onto image wrappers but never styles | Claude 2026-09-10 */
.img-with-aniamtion-wrap[data-border-radius="20px"] img,
.img-with-animation-wrap[data-border-radius="20px"] img { border-radius: 20px; }
.img-with-aniamtion-wrap[data-border-radius="8px"] img,
.img-with-animation-wrap[data-border-radius="8px"] img { border-radius: 8px; }

/* Mobile UAT 11 Sept 2026 (1 of 2). Sticky Media Sections in scroll-pinned mode, used on About Us (page 6625, "Who Good CX works for"). Each card was pinned at a fixed 75vh height with overflow hidden, which clipped the copy (about 190px lost on desktop as well as phones) and made the stack behave like a broken scroll box on touch. Cards now grow to fit their content and sit in normal page flow. Image columns inside the cards keep a 3:2 shape when stacked. Delete this block to bring the pinned effect back. */
.nectar-sticky-media-sections.type--scroll-pinned-sections .nectar-sticky-media-section__content-section { position: relative !important; top: auto !important; height: auto !important; transform: none !important; border-bottom: 24px solid transparent !important; }
.nectar-sticky-media-sections.type--scroll-pinned-sections .nectar-sticky-media-section__content__wrap > div:last-child { border-bottom: 0 !important; }
.nectar-sticky-media-sections.type--scroll-pinned-sections .nectar-sticky-media-section__content-section__wrap { height: auto !important; transform: none !important; opacity: 1 !important; filter: none !important; }
@media only screen and (max-width: 999px) {
  .nectar-sticky-media-sections.type--scroll-pinned-sections .vc_column-inner:has(> .column-image-bg-wrap) { aspect-ratio: 3 / 2; height: auto; }
}

/* Mobile UAT 11 Sept 2026 (2 of 2). Service-page cards whose image row is set to absolute position (bottom -8%, 152% wide) behind a 60vw spacer. On phones the copy wraps longer than the spacer allows, so the image sat on top of the last lines of text (About Us Innovation Lab, Human Centred Design, UX/UI design, Brand architecture). Below 690px the image now flows under the copy and the card grows to fit. Desktop and tablet are unchanged. */
@media only screen and (max-width: 690px) {
  body .vc_column-inner .divider-wrap:has(+ .wpb_row.inner_row.row_position_absolute.bottom_position_desktop_-8pct) { display: none !important; }
  body .vc_column-inner .wpb_row.inner_row.row_position_absolute.bottom_position_desktop_-8pct { position: relative !important; top: auto !important; bottom: auto !important; margin-top: 24px !important; margin-bottom: -60px !important; }
}

/* Mobile UAT 11 Sept 2026 (3 of 3). Salient CTA buttons in the text-reveal-wave style wrap every letter in its own inline-block span, so on narrow screens a label can break in the middle of a word ("Tell us where you're s / tuck" on CX Advisory; also The Trust Advantage and DISTIL). Below 1000px the letters sit inline, so labels only wrap between words. The hover wave does not exist on touch screens, so nothing is lost. */
@media only screen and (max-width: 999px) {
  .nectar-cta .link_text .text .char { display: inline !important; }
}

/* Mobile UAT 11 Sept 2026 (4). Silence of the System landing page (13243): the purple "Take the diagnostic at Half Time Orange" button carries 50px side padding, so on phones it ran past the right edge of the screen. Below 690px the button is held inside the column and its label wraps inside the pill. Scoped to this page so button spacing elsewhere is unchanged. */
@media only screen and (max-width: 690px) {
  body.page-id-13243 .nectar-cta[data-using-bg="true"] .link_wrap { display: inline-block; max-width: 100%; box-sizing: border-box; }
}

/* ---------------------------------------------------------------
   Mobile UAT 15 Sept 2026 - colour and contrast
   Theme accent moved from #4ac4ff to #9333ea in Salient > Accent
   Colors. These rules clear the failures that sit outside that
   setting. Measured ratios are the before values.
   --------------------------------------------------------------- */

/* Eyebrow headings were #bfbfbf on white, 1.84:1. Deep purple is 8.7:1. */
h5.vc_custom_heading[style*="bfbfbf" i],
h4.vc_custom_heading[style*="bfbfbf" i],
h6.vc_custom_heading[style*="bfbfbf" i] { color: #6b21a8 !important; }

/* Footer headings and text were #777777: 4.07:1 on the light panel. */
#footer-outer #footer-widgets .widget h4,
#footer-outer #footer-widgets h4,
#footer-outer #footer-widgets p,
#footer-outer #footer-widgets li,
#footer-outer #footer-widgets li a { color: #4b5563 !important; }

/* Copyright bar was #777777 on #1f1f1f, 3.68:1. This is 6.5:1. */
#footer-outer #copyright,
#footer-outer #copyright .col p,
#footer-outer #copyright p,
#footer-outer #copyright a { color: #9da3af !important; }

/* Text-reveal CTA links were #ff6b3d on white, 2.83:1. */
.nectar-cta[style*="ff6b3d" i] { --nectar-text-color: #6b21a8 !important; }
.nectar-cta[style*="ff6b3d" i] .link_text { color: #6b21a8 !important; border-color: #6b21a8 !important; }

/* ---------------------------------------------------------------
   Mobile UAT 15 Sept 2026 - old accent hardcoded in page content
   Changing the theme accent does not reach colours typed into
   pages. #4ac4ff on white is 1.98:1. These rules move those uses
   to the deep purple, 8.7:1, without rewriting twenty pages.
   --------------------------------------------------------------- */
.nectar-badge.text-color-4ac4ff .nectar-badge__inner { color: #6b21a8 !important; }
.nectar-cta[style*="4ac4ff" i] { --nectar-text-color: #6b21a8 !important; }
.nectar-cta[style*="4ac4ff" i] .link_text,
.nectar-cta[style*="4ac4ff" i] .nectar-button-type { color: #6b21a8 !important; border-color: #6b21a8 !important; }
h1[style*="4ac4ff" i], h2[style*="4ac4ff" i], h3[style*="4ac4ff" i],
h4[style*="4ac4ff" i], h5[style*="4ac4ff" i], h6[style*="4ac4ff" i],
.nectar-button[style*="4ac4ff" i],
.nectar-button [style*="4ac4ff" i] { color: #6b21a8 !important; }

/* Outline line-box buttons: a 15 percent black border reads as a
   stray rectangle rather than a button. Give them the house fill. */
#ajax-content-wrap .nectar-button[class*="see-through"] {
  background-color: #9333ea !important;
  border-color: #9333ea !important;
  color: #ffffff !important;
}
#ajax-content-wrap .nectar-button[class*="see-through"] .start,
#ajax-content-wrap .nectar-button[class*="see-through"] span { color: #ffffff !important; }

/* Badge pills sitting on photographs: guarantee the label reads
   whatever the image behind it happens to be doing. */
.column-image-bg-wrap .nectar-badge .nectar-badge__inner {
  background-color: rgba(5, 30, 48, 0.88) !important;
  color: #ffffff !important;
  padding: 4px 12px;
  border-radius: 4px;
}