/*
  Navigator Mega Menu. Every style field maps to a custom property on the wrapper. Presets are variable sets on a
  class; a field the editor sets is written inline on the wrapper and wins for that property only.
  Layout before JavaScript (and without it) uses the no-js class; module.js switches to the js class.
*/

/* ---------- Presets ---------- */
.navigator-mega-menu {
  --navigator-mega-menu-top-color: #1f2937;
  --navigator-mega-menu-heading-color: #4b5563;
  --navigator-mega-menu-link-color: #111827;
  --navigator-mega-menu-desc-color: #4b5563;
  --navigator-mega-menu-bar-bg: #ffffff;
  --navigator-mega-menu-panel-bg: #ffffff;
  --navigator-mega-menu-drawer-bg: #ffffff;
  --navigator-mega-menu-utility-bg: #f3f4f6;
  --navigator-mega-menu-utility-color: #1f2937;
  --navigator-mega-menu-bar-border-color: #e5e7eb;
  --navigator-mega-menu-bar-border-width: 1px;
  --navigator-mega-menu-panel-border-color: #e5e7eb;
  --navigator-mega-menu-divider-color: #e5e7eb;
  --navigator-mega-menu-hover-color: #1d4ed8;
  --navigator-mega-menu-hover-bg: #eff6ff;
  --navigator-mega-menu-active-color: #1d4ed8;
  --navigator-mega-menu-icon-bg: #eff6ff;
  --navigator-mega-menu-card-bg: #f8fafc;
  --navigator-mega-menu-footer-bg: #f8fafc;
  --navigator-mega-menu-badge-bg: #dbeafe;
  --navigator-mega-menu-badge-color: #1e3a8a;
  --navigator-mega-menu-primary-bg: #1d4ed8;
  --navigator-mega-menu-primary-text: #ffffff;
  --navigator-mega-menu-secondary-bg: transparent;
  --navigator-mega-menu-secondary-text: #1d4ed8;
  --navigator-mega-menu-secondary-border: #1d4ed8;
  --navigator-mega-menu-focus-bar: #1d4ed8;
  --navigator-mega-menu-focus-panel: #1d4ed8;
  --navigator-mega-menu-panel-radius: 12px;
  --navigator-mega-menu-button-radius: 8px;
  --navigator-mega-menu-bar-height: 72px;
  --navigator-mega-menu-dropdown-gap: 4px; /* dropdown and More panels sit this far under their item; the hit strip fills it */
  --navigator-mega-menu-utility-height: 36px;
  --navigator-mega-menu-container-width: 1280px;
  --navigator-mega-menu-panel-padding: 32px;
  --navigator-mega-menu-column-gap: 32px;
  --navigator-mega-menu-logo-height: 40px;
  --navigator-mega-menu-shadow: 0 16px 40px rgba(17, 24, 39, 0.12);
  --navigator-mega-menu-duration: 200ms;
  --navigator-mega-menu-panel-easing: ease; /* timing of the panel open animation (fade, or the content slide) */
  --navigator-mega-menu-z: 1000;
  --navigator-mega-menu-blur: none;
}
.navigator-mega-menu--preset-dark {
  --navigator-mega-menu-top-color: #e5e7eb;
  --navigator-mega-menu-heading-color: #9ca3af;
  --navigator-mega-menu-link-color: #f9fafb;
  --navigator-mega-menu-desc-color: #cbd5e1;
  --navigator-mega-menu-bar-bg: #0f172a;
  --navigator-mega-menu-panel-bg: #111827;
  --navigator-mega-menu-drawer-bg: #0f172a;
  --navigator-mega-menu-utility-bg: #020617;
  --navigator-mega-menu-utility-color: #e5e7eb;
  --navigator-mega-menu-bar-border-color: #1e293b;
  --navigator-mega-menu-panel-border-color: #1f2937;
  --navigator-mega-menu-divider-color: #334155;
  --navigator-mega-menu-hover-color: #93c5fd;
  --navigator-mega-menu-hover-bg: #1e293b;
  --navigator-mega-menu-active-color: #93c5fd;
  --navigator-mega-menu-icon-bg: #1e293b;
  --navigator-mega-menu-card-bg: #1e293b;
  --navigator-mega-menu-footer-bg: #0f172a;
  --navigator-mega-menu-badge-bg: #1e3a8a;
  --navigator-mega-menu-badge-color: #dbeafe;
  --navigator-mega-menu-primary-bg: #93c5fd;
  --navigator-mega-menu-primary-text: #0f172a;
  --navigator-mega-menu-secondary-text: #e5e7eb;
  --navigator-mega-menu-secondary-border: #e5e7eb;
  --navigator-mega-menu-focus-bar: #93c5fd;
  --navigator-mega-menu-focus-panel: #93c5fd;
  --navigator-mega-menu-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
}
.navigator-mega-menu--preset-brand_accent {
  --navigator-mega-menu-bar-bg: var(--navigator-mega-menu-theme-primary, #1d4ed8);
  --navigator-mega-menu-top-color: var(--navigator-mega-menu-bar-ink, #ffffff);
  --navigator-mega-menu-bar-border-color: transparent;
  --navigator-mega-menu-utility-bg: #172554;
  --navigator-mega-menu-utility-color: #ffffff;
  --navigator-mega-menu-primary-bg: #ffffff;
  --navigator-mega-menu-primary-text: #1e3a8a;
  --navigator-mega-menu-secondary-text: var(--navigator-mega-menu-bar-ink, #ffffff);
  --navigator-mega-menu-secondary-border: var(--navigator-mega-menu-bar-ink, #ffffff);
  --navigator-mega-menu-focus-bar: var(--navigator-mega-menu-bar-ink, #ffffff);
}
.navigator-mega-menu--preset-frosted_glass {
  --navigator-mega-menu-bar-bg: rgba(255, 255, 255, 0.84); /* 0.84: text keeps 4.5:1 over any content behind the bar (WCAG 1.4.3) */
  --navigator-mega-menu-panel-bg: #ffffff; /* panels and drawer are solid unless Panel background style is Frosted blur */
  --navigator-mega-menu-drawer-bg: #ffffff;
  --navigator-mega-menu-utility-bg: rgba(243, 244, 246, 0.85);
  --navigator-mega-menu-bar-border-color: rgba(17, 24, 39, 0.08);
  --navigator-mega-menu-panel-border-color: rgba(17, 24, 39, 0.08);
  --navigator-mega-menu-panel-radius: 16px;
  --navigator-mega-menu-button-radius: 999px;
  --navigator-mega-menu-blur: saturate(160%) blur(14px);
}
.navigator-mega-menu--shadow-none { --navigator-mega-menu-shadow: none; }
.navigator-mega-menu--shadow-soft { --navigator-mega-menu-shadow: 0 8px 24px rgba(17, 24, 39, 0.08); }
.navigator-mega-menu--shadow-strong { --navigator-mega-menu-shadow: 0 24px 56px rgba(17, 24, 39, 0.28); }

/* ---------- Base ---------- */
.navigator-mega-menu {
  position: relative;
  z-index: var(--navigator-mega-menu-z);
  font-family: var(--navigator-mega-menu-top-family, inherit);
  line-height: 1.4;
}
/* With two menus on a page, the one with an open panel stacks above the others (its panel can hang over the next
   menu's bar), and the one holding keyboard focus in an open panel stacks above a hover-opened one (Portia #23). */
.navigator-mega-menu:has(.navigator-mega-menu-item--open) { z-index: calc(var(--navigator-mega-menu-z) + 1); }
.navigator-mega-menu:focus-within:has(.navigator-mega-menu-item--open) { z-index: calc(var(--navigator-mega-menu-z) + 2); }
.navigator-mega-menu *, .navigator-mega-menu *::before, .navigator-mega-menu *::after { box-sizing: border-box; }
.navigator-mega-menu [hidden] { display: none !important; }
.navigator-mega-menu ul { list-style: none; margin: 0; padding: 0; }
.navigator-mega-menu p { margin: 0; }
.navigator-mega-menu a, .navigator-mega-menu button { -webkit-tap-highlight-color: transparent; }
.navigator-mega-menu-visually-hidden {
  position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.navigator-mega-menu-icon { width: 20px; height: 20px; flex: none; }
.navigator-mega-menu-icon--small { width: 16px; height: 16px; }
/* Skip link: clipped to nothing until it has focus. An offset such as top: -100px only hides it for a menu at the very
   top of the page; a second menu further down showed it over the content above (prelisting QA c). module.js keeps
   only the first skip link on the page. */
.navigator-mega-menu-skip:not(:focus) {
  position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}
.navigator-mega-menu-skip:focus {
  position: absolute; left: 16px; top: 8px; z-index: 2; padding: 12px 16px;
  background: var(--navigator-mega-menu-primary-bg); color: var(--navigator-mega-menu-primary-text); border-radius: var(--navigator-mega-menu-button-radius);
  font-weight: 600; text-decoration: none;
}

/* Focus: always visible, 2px minimum, never removed. */
.navigator-mega-menu a:focus-visible, .navigator-mega-menu button:focus-visible, .navigator-mega-menu input:focus-visible {
  outline: 3px solid var(--navigator-mega-menu-focus-panel); outline-offset: 2px;
}
/* Controls on the bar take the bar's ring colour. The top-level selectors start with .navigator-mega-menu so they outrank the
   panel rule above (.navigator-mega-menu button:focus-visible): without it Brand Accent's top-level ring was the panel blue on a
   blue bar, 1.00:1 (Portia, Oct 19 2026). Only the top level: triggers inside More sit on the panel colour. */
.navigator-mega-menu .navigator-mega-menu-bar-inner > a:focus-visible, .navigator-mega-menu .navigator-mega-menu-bar-inner > button:focus-visible,
.navigator-mega-menu .navigator-mega-menu-list > .navigator-mega-menu-item > .navigator-mega-menu-trigger:focus-visible, .navigator-mega-menu .navigator-mega-menu-list > .navigator-mega-menu-item > .navigator-mega-menu-top-link:focus-visible,
.navigator-mega-menu .navigator-mega-menu-actions > a:focus-visible, .navigator-mega-menu .navigator-mega-menu-actions > button:focus-visible,
.navigator-mega-menu .navigator-mega-menu-search-link:focus-visible, .navigator-mega-menu .navigator-mega-menu-search-toggle:focus-visible, .navigator-mega-menu .navigator-mega-menu-lang-toggle:focus-visible { outline-color: var(--navigator-mega-menu-focus-bar); }
/* The utility row keeps its own background (Brand Accent: navy under any theme colour), so its ring is its own text
   colour, which has 4.5:1 on that row, not the bar's ink (Portia pr19-qa r2: black on navy, 1.43:1). */
.navigator-mega-menu .navigator-mega-menu-utility a:focus-visible { outline-color: var(--navigator-mega-menu-utility-color); }
/* The search form and language list open as dropdowns on the panel colour: they keep the panel ring (the bar rule
   above used to reach them through .actions, white on white on Brand Accent, QA #19). */
/* The skip link appears over whatever is at the top (utility row or bar), so its ring sits inside its own box, in its
   own text colour, which already has 4.5:1 on its background (QA #19: 2.19:1 on the dark utility row). */
.navigator-mega-menu .navigator-mega-menu-skip:focus-visible { outline-color: var(--navigator-mega-menu-primary-text); outline-offset: -5px; }
/* The drawer is not the bar: everything in it takes the panel ring colour (Brand Accent's bar ring is white and the
   drawer is white). The no-JS drawer has the same rule inside the breakpoint block below. */
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-menu :is(a, button, input):focus-visible,
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-menu .navigator-mega-menu-list > .navigator-mega-menu-item > :is(.navigator-mega-menu-trigger, .navigator-mega-menu-top-link):focus-visible { outline-color: var(--navigator-mega-menu-focus-panel); }

.navigator-mega-menu-container { width: 100%; max-width: var(--navigator-mega-menu-container-width); margin: 0 auto; padding: 0 24px; }

/* ---------- Utility bar ---------- */
.navigator-mega-menu-utility { background: var(--navigator-mega-menu-utility-bg); color: var(--navigator-mega-menu-utility-color); font-size: 0.8125rem; }
.navigator-mega-menu-utility-inner { display: flex; justify-content: flex-end; align-items: center; min-height: var(--navigator-mega-menu-utility-height); }
.navigator-mega-menu-utility-list { display: flex; flex-wrap: wrap; gap: 4px 20px; }
.navigator-mega-menu-utility-link { display: inline-flex; align-items: center; gap: 6px; color: inherit; text-decoration: none; padding: 4px 0; }
.navigator-mega-menu-utility-link:hover { text-decoration: underline; }
.navigator-mega-menu-drawer-utility { display: none; }

/* ---------- Bar ---------- */
/* The blur lives on ::before: a backdrop-filter on the bar itself would stop the panels inside it from blurring. */
.navigator-mega-menu-bar {
  position: relative; isolation: isolate;
  background: var(--navigator-mega-menu-bar-bg);
  border-bottom: var(--navigator-mega-menu-bar-border-width) solid var(--navigator-mega-menu-bar-border-color);
}
.navigator-mega-menu-bar::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  -webkit-backdrop-filter: var(--navigator-mega-menu-blur); backdrop-filter: var(--navigator-mega-menu-blur);
}
/* Frosted on any preset: the bar colour at 84% over a blurred page (the preset's own colour stays the base). 84% is
   the least that keeps every default text pair at 4.5:1 over pure black and pure white content (frosted worst-case test). */
.navigator-mega-menu--bar-frosted { --navigator-mega-menu-blur: saturate(160%) blur(14px); }
/* The colour sits on ::before with the backdrop filter: an element's own background is not filtered, so
   saturate(160%) cannot brighten the bar colour itself (it did, QA #18: 4.57:1 rendered against 4.82:1 computed).
   --navigator-mega-menu-frost-mix is raised by the module for a Brand Accent theme colour that needs it. */
.navigator-mega-menu--bar-frosted .navigator-mega-menu-bar { background: transparent; }
.navigator-mega-menu--bar-frosted .navigator-mega-menu-bar::before { background: color-mix(in srgb, var(--navigator-mega-menu-bar-bg) var(--navigator-mega-menu-frost-mix, 84%), transparent); }
/* Frosted Glass is already see-through; the Frosted style must not thin it a second time. */
.navigator-mega-menu--preset-frosted_glass.navigator-mega-menu--bar-frosted .navigator-mega-menu-bar::before { background: var(--navigator-mega-menu-bar-bg); }
.navigator-mega-menu--bar-gradient .navigator-mega-menu-bar { background: linear-gradient(90deg, var(--navigator-mega-menu-bar-bg), var(--navigator-mega-menu-bar-bg-end, var(--navigator-mega-menu-bar-bg))); }
.navigator-mega-menu-bar-inner { display: flex; align-items: center; gap: 16px; min-height: var(--navigator-mega-menu-bar-height); }
.navigator-mega-menu-logo { display: inline-flex; align-items: center; flex: none; color: var(--navigator-mega-menu-top-color); text-decoration: none; font-weight: 700; }
/* A definite height plus the img width/height attributes (from the image field) lets the browser reserve the logo box before the image loads (no CLS). */
.navigator-mega-menu-logo-image { display: block; height: var(--navigator-mega-menu-logo-height); width: auto; object-fit: contain; object-position: left center; }
.navigator-mega-menu-logo-image--alternate { display: none; }
.navigator-mega-menu-menu { display: flex; flex: 1; align-items: center; gap: 12px; min-width: 0; }
/* While the page is still arriving the browser can paint a partly parsed bar (the nav, then half of the actions);
   when the rest arrives the actions grow and the menu items move. Until the end marker after the actions is parsed
   the menu's content is laid out but not painted, so it appears once, in its final place (CLS 0). Browsers without :has()
   ignore the rule and paint progressively as before.
   Fail-safe: if the marker never arrives (a truncated response, an edited template or a rewrite that drops it),
   the reveal animation shows the menu after 2 s anyway. The rule sits on the menu's children, not the menu, because
   the mobile drawer sets its own animation on the menu, which would replace the reveal. The mobile drawer is
   display: none while closed and showing it restarts the delay, so there the content appears 2 s after opening. A site-wide reduced-motion rule that sets
   animation: none !important cancels the fail-safe; the module's own reduced-motion rule does not (it shortens
   durations, not the delay). */
/* Slow connections: the 2 s fail-safe starts only once the nav (the bulk of the bar, panels inline) has fully arrived,
   that is once anything follows it, so a slow stream never reveals a half-parsed nav that then reflows. A response cut
   inside the nav still reveals through the 8 s backstop. */
.navigator-mega-menu-bar .navigator-mega-menu-menu:not(:has(> .navigator-mega-menu-parsed)) > * { visibility: hidden; animation: navigator-mega-menu-reveal-late 0s 8s forwards; }
.navigator-mega-menu-bar .navigator-mega-menu-menu:not(:has(> .navigator-mega-menu-parsed)):has(> .navigator-mega-menu-nav + *) > * { animation: navigator-mega-menu-reveal-late 0s 8s forwards, navigator-mega-menu-reveal 0s 2s forwards; }
/* The utility row has the same gate: a partly parsed row grows leftwards as its links arrive (CLS on a slow load, QA
   cls-utility). Its own end marker follows the list; the same 2 s fail-safe applies. */
.navigator-mega-menu-utility-inner:not(:has(> .navigator-mega-menu-parsed)) > * { visibility: hidden; animation: navigator-mega-menu-reveal 0s 2s forwards; }
@keyframes navigator-mega-menu-reveal { to { visibility: visible; } }
@keyframes navigator-mega-menu-reveal-late { to { visibility: visible; } }
.navigator-mega-menu-nav { flex: 1; min-width: 0; display: flex; }
.navigator-mega-menu--align-right .navigator-mega-menu-nav { justify-content: flex-end; }
.navigator-mega-menu--align-center .navigator-mega-menu-nav { justify-content: center; }
.navigator-mega-menu--logo-center .navigator-mega-menu-bar-inner { justify-content: center; }
.navigator-mega-menu--logo-center .navigator-mega-menu-logo { order: 0; }
.navigator-mega-menu-list { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; }
.navigator-mega-menu-item { position: static; }
.navigator-mega-menu-item--width-content, .navigator-mega-menu-item--more { position: relative; }

.navigator-mega-menu-trigger, .navigator-mega-menu-top-link {
  display: inline-flex; align-items: center; gap: 4px; min-height: 44px; padding: 0 10px;
  margin: 0; border: 0; border-radius: 8px; background: none; cursor: pointer;
  color: var(--navigator-mega-menu-top-color); text-decoration: none; white-space: nowrap;
  font: inherit; font-family: var(--navigator-mega-menu-top-family, inherit); font-size: var(--navigator-mega-menu-top-size, 1rem);
  font-weight: var(--navigator-mega-menu-top-weight, 500);
}
.navigator-mega-menu-trigger:hover, .navigator-mega-menu-top-link:hover { color: var(--navigator-mega-menu-hover-color); }
.navigator-mega-menu--preset-brand_accent .navigator-mega-menu-trigger:hover, .navigator-mega-menu--preset-brand_accent .navigator-mega-menu-top-link:hover { color: var(--navigator-mega-menu-top-color); text-decoration: underline; text-underline-offset: 6px; }
.navigator-mega-menu-item--active > .navigator-mega-menu-trigger, .navigator-mega-menu-item--active > .navigator-mega-menu-top-link { color: var(--navigator-mega-menu-active-color); box-shadow: inset 0 -3px 0 currentColor; }
.navigator-mega-menu--preset-brand_accent .navigator-mega-menu-item--active > .navigator-mega-menu-trigger, .navigator-mega-menu--preset-brand_accent .navigator-mega-menu-item--active > .navigator-mega-menu-top-link { color: var(--navigator-mega-menu-top-color); }
.navigator-mega-menu--underline-none .navigator-mega-menu-item--active > .navigator-mega-menu-trigger, .navigator-mega-menu--underline-none .navigator-mega-menu-item--active > .navigator-mega-menu-top-link { box-shadow: none; }
.navigator-mega-menu--underline-underline .navigator-mega-menu-item--active > .navigator-mega-menu-trigger, .navigator-mega-menu--underline-underline .navigator-mega-menu-item--active > .navigator-mega-menu-top-link,
.navigator-mega-menu--underline-underline .navigator-mega-menu-trigger:hover, .navigator-mega-menu--underline-underline .navigator-mega-menu-top-link:hover { box-shadow: none; text-decoration: underline; text-underline-offset: 6px; }
.navigator-mega-menu-chevron { width: 16px; height: 16px; transition: transform var(--navigator-mega-menu-duration) ease; }
.navigator-mega-menu-trigger[aria-expanded="true"] .navigator-mega-menu-chevron { transform: rotate(180deg); }
.navigator-mega-menu-trigger[aria-expanded="true"] { color: var(--navigator-mega-menu-hover-color); }
.navigator-mega-menu--preset-brand_accent .navigator-mega-menu-trigger[aria-expanded="true"] { color: var(--navigator-mega-menu-top-color); }

/* ---------- Panels ---------- */
.navigator-mega-menu-panel {
  position: absolute; top: 100%; left: 0; right: 0; z-index: 1;
  background: var(--navigator-mega-menu-panel-bg); color: var(--navigator-mega-menu-link-color);
  border: 1px solid var(--navigator-mega-menu-panel-border-color); border-top: 0;
  border-radius: 0 0 var(--navigator-mega-menu-panel-radius) var(--navigator-mega-menu-panel-radius);
  box-shadow: var(--navigator-mega-menu-shadow);
  text-align: left;
}
/* Hit strip: fills exactly the gap between the trigger and its open panel, starting at the panel's top edge, so a
   pointer crossing slowly stays inside the item and the hover close timer never starts (Portia ci-call-0832, WCAG
   1.4.13). It never overlaps the bar row: mega panels hang from the bar's bottom, so their gap is half of
   (bar height - 44 px trigger), 14 px at the default 72 px; dropdown and More panels sit --dropdown-gap (4 px) under
   their item. Top-level desktop panels only; a hidden panel is display: none, so the strip exists only while open. */
.navigator-mega-menu-list > .navigator-mega-menu-item > .navigator-mega-menu-panel::before {
  content: ""; position: absolute; left: 0; right: 0; bottom: 100%; height: max(0px, calc((var(--navigator-mega-menu-bar-height) - 44px) / 2));
}
/* + 1px: these panels have a 1px top border and the strip is measured from the padding edge. */
.navigator-mega-menu-list > .navigator-mega-menu-item > .navigator-mega-menu-panel--width-content::before { height: calc(var(--navigator-mega-menu-dropdown-gap) + 1px); }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-list > .navigator-mega-menu-item > .navigator-mega-menu-panel::before { content: none; }
.navigator-mega-menu-panel--width-full { left: 0; right: 0; border-radius: 0; border-left: 0; border-right: 0; }
.navigator-mega-menu-panel--width-container { left: max(16px, calc((100% - var(--navigator-mega-menu-container-width)) / 2 + 24px)); right: max(16px, calc((100% - var(--navigator-mega-menu-container-width)) / 2 + 24px)); }
.navigator-mega-menu-panel--width-content { left: 0; right: auto; width: max-content; min-width: 260px; max-width: min(92vw, 420px); border-top: 1px solid var(--navigator-mega-menu-panel-border-color); border-radius: var(--navigator-mega-menu-panel-radius); margin-top: var(--navigator-mega-menu-dropdown-gap); }
.navigator-mega-menu-panel-inner { padding: var(--navigator-mega-menu-panel-padding); }
.navigator-mega-menu-panel--dropdown .navigator-mega-menu-panel-inner, .navigator-mega-menu-panel--more .navigator-mega-menu-more-list { padding: 12px; }
.navigator-mega-menu-back, .navigator-mega-menu-panel-title { display: none; }
.navigator-mega-menu-overview {
  display: inline-flex; align-items: center; gap: 6px; margin-bottom: 20px; font-weight: 600;
  color: var(--navigator-mega-menu-hover-color); text-decoration: none;
}
.navigator-mega-menu-overview:hover { text-decoration: underline; }
.navigator-mega-menu-panel-body { display: block; }
.navigator-mega-menu-panel-body--featured-right, .navigator-mega-menu-panel-body--featured-left { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 300px); gap: var(--navigator-mega-menu-column-gap); }
.navigator-mega-menu-panel-body--featured-left { grid-template-columns: minmax(220px, 300px) minmax(0, 1fr); }
.navigator-mega-menu-panel-body--featured-left > .navigator-mega-menu-featured { order: -1; }
.navigator-mega-menu-columns { display: grid; grid-template-columns: repeat(var(--navigator-mega-menu-cols, 3), minmax(0, 1fr)); gap: var(--navigator-mega-menu-column-gap); }
.navigator-mega-menu-columns--1 { --navigator-mega-menu-cols: 1; } .navigator-mega-menu-columns--2 { --navigator-mega-menu-cols: 2; } .navigator-mega-menu-columns--3 { --navigator-mega-menu-cols: 3; }
.navigator-mega-menu-columns--4 { --navigator-mega-menu-cols: 4; } .navigator-mega-menu-columns--5 { --navigator-mega-menu-cols: 5; } .navigator-mega-menu-columns--6 { --navigator-mega-menu-cols: 6; }
/* Doubled class (here and on the card eyebrow, title and text, also <p>): page CSS such as ".section p { color: #fff }" (0,1,1) must not recolour the column headings, which
   are <p> elements; on the frosted demo it turned them white on a white panel (prelisting QA b). */
.navigator-mega-menu .navigator-mega-menu-heading {
  margin: 0 0 12px; color: var(--navigator-mega-menu-heading-color);
  font-family: var(--navigator-mega-menu-heading-family, inherit); font-size: var(--navigator-mega-menu-heading-size, 0.8125rem);
  font-weight: var(--navigator-mega-menu-heading-weight, 600); letter-spacing: 0.04em; text-transform: uppercase;
}
.navigator-mega-menu-heading-link { color: inherit; text-decoration: none; }
.navigator-mega-menu-heading-link:hover { color: var(--navigator-mega-menu-hover-color); text-decoration: underline; }
.navigator-mega-menu-links { display: grid; gap: 2px; }
.navigator-mega-menu-links--nested { margin: 2px 0 6px 12px; padding-left: 12px; border-left: 1px solid var(--navigator-mega-menu-divider-color); }
.navigator-mega-menu-link {
  display: flex; align-items: flex-start; gap: 12px; padding: 8px; margin: 0 -8px; border-radius: 8px;
  color: var(--navigator-mega-menu-link-color); text-decoration: none;
  font-family: var(--navigator-mega-menu-link-family, inherit); font-size: var(--navigator-mega-menu-link-size, 0.9375rem); font-weight: var(--navigator-mega-menu-link-weight, 500);
}
.navigator-mega-menu-link:hover, .navigator-mega-menu-link[aria-current="page"] { background: var(--navigator-mega-menu-hover-bg); color: var(--navigator-mega-menu-hover-color); }
.navigator-mega-menu--underline-underline .navigator-mega-menu-link:hover .navigator-mega-menu-link-label { text-decoration: underline; }
.navigator-mega-menu-link-text { display: flex; flex-direction: column; min-width: 0; }
.navigator-mega-menu-link-desc {
  margin-top: 2px; color: var(--navigator-mega-menu-desc-color); font-weight: var(--navigator-mega-menu-desc-weight, 400);
  font-family: var(--navigator-mega-menu-desc-family, inherit); font-size: var(--navigator-mega-menu-desc-size, 0.8125rem);
}
.navigator-mega-menu-link-icon {
  display: inline-flex; align-items: center; justify-content: center; flex: none; width: 36px; height: 36px;
  border-radius: 8px; background: var(--navigator-mega-menu-icon-bg); color: var(--navigator-mega-menu-hover-color);
}
.navigator-mega-menu-custom-icon { width: 24px; height: 24px; object-fit: contain; }
.navigator-mega-menu-thumb { flex: none; width: 64px; height: 48px; object-fit: cover; border-radius: 6px; margin-left: auto; }
.navigator-mega-menu-badge {
  display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px; vertical-align: 1px;
  background: var(--navigator-mega-menu-badge-bg); color: var(--navigator-mega-menu-badge-color); font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.02em;
}
.navigator-mega-menu-deep { display: none; }

/* Tabbed mega */
.navigator-mega-menu-tabs { display: grid; grid-template-columns: minmax(180px, 240px) minmax(0, 1fr); gap: var(--navigator-mega-menu-column-gap); }
.navigator-mega-menu-tablist { display: flex; flex-direction: column; gap: 2px; padding-right: 16px; border-right: 1px solid var(--navigator-mega-menu-divider-color); }
.navigator-mega-menu-tab {
  display: flex; align-items: center; min-height: 44px; padding: 8px 12px; border: 0; border-radius: 8px;
  background: none; color: var(--navigator-mega-menu-link-color); font: inherit; font-weight: 500; text-align: left; cursor: pointer;
}
.navigator-mega-menu-tab:hover, .navigator-mega-menu-tab[aria-selected="true"] { background: var(--navigator-mega-menu-hover-bg); color: var(--navigator-mega-menu-hover-color); }
.navigator-mega-menu--no-js .navigator-mega-menu-tablist { display: none; }
.navigator-mega-menu--no-js .navigator-mega-menu-tabs { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.navigator-mega-menu--js .navigator-mega-menu-tab-heading { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Featured card and posts */
.navigator-mega-menu-featured { display: flex; flex-direction: column; gap: 10px; padding: 20px; border-radius: calc(var(--navigator-mega-menu-panel-radius) - 4px); background: var(--navigator-mega-menu-card-bg); }
.navigator-mega-menu-card-image { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 8px; }
.navigator-mega-menu .navigator-mega-menu-card-eyebrow { color: var(--navigator-mega-menu-heading-color); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
.navigator-mega-menu .navigator-mega-menu-card-title { color: var(--navigator-mega-menu-link-color); font-size: 1.0625rem; font-weight: 700; }
.navigator-mega-menu .navigator-mega-menu-card-text { color: var(--navigator-mega-menu-desc-color); font-size: 0.875rem; }
.navigator-mega-menu-card-button { align-self: flex-start; margin-top: 4px; }
.navigator-mega-menu-post-list { display: grid; gap: 12px; }
.navigator-mega-menu-post-link { display: flex; gap: 12px; align-items: center; color: var(--navigator-mega-menu-link-color); text-decoration: none; font-size: 0.875rem; font-weight: 600; }
.navigator-mega-menu-post-link:hover .navigator-mega-menu-post-title { color: var(--navigator-mega-menu-hover-color); text-decoration: underline; }
.navigator-mega-menu-post-image { flex: none; width: 96px; height: 64px; object-fit: cover; border-radius: 6px; }

/* Footer strip */
.navigator-mega-menu-panel-footer {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px;
  padding: 14px var(--navigator-mega-menu-panel-padding); border-top: 1px solid var(--navigator-mega-menu-divider-color);
  background: var(--navigator-mega-menu-footer-bg); color: var(--navigator-mega-menu-desc-color); font-size: 0.875rem;
  border-radius: 0 0 var(--navigator-mega-menu-panel-radius) var(--navigator-mega-menu-panel-radius);
}
.navigator-mega-menu-panel--width-full .navigator-mega-menu-panel-footer { border-radius: 0; }
.navigator-mega-menu-panel--width-full .navigator-mega-menu-panel-inner { max-width: var(--navigator-mega-menu-container-width); margin-left: auto; margin-right: auto; }
.navigator-mega-menu-panel--width-full .navigator-mega-menu-panel-footer { padding-left: max(24px, calc((100% - var(--navigator-mega-menu-container-width)) / 2 + 24px)); padding-right: max(24px, calc((100% - var(--navigator-mega-menu-container-width)) / 2 + 24px)); }
.navigator-mega-menu-panel-footer-link { display: inline-flex; align-items: center; gap: 6px; min-height: 24px; color: var(--navigator-mega-menu-hover-color); font-weight: 600; text-decoration: none; }
.navigator-mega-menu-panel-footer-link:hover { text-decoration: underline; }

/* ---------- Actions: search, language, buttons ---------- */
.navigator-mega-menu-actions { display: flex; align-items: center; gap: 8px; flex: none; }
.navigator-mega-menu-search, .navigator-mega-menu-lang { position: relative; }
.navigator-mega-menu-search-link, .navigator-mega-menu-search-toggle, .navigator-mega-menu-lang-toggle, .navigator-mega-menu-menu-link, .navigator-mega-menu-menu-toggle, .navigator-mega-menu-close, .navigator-mega-menu-close-link {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 44px; min-height: 44px; padding: 0 10px;
  border: 0; border-radius: 8px; background: none; color: var(--navigator-mega-menu-top-color); font: inherit; cursor: pointer; text-decoration: none;
}
.navigator-mega-menu-search-link:hover, .navigator-mega-menu-search-toggle:hover, .navigator-mega-menu-lang-toggle:hover { color: var(--navigator-mega-menu-hover-color); }
.navigator-mega-menu--preset-brand_accent .navigator-mega-menu-search-toggle:hover, .navigator-mega-menu--preset-brand_accent .navigator-mega-menu-lang-toggle:hover { color: var(--navigator-mega-menu-top-color); }
.navigator-mega-menu-search-toggle, .navigator-mega-menu-menu-toggle, .navigator-mega-menu-close { display: none; }
.navigator-mega-menu--js .navigator-mega-menu-search-toggle { display: inline-flex; }
.navigator-mega-menu--js .navigator-mega-menu-search-link, .navigator-mega-menu--js .navigator-mega-menu-menu-link, .navigator-mega-menu--js .navigator-mega-menu-close-link { display: none; }
.navigator-mega-menu-search-form {
  position: absolute; right: 0; top: calc(100% + 8px); display: none; align-items: center; gap: 4px; width: min(360px, 86vw); padding: 8px;
  background: var(--navigator-mega-menu-panel-bg); border: 1px solid var(--navigator-mega-menu-panel-border-color); border-radius: var(--navigator-mega-menu-panel-radius); box-shadow: var(--navigator-mega-menu-shadow);
}
.navigator-mega-menu--js .navigator-mega-menu-search-form:not([hidden]) { display: flex; }
.navigator-mega-menu-search-input {
  flex: 1; min-width: 0; min-height: 44px; padding: 0 12px; border: 1px solid #6b7280; border-radius: 8px;
  background: #ffffff; color: #111827; font: inherit;
}
.navigator-mega-menu-search-submit {
  display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; border: 0; border-radius: 8px;
  background: var(--navigator-mega-menu-primary-bg); color: var(--navigator-mega-menu-primary-text); cursor: pointer;
}
.navigator-mega-menu--preset-brand_accent .navigator-mega-menu-actions .navigator-mega-menu-button--primary { border-color: var(--navigator-mega-menu-primary-edge, transparent); }
.navigator-mega-menu--preset-brand_accent .navigator-mega-menu-search-submit { background: var(--navigator-mega-menu-bar-bg); color: var(--navigator-mega-menu-bar-ink, #ffffff); }
.navigator-mega-menu-lang-list {
  position: absolute; right: 0; top: calc(100% + 8px); display: none; min-width: 180px; padding: 8px;
  background: var(--navigator-mega-menu-panel-bg); border: 1px solid var(--navigator-mega-menu-panel-border-color); border-radius: var(--navigator-mega-menu-panel-radius); box-shadow: var(--navigator-mega-menu-shadow);
}
.navigator-mega-menu--js .navigator-mega-menu-lang-list:not([hidden]) { display: block; }
.navigator-mega-menu-lang-link { display: flex; align-items: center; min-height: 44px; padding: 0 12px; border-radius: 8px; color: var(--navigator-mega-menu-link-color); text-decoration: none; }
.navigator-mega-menu-lang-link:hover { background: var(--navigator-mega-menu-hover-bg); color: var(--navigator-mega-menu-hover-color); }
.navigator-mega-menu-button {
  display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 18px; white-space: nowrap;
  border: 2px solid transparent; border-radius: var(--navigator-mega-menu-button-radius); font-weight: 600; text-decoration: none;
  transition: filter var(--navigator-mega-menu-duration) ease;
}
.navigator-mega-menu-button--primary { background: var(--navigator-mega-menu-primary-bg); color: var(--navigator-mega-menu-primary-text); }
.navigator-mega-menu-button--secondary { background: var(--navigator-mega-menu-secondary-bg); color: var(--navigator-mega-menu-secondary-text); border-color: var(--navigator-mega-menu-secondary-border); }
.navigator-mega-menu-button:hover { filter: brightness(0.92); text-decoration: underline; }
.navigator-mega-menu-panel .navigator-mega-menu-button--primary { background: #1d4ed8; color: #ffffff; }
.navigator-mega-menu--preset-dark .navigator-mega-menu-panel .navigator-mega-menu-button--primary { background: #93c5fd; color: #0f172a; }

/* ---------- More overflow ---------- */
.navigator-mega-menu-more-list { display: grid; gap: 2px; }
.navigator-mega-menu-more-list .navigator-mega-menu-trigger, .navigator-mega-menu-more-list .navigator-mega-menu-top-link { width: 100%; justify-content: space-between; color: var(--navigator-mega-menu-link-color); }
.navigator-mega-menu-more-list .navigator-mega-menu-panel { position: static; box-shadow: none; border: 0; width: auto; max-width: none; min-width: 0; margin: 0; background: transparent; }
.navigator-mega-menu-more-list .navigator-mega-menu-panel-inner { padding: 4px 0 8px 12px; }
.navigator-mega-menu-more-list .navigator-mega-menu-columns, .navigator-mega-menu-more-list .navigator-mega-menu-panel-body, .navigator-mega-menu-more-list .navigator-mega-menu-tabs { display: block; }
.navigator-mega-menu-more-list .navigator-mega-menu-featured, .navigator-mega-menu-more-list .navigator-mega-menu-panel-footer, .navigator-mega-menu-more-list .navigator-mega-menu-tablist { display: none; }

/* ---------- No JavaScript, desktop: panels open on hover and keyboard focus ---------- */
.navigator-mega-menu--no-js .navigator-mega-menu-panel { display: none; }
.navigator-mega-menu--no-js .navigator-mega-menu-item:hover > .navigator-mega-menu-panel, .navigator-mega-menu--no-js .navigator-mega-menu-item:focus-within > .navigator-mega-menu-panel { display: block; }
.navigator-mega-menu--no-js .navigator-mega-menu-search:focus-within .navigator-mega-menu-search-form, .navigator-mega-menu--no-js .navigator-mega-menu-lang:hover .navigator-mega-menu-lang-list, .navigator-mega-menu--no-js .navigator-mega-menu-lang:focus-within .navigator-mega-menu-lang-list { display: block; }
.navigator-mega-menu--no-js .navigator-mega-menu-search-form { display: none; }

/* ---------- JavaScript, desktop ---------- */
.navigator-mega-menu--js .navigator-mega-menu-list { flex-wrap: nowrap; }
/* When items fold into More the list fills the nav and packs from the start edge. That matches the first row of the
   wrapped list before JavaScript for every alignment, so no item moves when module.js tidies the overflow (CLS 0). */
.navigator-mega-menu--js[data-overflow]:not([data-overflow="0"]) .navigator-mega-menu-list { flex: 1 1 auto; }
.navigator-mega-menu-panel--warm { visibility: hidden !important; animation: none !important; }
.navigator-mega-menu--js .navigator-mega-menu-item--open > .navigator-mega-menu-panel { animation: navigator-mega-menu-in var(--navigator-mega-menu-duration) var(--navigator-mega-menu-panel-easing) both; }
.navigator-mega-menu--anim-none.navigator-mega-menu--js .navigator-mega-menu-item--open > .navigator-mega-menu-panel { animation: none; }
@keyframes navigator-mega-menu-in { from { opacity: 0; } to { opacity: 1; } }
/* Slide: the panel box (and its hit strip) only fades in place; its children slide down 6 px. The strip never moves, so
   no frame of the open puts it over the bar row (Portia pr31-qa: a counter-animated strip hit-tests 1 px high mid-slide).
   The clip keeps the sliding content inside the panel's top edge (visually and for hit-testing) and ends with the
   animation (fill backwards only), so focus rings are never clipped once open. */
.navigator-mega-menu--anim-slide.navigator-mega-menu--js .navigator-mega-menu-item--open > .navigator-mega-menu-panel > * { animation: navigator-mega-menu-slide var(--navigator-mega-menu-duration) var(--navigator-mega-menu-panel-easing) backwards; }
@keyframes navigator-mega-menu-slide { from { transform: translateY(-6px); clip-path: inset(6px -100vmax -100vmax -100vmax); } to { transform: none; clip-path: inset(0 -100vmax -100vmax -100vmax); } }
.navigator-mega-menu-more-list .navigator-mega-menu-item--open > .navigator-mega-menu-panel, .navigator-mega-menu-more-list .navigator-mega-menu-item--open > .navigator-mega-menu-panel > * { animation: none; }

/* ---------- Editor notes (editor only) ---------- */
.navigator-mega-menu-editor-note { margin: 8px 24px; padding: 12px 16px; border: 1px dashed #b45309; border-radius: 8px; background: #fffbeb; color: #78350f; font-size: 0.875rem; }
.navigator-mega-menu-editor-note p + p { margin-top: 6px; }

/* ---------- Mobile before JavaScript and without it ---------- */
/* breakpoint 768 */
@media (max-width: 767.98px) {
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu { display: none; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu-link { margin-left: auto; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target {
    position: fixed; inset: 0; z-index: 2; display: block; overflow-y: auto; padding: 16px 20px 32px;
    background: var(--navigator-mega-menu-drawer-bg); color: var(--navigator-mega-menu-link-color);
  }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-drawer-head { display: flex; justify-content: flex-end; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-nav, .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-list { display: block; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-item { border-bottom: 1px solid var(--navigator-mega-menu-divider-color); padding: 4px 0; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-trigger, .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-top-link { width: 100%; color: var(--navigator-mega-menu-link-color); padding: 0; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-chevron { display: none; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-item--active > .navigator-mega-menu-trigger, .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-item--active > .navigator-mega-menu-top-link { box-shadow: none; font-weight: 700; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-list > .navigator-mega-menu-item > .navigator-mega-menu-panel::before { content: none; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-panel { position: static; display: block; border: 0; box-shadow: none; background: none; width: auto; max-width: none; margin: 0; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-panel-inner { padding: 4px 0 12px 12px; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-columns, .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-panel-body, .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-tabs { display: block; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-column + .navigator-mega-menu-column { margin-top: 12px; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-featured { display: none; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-panel-footer { display: flex; flex-wrap: wrap; gap: 4px 12px; padding: 8px 0 0; background: none; border: 0; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-deep { display: block; padding-left: 16px; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-deep-link { display: flex; align-items: center; min-height: 44px; color: var(--navigator-mega-menu-link-color); text-decoration: none; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-link { min-height: 44px; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-actions { flex-wrap: wrap; margin-top: 20px; }
  /* Brand Accent drawer buttons, the same as the JS drawer: with JS off the bar's ink (white on dark theme colours) left
     the secondary button white on the white drawer (Portia pr19-qa r2, #0f766e) and the primary fill without an edge. */
  .navigator-mega-menu--preset-brand_accent.navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-actions .navigator-mega-menu-button--primary { background: var(--navigator-mega-menu-bar-bg); color: var(--navigator-mega-menu-bar-ink, #ffffff); border-color: var(--navigator-mega-menu-drawer-primary-edge, transparent); }
  .navigator-mega-menu--preset-brand_accent.navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-actions .navigator-mega-menu-button--secondary { background: transparent; color: var(--navigator-mega-menu-drawer-accent, var(--navigator-mega-menu-bar-bg)); border-color: var(--navigator-mega-menu-drawer-accent, var(--navigator-mega-menu-bar-bg)); }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-search-link, .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-lang-toggle { color: var(--navigator-mega-menu-link-color); }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-drawer-utility { display: block; margin-top: 16px; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-utility-link { min-height: 44px; }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-close-link { color: var(--navigator-mega-menu-link-color); }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target :is(a, button, input):focus-visible,
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-list > .navigator-mega-menu-item > :is(.navigator-mega-menu-trigger, .navigator-mega-menu-top-link):focus-visible { outline-color: var(--navigator-mega-menu-focus-panel); }
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-utility { display: none; }
}
@media (min-width: 768px) {
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-menu-link { display: none; }
  /* Before JavaScript (and without it) a menu too long for one line wraps below the bar instead of growing it,
     so nothing under the header moves when module.js tidies the overflow into More. */
  .navigator-mega-menu--bp-768.navigator-mega-menu--no-js .navigator-mega-menu-nav { height: 44px; }
}
/* breakpoint 900 */
@media (max-width: 899.98px) {
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu { display: none; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu-link { margin-left: auto; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target {
    position: fixed; inset: 0; z-index: 2; display: block; overflow-y: auto; padding: 16px 20px 32px;
    background: var(--navigator-mega-menu-drawer-bg); color: var(--navigator-mega-menu-link-color);
  }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-drawer-head { display: flex; justify-content: flex-end; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-nav, .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-list { display: block; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-item { border-bottom: 1px solid var(--navigator-mega-menu-divider-color); padding: 4px 0; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-trigger, .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-top-link { width: 100%; color: var(--navigator-mega-menu-link-color); padding: 0; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-chevron { display: none; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-item--active > .navigator-mega-menu-trigger, .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-item--active > .navigator-mega-menu-top-link { box-shadow: none; font-weight: 700; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-list > .navigator-mega-menu-item > .navigator-mega-menu-panel::before { content: none; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-panel { position: static; display: block; border: 0; box-shadow: none; background: none; width: auto; max-width: none; margin: 0; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-panel-inner { padding: 4px 0 12px 12px; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-columns, .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-panel-body, .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-tabs { display: block; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-column + .navigator-mega-menu-column { margin-top: 12px; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-featured { display: none; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-panel-footer { display: flex; flex-wrap: wrap; gap: 4px 12px; padding: 8px 0 0; background: none; border: 0; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-deep { display: block; padding-left: 16px; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-deep-link { display: flex; align-items: center; min-height: 44px; color: var(--navigator-mega-menu-link-color); text-decoration: none; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-link { min-height: 44px; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-actions { flex-wrap: wrap; margin-top: 20px; }
  /* Brand Accent drawer buttons, the same as the JS drawer: with JS off the bar's ink (white on dark theme colours) left
     the secondary button white on the white drawer (Portia pr19-qa r2, #0f766e) and the primary fill without an edge. */
  .navigator-mega-menu--preset-brand_accent.navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-actions .navigator-mega-menu-button--primary { background: var(--navigator-mega-menu-bar-bg); color: var(--navigator-mega-menu-bar-ink, #ffffff); border-color: var(--navigator-mega-menu-drawer-primary-edge, transparent); }
  .navigator-mega-menu--preset-brand_accent.navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-actions .navigator-mega-menu-button--secondary { background: transparent; color: var(--navigator-mega-menu-drawer-accent, var(--navigator-mega-menu-bar-bg)); border-color: var(--navigator-mega-menu-drawer-accent, var(--navigator-mega-menu-bar-bg)); }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-search-link, .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-lang-toggle { color: var(--navigator-mega-menu-link-color); }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-drawer-utility { display: block; margin-top: 16px; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-utility-link { min-height: 44px; }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-close-link { color: var(--navigator-mega-menu-link-color); }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target :is(a, button, input):focus-visible,
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-list > .navigator-mega-menu-item > :is(.navigator-mega-menu-trigger, .navigator-mega-menu-top-link):focus-visible { outline-color: var(--navigator-mega-menu-focus-panel); }
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-utility { display: none; }
}
@media (min-width: 900px) {
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-menu-link { display: none; }
  /* Before JavaScript (and without it) a menu too long for one line wraps below the bar instead of growing it,
     so nothing under the header moves when module.js tidies the overflow into More. */
  .navigator-mega-menu--bp-900.navigator-mega-menu--no-js .navigator-mega-menu-nav { height: 44px; }
}
/* breakpoint 1024 */
@media (max-width: 1023.98px) {
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu { display: none; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu-link { margin-left: auto; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target {
    position: fixed; inset: 0; z-index: 2; display: block; overflow-y: auto; padding: 16px 20px 32px;
    background: var(--navigator-mega-menu-drawer-bg); color: var(--navigator-mega-menu-link-color);
  }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-drawer-head { display: flex; justify-content: flex-end; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-nav, .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-list { display: block; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-item { border-bottom: 1px solid var(--navigator-mega-menu-divider-color); padding: 4px 0; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-trigger, .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-top-link { width: 100%; color: var(--navigator-mega-menu-link-color); padding: 0; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-chevron { display: none; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-item--active > .navigator-mega-menu-trigger, .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-item--active > .navigator-mega-menu-top-link { box-shadow: none; font-weight: 700; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-list > .navigator-mega-menu-item > .navigator-mega-menu-panel::before { content: none; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-panel { position: static; display: block; border: 0; box-shadow: none; background: none; width: auto; max-width: none; margin: 0; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-panel-inner { padding: 4px 0 12px 12px; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-columns, .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-panel-body, .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-tabs { display: block; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-column + .navigator-mega-menu-column { margin-top: 12px; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-featured { display: none; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-panel-footer { display: flex; flex-wrap: wrap; gap: 4px 12px; padding: 8px 0 0; background: none; border: 0; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-deep { display: block; padding-left: 16px; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-deep-link { display: flex; align-items: center; min-height: 44px; color: var(--navigator-mega-menu-link-color); text-decoration: none; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-link { min-height: 44px; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-actions { flex-wrap: wrap; margin-top: 20px; }
  /* Brand Accent drawer buttons, the same as the JS drawer: with JS off the bar's ink (white on dark theme colours) left
     the secondary button white on the white drawer (Portia pr19-qa r2, #0f766e) and the primary fill without an edge. */
  .navigator-mega-menu--preset-brand_accent.navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-actions .navigator-mega-menu-button--primary { background: var(--navigator-mega-menu-bar-bg); color: var(--navigator-mega-menu-bar-ink, #ffffff); border-color: var(--navigator-mega-menu-drawer-primary-edge, transparent); }
  .navigator-mega-menu--preset-brand_accent.navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-actions .navigator-mega-menu-button--secondary { background: transparent; color: var(--navigator-mega-menu-drawer-accent, var(--navigator-mega-menu-bar-bg)); border-color: var(--navigator-mega-menu-drawer-accent, var(--navigator-mega-menu-bar-bg)); }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-search-link, .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-lang-toggle { color: var(--navigator-mega-menu-link-color); }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-drawer-utility { display: block; margin-top: 16px; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-utility-link { min-height: 44px; }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-close-link { color: var(--navigator-mega-menu-link-color); }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target :is(a, button, input):focus-visible,
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-list > .navigator-mega-menu-item > :is(.navigator-mega-menu-trigger, .navigator-mega-menu-top-link):focus-visible { outline-color: var(--navigator-mega-menu-focus-panel); }
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-utility { display: none; }
}
@media (min-width: 1024px) {
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-menu-link { display: none; }
  /* Before JavaScript (and without it) a menu too long for one line wraps below the bar instead of growing it,
     so nothing under the header moves when module.js tidies the overflow into More. */
  .navigator-mega-menu--bp-1024.navigator-mega-menu--no-js .navigator-mega-menu-nav { height: 44px; }
}
/* breakpoint 1200 */
@media (max-width: 1199.98px) {
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu { display: none; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu-link { margin-left: auto; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target {
    position: fixed; inset: 0; z-index: 2; display: block; overflow-y: auto; padding: 16px 20px 32px;
    background: var(--navigator-mega-menu-drawer-bg); color: var(--navigator-mega-menu-link-color);
  }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-drawer-head { display: flex; justify-content: flex-end; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-nav, .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-list { display: block; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-item { border-bottom: 1px solid var(--navigator-mega-menu-divider-color); padding: 4px 0; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-trigger, .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-top-link { width: 100%; color: var(--navigator-mega-menu-link-color); padding: 0; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-chevron { display: none; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-item--active > .navigator-mega-menu-trigger, .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-item--active > .navigator-mega-menu-top-link { box-shadow: none; font-weight: 700; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-list > .navigator-mega-menu-item > .navigator-mega-menu-panel::before { content: none; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-panel { position: static; display: block; border: 0; box-shadow: none; background: none; width: auto; max-width: none; margin: 0; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-panel-inner { padding: 4px 0 12px 12px; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-columns, .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-panel-body, .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-tabs { display: block; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-column + .navigator-mega-menu-column { margin-top: 12px; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-featured { display: none; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-panel-footer { display: flex; flex-wrap: wrap; gap: 4px 12px; padding: 8px 0 0; background: none; border: 0; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-deep { display: block; padding-left: 16px; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-deep-link { display: flex; align-items: center; min-height: 44px; color: var(--navigator-mega-menu-link-color); text-decoration: none; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-link { min-height: 44px; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-actions { flex-wrap: wrap; margin-top: 20px; }
  /* Brand Accent drawer buttons, the same as the JS drawer: with JS off the bar's ink (white on dark theme colours) left
     the secondary button white on the white drawer (Portia pr19-qa r2, #0f766e) and the primary fill without an edge. */
  .navigator-mega-menu--preset-brand_accent.navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-actions .navigator-mega-menu-button--primary { background: var(--navigator-mega-menu-bar-bg); color: var(--navigator-mega-menu-bar-ink, #ffffff); border-color: var(--navigator-mega-menu-drawer-primary-edge, transparent); }
  .navigator-mega-menu--preset-brand_accent.navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-actions .navigator-mega-menu-button--secondary { background: transparent; color: var(--navigator-mega-menu-drawer-accent, var(--navigator-mega-menu-bar-bg)); border-color: var(--navigator-mega-menu-drawer-accent, var(--navigator-mega-menu-bar-bg)); }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-search-link, .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-lang-toggle { color: var(--navigator-mega-menu-link-color); }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-drawer-utility { display: block; margin-top: 16px; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-utility-link { min-height: 44px; }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-close-link { color: var(--navigator-mega-menu-link-color); }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target :is(a, button, input):focus-visible,
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu:target .navigator-mega-menu-list > .navigator-mega-menu-item > :is(.navigator-mega-menu-trigger, .navigator-mega-menu-top-link):focus-visible { outline-color: var(--navigator-mega-menu-focus-panel); }
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-utility { display: none; }
}
@media (min-width: 1200px) {
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-menu-link { display: none; }
  /* Before JavaScript (and without it) a menu too long for one line wraps below the bar instead of growing it,
     so nothing under the header moves when module.js tidies the overflow into More. */
  .navigator-mega-menu--bp-1200.navigator-mega-menu--no-js .navigator-mega-menu-nav { height: 44px; }
}
.navigator-mega-menu-drawer-head { display: none; }

/* ---------- JavaScript, mobile: the menu becomes a modal drawer (mode set from the breakpoint field) ---------- */
.navigator-mega-menu-lock, .navigator-mega-menu-lock body { overflow: hidden; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-utility { display: none; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-menu-toggle { display: inline-flex; margin-left: auto; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-menu {
  position: fixed; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: stretch; gap: 0; overflow-y: auto; overscroll-behavior: contain;
  padding: 0 20px; background: var(--navigator-mega-menu-drawer-bg); color: var(--navigator-mega-menu-link-color); text-align: left;
  animation: navigator-mega-menu-in var(--navigator-mega-menu-duration) ease both;
}
/* Panel background style Frosted blur: the panel colour at 94% (drawer 97%) over a blurred page. Solid (the default) has
   no backdrop blur on panels or the drawer: the blur costs menu response on slower devices (blur experiment, PR #15).
   Browsers without color-mix() keep the solid panel. */
@supports (background: color-mix(in srgb, red 50%, transparent)) {
  .navigator-mega-menu--panel-frosted .navigator-mega-menu-panel {
    background: color-mix(in srgb, var(--navigator-mega-menu-panel-bg) 94%, transparent);
    -webkit-backdrop-filter: saturate(160%) blur(14px); backdrop-filter: saturate(160%) blur(14px);
  }
  .navigator-mega-menu--panel-frosted.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-menu {
    background: color-mix(in srgb, var(--navigator-mega-menu-drawer-bg) 97%, transparent);
    -webkit-backdrop-filter: saturate(160%) blur(14px); backdrop-filter: saturate(160%) blur(14px);
  }
}
.navigator-mega-menu--drawer-right.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-menu, .navigator-mega-menu--drawer-left.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-menu { width: min(400px, 88vw); box-shadow: 0 0 0 100vmax rgba(15, 23, 42, 0.5); }
.navigator-mega-menu--drawer-right.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-menu { left: auto; animation-name: navigator-mega-menu-from-right; }
.navigator-mega-menu--drawer-left.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-menu { right: auto; animation-name: navigator-mega-menu-from-left; }
@keyframes navigator-mega-menu-from-right { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes navigator-mega-menu-from-left { from { transform: translateX(-24px); opacity: 0; } to { transform: none; opacity: 1; } }
.navigator-mega-menu--anim-none.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-menu { animation: none; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-drawer-head { position: sticky; top: 0; z-index: 1; display: flex; justify-content: flex-end; padding: 12px 0 4px; margin: 0 -20px; padding-right: 8px; background: var(--navigator-mega-menu-drawer-bg); }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-close { display: inline-flex; color: var(--navigator-mega-menu-link-color); }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-nav, .navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-list { display: block; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-nav { flex: 1 0 auto; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-item { border-bottom: 1px solid var(--navigator-mega-menu-divider-color); }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-item--more { display: none; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-trigger, .navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-top-link {
  width: 100%; justify-content: space-between; min-height: 52px; padding: 0 4px; border-radius: 0; box-shadow: none;
  color: var(--navigator-mega-menu-link-color); font-size: 1.0625rem; text-decoration: none;
}
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-item--active > .navigator-mega-menu-trigger, .navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-item--active > .navigator-mega-menu-top-link { box-shadow: none; font-weight: 700; color: var(--navigator-mega-menu-link-color); }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-trigger[aria-expanded="true"] { color: var(--navigator-mega-menu-link-color); }
.navigator-mega-menu--mobile-drilldown.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-chevron { transform: rotate(-90deg); }
.navigator-mega-menu--mobile-accordion.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-trigger[aria-expanded="true"] .navigator-mega-menu-chevron { transform: rotate(180deg); }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-panel {
  position: static; width: auto; min-width: 0; max-width: none; margin: 0; border: 0; border-radius: 0;
  background: none; box-shadow: none; animation: none; -webkit-backdrop-filter: none; backdrop-filter: none;
}
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-panel-inner { max-width: none; padding: 4px 0 16px; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-columns, .navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-panel-body, .navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-tabs { display: block; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-column + .navigator-mega-menu-column, .navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-tabpanel + .navigator-mega-menu-tabpanel { margin-top: 16px; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-tablist, .navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-featured { display: none; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-tab-heading { position: static; width: auto; height: auto; overflow: visible; clip: auto; white-space: normal; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-link, .navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-overview, .navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-heading-link { min-height: 44px; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-overview { margin-bottom: 8px; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-deep { display: block; padding-left: 16px; border-left: 1px solid var(--navigator-mega-menu-divider-color); margin: 0 0 8px 8px; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-deep-link { display: flex; align-items: center; min-height: 44px; color: var(--navigator-mega-menu-link-color); text-decoration: none; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-panel-footer { display: flex; flex-wrap: wrap; align-items: center; gap: 0 12px; padding: 0 0 12px; background: none; border: 0; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-panel-footer-link { min-height: 44px; }
.navigator-mega-menu--mobile-accordion.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-panel-inner { padding-left: 12px; }
/* Drill down: one level at a time, with Back and the section title */
.navigator-mega-menu--mobile-drilldown.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-menu--drilled .navigator-mega-menu-list > .navigator-mega-menu-item:not(.navigator-mega-menu-item--open),
.navigator-mega-menu--mobile-drilldown.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-menu--drilled .navigator-mega-menu-drawer-utility { display: none; }
.navigator-mega-menu--mobile-drilldown.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-menu--drilled .navigator-mega-menu-item--open { border-bottom: 0; }
/* A drill-down level waits unseen (and inert) for the two frames before focus moves to its Back button. Opacity, not
   visibility: under reduced motion every element gets a 0.01ms transition with the default property `all`, so
   visibility: hidden -> visible becomes a transition, Back is still hidden when focused, and focus() is refused. */
.navigator-mega-menu--mobile-drilldown.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-panel--pending { opacity: 0; }
/* Once Back has focus the drilled-into trigger collapses to nothing but stays in the accessibility tree: removing it
   (display: none or a position change) destroys the object a screen reader may still be presenting, and Orca then
   said "blank" and read the level as one run-on. It is tabindex -1 and the level title names the level. */
.navigator-mega-menu--mobile-drilldown.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-menu--settled .navigator-mega-menu-item--open > .navigator-mega-menu-trigger {
  height: 0; min-height: 0; padding-top: 0; padding-bottom: 0; margin: 0; border: 0; overflow: hidden; opacity: 0; pointer-events: none;
}
.navigator-mega-menu--mobile-drilldown.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-back {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 8px 0 0; margin-left: -4px; border: 0; background: none;
  color: var(--navigator-mega-menu-hover-color); font: inherit; font-weight: 600; cursor: pointer;
}
.navigator-mega-menu--mobile-drilldown.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-panel-title { display: block; margin: 4px 0 12px; color: var(--navigator-mega-menu-link-color); font-size: 1.375rem; font-weight: 700; }
.navigator-mega-menu--preset-dark.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-back { color: var(--navigator-mega-menu-hover-color); }
/* Search, language and buttons stay pinned to the bottom of the drawer */
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-actions {
  position: sticky; bottom: 0; z-index: 1; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; order: 2;
  margin: auto -20px 0; padding: 12px 20px calc(12px + env(safe-area-inset-bottom, 0px));
  background: var(--navigator-mega-menu-drawer-bg); border-top: 1px solid var(--navigator-mega-menu-divider-color);
}
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-search { flex: 1 0 100%; order: -1; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-search-toggle { display: none; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-search-form { position: static; display: flex; width: auto; padding: 0; border: 0; background: none; box-shadow: none; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-search-form[hidden] { display: none; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-button { flex: 1 1 auto; }
.navigator-mega-menu--preset-brand_accent.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-actions .navigator-mega-menu-button--primary { background: var(--navigator-mega-menu-bar-bg); color: var(--navigator-mega-menu-bar-ink, #ffffff); border-color: var(--navigator-mega-menu-drawer-primary-edge, transparent); }
.navigator-mega-menu--preset-brand_accent.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-actions .navigator-mega-menu-button--secondary { background: transparent; color: var(--navigator-mega-menu-drawer-accent, var(--navigator-mega-menu-bar-bg)); border-color: var(--navigator-mega-menu-drawer-accent, var(--navigator-mega-menu-bar-bg)); }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-lang-toggle { color: var(--navigator-mega-menu-link-color); }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-lang-list { top: auto; bottom: calc(100% + 8px); left: 0; right: auto; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-drawer-utility { display: block; order: 1; padding: 12px 0; }
.navigator-mega-menu--js.navigator-mega-menu--mobile .navigator-mega-menu-drawer-utility .navigator-mega-menu-utility-link { min-height: 44px; color: var(--navigator-mega-menu-desc-color); }

/* ---------- Scroll modes (the bar keeps its height, so nothing below it moves) ---------- */
.navigator-mega-menu--scroll-sticky, .navigator-mega-menu--scroll-shrink, .navigator-mega-menu--scroll-hide { position: sticky; top: 0; }
.navigator-mega-menu--scroll-shrink.navigator-mega-menu--has-utility { top: calc(-1 * var(--navigator-mega-menu-utility-height)); }
.navigator-mega-menu--scroll-shrink .navigator-mega-menu-logo-image { transform-origin: left center; transition: transform var(--navigator-mega-menu-duration) ease; }
.navigator-mega-menu--scroll-shrink.navigator-mega-menu--scrolled .navigator-mega-menu-logo-image { transform: scale(0.84); }
.navigator-mega-menu--scrolled .navigator-mega-menu-bar { box-shadow: 0 6px 20px rgba(15, 23, 42, 0.08); }
.navigator-mega-menu--scroll-hide { transition: transform var(--navigator-mega-menu-duration) ease; }
.navigator-mega-menu--scroll-hide.navigator-mega-menu--away { transform: translateY(-100%); }
/* Transparent over a hero until 40px of scroll. The header leaves the page flow, so the hero must allow for it. */
.navigator-mega-menu--transparent { position: absolute; top: 0; left: 0; right: 0; }
/* Fixed only with JS: without JS nothing turns the bar solid, so it stays absolute and scrolls away with the hero. */
.navigator-mega-menu--js.navigator-mega-menu--transparent.navigator-mega-menu--scroll-sticky, .navigator-mega-menu--js.navigator-mega-menu--transparent.navigator-mega-menu--scroll-shrink, .navigator-mega-menu--js.navigator-mega-menu--transparent.navigator-mega-menu--scroll-hide { position: fixed; }
.navigator-mega-menu--transparent:not(.navigator-mega-menu--scrolled):not(.navigator-mega-menu--drawer-open) .navigator-mega-menu-bar { background: transparent; border-bottom-color: transparent; box-shadow: none; }
.navigator-mega-menu--transparent:not(.navigator-mega-menu--scrolled):not(.navigator-mega-menu--drawer-open) .navigator-mega-menu-bar::before { -webkit-backdrop-filter: none; backdrop-filter: none; background: transparent; }
.navigator-mega-menu--transparent:not(.navigator-mega-menu--scrolled):not(.navigator-mega-menu--drawer-open) .navigator-mega-menu-logo, .navigator-mega-menu--transparent:not(.navigator-mega-menu--scrolled):not(.navigator-mega-menu--drawer-open) .navigator-mega-menu-menu-toggle, .navigator-mega-menu--transparent:not(.navigator-mega-menu--scrolled):not(.navigator-mega-menu--drawer-open).navigator-mega-menu--desktop .navigator-mega-menu-list > .navigator-mega-menu-item > .navigator-mega-menu-trigger,
.navigator-mega-menu--transparent:not(.navigator-mega-menu--scrolled):not(.navigator-mega-menu--drawer-open).navigator-mega-menu--desktop .navigator-mega-menu-list > .navigator-mega-menu-item > .navigator-mega-menu-top-link, .navigator-mega-menu--transparent:not(.navigator-mega-menu--scrolled):not(.navigator-mega-menu--drawer-open).navigator-mega-menu--desktop .navigator-mega-menu-search-toggle, .navigator-mega-menu--transparent:not(.navigator-mega-menu--scrolled):not(.navigator-mega-menu--drawer-open).navigator-mega-menu--desktop .navigator-mega-menu-lang-toggle,
.navigator-mega-menu--transparent:not(.navigator-mega-menu--scrolled):not(.navigator-mega-menu--drawer-open).navigator-mega-menu--no-js .navigator-mega-menu-list > .navigator-mega-menu-item > .navigator-mega-menu-trigger, .navigator-mega-menu--transparent:not(.navigator-mega-menu--scrolled):not(.navigator-mega-menu--drawer-open).navigator-mega-menu--no-js .navigator-mega-menu-list > .navigator-mega-menu-item > .navigator-mega-menu-top-link, .navigator-mega-menu--transparent:not(.navigator-mega-menu--scrolled):not(.navigator-mega-menu--drawer-open).navigator-mega-menu--no-js .navigator-mega-menu-menu-link {
  --navigator-mega-menu-focus-bar: var(--navigator-mega-menu-transparent-text, #ffffff); color: var(--navigator-mega-menu-transparent-text, #ffffff);
}
.navigator-mega-menu--transparent:not(.navigator-mega-menu--scrolled) .navigator-mega-menu-logo-image--alternate { display: block; }
.navigator-mega-menu--transparent:not(.navigator-mega-menu--scrolled) .navigator-mega-menu-logo-image:first-child:not(:only-child) { display: none; }

@media (prefers-reduced-motion: reduce) {
  .navigator-mega-menu *, .navigator-mega-menu *::before, .navigator-mega-menu *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}