/* The site header and footer, in the theme (inc/chrome.php). Loaded only on pages it covers.
   Measured off the Elementor header/footer (2026-10-20): #F3F5F8 ground, navy #1C244B, gold #815C00,
   1000px content width, top strip 42px, main bar 60 / 58 / 56px (desktop / tablet / phone).
   Phone fixes Alicia asked for: the menu button sits dead centre; the open menu has room between lines;
   the footer wraps cleanly. Every rule is scoped to mch- / mcf- classes, which only this file styles. */

/* Elementor's site kit (post-3875.css) is no longer loaded on covered pages, but six of its rules reached the page body
   through the body class it leaves behind: body text, link and heading colours, and the H3 face. Measured 2026-10-20: without
   them the careers cards' links turned the parent theme's pink and job text shifted colour. Carried over verbatim, same
   selectors and strength, and placed first so the header and footer rules below still win where they set their own. */
.elementor-kit-3875{color:#312F2F}.elementor-kit-3875 a{color:#0C62A8}.elementor-kit-3875 a:hover{color:#8B5A03}.elementor-kit-3875 h1{color:#1C244B}.elementor-kit-3875 h2{color:#1C244B}.elementor-kit-3875 h3{font-family:"Roboto Flex", Sans-serif;font-size:18px;line-height:1.2em}
@media(max-width:1024px){.elementor-kit-3875 h2{font-size:22px}.elementor-kit-3875 h3{font-size:20px}}
@media(max-width:767px){.elementor-kit-3875 h2{font-size:22px}.elementor-kit-3875 h3{font-size:20px}}

/* Header & footer tokens — the Design panel's Global tab for the "Header & Footer" page writes these (and only these),
   so a value set there reaches every page's header and footer and can never touch a page body. Defaults = the values
   Alicia approved on 2026-10-20. */
:root{--ch-bg:#F3F5F8;--ch-ink:#1C244B;--ch-accent:#815C00;--ch-strip:#815C00;--ch-icon:#0C62A8;--ch-rule:#B6C9DB;--ch-cta-bd:#B6C9DB;
 --ch-top-fs:13px;--ch-nav-fs:15px;--ch-sub-fs:15px;--ch-cta-fs:15px;--ch-fmenu-fs:12.5px;--ch-fcontact-fs:13px;--ch-flegal-fs:11.5px;
 --ch-logo-w:60px;--ch-flogo-h:22px;--ch-mcx-h:19px;--ch-in:22px;--ch-ca:46px}
:root{--mce-hdr:60px}
@media(max-width:1024px){:root{--mce-hdr:58px}}
@media(max-width:767px){:root{--mce-hdr:56px}}

.mch-top,.mch-bar,.mcf-foot{font-family:"Roboto Flex",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;background:var(--ch-bg);color:var(--ch-ink);-webkit-font-smoothing:antialiased;box-sizing:border-box}
.mch-top *,.mch-bar *,.mcf-foot *{box-sizing:border-box}
.mch-in{max-width:1024px;margin:0 auto;padding:0 12px} /* 1000px of content, 12px gutters below that — as the Elementor header measured */
.mch-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:-1px}

/* ── top strip: scrolls away ── */
.mch-top .mch-in{height:42px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.mch-top .mch-fx{font-size:var(--ch-top-fs);font-weight:300;letter-spacing:1.2px;text-transform:uppercase;color:var(--ch-strip);text-decoration:none;line-height:1.5}
.mch-top .mch-fx:hover,.mch-top .mch-fx:focus-visible{color:var(--ch-ink)}
.mch-top .mch-search{display:flex;align-items:center;width:140px;height:28px;margin:0;border-bottom:1px solid var(--ch-ink)}
.mch-top .mch-search:focus-within{border-bottom-color:var(--ch-accent)}
.mch-top .mch-search input{flex:1 1 auto;min-width:0;width:auto;height:27px;margin:0;padding:0 4px;border:0;border-radius:0;background:transparent;font:inherit;font-size:13px;color:var(--ch-ink);outline:0;-webkit-appearance:none;appearance:none;box-shadow:none}
.mch-top .mch-search input::-webkit-search-cancel-button{-webkit-appearance:none}
.mch-top .mch-search button,.mch-top .mch-search button:hover,.mch-top .mch-search button:focus{flex:0 0 30px;width:30px;height:27px;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:var(--ch-ink);display:grid;place-items:center;cursor:pointer}
.mch-top .mch-search button:hover{color:var(--ch-accent)}
.mch-top .mch-search svg{width:15px;height:15px;display:block}

/* ── main bar: stays at the top ── */
.mch-bar{position:-webkit-sticky;position:sticky;top:0;z-index:999}
body.admin-bar .mch-bar{top:32px}
@media(max-width:782px){body.admin-bar .mch-bar{top:46px}}
@media(max-width:600px){body.admin-bar .mch-bar{top:0}}
.mch-bar .mch-in{height:var(--mce-hdr);display:flex;align-items:center;position:relative}
.mch-bar .mch-logo{flex:0 0 auto;display:block;line-height:0;margin-right:auto}
.mch-bar .mch-logo img{width:var(--ch-logo-w);height:auto;display:block}
.mch-bar .mch-nav{margin-left:auto}
.mch-bar .mch-nav ul{list-style:none;margin:0;padding:0}
.mch-bar .mch-nav>ul{display:flex;align-items:center}
.mch-bar .mch-nav li{position:relative;margin:0;padding:0}
.mch-bar .mch-nav>ul>li{display:flex;align-items:center}
.mch-bar .mch-nav>ul>li>a{display:block;padding:12px 16px;font-size:var(--ch-nav-fs);font-weight:400;line-height:20px;color:var(--ch-ink);text-decoration:none;white-space:nowrap}
.mch-bar .mch-nav>ul>li.has-sub>a{padding-right:4px}
.mch-bar .mch-nav>ul>li.is-cur>a,.mch-bar .mch-nav>ul>li>a:hover,.mch-bar .mch-nav>ul>li>a:focus-visible,.mch-bar .mch-nav>ul>li.has-sub:hover>a{color:var(--ch-accent)}
.mch-bar .mch-subbtn,.mch-bar .mch-subbtn:hover,.mch-bar .mch-subbtn:focus{display:grid;place-items:center;width:22px;height:30px;margin:0 10px 0 0;padding:0;border:0;border-radius:0;background:transparent;color:inherit;cursor:pointer;box-shadow:none}
.mch-bar .mch-subbtn svg{width:14px;height:14px;transition:transform .2s}
.mch-bar li.has-sub:hover .mch-subbtn,.mch-bar li.is-cur .mch-subbtn{color:var(--ch-accent)}
.mch-bar li.sub-open>.mch-subbtn svg{transform:rotate(180deg)}

/* desktop + tablet dropdown */
@media(min-width:768px){
 .mch-bar .mch-sub{position:absolute;top:100%;left:0;min-width:270px;padding:8px 0;background:#fff;border:1px solid #E2E6EC;border-radius:10px;box-shadow:0 14px 34px rgba(28,36,75,.14);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .18s,transform .18s,visibility 0s .18s;z-index:2}
 .mch-bar li.has-sub:hover>.mch-sub,.mch-bar li.has-sub:has(:focus-visible)>.mch-sub,.mch-bar li.sub-open>.mch-sub{opacity:1;visibility:visible;transform:none;transition:opacity .18s,transform .18s}
 .mch-bar .mch-sub a{display:block;padding:9px 18px;font-size:var(--ch-sub-fs);font-weight:400;line-height:1.35;color:var(--ch-ink);text-decoration:none;white-space:nowrap}
 .mch-bar .mch-sub a:hover,.mch-bar .mch-sub a:focus-visible{background:var(--ch-bg);color:var(--ch-accent)}
 .mch-bar .mch-burger{display:none}
}

.mch-bar .mch-cta,.mch-bar .mch-cta:visited{flex:0 0 auto;margin-left:46px;padding:11px 30px;border:1px solid var(--ch-cta-bd);border-radius:11px;background:var(--ch-bg);color:var(--ch-ink);font-size:var(--ch-cta-fs);font-weight:400;line-height:15px;text-decoration:none;white-space:nowrap;transition:color .15s,border-color .15s}
.mch-bar .mch-cta:hover,.mch-bar .mch-cta:focus-visible{color:var(--ch-accent);border-color:var(--ch-accent)}

/* tablet */
@media(max-width:1024px) and (min-width:768px){
 .mch-bar .mch-nav>ul>li>a{padding:9px}
 .mch-bar .mch-nav>ul>li.has-sub>a{padding-right:2px}
 .mch-bar .mch-subbtn{margin-right:6px}
 .mch-bar .mch-cta{margin-left:24px;padding:8px 15px}
}

/* phone: logo | menu button (dead centre) | Contact Us ── the menu drops below the bar */
@media(max-width:767px){
 .mch-top .mch-in{justify-content:center}
 .mch-top .mch-search{display:none}
 .mch-bar .mch-in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
 .mch-bar .mch-logo{justify-self:start;margin:0}
 .mch-bar .mch-burger,.mch-bar .mch-burger:hover,.mch-bar .mch-burger:focus{justify-self:center;grid-column:2;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;width:44px;height:44px;margin:0;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ch-ink);cursor:pointer;box-shadow:none}
 .mch-bar .mch-burger span{display:block;width:24px;height:2px;border-radius:2px;background:currentColor;transition:transform .22s,opacity .22s}
 .mch-bar.is-open .mch-burger span:nth-child(1){transform:translateY(8px) rotate(45deg)}
 .mch-bar.is-open .mch-burger span:nth-child(2){opacity:0}
 .mch-bar.is-open .mch-burger span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
 .mch-bar .mch-cta{grid-column:3;justify-self:end;margin:0;padding:9px 15px;font-size:calc(var(--ch-cta-fs) * .9333);line-height:14px}
 .mch-bar .mch-nav{position:absolute;top:100%;left:0;right:0;margin:0;background:var(--ch-bg);border-top:1px solid #E2E6EC;box-shadow:0 18px 30px rgba(28,36,75,.12);max-height:calc(100vh - var(--mce-hdr));max-height:calc(100svh - var(--mce-hdr));overflow-y:auto;-webkit-overflow-scrolling:touch;display:none}
 .mch-bar.is-open .mch-nav{display:block}
 .mch-bar .mch-nav>ul{display:block;padding:6px 0 12px}
 .mch-bar .mch-nav>ul>li{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;border-bottom:1px solid #E2E6EC}
 .mch-bar .mch-nav>ul>li:last-child{border-bottom:0}
 .mch-bar .mch-nav>ul>li>a,.mch-bar .mch-nav>ul>li.has-sub>a{flex:0 1 auto;padding:15px 4px;font-size:calc(var(--ch-nav-fs) * 1.1333);line-height:22px;text-align:center}
 .mch-bar .mch-nav>ul>li:not(.has-sub)>a{flex:1 1 100%}
 .mch-bar .mch-nav>ul>li.has-sub::before{content:"";flex:0 0 30px} /* balances the arrow on the right, so the word itself sits dead centre */
 .mch-bar .mch-subbtn,.mch-bar .mch-subbtn:hover,.mch-bar .mch-subbtn:focus{width:30px;height:52px;margin:0}
 .mch-bar .mch-subbtn svg{width:16px;height:16px}
 .mch-bar .mch-sub{flex:0 0 100%;display:none;padding:0 0 10px;text-align:center}
 .mch-bar li.sub-open>.mch-sub{display:block}
 .mch-bar .mch-sub a{display:block;padding:10px 20px;font-size:calc(var(--ch-sub-fs) * 1.0333);line-height:21px;color:var(--ch-ink);text-decoration:none;text-align:center}
 .mch-bar .mch-sub a:active,.mch-bar .mch-sub a:hover{color:var(--ch-accent)}
}

/* ── footer (Alicia, 2026-10-20) ──
   One centred block: MCF | links | MCX on top, drawn in toward the middle; under it the ways to reach MCE —
   address, phone, Service Request, Newsletter and LinkedIn beside it. The Canadian badge stands apart at the right,
   centred in the height of the two lines rather than on either. Then the small legal line.
   Scale: MCF 22px, MCX 19px (bold wordmark beside thin strokes, balanced by eye), LinkedIn 22px, badge 46px. */
.mcf-foot{padding:18px 0 18px}
.mcf-foot a{text-decoration:none}
.mcf-foot ul{list-style:none;margin:0;padding:0}
.mcf-foot li{margin:0;padding:0}
.mcf-grid{display:grid;grid-template-columns:62px 1fr 62px;grid-template-areas:"l top ca" "l contact ca" "base base base";column-gap:16px;row-gap:12px}
.mcf-top{grid-area:top;display:flex;align-items:center;justify-content:center;gap:40px}
.mcf-foot .mcf-contact{grid-area:contact}
.mcf-ca{grid-area:ca;justify-self:end;align-self:center;display:block;line-height:0}
.mcf-ca img{width:var(--ch-ca);height:var(--ch-ca);display:block}
.mcf-base{grid-area:base}
.mcf-logo{display:block;line-height:0;flex:0 0 auto}
.mcf-logo img{height:var(--ch-flogo-h);width:auto;display:block}
.mcf-mcx img{height:var(--ch-mcx-h)}
.mcf-menu ul{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 22px}
.mcf-menu a{font-size:var(--ch-fmenu-fs);font-weight:400;letter-spacing:.7px;text-transform:uppercase;color:var(--ch-ink);line-height:1.6}
.mcf-menu a:hover,.mcf-menu a:focus-visible{color:var(--ch-accent)}
.mcf-foot .mcf-contact{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 24px}
.mcf-contact a{display:inline-flex;align-items:center;gap:7px;font-size:var(--ch-fcontact-fs);font-weight:300;line-height:1.5;color:var(--ch-ink)}
.mcf-contact a:hover,.mcf-contact a:focus-visible{color:var(--ch-accent)}
.mcf-contact svg{flex:0 0 13px;width:13px;height:13px;color:var(--ch-icon)}
.mcf-foot .mcf-reach{display:flex;align-items:center;gap:14px}
.mcf-foot .mcf-contact .mcf-in{color:var(--ch-icon);line-height:0}
.mcf-foot .mcf-contact .mcf-in:hover{color:var(--ch-accent)}
.mcf-foot .mcf-contact .mcf-in svg{flex:none;width:var(--ch-in);height:var(--ch-in)}
.mcf-base{margin-top:4px;padding-top:12px;border-top:1px solid var(--ch-rule);text-align:center}
.mcf-legal{display:flex;flex-wrap:wrap;justify-content:center}
.mcf-legal li{display:flex;align-items:center}
.mcf-legal li+li::before{content:"";display:block;width:1px;height:11px;margin:0 12px;background:var(--ch-ink);opacity:.4}
.mcf-legal a{font-size:var(--ch-flegal-fs);font-weight:300;letter-spacing:.2px;line-height:1.6;color:var(--ch-ink)}
.mcf-legal a:hover,.mcf-legal a:focus-visible{color:var(--ch-accent)}
.mcf-copy{margin:4px 0 0;font-size:var(--ch-flegal-fs);font-weight:300;letter-spacing:.3px;line-height:1.6;color:var(--ch-ink);text-wrap:balance}

/* narrower than the one-line contact row: the address takes its own line; the logos sit either side of the links,
   and the badge keeps its own place at the right */
@media(max-width:1024px){
 .mcf-foot .mcf-contact .mcf-addr{flex:0 0 100%;display:flex;justify-content:center}
 .mcf-top{gap:28px}
}
/* phone: the two logos as a centred pair with the badge at the right of their line; the links get the full width
   under them, then the contact lines */
@media(max-width:767px){
 .mcf-foot{padding:16px 0 18px}
 .mcf-grid{grid-template-columns:46px 1fr 1fr 46px;grid-template-areas:"l mcf mcx ca" "menu menu menu menu" "contact contact contact contact" "base base base base";column-gap:0;row-gap:18px;align-items:center}
 .mcf-top{display:contents}
 .mcf-mcf{grid-area:mcf;justify-self:end;margin-right:18px}
 .mcf-mcx{grid-area:mcx;justify-self:start;margin-left:18px}
 .mcf-menu{grid-area:menu}
 .mcf-ca{align-self:center}
 .mcf-menu ul{gap:6px 16px}
 .mcf-menu a{font-size:calc(var(--ch-fmenu-fs) * .96);letter-spacing:.6px;line-height:18px;display:block}
 .mcf-foot .mcf-contact{gap:6px 20px}
 .mcf-contact a{line-height:18px;text-align:center}
 .mcf-contact a span{text-wrap:balance}
 .mcf-base{margin-top:0;padding-top:16px}
 .mcf-foot .mcf-legal{display:grid;grid-template-columns:1fr 1fr;gap:4px 0;max-width:300px;margin:0 auto}
 .mcf-legal li{display:block;text-align:center}
 .mcf-legal li+li::before{content:none}
 .mcf-legal a{line-height:18px}
 .mcf-copy{margin-top:8px;line-height:18px}
}
/* small phones: the four links break two and two, never three plus one */
@media(max-width:440px){.mcf-menu ul{max-width:300px;margin:0 auto}}