/* WTTC header + mega menu. Replicates the current Elementor header (transparent over the hero, white outlined bar,
   uppercase tabs) and adds the mega panel. Only wttc-* classes and --wttc-* tokens. */

.wttc-header {
	position: fixed;
	top: 0; left: 0; right: 0;
	z-index: var(--wttc-header-z);
	padding: var(--wttc-space-2) 0;
	font-family: var(--wttc-font-sans);
	--wttc-logo-now: var(--wttc-logo-size);
	transition: background-color .3s ease, box-shadow .3s ease, padding .3s ease;
}
/* Scrolled: the header gets slimmer (logo 81 -> 60px, less padding) so it takes less of the screen. */
.wttc-header.is-scrolled { --wttc-logo-now: var(--wttc-logo-size-sm); padding: var(--wttc-space-2) 0; }
body.admin-bar { --wttc-header-full: calc(var(--wttc-logo-size) + var(--wttc-space-2) * 2 + var(--wp-admin--admin-bar--height, 32px)); }
/* Over the hero: no colour, only a blur of what passes underneath. The blur lives on a pseudo-element because
   backdrop-filter on the header itself would turn it into the containing block of the fixed mega panel. */
.wttc-header::before {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	-webkit-backdrop-filter: blur(var(--wttc-header-blur)); backdrop-filter: blur(var(--wttc-header-blur));
	transition: opacity .3s ease;
}
/* Once content moves under it (the page has scrolled) - and always on pages with a white background - the header
   gets the WTTC navy and the logo switches to the white-square version (navy lettering), as in the brand guidelines. */
.wttc-header.is-scrolled { background-color: var(--wttc-navy); box-shadow: 0 2px 12px rgba(0, 0, 0, .25); }
.wttc-header.is-scrolled::before { opacity: 0; }
body.admin-bar .wttc-header { top: var(--wp-admin--admin-bar--height, 32px); }

.wttc-header__inner {
	display: flex;
	align-items: center;
	gap: var(--wttc-space-4);
	max-width: var(--wttc-container);
	margin: 0 auto;
	padding: 0 12px;
}
.wttc-header__logo { position: relative; flex: 0 0 auto; display: block; width: var(--wttc-logo-now); height: var(--wttc-logo-now); line-height: 0; transition: width .3s ease, height .3s ease; }
.wttc-header__logo img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; transition: opacity .3s ease; }
.wttc-header__logo-light { opacity: 0; }
.wttc-header__logo .wttc-header__logo-wordmark { display: none; }
.wttc-header.is-scrolled .wttc-header__logo-light { opacity: 1; }
.wttc-header.is-scrolled .wttc-header__logo-default { opacity: 0; }

.wttc-header__bar {
	flex: 1 1 auto;
	display: flex;
	justify-content: center;
}
.wttc-nav {
	position: relative;
	border: .67px solid var(--wttc-line);
	border-radius: var(--wttc-radius);
	padding: var(--wttc-space-2) var(--wttc-space-1);
}

.wttc-menu { display: flex; align-items: center; gap: 0; margin: 0; padding: 0; list-style: none; }
.wttc-menu__item { position: relative; margin: 0; display: flex; align-items: center; }

.wttc-menu__link {
	display: block;
	padding: 7px var(--wttc-space-4);
	border: 0;
	border-radius: var(--wttc-radius);
	background: transparent;
	color: var(--wttc-white);
	font: 500 12px/1.4 var(--wttc-font-sans);
	letter-spacing: .3px;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .2s ease;
}
.wttc-menu__link:hover, .wttc-menu__link:focus { color: var(--wttc-white); }
.wttc-menu__item:hover > .wttc-menu__link,
.wttc-menu__item.is-open > .wttc-menu__link,
.wttc-menu__item.current-menu-item > .wttc-menu__link,
.wttc-menu__item.current-menu-ancestor > .wttc-menu__link { background: var(--wttc-glass); color: var(--wttc-white); }
.wttc-header a:focus-visible,
.wttc-header button:focus-visible { outline: 2px solid var(--wttc-white); outline-offset: 2px; }
/* Hello Elementor paints any button red (#c36) on :hover, :focus and :active (a clicked button keeps :focus): every state of ours is set. */
.wttc-header button.wttc-header__search-toggle, .wttc-header button.wttc-header__burger, .wttc-header button.wttc-menu__toggle, .wttc-header button.wttc-menu__link--button { background: transparent; }
.wttc-header button.wttc-header__search-toggle:hover, .wttc-header button.wttc-header__burger:hover,
.wttc-header button.wttc-header__search-toggle:active, .wttc-header button.wttc-header__burger:active,
.wttc-header button.wttc-header__search-toggle:focus-visible, .wttc-header button.wttc-header__burger:focus-visible { background: rgba(255, 255, 255, .14); color: var(--wttc-white); }
.wttc-header button.wttc-header__search-toggle:focus:not(:focus-visible):not(:hover):not(:active), .wttc-header button.wttc-header__burger:focus:not(:focus-visible):not(:hover):not(:active),
.wttc-header button.wttc-menu__toggle:focus, .wttc-header button.wttc-menu__toggle:hover, .wttc-header button.wttc-menu__toggle:active,
.wttc-header button.wttc-menu__link--button:focus, .wttc-header button.wttc-menu__link--button:hover, .wttc-header button.wttc-menu__link--button:active { background: transparent; }

/* Chevron: the toggle button sits inside the tab, after the link. */
.wttc-menu__toggle {
	position: relative;
	margin-left: -14px; margin-right: 6px;
	width: 14px; height: 14px; padding: 0; border: 0; background: transparent; cursor: pointer;
	color: var(--wttc-white);
}
.wttc-menu__toggle::before {
	content: ""; position: absolute; left: 3px; top: 2px; width: 6px; height: 6px;
	border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg);
	transition: transform .2s ease;
}
.wttc-menu__item.is-open > .wttc-menu__toggle::before { transform: rotate(225deg); top: 5px; }
.wttc-menu__item.has-panel > .wttc-menu__link:not(.wttc-menu__link--button) { padding-right: 24px; }
.wttc-menu__link--button::after {
	content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 0 3px 8px;
	border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); transition: transform .2s ease;
}
.wttc-menu__item.is-open > .wttc-menu__link--button::after { transform: rotate(225deg); margin-bottom: -2px; }

/* ----- Panels (dropdown + mega) ----- */
.wttc-panel {
	position: absolute; top: 100%; left: 0;
	padding-top: 12px;                                   /* hover bridge between tab and panel */
	visibility: hidden; opacity: 0; transform: translateY(6px);
	transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
	z-index: 2;
}
.wttc-menu__item:hover > .wttc-panel,
.wttc-menu__item.is-open > .wttc-panel,
.wttc-menu__item:focus-within > .wttc-panel { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }

.wttc-panel__inner {
	display: grid; gap: var(--wttc-space-3);
	padding: 7px;
	background: var(--wttc-white); color: var(--wttc-black);
	border-radius: var(--wttc-radius); box-shadow: var(--wttc-shadow-panel);
}
.wttc-panel--simple .wttc-panel__inner { min-width: 200px; }

/* Mega: fixed, centred in the viewport just under the header, whatever the width of the bar. */
.wttc-menu__item.has-panel:has(> .wttc-panel--mega) { position: static; }
.wttc-panel--mega {
	/* The panel box starts exactly at the bottom edge of the bar (--wttc-panel-top, set by header.js) and its transparent
	   top padding is the hover bridge: it never reaches up over the neighbouring tabs, so moving from one tab to another works. */
	position: fixed; top: var(--wttc-panel-top, var(--wttc-header-offset, 100px)); left: 50%;
	width: min(var(--wttc-container), calc(100vw - 48px));
	padding-top: 12px; transform: translate(-50%, 6px);
}
.wttc-menu__item:hover > .wttc-panel--mega,
.wttc-menu__item.is-open > .wttc-panel--mega,
.wttc-menu__item:focus-within > .wttc-panel--mega { transform: translate(-50%, 0); }
/* Mega panel: link columns; with highlighted items, a navy band goes under the columns, bleeding to the panel edges. */
.wttc-panel--mega .wttc-panel__inner {
	grid-template-columns: repeat(var(--wttc-cols, 3), minmax(0, 1fr));
	padding: 28px 32px; gap: 32px;
}
.wttc-panel--mega.has-features .wttc-panel__inner { overflow: hidden; }

.wttc-col__title {
	display: block; margin-bottom: 8px; padding: 0 0 10px;
	border-bottom: 1px solid rgba(21, 27, 52, .15);
	color: var(--wttc-navy); font: 600 12px/1.4 var(--wttc-font-sans); letter-spacing: .3px; text-transform: uppercase; text-decoration: none;
}
.wttc-col__list { margin: 0; padding: 0; list-style: none; }
.wttc-col__item { margin: 0; }
.wttc-col__list a {
	display: block; padding: 7px var(--wttc-space-3);
	border-radius: var(--wttc-radius);
	color: var(--wttc-black); font: 400 12px/1.5 var(--wttc-font-sans); text-decoration: none; white-space: nowrap;
}
.wttc-panel--mega .wttc-col__list a { padding-left: 0; white-space: normal; }
.wttc-col__list a:hover, .wttc-col__list a:focus-visible { background: var(--wttc-cream); }
.wttc-panel--mega .wttc-col__list a:hover { padding-left: 8px; }
.wttc-col__item.current-menu-item > a { color: var(--wttc-navy); font-weight: 600; }

/* External link arrow: uses the Phosphor mask of WTTC Core (--wttc-i is defined by its .wttc-i-* classes). */
.wttc-ext > a::after {
	content: ""; display: inline-block; width: .9em; height: .9em; margin-left: 6px; vertical-align: -.1em;
	background: currentColor;
	-webkit-mask: var(--wttc-i) center / contain no-repeat; mask: var(--wttc-i) center / contain no-repeat;
}

/* Feature band: under the link columns, full width, one card per featured item side by side. */
.wttc-features {
	grid-column: 1 / -1;
	display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 0;
	margin: 0 -32px -28px; padding: 0 32px;                       /* bleeds to the panel's left, right and bottom edges */
	background: var(--wttc-navy); color: var(--wttc-white);
}
.wttc-feature {
	display: grid; grid-template-columns: 220px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 24px; row-gap: 6px; align-items: center;
	padding: 22px 0; color: var(--wttc-white); text-decoration: none;
}
.wttc-feature + .wttc-feature { margin-left: 32px; padding-left: 32px; border-left: 1px solid rgba(255, 255, 255, .2); }
/* Hello's a:hover (#336) would turn the whole item the same navy as the band: the colour is fixed for every state. */
.wttc-feature, .wttc-feature:hover, .wttc-feature:focus, .wttc-feature:visited { color: var(--wttc-white); }
/* Logos: every logo sits on an identical dark plate (same size, same colour) and each one gets the width that makes its
   mark weigh the same as the others. To tune one: .wttc-feature--<slug> .wttc-feature__logo { width: ... } */
.wttc-feature__plate { grid-column: 1; grid-row: 1 / span 2; display: grid; place-items: center; width: 100%; height: 72px; padding: 0 16px; box-sizing: border-box; border-radius: 8px; background: var(--wttc-plate); overflow: hidden; }
.wttc-feature__logo { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; }
.wttc-feature--media .wttc-feature__plate { padding: 10px 16px; grid-template: 100% / 100%; }   /* a definite track, so the logo's height:100% resolves (a wide SVG otherwise overflows the plate and sits low) */
.wttc-feature--media .wttc-feature__logo { width: 100%; height: 100%; max-height: none; object-fit: contain; }   /* logos from the media library: contained in the plate, whatever their proportion */
.wttc-feature--research-hub .wttc-feature__logo { width: 180px; }
.wttc-feature--together-in-travel .wttc-feature__logo { width: 160px; }
.wttc-feature__title { grid-column: 1; grid-row: 1 / span 2; font: 400 22px/1.15 var(--wttc-font-serif); }
.wttc-feature__text { grid-column: 2; grid-row: 1; align-self: end; font: 400 13px/1.5 var(--wttc-font-sans); color: rgba(255, 255, 255, .85); }
/* "Visit": a quiet text link with an arrow, not a button. */
.wttc-feature__cta { grid-column: 2; grid-row: 2; align-self: start; justify-self: start; display: inline-flex; align-items: center; gap: 6px; font: 600 12px/1.4 var(--wttc-font-sans); letter-spacing: .5px; text-transform: uppercase; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 4px; transition: text-decoration-color .2s ease; }
.wttc-feature__cta svg { transition: transform .2s ease; }
.wttc-feature:hover .wttc-feature__cta, .wttc-feature:focus-visible .wttc-feature__cta { text-decoration-color: currentColor; }
.wttc-feature:hover .wttc-feature__cta svg, .wttc-feature:focus-visible .wttc-feature__cta svg { transform: translate(2px, -2px); }
.wttc-feature:focus-visible { outline: 2px solid var(--wttc-white); outline-offset: 4px; }

/* ----- Tools ----- */
.wttc-header__tools { flex: 0 0 auto; display: flex; align-items: center; gap: 4px; margin-left: auto; }
.wttc-header__search-toggle, .wttc-header__burger {
	width: 40px; height: 40px; display: grid; place-items: center; padding: 0;
	border: 0; background: transparent; color: var(--wttc-white); cursor: pointer; border-radius: var(--wttc-radius);
}
.wttc-header__search-toggle .wttc-i { font-size: 20px; }
.wttc-header__burger { display: none; }
.wttc-header__burger-box { display: grid; gap: 5px; width: 22px; }
.wttc-header__burger-box span { display: block; height: 2px; background: currentColor; transition: transform .25s ease, opacity .2s ease; }
.wttc-header__burger[aria-expanded="true"] .wttc-header__burger-box span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.wttc-header__burger[aria-expanded="true"] .wttc-header__burger-box span:nth-child(2) { opacity: 0; }
.wttc-header__burger[aria-expanded="true"] .wttc-header__burger-box span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ----- Search ----- */
/* No colour of its own: the header paints it (blur over the hero, solid navy once the header is navy), so the search bar always matches the bar it hangs from. */
.wttc-search { background: transparent; }
.wttc-search[hidden] { display: none; }
.wttc-search__form { display: flex; gap: 10px; max-width: var(--wttc-container); margin: 0 auto; padding: 16px 12px; }
.wttc-search__input { flex: 1; min-width: 0; padding: 12px 16px; border: 1px solid var(--wttc-white); border-radius: var(--wttc-radius); background: transparent; color: var(--wttc-white); font: 400 16px var(--wttc-font-sans); }
.wttc-search__input::placeholder { color: rgba(255, 255, 255, .7); }
.wttc-search__submit { padding: 12px 24px; border: 0; border-radius: var(--wttc-radius); background: var(--wttc-white); color: var(--wttc-navy); font: 600 12px var(--wttc-font-sans); letter-spacing: .3px; text-transform: uppercase; cursor: pointer; }
.wttc-search button.wttc-search__submit:hover, .wttc-search button.wttc-search__submit:focus-visible { background: transparent; color: var(--wttc-white); box-shadow: inset 0 0 0 1px var(--wttc-white); }
.wttc-search button.wttc-search__submit:active { background: rgba(255, 255, 255, .85); color: var(--wttc-navy); box-shadow: none; }
.wttc-search button.wttc-search__submit:focus:not(:focus-visible):not(:hover):not(:active) { background: var(--wttc-white); color: var(--wttc-navy); box-shadow: none; }

/* ----- Tablet and mobile: drawer ----- */
@media (max-width: 1024px) {
	/* Slimmer bar: the logo is smaller (tokens.css) and, with the drawer open, the bar is solid navy with the light logo. */
	.wttc-header { --wttc-bar-h: calc(var(--wttc-logo-size-sm) + var(--wttc-space-2) * 2); }
	.wttc-header.is-nav-open { background-color: var(--wttc-navy); padding: var(--wttc-space-2) 0; --wttc-logo-now: var(--wttc-logo-size-sm); box-shadow: none; }
	.wttc-header.is-nav-open::before { opacity: 0; }
	.wttc-header.is-nav-open .wttc-header__logo-light { opacity: 1; }
	.wttc-header.is-nav-open .wttc-header__logo-default { opacity: 0; }
	.wttc-header__burger { display: grid; }
	/* Mobile logo: the horizontal wordmark (same artwork as wttc.org: navy mark + white name), white on the navy bar and over the hero. */
	.wttc-header__logo { width: calc(var(--wttc-logo-now) * 5.7939); }   /* width AND height transition (base rule): the logo shrinks smoothly on scroll */
	.wttc-header__logo img.wttc-header__logo-default, .wttc-header__logo img.wttc-header__logo-light { display: none; }
	.wttc-header__logo .wttc-header__logo-wordmark { display: block; position: absolute; inset: 0; width: 100%; height: 100%; }
	/* Logo colours: over the hero the official logo (navy square, white mark, green dot); on the navy bar the white-square version
	   (white square, navy mark, green dot), as in the brand guidelines. The name stays white. */
	.wttc-wm-plate { fill: var(--wttc-logo-plate); transition: fill .3s ease; }
	.wttc-wm-mark { fill: var(--wttc-white); transition: fill .3s ease; }
	.wttc-wm-dot { fill: var(--wttc-logo-green); }
	.wttc-wm-text { fill: var(--wttc-white); }
	.wttc-wm-dot { transition: fill .3s ease; }
	.wttc-header.is-scrolled .wttc-wm-plate, .wttc-header.is-nav-open .wttc-wm-plate { fill: var(--wttc-white); }
	.wttc-header.is-scrolled .wttc-wm-mark, .wttc-header.is-nav-open .wttc-wm-mark { fill: var(--wttc-logo-plate); }
	/* Search with the drawer open: the field takes a row at the very top of the drawer and the tabs move down under it. */
	.wttc-header { --wttc-search-h: 72px; }
	.wttc-header.is-nav-open .wttc-search { position: fixed; top: calc(var(--wttc-bar-h) + var(--wp-admin--admin-bar--height, 0px)); right: 0; width: min(420px, 100%); height: var(--wttc-search-h); box-sizing: border-box; z-index: 4; background: var(--wttc-navy); border-bottom: 1px solid rgba(255, 255, 255, .15); }
	.wttc-header.is-nav-open .wttc-search__form { height: 100%; box-sizing: border-box; align-items: center; padding: 0 20px; }
	.wttc-header.is-nav-open:has(.wttc-search:not([hidden])) .wttc-header__bar { padding-top: calc(8px + var(--wttc-search-h)); }
	/* The drawer starts under the bar, so the logo and the buttons never sit over the menu text. */
	.wttc-header__bar { position: fixed; top: calc(var(--wttc-bar-h) + var(--wp-admin--admin-bar--height, 0px)); right: 0; bottom: 0; left: auto; width: min(420px, 100%); height: auto; display: block; padding: 8px 20px 32px; background: var(--wttc-navy); overflow-y: auto; transform: translateX(100%); visibility: hidden; transition: transform .3s ease, visibility 0s linear .3s; z-index: 3; }
	.wttc-header.is-nav-open .wttc-header__bar { transform: none; visibility: visible; transition-delay: 0s; }
	.wttc-header__logo, .wttc-header__tools { position: relative; z-index: 4; }
	.wttc-nav { border: 0; padding: 0; }
	.wttc-menu { display: block; }
	.wttc-menu__item { display: flex; flex-wrap: wrap; border-bottom: 1px solid rgba(255, 255, 255, .15); }
	.wttc-menu__link { flex: 1 1 auto; padding: 16px 0; font-size: 14px; font-weight: 600; }
	.wttc-menu__item:hover > .wttc-menu__link,
	.wttc-menu__item.is-open > .wttc-menu__link,
	.wttc-menu__item.current-menu-item > .wttc-menu__link { background: transparent; }
	.wttc-menu__toggle { flex: 0 0 44px; height: 44px; width: 44px; margin: 0; }
	.wttc-menu__toggle::before { left: 18px; top: 15px; }
	.wttc-menu__item.is-open > .wttc-menu__toggle::before { top: 19px; }
	.wttc-menu__item.has-panel > .wttc-menu__link:not(.wttc-menu__link--button) { padding-right: 0; }
	/* Unfolded vs folded: the open tab and its panel sit on a lighter plate with a white edge, so they never blend with the closed ones. */
	.wttc-menu__item.is-open { margin: 0 -20px; padding: 0 20px 0 17px; background: rgba(255, 255, 255, .09); border-left: 3px solid var(--wttc-white); }
	.wttc-menu__item.is-open > .wttc-menu__link { color: var(--wttc-white); }
	/* A tab without a link of its own (News): label on the left, chevron on the right, like the other tabs. */
	.wttc-menu__link--button { display: flex; align-items: center; justify-content: space-between; width: 100%; text-align: left; }
	.wttc-menu__link--button::after { margin: 0 21px 3px 0; }
	.wttc-menu__item.is-open > .wttc-menu__link--button::after { margin-bottom: -2px; }
	.wttc-menu__item.has-panel:has(> .wttc-panel--mega) { position: relative; }
	.wttc-panel, .wttc-panel--mega { position: static; flex: 0 0 100%; width: 100%; padding: 0; transform: none; top: auto; left: auto; visibility: visible; opacity: 1; display: none; }
	.wttc-panel--mega::before { display: none; }
	.wttc-menu__item:hover > .wttc-panel, .wttc-menu__item:focus-within > .wttc-panel { display: none; }
	.wttc-menu__item:hover > .wttc-panel--mega, .wttc-menu__item.is-open > .wttc-panel--mega { transform: none; }
	.wttc-menu__item.is-open > .wttc-panel { display: block; transform: none; }
	/* Every level starts at the same left edge: the hierarchy is carried by size and weight (tab 14px bold caps, group
	   title small caps, links regular), not by indentation. */
	.wttc-panel__inner, .wttc-panel--mega .wttc-panel__inner { display: block; padding: 0 0 12px; background: transparent; box-shadow: none; color: var(--wttc-white); }
	.wttc-col { margin-top: 14px; }
	.wttc-col__title { margin-bottom: 4px; padding-bottom: 8px; color: rgba(255, 255, 255, .7); border-color: rgba(255, 255, 255, .25); font-size: 11px; letter-spacing: .8px; }
	.wttc-col__list a, .wttc-panel--mega .wttc-col__list a { color: var(--wttc-white); padding: 9px 0; font-size: 15px; font-weight: 400; white-space: normal; }
	.wttc-col__list a:hover, .wttc-panel--mega .wttc-col__list a:hover { background: transparent; padding-left: 0; }
	/* Featured items (Research Hub, Together in Travel): side by side, two columns. */
	.wttc-features { grid-column: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 18px 0 4px; padding: 0; background: transparent; }
	.wttc-feature, .wttc-feature + .wttc-feature { grid-template-columns: minmax(0, 1fr); row-gap: 8px; margin: 0; padding: 0; border: 0; align-content: start; }
	.wttc-feature__plate, .wttc-feature__title, .wttc-feature__text, .wttc-feature__cta { grid-column: 1; grid-row: auto; }
	.wttc-feature__plate { height: 56px; padding: 0 10px; }
	.wttc-feature__plate .wttc-feature__logo, .wttc-feature--research-hub .wttc-feature__logo, .wttc-feature--together-in-travel .wttc-feature__logo { width: 100%; height: 100%; object-fit: contain; }
	.wttc-feature__text { align-self: start; font-size: 12px; }
	.wttc-panel--mega.has-features .wttc-panel__inner { overflow: visible; }
}
body.wttc-nav-open { overflow: hidden; }
/* ----- Footer of the mobile drawer (contact, social, partner, copyright): small, quiet ----- */
.wttc-menu-foot { display: none; }
@media (max-width: 1024px) {
	.wttc-menu-foot { display: block; margin-top: 28px; padding-bottom: 8px; color: rgba(255, 255, 255, .8); font: 400 12px/1.6 var(--wttc-font-sans); }
	.wttc-menu-foot a, .wttc-menu-foot a:visited { color: inherit; text-decoration: none; }
	.wttc-menu-foot a:hover, .wttc-menu-foot a:focus-visible { color: var(--wttc-white); text-decoration: underline; text-underline-offset: 3px; }
	.wttc-menu-foot p { margin: 0; }
	.wttc-menu-foot__social { display: flex; flex-wrap: wrap; gap: 6px 4px; margin: 14px 0 0 -6px; padding: 0; list-style: none; }
	.wttc-menu-foot__social li { margin: 0; }
	.wttc-menu-foot__social a { display: grid; place-items: center; width: 32px; height: 32px; border-radius: var(--wttc-radius); }
	.wttc-menu-foot__social a:hover, .wttc-menu-foot__social a:focus-visible { background: rgba(255, 255, 255, .12); text-decoration: none; }
	.wttc-menu-foot__partner { display: flex; align-items: center; gap: 12px; margin-top: 14px; }
	.wttc-menu-foot__partner a { display: flex; align-items: center; gap: 12px; }
	.wttc-menu-foot__partner-logo { display: block; width: auto; height: 38px; }
	.wttc-menu-foot__copy { margin-top: 20px; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, .15); font-size: 10px; letter-spacing: .5px; text-transform: uppercase; }
}
@media (max-width: 1024px) and (prefers-reduced-motion: no-preference) {
	.wttc-menu-foot { opacity: 0; transition: opacity .4s ease; }
	.wttc-header.is-nav-open .wttc-menu-foot { opacity: 1; transition-delay: .45s; }
}

/* ----- Light tone: pages whose top is white (news, members) ----------------------------------------------------------------
   Same header, same behaviour: transparent with the blur at the top, navy bar once the page scrolls (or the drawer opens). Only the
   ink changes (navy instead of white) while it floats over the white, so it can be read. Body class wttc-header-light. */
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) { --wttc-ink: var(--wttc-navy); }
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) .wttc-nav { border-color: rgba(21, 27, 52, .45); }
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) .wttc-menu__link,
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) .wttc-menu__link:hover,
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) .wttc-menu__link:focus,
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) .wttc-menu__toggle,
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) button.wttc-header__search-toggle,
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) button.wttc-header__burger { color: var(--wttc-navy); }
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) .wttc-menu__item:hover > .wttc-menu__link,
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) .wttc-menu__item.is-open > .wttc-menu__link,
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) .wttc-menu__item.current-menu-item > .wttc-menu__link,
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) .wttc-menu__item.current-menu-ancestor > .wttc-menu__link { background: rgba(21, 27, 52, .08); color: var(--wttc-navy); }
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) button.wttc-header__search-toggle:hover,
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) button.wttc-header__burger:hover,
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) button.wttc-header__search-toggle:focus-visible,
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) button.wttc-header__burger:focus-visible { background: rgba(21, 27, 52, .08); color: var(--wttc-navy); }
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) a:focus-visible,
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) button:focus-visible { outline-color: var(--wttc-navy); }
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) .wttc-search__input { border-color: rgba(21, 27, 52, .45); color: var(--wttc-navy); }
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) .wttc-search__input::placeholder { color: rgba(21, 27, 52, .6); }
.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) button.wttc-search__submit { background: var(--wttc-navy); color: var(--wttc-white); }
@media (max-width: 1024px) {
	.wttc-header-light .wttc-header:not(.is-scrolled):not(.is-nav-open) .wttc-wm-text { fill: var(--wttc-navy); }
}

/* ----- Opening animations (CSS only; nothing moves with "reduce motion") ----- */
@media (prefers-reduced-motion: no-preference) {
	/* The logo and the tools slide in once, when the page loads. Never a transform on .wttc-header__inner or the bar: any transform
	   (even an animated one) makes the element the containing block of the fixed mega panel and of the mobile drawer. */
	@keyframes wttc-bar-in { from { opacity: 0; transform: translateY(-14px); } to { opacity: 1; transform: none; } }
	@keyframes wttc-fade-in { from { opacity: 0; } to { opacity: 1; } }
	.wttc-header__logo, .wttc-header__tools { animation: wttc-bar-in .6s cubic-bezier(.22, 1, .36, 1) .1s backwards; }
	.wttc-header__bar { animation: wttc-fade-in .6s ease .2s backwards; }
	/* Search bar drops down. */
	@keyframes wttc-drop { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
	.wttc-search:not([hidden]) { animation: wttc-drop .25s ease-out both; }
}
@media (min-width: 1025px) and (prefers-reduced-motion: no-preference) {
	/* Panels: the columns rise one after the other, then the featured band. Closing is immediate (no delays on the base state). */
	.wttc-panel--mega .wttc-col, .wttc-panel--simple .wttc-col__item { opacity: 0; transform: translateY(10px); transition: opacity .35s ease, transform .4s cubic-bezier(.22, 1, .36, 1); }
	.wttc-panel--mega .wttc-features { opacity: 0; transform: translateY(16px); transition: opacity .4s ease, transform .5s cubic-bezier(.22, 1, .36, 1); }
	.wttc-menu__item:hover > .wttc-panel .wttc-col, .wttc-menu__item.is-open > .wttc-panel .wttc-col, .wttc-menu__item:focus-within > .wttc-panel .wttc-col,
	.wttc-menu__item:hover > .wttc-panel .wttc-col__item, .wttc-menu__item.is-open > .wttc-panel .wttc-col__item, .wttc-menu__item:focus-within > .wttc-panel .wttc-col__item,
	.wttc-menu__item:hover > .wttc-panel .wttc-features, .wttc-menu__item.is-open > .wttc-panel .wttc-features, .wttc-menu__item:focus-within > .wttc-panel .wttc-features { opacity: 1; transform: none; }
	.wttc-panel--mega .wttc-col:nth-child(1) { transition-delay: .05s; }
	.wttc-panel--mega .wttc-col:nth-child(2) { transition-delay: .11s; }
	.wttc-panel--mega .wttc-col:nth-child(3) { transition-delay: .17s; }
	.wttc-panel--mega .wttc-col:nth-child(4) { transition-delay: .23s; }
	.wttc-panel--mega .wttc-features { transition-delay: .26s; }
	.wttc-panel--simple .wttc-col__item:nth-child(1) { transition-delay: .04s; }
	.wttc-panel--simple .wttc-col__item:nth-child(2) { transition-delay: .08s; }
	.wttc-panel--simple .wttc-col__item:nth-child(3) { transition-delay: .12s; }
	.wttc-panel--simple .wttc-col__item:nth-child(4) { transition-delay: .16s; }
	.wttc-panel--simple .wttc-col__item:nth-child(n+5) { transition-delay: .2s; }
	.wttc-panel:not(:hover) .wttc-col, .wttc-menu__item:not(:hover):not(.is-open):not(:focus-within) .wttc-col { transition-delay: 0s; }
}
@media (max-width: 1024px) and (prefers-reduced-motion: no-preference) {
	/* Drawer: the tabs come in one after the other; an unfolding tab opens its panel with a short slide. */
	.wttc-header__bar .wttc-menu > .wttc-menu__item { opacity: 0; transform: translateX(18px); transition: opacity .3s ease, transform .4s cubic-bezier(.22, 1, .36, 1); }
	.wttc-header.is-nav-open .wttc-menu > .wttc-menu__item { opacity: 1; transform: none; }
	.wttc-header.is-nav-open .wttc-menu > .wttc-menu__item:nth-child(1) { transition-delay: .12s; }
	.wttc-header.is-nav-open .wttc-menu > .wttc-menu__item:nth-child(2) { transition-delay: .17s; }
	.wttc-header.is-nav-open .wttc-menu > .wttc-menu__item:nth-child(3) { transition-delay: .22s; }
	.wttc-header.is-nav-open .wttc-menu > .wttc-menu__item:nth-child(4) { transition-delay: .27s; }
	.wttc-header.is-nav-open .wttc-menu > .wttc-menu__item:nth-child(5) { transition-delay: .32s; }
	.wttc-header.is-nav-open .wttc-menu > .wttc-menu__item:nth-child(n+6) { transition-delay: .37s; }
	@keyframes wttc-unfold { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
	.wttc-menu__item.is-open > .wttc-panel { animation: wttc-unfold .3s ease-out both; }
	.wttc-menu__item.is-open > .wttc-panel .wttc-features { animation: wttc-unfold .4s ease-out .12s both; }
}
@media (prefers-reduced-motion: reduce) { .wttc-panel, .wttc-header__bar, .wttc-header, .wttc-header::before, .wttc-header__logo, .wttc-header__logo img { transition: none; } }
/* Elementor's kit paints every link (".elementor-kit-N a", specificity 0,1,1): the single-class link colours of the menu need one more class to win on sites that have a kit. */
.wttc-header .wttc-menu__link { color: var(--wttc-white); }
.wttc-header .wttc-col__title { color: var(--wttc-navy); }
.wttc-header .wttc-feature { color: var(--wttc-white); }
@media (max-width: 1024px) { .wttc-header .wttc-col__title { color: rgba(255, 255, 255, .7); } }
