/*
Theme Name: MSH Careers
Description: Salient child theme for MSH Healthcare's careers site. Brand styling for the jobs plugin and pages.
Template: salient
Version: 1.0.0
Text Domain: msh-careers
*/

:root {
	--msh-red: #ce203e;
	--msh-ink: #161514;
	--msh-stone: #f4f2ef;
	--msh-stone-2: #e0dedb;
	--msh-radius: 15px;
}

/* Tick lists used across pages */
body .msh-ticks { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
body .msh-ticks li { list-style: none; position: relative; padding-left: 30px; margin: 0; line-height: 1.45; }
body .msh-ticks li::before {
	content: ""; position: absolute; left: 0; top: 2px; width: 20px; height: 20px; border-radius: 50%;
	background: var(--msh-red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L19 7'/%3E%3C/svg%3E") center / 12px no-repeat;
}

/* ---------- Job cards ---------- */
body .msh-jobs__list { gap: 10px; }
body .msh-job-card { border: 0; border-radius: var(--msh-radius); background: #fff; }
body .msh-job-card:hover { box-shadow: 0 18px 40px rgba(22, 21, 20, 0.08); transform: translateY(-3px); }
body .msh-job-card__link { padding: 30px; gap: 4px; }
body .msh-job-card__title { font-size: 1.35rem; font-weight: 500; letter-spacing: -0.01em; }
body .msh-job-card__pay { color: var(--msh-red); font-weight: 700; }
body ul.msh-job-card__meta { margin: 8px 0 22px; padding: 0; }
body ul.msh-job-card__meta li { list-style: none; background: var(--msh-stone); padding: 6px 12px; font-size: 0.85rem; line-height: 1.2; }
body .msh-job-card__cta { display: inline-flex; align-self: flex-start; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 100px; background: var(--msh-ink); color: #fff; font-size: 0.95rem; transition: background .2s; }
body .msh-job-card:hover .msh-job-card__cta { background: var(--msh-red); }

body .msh-jobs__filters input, body .msh-jobs__filters select { border-radius: 100px; border: 0; background: #fff; padding: 0 20px; }
body .msh-jobs__count { margin: 6px 0 14px; }
body .msh-jobs__all .nectar-button { border-radius: 100px !important; background: var(--msh-ink) !important; }
body .msh-jobs__empty { background: #fff; border-radius: var(--msh-radius); }

/* ---------- Job page ---------- */
body.msh-job-single { background: var(--msh-stone); }
body .msh-job { padding: 60px 0 100px; }
body .msh-job__back a { font-weight: 600; text-decoration: none; }
body .msh-job__header { background: #fff; border-radius: var(--msh-radius); padding: clamp(28px, 5vw, 60px); }
body .msh-job__title { font-family: "faricy-new", sans-serif; font-weight: 500; font-size: clamp(2.1rem, 4.4vw, 3.6rem); line-height: 1.05; letter-spacing: -0.03em; }
body ul.msh-job__meta { margin: 6px 0 26px; padding: 0; }
body ul.msh-job__meta li { list-style: none; background: var(--msh-stone); }
body ul.msh-job__meta li.msh-meta-pay { background: var(--msh-red); color: #fff; }
body .msh-job__layout { gap: 10px; margin-top: 10px; }
body .msh-job__body { background: #fff; border-radius: var(--msh-radius); padding: clamp(28px, 5vw, 60px); }
body .msh-job__desc h2, body .msh-job__desc h3 { margin-top: 1.4em; }
body .msh-job__desc h2:first-child { margin-top: 0; }
body .msh-job__desc ul li { margin-bottom: 4px; }
body .msh-job__aside-card { background: var(--msh-ink); color: var(--msh-stone); border-radius: var(--msh-radius); padding: 30px; top: 110px; }
body .msh-job__aside-pay { font-family: "faricy-new", sans-serif; font-weight: 500; font-size: 2.2rem; letter-spacing: -0.02em; line-height: 1.1; margin-bottom: 18px; }
body .msh-job .nectar-button { border-radius: 100px !important; background: var(--msh-red) !important; color: #fff !important; }
body .msh-job__apply { border-top: 1px solid var(--msh-stone-2); padding-top: 40px; }

/* ---------- Application form ---------- */
body .msh-apply { max-width: none; }
body .msh-field input[type=text], body .msh-field input[type=email], body .msh-field input[type=tel],
body .msh-field input[type=number], body .msh-field input[type=date], body .msh-field select, body .msh-field textarea {
	border: 1px solid var(--msh-stone-2); border-radius: 12px; background: var(--msh-stone); padding: 12px 16px;
}
body .msh-field input:focus, body .msh-field select:focus, body .msh-field textarea:focus { outline: 2px solid var(--msh-red); outline-offset: 1px; background: #fff; }
body .msh-field--choice { background: var(--msh-stone); border-radius: 12px; padding: 16px 18px; }
body .msh-field--choice label { margin: 6px 0; }
body .msh-req { color: var(--msh-red); }
body .msh-apply__errors { border-color: var(--msh-red); background: #fdeef1; }
body .msh-apply__done { background: var(--msh-stone); border-left: 4px solid var(--msh-red); }

@media (max-width: 999px) {
	/* Floating glass pill, matching the header. */
	body .msh-job__sticky { left: 12px; right: 12px; bottom: 12px; padding: 8px 8px 8px 22px; border-radius: 200px; background: rgba(22, 21, 20, 0.82); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); color: #fff; box-shadow: 0 10px 30px rgba(22, 21, 20, 0.18); font-weight: 500; }
	body .msh-job__sticky.is-hidden { transform: translateY(140%); }
}

/* ---------- Brand font ---------- */
body, body input, body select, body textarea, body button { font-family: "faricy-new", "Outfit", system-ui, sans-serif; }
/* Emphasis inside headings is a brand-red accent rather than italics. */
body h1 em, body h2 em, body .nectar-split-heading em, body .nectar-responsive-text em { font-style: normal; color: var(--msh-red) !important; }

/* ---------- Header "Apply now" button: ink, turning red on hover ---------- */
#header-outer .menu-item-btn-style-button_accent-color > a .menu-title-text,
#header-outer li[class*="button_accent-color"] > a { color: #fff !important; }
#header-outer li[class*="button_accent-color"] > a:before { background-color: var(--msh-ink) !important; }
#header-outer li[class*="button_accent-color"] > a:hover:before { background-color: var(--msh-red) !important; }

/* ---------- UX polish ---------- */
/* No CSS smooth scrolling: it fights Salient's own anchor scroll and made in-page links lag by ~3s. */
body :focus-visible { outline: 2px solid var(--msh-red); outline-offset: 3px; }
body a[href^="tel:"] { white-space: nowrap; }
body .nectar-icon-list[data-direction="horizontal"] .nectar-icon-list-item h3 { font-size: 1.25rem; margin-bottom: 6px; }
body .nectar-icon-list .nectar-icon-list-item .content { color: var(--msh-ink); opacity: .8; }
body .nectar-icon-list .list-icon-holder[data-icon_type="numerical"] { background: var(--msh-red) !important; border-color: var(--msh-red) !important; }
body .nectar-icon-list .list-icon-holder[data-icon_type="numerical"] span { color: #fff !important; }
body #is-it-for-you .msh-ticks, body #roles .msh-ticks { margin: 4px 0 8px; }
body .msh-jobs__notice { background: #fff; border-radius: 12px; padding: 14px 18px; }
@media (max-width: 690px) {
	body .nectar-icon-list[data-direction="horizontal"] .nectar-icon-list-item { width: 100% !important; margin-bottom: 18px; }
	body .msh-job__header, body .msh-job__body { border-radius: 12px; }
}

/* ---------- Brand shapes (from MSH print and vehicle livery) ---------- */
/* Red panel with the photo's left edge curved, like the exhibition stand artwork. */
body .msh-red-panel .msh-ticks li::before { background-color: #fff; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23CE203E' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L19 7'/%3E%3C/svg%3E"); }
body .msh-red-panel .img-with-aniamtion-wrap .inner, body .msh-red-panel .img-with-aniamtion-wrap img { border-radius: 50% 15px 15px 50% / 50% 15px 15px 50% !important; }
body .msh-red-panel h6, body .msh-red-panel [data-inherit-heading-family="h6"] { color: rgba(255,255,255,.8); }
@media (max-width: 999px) {
	body .msh-red-panel .img-with-aniamtion-wrap .inner, body .msh-red-panel .img-with-aniamtion-wrap img { border-radius: 50% 50% 15px 15px / 30% 30% 15px 15px !important; }
}
/* The MSH arc under page headings, echoing the logo's swoosh. */
body .msh-page-header { position: relative; overflow: hidden; }
body .msh-page-header::after {
	content: ""; position: absolute; left: -10%; right: -10%; bottom: -1px; height: 90px; pointer-events: none;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 90' preserveAspectRatio='none'%3E%3Cpath d='M0 90 Q600 -30 1200 90' fill='none' stroke='%23CE203E' stroke-width='3' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center bottom / 100% 100% no-repeat;
	opacity: .9;
}
@media (max-width: 690px) { body .msh-page-header::after { height: 40px; } }
body .msh-red-panel .nectar-responsive-text em { color: #fff !important; box-shadow: inset 0 -0.12em 0 rgba(255,255,255,.45); }

/* ---------- Form polish ---------- */
body .msh-apply { accent-color: var(--msh-red); }
body .msh-field--choice legend { float: left; width: 100%; padding: 0; margin: 0 0 10px; font-weight: 600; }
body .msh-field--choice legend + label { clear: both; }
body .msh-field--choice label { display: flex; align-items: center; gap: 10px; min-height: 36px; }
body .msh-field--choice input { width: 20px; height: 20px; margin: 0; flex: 0 0 auto; }
body .msh-field--consent label { display: flex; align-items: flex-start; gap: 12px; font-weight: 400; }
body .msh-field--consent input { width: 22px; height: 22px; margin: 2px 0 0; flex: 0 0 auto; }
body .msh-field input[type=file] { font: inherit; padding: 10px; border: 1px dashed var(--msh-stone-2); border-radius: 12px; background: #fff; width: 100%; }
body .msh-field input[type=file]::file-selector-button { font: inherit; font-weight: 600; border: 0; border-radius: 100px; padding: 8px 16px; margin-right: 12px; background: var(--msh-ink); color: #fff; cursor: pointer; }
body .msh-field label { font-weight: 600; }
body .msh-help { font-size: .9em; opacity: .75; margin-top: 6px; }

/* ---------- Red panel as an inset rounded card, matching the hero tiles' 10px gutter ---------- */
body .msh-red-panel > .row-bg-wrap { left: 10px !important; right: 10px !important; width: auto !important; margin-left: 0 !important; border-radius: var(--msh-radius); overflow: hidden; }
/* Sliders and bleed images run past the viewport by design; never let them cause sideways scrolling. */
html, body { overflow-x: clip; }
body .msh-red-panel .row_col_wrap_12 > .wpb_column:first-child { padding-left: clamp(24px, 5vw, 90px) !important; padding-right: clamp(0px, 3vw, 48px) !important; }
/* Quote over a photo: red emphasis is unreadable there, so emphasise with a soft white underline instead. */
body .msh-quote .nectar-responsive-text em { color: inherit !important; box-shadow: inset 0 -0.1em 0 rgba(255,255,255,.5); }
/* Home hero supporting line. */
body .msh-hero-sub, body #top .nectar-responsive-text.font_size_desktop_19px { text-align: center; opacity: .8; margin: 4px auto 6px; }
/* Even line lengths on headings and short copy, so nothing ends on an orphan word. */
body h1, body h2, body h3, body h4, body .nectar-split-heading, body .nectar-responsive-text p, body .avatar-group-text, body .nectar-cta { text-wrap: balance; }

/* ---------- Myth / truth flip cards (Salient flip box) ---------- */
body .msh-myths .nectar-flip-box, body .msh-myths .flip-box-front, body .msh-myths .flip-box-back { border-radius: var(--msh-radius); }
body .msh-myths .flip-box-front .inner, body .msh-myths .flip-box-back .inner { padding: 30px !important; }
body .msh-myths h3 { margin: 18px 0 0; font-size: clamp(22px, 1.8vw, 28px); line-height: 1.2; font-weight: 500; letter-spacing: -0.01em; }
body .msh-myths .flip-box-back p { font-size: 17px; line-height: 1.5; margin-top: 16px; }
body .msh-myths .msh-flip-hint { margin-top: 18px; font-size: 13px; opacity: .55; }
body .msh-pill { display: inline-flex; align-items: center; min-height: 28px; padding: 0 12px; border-radius: 99px; background: rgba(22, 21, 20, 0.06); font-size: 13px; line-height: 1; font-weight: 500; }
body .msh-pill--light { background: rgba(255, 255, 255, 0.18); color: #fff; }
/* Front text is plain (shortcode attributes can't hold HTML), so the pill and hint are drawn here. */
body .msh-myths .flip-box-front .inner { display: flex; flex-direction: column; align-items: flex-start; text-align: left; font-size: clamp(22px, 1.8vw, 28px); line-height: 1.2; font-weight: 500; letter-spacing: -0.01em; color: var(--msh-ink); }
body .msh-myths .flip-box-front .inner::before { content: "Myth"; display: inline-flex; align-items: center; min-height: 28px; padding: 0 12px; margin-bottom: 18px; border-radius: 99px; background: rgba(22, 21, 20, 0.06); font-size: 13px; font-weight: 500; letter-spacing: 0; }
body .msh-myths .flip-box-front .inner::after { content: "Tap or hover to see the truth"; margin-top: 18px; font-size: 13px; font-weight: 400; letter-spacing: 0; opacity: .55; }
body .msh-myths .flip-box-front .inner p { margin: 0; padding: 0; font: inherit; }

/* ---------- Numbered steps: centre the number in its circle and tighten the gap to the text ---------- */
body .nectar-icon-list .list-icon-holder[data-icon_type="numerical"] { display: flex !important; align-items: center; justify-content: center; width: 44px !important; height: 44px !important; line-height: 1 !important; }
body .nectar-icon-list .list-icon-holder[data-icon_type="numerical"] span { display: block; height: auto !important; margin: 0 !important; line-height: 1 !important; font-size: 18px !important; font-weight: 600; }
body .nectar-icon-list[data-direction="horizontal"] .nectar-icon-list-item { padding-left: 64px !important; }
body .nectar-icon-list[data-direction="horizontal"] .nectar-icon-list-item .list-icon-holder { top: 0 !important; left: 0 !important; }
body .nectar-icon-list[data-direction="horizontal"] .nectar-icon-list-item h3 { line-height: 44px; margin: 0 0 4px; }
body #how-to-apply .nectar-icon-list { margin-bottom: 32px !important; }

/* ---------- Footer: dark rounded card, matching the hero tiles' 10px gutter ---------- */
body .msh-footer-row { padding: 0 10px 10px !important; }
body .msh-footer { background: var(--msh-ink); color: rgba(255,255,255,.72); border-radius: var(--msh-radius); padding: clamp(36px, 5vw, 72px) clamp(24px, 5vw, 72px) 28px; font-size: 15px; line-height: 1.55; }
body .msh-footer a { color: #fff; text-decoration: none; transition: color .2s, opacity .2s; }
body .msh-footer a:hover { color: #fff; opacity: .7; }
body .msh-footer__top { display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)); gap: clamp(28px, 4vw, 64px); }
body .msh-footer__logo img { width: 240px; height: auto; display: block; }
body .msh-footer__tagline { margin: 20px 0 24px; max-width: 34ch; font-size: 17px; color: rgba(255,255,255,.85); }
body .msh-footer__ctas { display: flex; flex-wrap: wrap; gap: 8px; }
body .msh-footer__btn { display: inline-flex; align-items: center; height: 44px; padding: 0 20px; border-radius: 200px; background: var(--msh-red); color: #fff !important; font-weight: 500; }
body .msh-footer__btn:hover { opacity: 1 !important; background: #b51a35; }
body .msh-footer__btn--ghost { background: rgba(255,255,255,.1); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
body .msh-footer__btn--ghost:hover { background: rgba(255,255,255,.18); }
body .msh-footer__h { margin: 0 0 14px; color: #fff; font-size: 13px; line-height: 1; letter-spacing: .08em; text-transform: uppercase; font-weight: 500; }
body .msh-footer ul { list-style: none; margin: 0; padding: 0; }
body .msh-footer__col li { margin: 0 0 10px; }
body .msh-footer address { font-style: normal; }
body .msh-footer__mid { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; margin-top: clamp(32px, 4vw, 56px); padding-top: 28px; border-top: 1px solid rgba(255,255,255,.12); }
body .msh-footer__badges { display: flex; flex-wrap: wrap; gap: 10px; }
body .msh-footer__badges li { display: flex; align-items: center; height: 56px; padding: 8px 12px; border-radius: 12px; background: #fff; }
body .msh-footer__badges img { max-height: 40px; width: auto; display: block; }
body .msh-footer__social { display: flex; flex-wrap: wrap; gap: 8px; }
body .msh-footer__social a { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: rgba(255,255,255,.1); }
body .msh-footer__social a:hover { background: var(--msh-red); opacity: 1; }
body .msh-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; margin-top: 28px; font-size: 13px; color: rgba(255,255,255,.55); }
body .msh-footer__bottom p { margin: 0; padding: 0; }
body .msh-footer__bottom a { color: rgba(255,255,255,.75); }
@media (max-width: 999px) {
	body .msh-footer__top { grid-template-columns: 1fr 1fr; }
	body .msh-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
	body .msh-footer__top { grid-template-columns: 1fr; }
	body .msh-footer__logo img { width: 200px; }
}
body .msh-footer ul, body .msh-footer li { list-style: none !important; margin-left: 0 !important; padding-left: 0 !important; }
body .msh-footer li::before, body .msh-footer li::marker { content: none !important; display: none !important; }
@media (max-width: 600px) {
	body .msh-footer__badges li { height: 48px; padding: 6px 10px; }
	body .msh-footer__badges img { max-height: 34px; }
	body .msh-footer__social a { width: 38px; height: 38px; }
}

/* ---------- Photo cards with hover reveal (qualities) ---------- */
body .msh-qualities .wpb_column { margin-bottom: 10px; }
body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] { overflow: hidden; border-radius: var(--msh-radius); }
body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] .inner { padding: 30px; }
body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] h3 { margin: 14px 0 0; color: #fff; font-size: clamp(24px, 2vw, 30px); line-height: 1.15; font-weight: 500; letter-spacing: -0.01em; }
body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] .hover-content { color: rgba(255,255,255,.92); font-size: 16px; line-height: 1.5; }
body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] .inner { padding: 30px !important; }
body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] .heading-wrap, body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] .hover-content { width: 100% !important; padding: 0 !important; margin-left: 0 !important; }
body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] { padding: 0 !important; }
body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] .hover-content { padding: 0 30px 30px !important; box-sizing: border-box; }

/* =========================================================================
   Consistency pass (2026-10-09): one CTA style, one card radius, readable
   text on every red surface, aligned numerals, tidy mobile stacking.
   ========================================================================= */

/* Red cards always carry white text (Training card, Companionship card). */
body .nectar-sticky-media-section__content-section__wrap:has(.nectar-sticky-media-section__media[style*="CE203E"]) :is(h2, h3, p, .nectar-responsive-text, [data-inherit-heading-family="h6"] p) { color: #fff !important; }
body .nectar-sticky-media-section__content-section__wrap:has(.nectar-sticky-media-section__media[style*="CE203E"]) [data-inherit-heading-family="h6"] p { color: rgba(255,255,255,.8) !important; }

/* Photo chips ("• Full induction"): solid and legible; hidden on small phones where they can't be read. */
body .nectar-badge.backdrop_filter_blur_16 .nectar-badge__inner { background: rgba(255,255,255,.92) !important; color: var(--msh-ink) !important; font-size: 14px !important; }
@media (max-width: 690px) { body .nectar-sticky-media-section__media-wrap .nectar-badge, body .nectar-sticky-media-content__media-wrap .nectar-badge { display: none !important; } }

/* Red panel card: rounded on every layer. */
body .msh-red-panel > .row-bg-wrap .inner-wrap, body .msh-red-panel > .row-bg-wrap .row-bg { border-radius: var(--msh-radius); }

/* Big quote: dark scrim so white text always reads over the photo. */
body .msh-quote > .row-bg-wrap .inner-wrap::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(22,21,20,.78) 0%, rgba(22,21,20,.45) 55%, rgba(22,21,20,.15) 100%); pointer-events: none; }

/* Closing CTA band: scrim, no gap under the photo. */
body .msh-cta-band > .row-bg-wrap, body .msh-cta-band > .row-bg-wrap .inner-wrap, body .msh-cta-band .row-bg { height: 100% !important; top: 0 !important; bottom: 0 !important; }
body .msh-cta-band .row-bg { background-size: cover !important; background-position: center 30% !important; transform: none !important; }

/* Split image + text sections: one landscape ratio everywhere, so no tall image strands the text. */
body .msh-two-col .img-with-aniamtion-wrap img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; height: auto; }

/* Steps card: tighter rhythm and a proper gap between the two buttons. */
body #how-to-apply .nectar-icon-list { margin-bottom: 8px !important; }
body #how-to-apply .nectar-cta { margin: 0 10px 10px 0 !important; }
body .msh-call-line { margin-top: 18px; font-size: 16px; }
body .msh-call-line a { font-weight: 600; color: var(--msh-red); }

/* Numbered cards (How we hire): numeral aligned with the text, not centred. */
body .nectar-milestone { text-align: left !important; }
body .nectar-milestone .number { justify-content: flex-start !important; }

/* FAQ: question text gets the width; heading column sticks while answers scroll. */
@media (min-width: 1000px) {
	body .msh-faq > .row_col_wrap_12 > .wpb_column:first-child { align-self: flex-start; position: sticky; top: 110px; }
}
@media (max-width: 690px) {
	body .toggles .toggle > .toggle-title a { padding-right: 56px !important; padding-left: 20px !important; font-size: 17px !important; }
}

/* Mobile: stacked hero buttons share one width. */
@media (max-width: 480px) {
	body .msh-page-header .nectar-cta, body .msh-page-header .nectar-cta .link_wrap, body .msh-page-header .nectar-cta a { width: 100%; text-align: center; justify-content: center; }
	body .msh-page-header .wpb_wrapper > .vc_row .wpb_wrapper { width: 100%; }
}

/* Number pills on photos: solid dark glass, readable on any picture. */
body .msh-qualities .msh-pill--light { background: rgba(22,21,20,.55); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); min-height: 30px; font-size: 14px; }

/* Touch screens: the hover photo cards show their text all the time over a dark fade. */
@media (hover: none) {
	body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] .hover-content { opacity: 1 !important; transform: none !important; max-height: none !important; height: auto !important; visibility: visible !important; }
	body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] .box-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 25%, rgba(22,21,20,.82)); }
	body .msh-myths .flip-box-front .inner::after { content: "Tap to see the truth"; }
}

/* Myth cards: content starts at the top, hint readable. */
body .msh-myths .flip-box-front .inner, body .msh-myths .flip-box-back .inner { justify-content: flex-start !important; top: 0 !important; transform: none !important; position: relative; }
body .msh-myths .flip-box-front, body .msh-myths .flip-box-back { display: flex; align-items: flex-start !important; }
body .msh-myths .flip-box-front .inner::after { opacity: .75; font-size: 14px; }
@media (max-width: 690px) { body .msh-myths .nectar-flip-box, body .msh-myths .flip-box-front, body .msh-myths .flip-box-back { min-height: 230px !important; } }

/* Recognition logos: three, never clipped. */
@media (max-width: 690px) { body #recognition .flickity-slider, body #recognition .flickity-viewport { transform: none !important; } }

/* Privacy notice and other long text: readable line length. */
body .msh-prose .wpb_text_column { max-width: 720px; margin: 0 auto; }
body .msh-prose ul, body .msh-prose ol { margin-top: 10px; margin-bottom: 20px; }

/* Current page in the menu. */
body #header-outer #top nav > ul > li.current-menu-item > a .menu-title-text, body #header-outer #top nav > ul > li.current_page_item > a .menu-title-text { box-shadow: inset 0 -2px 0 var(--msh-red); }

/* Place names never split at their hyphens. */
.msh-nowrap { white-space: nowrap; }

/* ---------- Job page and application form ---------- */
/* Every Apply button: the same red pill, one size. */
body .msh-job .nectar-button, body .msh-job__sticky .nectar-button, body .msh-apply__submit { display: inline-flex !important; align-items: center; justify-content: center; min-height: 52px; padding: 0 28px !important; border-radius: 100px !important; background: var(--msh-red) !important; border-color: var(--msh-red) !important; color: #fff !important; font-size: 16px !important; font-weight: 600; line-height: 1 !important; }
body .msh-job .nectar-button span, body .msh-job__sticky .nectar-button span { color: #fff !important; }
body .msh-job__aside-card .nectar-button { width: 100%; }
body .msh-job__aside-pay { margin-bottom: 6px !important; }
body .msh-job__aside-note { margin: 0 0 18px; font-size: 14px; opacity: .75; }

/* Section headings inside the job page share one size. */
body .msh-job__desc h2, body .msh-job__body > section > h2, body .msh-benefits h2, body .msh-voices h2, body .msh-similar h2, body .msh-job__apply h2 { font-size: clamp(24px, 2.2vw, 30px) !important; line-height: 1.2 !important; font-weight: 500; letter-spacing: -0.01em; margin-bottom: 14px; }
body .msh-job__desc h3 { font-size: 20px !important; line-height: 1.3 !important; }
body .msh-eyebrow { margin: 0 0 8px; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--msh-red); font-weight: 600; }
body .msh-next__n { opacity: .7 !important; font-size: 13px !important; color: var(--msh-ink); }

/* Accreditation tiles: equal height, one row. */
body ul.msh-trust { gap: 10px; flex-wrap: nowrap; }
body ul.msh-trust li { display: grid; place-items: center; height: 64px; padding: 8px 14px; border-radius: 12px; background: #fff; border: 1px solid var(--msh-stone-2); }
body ul.msh-trust img { height: 44px; max-width: 120px; object-fit: contain; }
@media (max-width: 690px) { body ul.msh-trust li { height: 56px; padding: 6px 10px; } body ul.msh-trust img { height: 36px; max-width: 86px; } }

/* Form: one family of controls. */
body .msh-apply__intro { font-size: 15px; opacity: .8; margin: 6px 0 22px; }
body .msh-field label, body .msh-field legend { font-size: 16px; font-weight: 600; color: var(--msh-ink); }
body .msh-field--choice { background: none !important; padding: 0 !important; border-radius: 0 !important; margin-bottom: 22px; }
body .msh-field--choice legend { margin-bottom: 8px; }
body .msh-field--choice label { font-weight: 400; min-height: 44px; margin: 0 0 6px !important; padding: 0 14px; border-radius: 12px; background: var(--msh-stone); cursor: pointer; transition: background .2s; }
body .msh-field--choice label:hover { background: var(--msh-stone-2); }
body .msh-field--choice label:has(input:checked) { background: #fdeef1; box-shadow: inset 0 0 0 1.5px var(--msh-red); }
body .msh-apply input[type=radio], body .msh-apply input[type=checkbox] { -webkit-appearance: none; appearance: none; display: grid; place-items: center; width: 22px !important; height: 22px !important; margin: 0; flex: 0 0 22px; border: 1.5px solid #9b9690; background: #fff; cursor: pointer; }
body .msh-apply input[type=radio] { border-radius: 50%; }
body .msh-apply input[type=checkbox] { border-radius: 6px; }
body .msh-apply input[type=radio]:checked { border-color: var(--msh-red); box-shadow: inset 0 0 0 5px #fff; background: var(--msh-red); }
body .msh-apply input[type=checkbox]:checked { border-color: var(--msh-red); background: var(--msh-red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L19 7'/%3E%3C/svg%3E") center / 15px no-repeat; }
body .msh-apply input[type=radio]:focus-visible, body .msh-apply input[type=checkbox]:focus-visible { outline: 2px solid var(--msh-red); outline-offset: 2px; }
body .msh-field select { -webkit-appearance: none; appearance: none; min-height: 50px; padding: 0 48px 0 18px !important; font-size: 16px !important; color: var(--msh-ink) !important; background: var(--msh-stone) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23161514' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 18px center / 18px no-repeat !important; border: 0 !important; border-radius: 100px !important; }
body .msh-field input[type=file] { background: var(--msh-stone) !important; border: 1.5px dashed #cfcac3 !important; border-radius: 15px !important; padding: 14px !important; }
body .msh-field input[type=file]::file-selector-button { background: var(--msh-ink); }
body .msh-field--consent label { align-items: flex-start !important; }
body .msh-field--consent input { margin-top: 2px !important; }
body .msh-field--consent a { color: var(--msh-red); text-decoration: underline; text-underline-offset: 3px; font-weight: 600; }
body .msh-req { color: var(--msh-red); }

/* Save and finish later: a real secondary button, same height as Send. */
body .msh-apply__actions { gap: 10px; }
body .msh-apply__actions .msh-apply__submit { width: auto !important; flex: 1 1 220px; }
body .msh-apply__later { flex: 1 1 200px; min-height: 52px; padding: 0 24px !important; border-radius: 100px !important; border: 1.5px solid var(--msh-ink) !important; background: #fff !important; color: var(--msh-ink) !important; text-decoration: none !important; font-size: 16px; }
body .msh-apply__later:hover { background: var(--msh-ink) !important; color: #fff !important; }
body .msh-apply__talk { margin-top: 18px; font-size: 15px; }
body .msh-apply__talk a { color: var(--msh-red); font-weight: 600; }

/* Mobile: let the form breathe edge to edge, videos one per row. */
@media (max-width: 690px) {
	body .msh-job__body { padding: 26px 18px !important; }
	body .msh-voices__grid { grid-template-columns: 1fr !important; }
	body .msh-voice--video { aspect-ratio: 4 / 5 !important; }
}
/* Videos: solid play button and a clean label. */
body .msh-voice__play { background: #fff !important; color: var(--msh-red) !important; border: 0 !important; box-shadow: 0 8px 24px rgba(22,21,20,.25); }
body .msh-voice__play:hover { background: var(--msh-red) !important; color: #fff !important; }
/* Value cards: titles reserve two lines so body text lines up across the row. */
@media (min-width: 1000px) { body .msh-values h3 { min-height: 2.5em; } }
/* Safer recruitment: both columns start at the same line. */
body .vc_row .wpb_column > .vc_column-inner > .wpb_wrapper > .wpb_text_column:first-child p:first-child { margin-top: 0; }

/* ---------- Consistency pass 2 ---------- */
body .msh-footer__btn { gap: .3em; white-space: nowrap; }
/* Header Apply now: the red primary pill like every other Apply button. */
body #header-outer .menu-item-btn-style-button_accent-color > a:before, body #header-outer .menu-item-btn-style-button_accent-color > a .menu-title-text:after { background-color: var(--msh-red) !important; }
body #header-outer .menu-item-btn-style-button_accent-color > a .menu-title-text { box-shadow: none !important; color: #fff !important; }
/* FAQ questions use the full width on phones. */
@media (max-width: 690px) {
	body .toggles .toggle > .toggle-title a { padding: 20px 56px 20px 20px !important; }
	body .toggles .toggle > .toggle-title a .nectar-toggle-icon { right: 18px !important; left: auto !important; }
	body .toggles .toggle > .toggle-title { padding: 0 !important; }
	body .toggles .toggle > div { padding-left: 20px !important; padding-right: 20px !important; }
}
/* Hover photo cards: on phones (touch or small screens) the description is always shown. */
@media (max-width: 690px) {
	body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] .hover-content { opacity: 1 !important; transform: none !important; max-height: none !important; height: auto !important; visibility: visible !important; }
	body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] .box-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 20%, rgba(22,21,20,.85)); }
	body .msh-myths .flip-box-front .inner::after { content: "Tap to see the truth"; }
}
body .msh-myths .nectar-flip-box, body .msh-myths .flip-box-front, body .msh-myths .flip-box-back { min-height: 250px !important; }
/* Quote banner: stronger scrim. */
body .msh-quote > .row-bg-wrap .inner-wrap::after { background: linear-gradient(90deg, rgba(22,21,20,.85) 0%, rgba(22,21,20,.55) 55%, rgba(22,21,20,.2) 100%); }
body .msh-quote .row-bg { transform: none !important; height: 100% !important; top: 0 !important; background-size: cover !important; }
/* CTA banner never touches the footer. */
body .msh-cta-band { margin-bottom: 10px !important; }
/* Red "Is it for you" panel: text centred against the photo; rounded on phones too. */
body .msh-red-panel > .row_col_wrap_12 > .wpb_column:first-child { align-self: center; }
@media (max-width: 999px) { body .msh-red-panel > .row-bg-wrap { left: 10px !important; right: 10px !important; border-radius: var(--msh-radius); overflow: hidden; } }
/* Shift pattern pills stay on one line. */
body .nectar-badge__inner { white-space: nowrap; }
/* Recognition logos: a still, centred row of three. */
body #recognition .flickity-viewport { overflow: visible !important; }
body #recognition .flickity-slider { position: static !important; transform: none !important; display: flex !important; justify-content: center; gap: clamp(20px, 5vw, 70px); }
body #recognition .flickity-slider > * { position: static !important; transform: none !important; left: auto !important; width: auto !important; }
/* Lists and long copy: no one-word last lines. */
body li, body p { text-wrap: pretty; }
body .nectar-text-inline-images, body h1, body h2 { text-wrap: balance; }
body .msh-prose p + ul, body .msh-prose p + ol { margin-top: -8px !important; }
/* Mobile: split cards don't keep desktop centring gaps. */
@media (max-width: 999px) {
	body .nectar-sticky-media-section__content-section-inner .wpb_column { min-height: 0 !important; justify-content: flex-start !important; }
	body .nectar-sticky-media-section__content-section-inner .vc_column-inner { min-height: 0 !important; }
}
/* Job page: sticky bar is the red pill on phones. */
@media (max-width: 999px) {
	body .msh-job__sticky { left: 16px !important; right: 16px !important; background: var(--msh-red) !important; color: #fff !important; }
	body .msh-job__sticky .nectar-button { background: #fff !important; border-color: #fff !important; min-height: 44px; }
	body .msh-job__sticky .nectar-button, body .msh-job__sticky .nectar-button span { color: var(--msh-red) !important; }
}
body .msh-apply__actions { align-items: center; }
body .msh-apply__actions > * { margin: 0 !important; }
body .msh-field--consent a { white-space: nowrap; }
body .msh-field--consent { margin-bottom: 28px; }
body .msh-field textarea { resize: vertical; }
body .msh-voice--video::after { inset: 0 0 50% !important; background: linear-gradient(rgba(22,21,20,.8), transparent) !important; }
/* Accreditation tiles: identical tiles, here and in the footer. */
body ul.msh-trust { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 480px; }
body ul.msh-trust li { width: auto; }
body .msh-footer__badges { display: grid !important; grid-template-columns: repeat(3, 96px); gap: 10px; }
body .msh-footer__badges > * { display: grid; place-items: center; height: 56px; padding: 6px 10px; border-radius: 10px; background: #fff; }
body .msh-footer__badges img { max-height: 40px; max-width: 100%; width: auto !important; object-fit: contain; }
/* How we hire: room around the button under the steps. */
@media (max-width: 690px) { body .msh-milestone-cta { margin: 24px 0 56px; } }

/* Bento chat card: frosted glass panel over the photo instead of a flat grey block. */
.child_column:has(.nectar-chat-thread) > .vc_column-inner > .column-bg-overlay-wrap .column-bg-overlay { background-color: rgba(255,255,255,.16) !important; }
.child_column:has(.nectar-chat-thread) > .vc_column-inner { -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%); border: 1px solid rgba(255,255,255,.35); box-shadow: 0 20px 50px rgba(22,21,20,.18); }
.nectar-chat-thread__bubble[data-direction="outgoing"] .nectar-chat-thread__bubble-name strong { color: rgba(255,255,255,.85); }

/* Mobile pass 3 */
@media (max-width: 690px) {
	/* Recognition logos: fit all three on one row, nothing clipped. */
	body #recognition .flickity-slider { gap: 14px !important; flex-wrap: nowrap; align-items: center; }
	body #recognition .flickity-slider > * { margin: 0 !important; padding: 0 !important; flex: 0 1 30% !important; max-width: 30% !important; min-width: 0 !important; }
	body #recognition .flickity-slider > * * { margin: 0 !important; padding: 0 !important; max-width: 100% !important; width: auto !important; }
	body #recognition .flickity-slider img { height: auto !important; max-height: 56px; width: auto !important; margin: 0 auto !important; display: block; }
	/* Quality cards: title above the always-visible description, never on top of it. */
	body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] .inner { display: flex; flex-direction: column; justify-content: flex-end; min-height: 100%; position: absolute; inset: 0; }
	body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] .hover-content { position: static !important; padding: 10px 0 0 !important; top: auto !important; }
	/* FAQ toggles: full-width questions. */
	body .toggles .toggle { padding: 0 !important; }
	body .toggles .toggle > .toggle-title a { padding: 18px 20px !important; gap: 14px; justify-content: space-between; text-wrap: pretty; }
	body .toggles .toggle > .toggle-title a .nectar-toggle-icon { flex: 0 0 30px; margin-left: auto; }
	body .toggles .toggle > div { padding: 0 20px !important; }
}

/* Footer badges: each logo sits centred inside its own white tile, never clipped. */
body .msh-footer__badges { grid-template-columns: repeat(3, 112px) !important; }
body .msh-footer__badges > li { height: 64px !important; padding: 8px !important; overflow: hidden; display: flex !important; align-items: center; justify-content: center; box-sizing: border-box; }
body .msh-footer__badges > li img { width: 100% !important; height: 100% !important; max-width: 100% !important; max-height: 100% !important; object-fit: contain !important; margin: 0 !important; }
@media (max-width: 690px) { body .msh-footer__badges { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; max-width: 340px; } }

/* Red "Is it for you?" panel: circular photo; on mobile rounded panel with the photo as a full-bleed dome at the bottom. */
body .msh-red-panel.full-width-section, body .msh-red-panel { background-color: transparent !important; }
body .msh-red-panel .img-with-aniamtion-wrap .inner, body .msh-red-panel .img-with-aniamtion-wrap .hover-wrap, body .msh-red-panel .img-with-aniamtion-wrap .hover-wrap-inner { border-radius: 0 !important; overflow: visible !important; }
body .msh-red-panel .img-with-aniamtion-wrap img { display: block; width: min(100%, 540px) !important; height: auto !important; aspect-ratio: 1 / 1; object-fit: cover; object-position: center 25%; border-radius: 50% !important; margin-left: auto !important; }
@media (max-width: 999px) {
	body .msh-red-panel { padding-bottom: 0 !important; }
	body .msh-red-panel > .row-bg-wrap { left: 0 !important; right: 0 !important; }
	body .msh-red-panel > .row_col_wrap_12 > .wpb_column:last-child, body .msh-red-panel > .row_col_wrap_12 > .wpb_column:last-child * { margin-bottom: 0 !important; padding-bottom: 0 !important; }
	body .msh-red-panel > .row_col_wrap_12 > .wpb_column:last-child { margin-top: 8px !important; }
	body .msh-red-panel .img-with-aniamtion-wrap img { width: 100% !important; aspect-ratio: 1 / 0.85; border-radius: 50% 50% 15px 15px / 58% 58% 15px 15px !important; }
}
@media (min-width: 1000px) { body .msh-red-panel > .row_col_wrap_12 > .wpb_column:last-child { padding-right: clamp(30px, 4vw, 70px) !important; } }

/* Mobile menu (fullscreen off-canvas): branded footer with the apply CTA; AI button hidden while it is open. */
#slide-out-widget-area .bottom-text { display: flex !important; flex-direction: column; align-items: center; gap: 14px; margin-top: 28px; text-align: center; }
#slide-out-widget-area .bottom-text .msh-ocm__apply { display: inline-flex; align-items: center; justify-content: center; height: 54px; padding: 0 30px; border-radius: 999px; background: var(--msh-red, #CE203E); color: #fff !important; font-size: 17px; font-weight: 500; }
#slide-out-widget-area .bottom-text .msh-ocm__meta { color: rgba(255,255,255,.72); font-size: 14px; line-height: 1.5; max-width: 300px; }
#slide-out-widget-area .bottom-text .msh-ocm__tel { color: #fff !important; font-size: 15px; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(255,255,255,.4); }
#slide-out-widget-area .off-canvas-menu-container .menu > li > a { letter-spacing: -0.02em; }
#slide-out-widget-area .off-canvas-menu-container .menu > li.current-menu-item > a { color: #ff8fa3 !important; }
body:has(#slide-out-widget-area.open) .msh-ai, body.material-ocm-open .msh-ai { opacity: 0 !important; pointer-events: none !important; }
body:has(#slide-out-widget-area.open) #header-outer { background-color: #fff !important; }
#slide-out-widget-area .bottom-text a, #slide-out-widget-area .bottom-text a:hover { text-decoration: none !important; }
#slide-out-widget-area .bottom-text .msh-ocm__apply { height: 52px !important; padding: 0 28px !important; font-size: 16px !important; }
#slide-out-widget-area .bottom-text .msh-ocm__tel { text-decoration: underline !important; }
#slide-out-widget-area .bottom-text .msh-ocm__meta { text-wrap: balance; }

/* ---------- QA pass, 2026-10-11 (device emulation report) ---------- */
/* Salient sets "html body { overflow: visible }" from 1000px on the home page; keep sideways clipping (clip, unlike
   hidden, does not break the sticky sections). Stops touch tablets in landscape panning sideways. */
html body, html body.home { overflow-x: clip !important; }
body .msh-red-panel .img-with-aniamtion-wrap { overflow: clip; }
body .msh-faq { overflow-x: clip; }
/* Quality cards: tablets have no hover either, so show the description under the title up to 999px. */
@media (max-width: 999px) {
	body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] .hover-content { opacity: 1 !important; transform: none !important; max-height: none !important; height: auto !important; visibility: visible !important; }
	body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] .box-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 20%, rgba(22,21,20,.85)); }
	body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] .inner { display: flex; flex-direction: column; justify-content: flex-end; min-height: 100%; position: absolute; inset: 0; }
	body .msh-qualities .nectar-fancy-box[data-style="hover_desc"] .hover-content { position: static !important; padding: 10px 0 0 !important; top: auto !important; }
}
/* Recognition logos are laid out statically, so drop the ticker's faded edges. */
body #recognition .nectar-flickity, body #recognition .flickity-viewport { -webkit-mask-image: none !important; mask-image: none !important; }
/* Small phones (under 360px): the header logo and Apply pill fit side by side. */
@media (max-width: 359px) {
	body #header-outer #logo img { height: 22px !important; }
	body #header-outer .nectar-mobile-only li[class*="button_accent-color"] > a .menu-title-text { font-size: 12.5px !important; letter-spacing: 0; }
	body .msh-job__sticky { gap: 8px !important; padding: 8px 10px !important; }
	body .msh-job__sticky, body .msh-job__sticky * { white-space: nowrap; }
	body .msh-job__sticky .nectar-button { padding-left: 16px !important; padding-right: 16px !important; font-size: 15px !important; }
	body .msh-job__sticky > span { font-size: 14px !important; }
}
/* Numbered step headings: normal line spacing when they wrap, still centred on the number when they don't. */
body .nectar-icon-list[data-direction="horizontal"] .nectar-icon-list-item h3 { line-height: 1.25 !important; min-height: 44px; display: flex; align-items: center; }
/* Home photo tiles fill their column at any width. */
/* Only the middle portrait photo (the right-hand tile already fills its space). */
body .msh-map-card + .wpb_column .img-with-animation { width: 100% !important; height: auto; }
/* Landscape phones: header plus the sticky bar covered half the screen, and the header's own Apply button is there. */
@media (max-height: 500px) and (max-width: 999px) { body .msh-job__sticky { display: none !important; } }