/*
 * Career - Header — its own stylesheet.
 *
 * The corporate header's design (components/navbar.html, app.css) drawn under
 * career-header's own class names, so a change to one bar never reaches the
 * other; then, below, what the careers bar sets apart (navbar-career.html,
 * career.css:43-91).
 */

/* ======================================================================
   Site Header widget  (custom-career-header)
   ====================================================================== */

/* ── CSS variables (defaults — Elementor controls override these) ──── */
.custom-career-header {
	--sh-h:  90px;    /* header height — set by height control    */
	--sh-bp: 1180px;  /* mobile breakpoint — set by bp control   */

	display: block;
	/* Reserve space equal to bar height so page content starts below. */
	height: var(--sh-h);
}


/* ── Fixed bar ─────────────────────────────────────────────────────── */
.custom-career-header__bar {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 9900;
	background: transparent;
	border-bottom: 1px solid transparent;
	transition: background .3s ease, box-shadow .3s ease, border-color .3s ease, transform .35s ease;
}

.custom-career-header__bar.is-scrolled,
.custom-career-header__bar.has-drop {
	background: #fff;
	backdrop-filter: blur(22px);
	-webkit-backdrop-filter: blur(22px);
	box-shadow: rgba(22, 65, 140, 0.16) 0px 2px 20px -8px;
	border-color: #EEF2F7;
}

/* Hide on scroll-down; JS adds this class */
.custom-career-header__bar.is-hidden {
	transform: translateY(-100%);
}


/* ── Inner row ─────────────────────────────────────────────────────── */
.custom-career-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	height: var(--sh-h);            /* responsive via Elementor control  */
	max-width: 1440px;
	margin: 0 auto;
	padding: 0 40px;                 /* responsive via Elementor control  */
}


/* ── Logo ──────────────────────────────────────────────────────────── */
/*
   Both images are always display:block.
   The white version is stacked absolutely on top of the colour version;
   opacity cross-fades between them.
   (Using display:none/block caused a specificity clash with the img rule
   that made both logos show side-by-side when scrolling back to the top.)
*/
.custom-career-header__logo {
	position: relative;        /* white logo positions relative to this  */
	display: flex;
	align-items: center;
	flex-shrink: 0;
	text-decoration: none;
}

.custom-career-header__logo img {
	display: block;
	width: 130px;              /* responsive via Elementor control        */
	height: auto;
}

/* Colour logo: opaque by default */
.custom-career-header__logo-color {
	opacity: 1;
	transition: opacity .3s ease;
}

/* White logo: stacked on top, transparent by default */
.custom-career-header__logo-white {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	opacity: 0;
	transition: opacity .3s ease;
	pointer-events: none;
}

/* Over a transparent bar (no scroll, no open dropdown): cross-fade to white */
.custom-career-header__bar:not(.is-scrolled):not(.has-drop) .custom-career-header__logo-color { opacity: 0; }
.custom-career-header__bar:not(.is-scrolled):not(.has-drop) .custom-career-header__logo-white { opacity: 1; pointer-events: auto; }


/* ── Desktop navigation ────────────────────────────────────────────── */
.custom-career-header__nav-wrap {
	flex: 1;
	display: flex;
	justify-content: center;
	overflow: visible;
}

.custom-career-header__nav {
	display: flex;
	align-items: center;
	gap: 6px;         /* responsive via Elementor control */
	list-style: none;
	margin: 0;
	padding: 0;
}

.custom-career-header__item {
	position: relative;
	list-style: none;
}

/* Top-level link */
.custom-career-header__link {
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 8px 12px;
	color: #fff;           /* initial state — overridden by Elementor */
	font-size: 16px;
	font-weight: 500;
	text-decoration: none;
	white-space: nowrap;
	border-radius: 8px;
	transition: color .2s ease, background .2s ease;
	line-height: 1;
}

.custom-career-header__link:hover,
.custom-career-header__item.is-active > .custom-career-header__link { color: #50A3D5; }

/* After scrolling / while dropdown is open: navy links */
.custom-career-header__bar.is-scrolled  .custom-career-header__link,
.custom-career-header__bar.has-drop     .custom-career-header__link { color: #16418C; }

.custom-career-header__bar.is-scrolled  .custom-career-header__link:hover,
.custom-career-header__bar.has-drop     .custom-career-header__link:hover { color: #50A3D5; }

/* Caret arrow */
.custom-career-header__caret {
	display: inline-block;
	width: 6px;
	height: 6px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg) translate(-1px, -2px);
	transition: transform .2s ease;
	flex-shrink: 0;
}

.custom-career-header__item--has-drop:hover > .custom-career-header__link .custom-career-header__caret,
.custom-career-header__item--has-drop.is-open > .custom-career-header__link .custom-career-header__caret {
	transform: rotate(-135deg) translate(-1px, -2px);
}


/* ── Mega-menu panel ───────────────────────────────────────────────── */
/*
   position: fixed  → full-width, anchored to viewport just below the bar.
   Hover still works because the mega is a DOM child of __item--has-drop,
   so moving the cursor into it keeps the parent :hover state active.
*/
.custom-career-header__mega {
	position: fixed;
	top: var(--sh-h);          /* sits directly below the fixed bar    */
	left: 0;
	right: 0;
	background: #fff;
	border-top: 1px solid rgba(22, 65, 140, .06);
	box-shadow: 0 8px 30px rgba(22, 65, 140, .10);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-4px);
	transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
	z-index: 9899;             /* just under the bar (9900)            */
}

.custom-career-header__item--has-drop:hover > .custom-career-header__mega,
.custom-career-header__item--has-drop.is-open > .custom-career-header__mega {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* app.css:541 — the panel runs the window's width, to the content cap;
   32 · 57.6 · 37.44 capped at 36 */
.custom-career-header__mega-inner {
	max-width: 1920px;
	margin: 0 auto;
	padding: 32px 58px 36px;
	box-sizing: border-box;
}

.custom-career-header__mega-grid {
	display: flex;
	align-items: flex-start;
}

.custom-career-header__mega-card {
	padding-right: 43px;   /* matches design card spacing */
}

/* A panel stands its groups in the columns the menu names (colN on a group,
   Appearance > Menus; none is column 1): equal columns with the design's
   gap and a rule centred in it — app.css:580-618 (.cp-mega__flow,
   .cp-mega__links--split). A column twice as wide splits its long list in two.
   The bar is a drawer below 1181px, where a panel is a list. */
@media (min-width: 1181px) {
	.custom-career-header:not(.is-compact) .custom-career-header__mega-grid {
		display: grid;
		grid-template-columns: var(--custom-mega-tracks, minmax(0, 1fr));
		align-items: stretch;
		column-gap: 88px;                 /* 6 --vwu: 86.4 */
	}
	.custom-career-header:not(.is-compact) .custom-career-header__mega-column {
		position: relative;
		min-width: 0;
	}
	/* the rule stands in the middle of the gap */
	.custom-career-header:not(.is-compact) .custom-career-header__mega-column + .custom-career-header__mega-column::before {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: -45px;                      /* 88 / 2 + the rule's own 2 / 2 */
		width: 2px;                       /* --g200, measures 1px */
		background-color: #EEF2F7;
	}
	.custom-career-header:not(.is-compact) .custom-career-header__mega-card {
		margin: 0 0 34px;                 /* 2.4 --vwu: 34.56 capped at 34 */
		padding: 0;
	}
	.custom-career-header:not(.is-compact) .custom-career-header__mega-card:last-child {
		margin-bottom: 0;
	}
	.custom-career-header:not(.is-compact) .custom-career-header__mega-title:last-child {
		margin-bottom: 0;
	}
	/* a group to each column, links among them: the design's cards — app.css:545-553
	   (.cp-mega__grid, .cp-mega__card): no gap, each column held off its rule by 3 --vwu */
	.custom-career-header:not(.is-compact) .custom-career-header__mega-grid--cards {
		column-gap: 0;
	}
	.custom-career-header:not(.is-compact) .custom-career-header__mega-grid--cards > .custom-career-header__mega-column {
		padding: 0 44px;                  /* 43.2 */
	}
	.custom-career-header:not(.is-compact) .custom-career-header__mega-grid--cards > .custom-career-header__mega-column:first-child {
		padding-left: 0;
	}
	.custom-career-header:not(.is-compact) .custom-career-header__mega-grid--cards > .custom-career-header__mega-column + .custom-career-header__mega-column {
		border-left: 2px solid #EEF2F7;   /* --g200, measures 1px */
	}
	.custom-career-header:not(.is-compact) .custom-career-header__mega-grid--cards > .custom-career-header__mega-column + .custom-career-header__mega-column::before {
		content: none;
	}

	/* a long list in a wide column splits in two — .cp-mega__links--split */
	.custom-career-header:not(.is-compact) .custom-career-header__mega-column--wide .custom-career-header__mega-links:has(> :nth-child(9)) {
		display: block;
		columns: 2;
		column-gap: 30px;                 /* 2.4 --vwu: 34.56 capped at 30 */
		column-rule: 2px solid #EEF2F7;
	}
	.custom-career-header:not(.is-compact) .custom-career-header__mega-links > li {
		break-inside: avoid;
	}
}

/* Column heading — navy, semi-bold, 16px (matches .cp-mega__title) */
.custom-career-header__mega-title {
	display: block;
	line-height: 1.6;      /* the page's own, as the design's title inherits it */
	color: #16418C;        /* --navy */
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
	margin: 0 0 10px;
	transition: color .2s ease;
}

a.custom-career-header__mega-title:hover { color: #50A3D5; }
span.custom-career-header__mega-title   { cursor: default; }

/* Links list — left border separator (matches .cp-mega__links). Named with
   the header, so the theme's own rule for a list's indent does not win. */
.custom-career-header .custom-career-header__mega-links {
	list-style: none;
	margin: 0;
	padding: 0 0 0 13px;
	border-left: 1px solid #EEF2F7;  /* --g200 */
	display: grid;
	gap: 0;
}

.custom-career-header__mega-item { list-style: none; }

/* Link — slate gray, 16px (matches .cp-mega__links a) */
.custom-career-header__mega-link {
	display: block;
	padding: 5px 0;
	color: #475569;        /* --g700 */
	font-size: 16px;
	line-height: 1.5;
	text-decoration: none;
	border-radius: 0;
	transition: color .18s ease;
}

.custom-career-header__mega-link:hover { color: #50A3D5; }

.custom-career-header__mega-link:hover { color: #50A3D5; }


/* ── Dropdown ──────────────────────────────────────────────────────── */
.custom-career-header__dropdown {
	position: absolute;
	top: calc(100% + 6px);
	left: 50%;
	transform: translateX(-50%) translateY(-6px);
	min-width: 200px;
	background: #fff;
	border-radius: 14px;
	box-shadow: 0 8px 30px rgba(22, 65, 140, .12);
	list-style: none;
	margin: 0;
	padding: 8px;
	opacity: 0;
	visibility: hidden;
	transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
	z-index: 10;
}

/* Show on hover or when .is-open (keyboard / JS) */
.custom-career-header__item--has-drop:hover > .custom-career-header__dropdown,
.custom-career-header__item--has-drop.is-open > .custom-career-header__dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateX(-50%) translateY(0);
}

/* Ensure dropdown doesn't go off left edge */
.custom-career-header__item--has-drop:first-child > .custom-career-header__dropdown,
.custom-career-header__item--has-drop:nth-child(2) > .custom-career-header__dropdown {
	left: 0;
	transform: translateX(0) translateY(-6px);
}

.custom-career-header__item--has-drop:first-child:hover > .custom-career-header__dropdown,
.custom-career-header__item--has-drop:nth-child(2):hover > .custom-career-header__dropdown,
.custom-career-header__item--has-drop:first-child.is-open > .custom-career-header__dropdown,
.custom-career-header__item--has-drop:nth-child(2).is-open > .custom-career-header__dropdown {
	transform: translateX(0) translateY(0);
}

.custom-career-header__sub-item { list-style: none; }

.custom-career-header__sub-link {
	display: block;
	padding: 9px 14px;
	color: #16418C;
	font-size: 14px;
	text-decoration: none;
	border-radius: 8px;
	white-space: nowrap;
	transition: color .15s ease, background .15s ease;
}

.custom-career-header__sub-link:hover {
	color: #50A3D5;
	background: #F0F9FD;
}


/* ── Right side (CTA + burger) ─────────────────────────────────────── */
.custom-career-header__right {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
}


/* ── CTA button ────────────────────────────────────────────────────── */
.custom-career-header__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 10px 22px;      /* responsive via Elementor control */
	background: #16418C;     /* --navy: btn--navy (main navbar) — overridden per Elementor */
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	text-decoration: none;
	border-radius: 14px;     /* responsive via Elementor control */
	white-space: nowrap;
	transition: background .2s ease, color .2s ease, transform .15s ease, box-shadow .15s ease;
	line-height: 1.3;
}

.custom-career-header__cta:hover {
	background: #0E1E54;     /* --navy-darker */
	transform: translateY(-1px);
	box-shadow: 0 4px 14px rgba(22, 65, 140, .35);
}


/* ── Hamburger button ──────────────────────────────────────────────── */
.custom-career-header__burger {
	display: none;          /* shown in compact mode via JS + .is-compact */
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 5px;
	width: 40px;
	height: 40px;
	background: transparent;
	border: none;
	cursor: pointer;
	padding: 0;
	border-radius: 8px;
	flex-shrink: 0;
	transition: background .2s ease;
}

.custom-career-header__burger:hover { background: rgba(0, 0, 0, .06); }

.custom-career-header__burger span {
	display: block;
	width: 22px;
	height: 2.5px;
	background: #fff;         /* initial state; overridden by Elementor */
	border-radius: 2px;
	transition: background .3s ease, transform .3s ease, opacity .3s ease;
}

.custom-career-header__bar.is-scrolled .custom-career-header__burger span { background: #16418C; }

/* Burger → X when drawer is open */
.custom-career-header__burger.is-open span:nth-child(1) { transform: translateY(7.5px) rotate(45deg);  }
.custom-career-header__burger.is-open span:nth-child(2) { opacity: 0; transform: scaleX(0);            }
.custom-career-header__burger.is-open span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }


/* ── Compact mode (mobile) ─────────────────────────────────────────── */
/* JS adds .is-compact to the widget root when window ≤ --sh-bp.
   Default @media fallback uses 1180px (the design default).          */
@media (max-width: 1180px) {
	.custom-career-header__nav-wrap { display: none; }
	.custom-career-header__burger   { display: flex; }
	/* Mobile bar: frosted glass (matches design) */
	.custom-career-header__bar {
		background: rgba(255, 255, 255, 0.12);
		backdrop-filter: blur(30px) saturate(190%);
		-webkit-backdrop-filter: blur(30px) saturate(190%);
		border-color: rgba(255, 255, 255, 0.26);
	}
	.custom-career-header__bar.is-scrolled {
		background: rgba(255, 255, 255, 0.96);
		border-color: #EEF2F7;
		box-shadow: rgba(22, 65, 140, 0.16) 0px 2px 20px -8px;
	}
}

.custom-career-header.is-compact .custom-career-header__nav-wrap { display: none; }
.custom-career-header.is-compact .custom-career-header__burger   { display: flex; }
.custom-career-header.is-compact .custom-career-header__bar {
	background: rgba(255, 255, 255, 0.12);
	backdrop-filter: blur(30px) saturate(190%);
	-webkit-backdrop-filter: blur(30px) saturate(190%);
	border-color: rgba(255, 255, 255, 0.26);
}
.custom-career-header.is-compact .custom-career-header__bar.is-scrolled {
	background: rgba(255, 255, 255, 0.96);
	border-color: #EEF2F7;
	box-shadow: rgba(22, 65, 140, 0.16) 0px 2px 20px -8px;
}

/* Hide bar-level CTA on mobile; it reappears inside the drawer */
@media (max-width: 1180px) {
	.custom-career-header__right .custom-career-header__cta { display: none; }
}
.custom-career-header.is-compact .custom-career-header__right .custom-career-header__cta { display: none; }


/* ── Mobile drawer ─────────────────────────────────────────────────── */
.custom-career-header__drawer {
	position: fixed;
	top: 0;
	right: 0;
	height: 100dvh;
	width: min(320px, 92vw);    /* responsive via Elementor drawer-width control */
	background: #fff;
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: 0 0 48px;
	transform: translateX(105%);
	transition: transform .35s cubic-bezier(.2, .8, .2, 1);
	z-index: 9901;
	box-shadow: -4px 0 30px rgba(22, 65, 140, .12);
}

.custom-career-header__drawer.is-open {
	transform: translateX(0);
}

/* Drawer navigation list (default wp_nav_menu classes) */
.custom-career-header__drawer-nav {
	list-style: none;
	margin: 0;
	padding: 0;
}

.custom-career-header__drawer-nav .menu-item {
	list-style: none;
	border-bottom: 1px solid #EEF2F7;
}

.custom-career-header__drawer-nav > .menu-item > a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 14px 24px;
	color: #16418C;
	font-size: 16px;
	font-weight: 500;
	text-decoration: none;
	transition: color .2s ease, background .2s ease;
}

.custom-career-header__drawer-nav > .menu-item > a:hover { color: #50A3D5; }

/* Accordion toggle arrow */
.custom-career-header__drawer-nav .menu-item-has-children > a::after {
	content: '';
	display: inline-block;
	width: 7px;
	height: 7px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg);
	transition: transform .2s ease;
	flex-shrink: 0;
}

.custom-career-header__drawer-nav .menu-item-has-children.is-open > a::after {
	transform: rotate(-135deg);
}

/* Sub-menu (hidden by default, shown via .is-open added by JS) */
.custom-career-header__drawer-nav .sub-menu {
	max-height: 0;
	overflow: hidden;
	transition: max-height .32s ease;
	background: #F5F8FC;
	border-radius: 10px;
	list-style: none;
	margin: 0 16px;
	padding: 0;
}

.custom-career-header__drawer-nav .menu-item-has-children.is-open > .sub-menu {
	max-height: 600px;
	margin-top: 4px;
}

.custom-career-header__drawer-nav .sub-menu .menu-item {
	list-style: none;
	padding: 0 14px;
}

.custom-career-header__drawer-nav .sub-menu .menu-item:first-child { padding-top: 8px; }
.custom-career-header__drawer-nav .sub-menu .menu-item:last-child { padding-bottom: 8px; }

.custom-career-header__drawer-nav .sub-menu a {
	display: block;
	padding: 7px 0 7px 13px;
	border-left: 1px solid #D0DEEC;
	color: #475569;
	font-size: 14px;
	font-weight: 400;
	text-decoration: none;
	transition: color .2s ease;
}

.custom-career-header__drawer-nav .sub-menu a:hover { color: #50A3D5; }

/* CTA inside drawer */
.custom-career-header__drawer-cta {
	padding: 20px 20px 0;
}

.custom-career-header__drawer-cta .custom-career-header__cta {
	width: 100%;
	justify-content: center;
}


/* ── Overlay (dim the page behind the drawer) ──────────────────────── */
.custom-career-header__overlay {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, .38);
	z-index: 9898;
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s ease, visibility .3s ease;
}

.custom-career-header__overlay.is-open {
	opacity: 1;
	visibility: visible;
}


/* ── Language switcher ──────────────────────────────────────────────── */
.custom-career-header__lang {
	display: flex;
	align-items: center;
	gap: 2px;
	padding: 8px 15px;
	border: 1px solid #E2E8F0;
	border-radius: 30px;
}

.custom-career-header__lang-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 4px 3px;
	min-width: 28px;
	background: transparent;
	border: none;
	outline: none;
	color: rgba(255, 255, 255, .7);   /* initial; overridden by Elementor */
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	letter-spacing: .5px;
	transition: color .2s ease;
	text-decoration: none;
	line-height: 1;
	font-family: inherit;
	-webkit-appearance: none;
	appearance: none;
}

/* Active = blue; hover = blue; no background on hover */
.custom-career-header__lang-btn.is-active,
.custom-career-header__lang-btn:hover {
	color: #50A3D5;
	background: transparent;
}

.custom-career-header__bar.is-scrolled .custom-career-header__lang-btn {
	color: rgba(22, 65, 140, .55);
}

.custom-career-header__bar.is-scrolled .custom-career-header__lang-btn.is-active,
.custom-career-header__bar.is-scrolled .custom-career-header__lang-btn:hover {
	color: #50A3D5;
	background: transparent;
}

.custom-career-header__lang-sep {
	display: inline-block;
	width: 1px;
	height: 12px;
	background: currentColor;
	opacity: .35;
	margin: 0 2px;
}

/* Initial (transparent bar): white semi-transparent border — same as search button */
.custom-career-header__bar:not(.is-scrolled) .custom-career-header__lang {
	border-color: rgba(255, 255, 255, .45);
}

/* Hide lang in bar on mobile */
@media (max-width: 1180px) {
	.custom-career-header__right .custom-career-header__lang { display: none; }
}
.custom-career-header.is-compact .custom-career-header__right .custom-career-header__lang { display: none; }

/* Hide bar-level search button on mobile; it reappears inside the drawer head */
@media (max-width: 1180px) {
	.custom-career-header__right .custom-career-header__search-btn { display: none; }
}
.custom-career-header.is-compact .custom-career-header__right .custom-career-header__search-btn { display: none; }


/* ── Search button ──────────────────────────────────────────────────── */
.custom-career-header__search-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: transparent;
	border: 1.5px solid rgba(255, 255, 255, .45);   /* initial: white semi-transparent */
	border-radius: 100px !important;
	outline: none;
	color: #fff;          /* initial; overridden by Elementor */
	cursor: pointer;
	border-radius: 8px;
	transition: color .2s ease, background .2s ease, border-color .2s ease;
	flex-shrink: 0;
	padding: 0;
	-webkit-appearance: none;
	appearance: none;
}

.custom-career-header__search-btn:hover {
	background: rgba(255, 255, 255, .12);
}

.custom-career-header__bar.is-scrolled .custom-career-header__search-btn {
	color: #16418C;
	border-color: rgba(22, 65, 140, .25);   /* scrolled: navy semi-transparent */
}

.custom-career-header__bar.is-scrolled .custom-career-header__search-btn:hover {
	background: rgba(22, 65, 140, .06);
}


/* ── Search overlay ─────────────────────────────────────────────────── */
.custom-career-header__search {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 9901;          /* above the bar (9900) */
	background: #fff;
	box-shadow: 0 4px 30px rgba(22, 65, 140, .14);
	transform: translateY(-100%);
	transition: transform .3s cubic-bezier(.2, .8, .2, 1);
}

.custom-career-header__search.is-open {
	transform: translateY(0);
}

.custom-career-header__search-panel {
	max-width: 1440px;
	margin: 0 auto;
	padding: 0 40px;
}

.custom-career-header__search-bar {
	display: flex;
	align-items: center;
	gap: 12px;
	height: var(--sh-h);
}

.custom-career-header__search-input {
	flex: 1;
	border: none;
	outline: none;
	font-size: 16px;
	font-weight: 400;
	color: #16418C;
	background: transparent;
	font-family: inherit;
}

.custom-career-header__search-input::placeholder {
	color: #94A3B8;
}

.custom-career-header__search-close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	background: transparent;
	border: none;
	outline: none;
	color: #94A3B8;
	font-size: 16px;
	cursor: pointer;
	border-radius: 8px;
	transition: background .2s ease, color .2s ease;
	flex-shrink: 0;
	padding: 0;
	-webkit-appearance: none;
	appearance: none;
}

.custom-career-header__search-close:hover {
	background: #F0F9FD;
	color: #16418C;
}


/* ── Drawer head (lang + tools) ─────────────────────────────────────── */
.custom-career-header__drawer-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 14px 20px;
	border-bottom: 1px solid #EEF2F7;
	flex-shrink: 0;
}

.custom-career-header__drawer-head .custom-career-header__lang-btn {
	color: rgba(22, 65, 140, .55);
	font-size: 14px;
}

.custom-career-header__drawer-head .custom-career-header__lang-btn.is-active {
	color: #16418C;
	font-weight: 700;
}

.custom-career-header__drawer-tools {
	display: flex;
	align-items: center;
	gap: 4px;
}

.custom-career-header__drawer-close,
.custom-career-header__drawer-head .custom-career-header__search-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	background: none;
	border: none;
	border-radius: 50%;
	color: #16418C;
	cursor: pointer;
	transition: background .15s ease;
}

.custom-career-header__drawer-close:hover,
.custom-career-header__drawer-head .custom-career-header__search-btn:hover {
	background: #EEF2F7;
}


/* ── Elementor editor hint ─────────────────────────────────────────── */
.custom-career-header__hint {
	padding: 6px 10px;
	background: rgba(100, 116, 139, .12);
	border: 1px dashed #94A3B8;
	border-radius: 6px;
	color: #64748B;
	font-size: 12px;
}

/* ==========================================================================
   What the careers bar sets apart — scoped by Elementor's wrapper,
   .elementor-widget-career-header, as heavily as the corporate rules above
   ========================================================================== */

/* Read from cp-all-designer css/career.css:52-91 and css/app.css:328-329. */

/* the list carries no indent of its own, whatever the theme gives a list */
.elementor-widget-career-header .custom-career-header__nav {
	margin: 0;
	padding: 0;
}

/* app.css:137, 189-191 — the bar runs the page's width, inside the 1920px cap */
.elementor-widget-career-header .custom-career-header__inner {
	max-width: 1920px;
}

/* app.css:516-517 — TH | EN set closer, the letters bolder (.5px of tracking left out: no part pixels) */
.elementor-widget-career-header .custom-career-header__lang {
	gap: 10px;                             /* app.css:516 measures 9px */
}

.elementor-widget-career-header .custom-career-header__lang-btn {
	min-width: 0;
	padding: 0;
	font-weight: 700;
}

/* app.css:520, 657-658 — the rule between them and the pill's edge: slate on the
   sheet, faint white on the picture */
.elementor-widget-career-header .custom-career-header__lang-sep {
	margin: 0;
	opacity: 1;
	background: #E2E8F0;
}

.elementor-widget-career-header .custom-career-header__bar:not(.is-scrolled):not(.has-drop) .custom-career-header__lang,
.elementor-widget-career-header .custom-career-header__bar:not(.is-scrolled):not(.has-drop) .custom-career-header__lang-sep {
	border-color: rgba(255, 255, 255, 0.34);
}

.elementor-widget-career-header .custom-career-header__bar:not(.is-scrolled):not(.has-drop) .custom-career-header__lang-sep {
	background: rgba(255, 255, 255, 0.34);
}

/* app.css:640 — the burger's lines are 24px long */
.elementor-widget-career-header .custom-career-header__burger span {
	width: 24px;
}

/* app.css:499-502 — the links' own size; the Style tab's type, when set, writes over it */
.elementor-widget-career-header .custom-career-header__link {
	font-size: 14px;
	line-height: 1.5;
	padding-top: 10px;
	padding-bottom: 10px;
}

/* app.css:322-326, 526 — .btn.cp-cta: 14px at 1.6 */
.elementor-widget-career-header .custom-career-header__cta {
	font-size: 14px;
	line-height: 1.6;
}

/* career.css:58-59 — five routes, given room; the gap arrives from the Style tab */
.elementor-widget-career-header .custom-career-header:not(.is-compact) .custom-career-header__nav {
	gap: var(--custom-career-header-gap, 24px);
}

.elementor-widget-career-header .custom-career-header:not(.is-compact) .custom-career-header__link {
	padding-right: 14px;
	padding-left: 14px;
}

/* career.css:71-74 — near the fold the bar runs as tight as the corporate one */
@media (width < 1360px) {
	.elementor-widget-career-header .custom-career-header:not(.is-compact) .custom-career-header__nav {
		gap: 6px;
	}
	.elementor-widget-career-header .custom-career-header:not(.is-compact) .custom-career-header__link {
		padding-right: 8px;
		padding-left: 8px;
	}
}

/* app.css:329 — the red pill lifts with a red shadow */
.elementor-widget-career-header .custom-career-header__cta:hover {
	transform: translateY(-2px);
	box-shadow: 0 14px 30px rgba(206, 41, 41, 0.34);
}

/* career.css:76-88 — folded, the button stays on the bar beside the burger
   and is not repeated in the drawer */
@media (max-width: 1180px) {
	.elementor-widget-career-header .custom-career-header__right .custom-career-header__cta {
		display: inline-flex;
	}
	.elementor-widget-career-header .custom-career-header__right {
		gap: 24px;
	}
	.elementor-widget-career-header .custom-career-header__burger {
		margin-right: -8px;
	}
}

.elementor-widget-career-header .custom-career-header.is-compact .custom-career-header__right .custom-career-header__cta {
	display: inline-flex;
}

/* app.css:468 + career.css:87 — the bar's 18px gap and the burger's own 6px;
   the burger reaches 8px into the gutter (app.css) */
.elementor-widget-career-header .custom-career-header.is-compact .custom-career-header__right {
	gap: 24px;
}

.elementor-widget-career-header .custom-career-header.is-compact .custom-career-header__burger {
	margin-right: -8px;
}

/* app.css:683-687 — folded and still over the picture, the bar is frosted glass
   whatever ground the open bar is given */
.elementor-widget-career-header .custom-career-header.is-compact .custom-career-header__bar:not(.is-scrolled) {
	background: rgba(255, 255, 255, 0.12);
}

.elementor-widget-career-header .custom-career-header__drawer-cta {
	display: none;
}

/* career.css:89-91 — a step smaller on a phone (the padding is the Style tab's mobile value) */
@media (max-width: 767px) {
	.elementor-widget-career-header .custom-career-header__right .custom-career-header__cta {
		font-size: 12px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.elementor-widget-career-header .custom-career-header__cta:hover {
		transform: none;
	}
}
