/* WUB header – mega menu, account menu, cart icon (design "WUB Mega Menu 1b").
   Loaded on every page by WUBSHOP_Header. Colours come from the Elementor kit. */

:root {
	--wub-hdr-ink: var(--e-global-color-text, #201e1d);
	--wub-hdr-cream: var(--e-global-color-wcream, #f5ead8);
	--wub-hdr-sand: var(--e-global-color-wsand, #ebddc5);
	--wub-hdr-raised: var(--e-global-color-wraise, #fdf7ec);
	--wub-hdr-deep: var(--e-global-color-wbl900, #122d37);
	--wub-hdr-light-text: var(--e-global-color-wondrk, #faf6ee);
	--wub-hdr-blue: var(--e-global-color-primary, #2f7386);
	--wub-hdr-blue-text: var(--e-global-color-accent, #245c6c);
	--wub-hdr-clay-text: var(--e-global-color-wcl700, #8c491a);
	--wub-hdr-divider: var(--e-global-color-wdivid, rgba(32, 30, 29, .16));
	--wub-hdr-shadow: 0 14px 34px rgba(74, 58, 34, .18);
}

/* ── icon buttons: account + cart ─────────────────────────────────────────── */

.wub-hdr-icon {
	position: relative; display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; padding: 0; margin: 0; border-radius: 50%;
	border: 1px solid var(--wub-hdr-icon-border, var(--wub-hdr-divider)); background: transparent;
	color: inherit; cursor: pointer; text-decoration: none; line-height: 1;
	transition: background-color .15s, border-color .15s;
}
.wub-hdr-icon:hover,
.wub-hdr-icon[aria-expanded="true"] { background: var(--wub-hdr-hover-bg, rgba(47, 115, 134, .1)); color: inherit; }
.wub-hdr-icon:focus-visible { outline: 2px solid var(--e-global-color-wbl500, #3f8b9d); outline-offset: 2px; }
.wub-hdr-icon .wub-ico { display: block; flex: none; }
/* The cart icon is a link; beat the site link colour so it matches the bar. */
.wub-hdr a.wub-hdr-icon, .wub-hdr a.wub-hdr-icon:hover { color: var(--wub-hdr-fg); }
/* The account icon is a <button>: the kit's global button style (teal fill) would win. */
.wub-hdr button.wub-hdr-icon { background: transparent; color: var(--wub-hdr-fg); border: 1px solid var(--wub-hdr-icon-border); padding: 0; border-radius: 50%; box-shadow: none; }
.wub-hdr button.wub-hdr-icon:hover, .wub-hdr button.wub-hdr-icon:focus, .wub-hdr button.wub-hdr-icon[aria-expanded="true"] { background: var(--wub-hdr-hover-bg); color: var(--wub-hdr-fg); border-color: var(--wub-hdr-icon-border); }
/* Quieter on desktop; phones keep 44px for thumbs. */
@media (min-width: 1025px) {
	.wub-hdr .wub-hdr-icon { width: 38px; height: 38px; }
	.wub-hdr .wub-hdr-icon .wub-ico { width: 17px; height: 17px; stroke-width: 2.25; }
}

.wub-cart-badge .wub-cart-count {
	position: absolute; top: -4px; right: -4px; min-width: 18px; height: 18px; padding: 0 5px;
	display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box;
	border-radius: 999px; background: var(--e-global-color-wgold, #fbaa28); color: var(--wub-hdr-ink); /* gold, like the gold buttons */
	font: 700 11px/1 var(--e-global-typography-text-font-family, sans-serif);
}
.wub-cart-badge .wub-cart-count[data-count="0"] { display: none; }

/* ── account menu ─────────────────────────────────────────────────────────── */

.wub-acct { position: relative; display: inline-flex; }
.wub-acct__menu {
	position: absolute; top: calc(100% + 10px); right: 0; z-index: 1000; min-width: 220px;
	display: grid; gap: 2px; padding: 8px; box-sizing: border-box;
	background: var(--wub-hdr-raised); border-radius: 18px; box-shadow: var(--wub-hdr-shadow);
}
.wub-acct__menu[hidden] { display: none; }
.wub-acct__item {
	display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 12px;
	color: var(--wub-hdr-ink); text-decoration: none; white-space: nowrap;
	font: 600 15px/1.2 var(--e-global-typography-text-font-family, sans-serif);
}
.wub-acct__item:hover, .wub-acct__item:focus-visible { background: var(--wub-hdr-sand); color: var(--wub-hdr-ink); }
.wub-acct__item.is-logout { color: var(--wub-hdr-clay-text); border-top: 1px solid var(--wub-hdr-divider); border-radius: 0 0 12px 12px; margin-top: 4px; padding-top: 12px; }

/* ── phone menu tiles ─────────────────────────────────────────────────────── */

.wub-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 8px; }
.wub-tile {
	display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 12px 6px;
	border-radius: 14px; background: var(--wub-hdr-sand); color: var(--wub-hdr-ink); text-decoration: none;
	font: 600 13px/1.2 var(--e-global-typography-text-font-family, sans-serif); text-align: center;
}
.wub-tile.is-logout { color: var(--wub-hdr-clay-text); }
.wub-login-btn {
	min-height: 48px; display: flex; align-items: center; justify-content: center; gap: 8px; box-sizing: border-box;
	border-radius: 999px; border: 1.5px solid rgba(32, 30, 29, .2); background: transparent;
	color: var(--wub-hdr-ink); text-decoration: none; font: 600 15px/1.2 var(--e-global-typography-text-font-family, sans-serif);
	transition: background-color .15s;
}
.wub-login-btn:hover { background: var(--wub-hdr-hover-bg, rgba(47, 115, 134, .1)); }
/* Beat the site link colour. */
.wub-hdr a.wub-login-btn, .wub-hdr a.wub-login-btn:hover { color: var(--wub-hdr-ink); }

/* ── the bar: dark by default, light on the store pages (body.wub-hdr-light) ── */

.wub-hdr {
	--wub-hdr-fg: var(--wub-hdr-light-text);
	--wub-hdr-icon-border: var(--e-global-color-wwht14, rgba(255, 255, 255, .14)); /* same as the footer's divider */
	--wub-hdr-hover-bg: rgba(250, 246, 238, .1);
	--wub-hdr-active: var(--e-global-color-wbl300, #a4d0da);
	--wub-hdr-active-bg: rgba(250, 246, 238, .1);
	position: relative; z-index: 100; color: var(--wub-hdr-fg);
}
body.wub-hdr-light .wub-hdr {
	--wub-hdr-fg: var(--wub-hdr-ink);
	--wub-hdr-icon-border: var(--e-global-color-wdivid, rgba(32, 30, 29, .16));
	--wub-hdr-hover-bg: rgba(47, 115, 134, .1);
	--wub-hdr-active: var(--wub-hdr-blue-text);
	--wub-hdr-active-bg: var(--wub-hdr-sand);
}
body.wub-hdr-light .wub-hdr.e-con { background-color: var(--wub-hdr-cream) !important; }
/* Pages with their own header style (1a dark / 1b light): the active menu item
   takes the page's accent… */
body.wub-hdr-page-events .wub-hdr { --wub-hdr-active: var(--e-global-color-wwksoft, #a4e4ec); }
body.wub-hdr-page-about .wub-hdr { --wub-hdr-active: var(--e-global-color-wshsoft, #f7bccc); }
body.wub-hdr-page-workshops .wub-hdr { --wub-hdr-active: var(--e-global-color-wabsoft, #b5defc); }
body.wub-hdr-page-gallery .wub-hdr { --wub-hdr-active: var(--e-global-color-wgasoft, #dcc6f7); }
body.wub-hdr-page-shop .wub-hdr { --wub-hdr-active: var(--e-global-color-wcl300, #ffc6a5); }
/* …1a pages: the bar is the page's deep colour… */
body.wub-hdr-page-workshops .wub-hdr.e-con { background-color: var(--e-global-color-wabdeep, #0f2a45) !important; }
body.wub-hdr-page-gallery .wub-hdr.e-con { background-color: var(--e-global-color-wgadeep, #2c1a45) !important; }
body.wub-hdr-page-shop .wub-hdr.e-con { background-color: var(--e-global-color-wevdeep, #4a1f0c) !important; }
body.wub-hdr-page-about .wub-hdr.e-con { background-color: var(--e-global-color-wshdeep, #45162b) !important; }
/* …and the page's own menu item sits in a pill (Elementor doesn't mark it current). */
@media (min-width: 1025px) {
	body.wub-hdr-page-events .wub-hdr .wub-mm .e-n-menu-title:has([href$="/events/"]),
	body.wub-hdr-page-about .wub-hdr .wub-mm .e-n-menu-title:has([href$="/about/"]),
	body.wub-hdr-page-workshops .wub-hdr .wub-mm .e-n-menu-title:has([href$="/workshops/"]),
	body.wub-hdr-page-gallery .wub-hdr .wub-mm .e-n-menu-title:has([href$="/gallery/"]),
	body.wub-hdr-page-shop .wub-hdr .wub-mm .e-n-menu-title:has([href$="/shop/"]) { background: var(--wub-hdr-active-bg); }
	body.wub-hdr-page-events .wub-hdr .wub-mm .e-n-menu-title:has([href$="/events/"]) :is(.e-n-menu-title-container, .e-n-menu-title-text, .e-n-menu-dropdown-icon),
	body.wub-hdr-page-about .wub-hdr .wub-mm .e-n-menu-title:has([href$="/about/"]) :is(.e-n-menu-title-container, .e-n-menu-title-text, .e-n-menu-dropdown-icon),
	body.wub-hdr-page-workshops .wub-hdr .wub-mm .e-n-menu-title:has([href$="/workshops/"]) :is(.e-n-menu-title-container, .e-n-menu-title-text, .e-n-menu-dropdown-icon),
	body.wub-hdr-page-gallery .wub-hdr .wub-mm .e-n-menu-title:has([href$="/gallery/"]) :is(.e-n-menu-title-container, .e-n-menu-title-text, .e-n-menu-dropdown-icon),
	body.wub-hdr-page-shop .wub-hdr .wub-mm .e-n-menu-title:has([href$="/shop/"]) :is(.e-n-menu-title-container, .e-n-menu-title-text, .e-n-menu-dropdown-icon) { color: var(--wub-hdr-active); }
}
.wub-hdr .wub-hdr__logo--light,
body.wub-hdr-light .wub-hdr .wub-hdr__logo--dark { display: none !important; }
body.wub-hdr-light .wub-hdr .wub-hdr__logo--light { display: block !important; }
.wub-hdr .wub-hdr__right.e-con { --flex-direction: row; --align-items: center; --gap: 9px; --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0; width: auto; flex: none; }
.wub-hdr .wub-hdr__right .elementor-widget-shortcode { width: auto; }

/* ── menu items: pills ──────────────────────────────────────────────────── */

.wub-hdr .wub-mm.elementor-widget-n-menu {
	--n-menu-title-color-normal: var(--wub-hdr-fg);
	--n-menu-title-color-hover: var(--wub-hdr-active);
	--n-menu-title-color-active: var(--wub-hdr-active);
	--n-menu-title-font-size: 15px;
	--n-menu-title-line-height: 1.2;
	--n-menu-title-padding: 9px 14px;
	--n-menu-title-space-between: 4px;
	--n-menu-dropdown-indicator-size: 11px;
	--n-menu-dropdown-indicator-space: 6px;
	--n-menu-toggle-icon-color: var(--wub-hdr-fg);
	--n-menu-toggle-icon-color-hover: var(--wub-hdr-fg);
	--n-menu-toggle-icon-color-active: var(--wub-hdr-fg);
	--n-menu-toggle-icon-size: 20px;
	--n-menu-divider-border-width: 0;
	flex: 1 1 auto;
}
.wub-hdr .wub-mm .e-n-menu-title { border-radius: 999px; transition: background-color .15s; font-family: var(--e-global-typography-wnav-font-family, sans-serif); font-weight: 600; }
.wub-hdr .wub-mm .e-n-menu-title:hover,
.wub-hdr .wub-mm .e-n-menu-title.e-current { background: var(--wub-hdr-active-bg); }
.wub-hdr .wub-mm .e-n-menu-title-container { text-decoration: none; }

/* ── the panel ──────────────────────────────────────────────────────────── */

@media (min-width: 1025px) {
	.wub-hdr .wub-mm .e-n-menu-content > .e-con.wub-mm-panel {
		--padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0; --gap: 0; --row-gap: 0px; --column-gap: 0px;
		/* Elementor writes width: var(--width) inline, so set the variable. */
		--width: min(1180px, calc(100vw - 70px)); max-width: none; margin: 10px auto 0;
		background: var(--wub-hdr-raised); color: var(--wub-hdr-ink);
		border-radius: 18px; box-shadow: var(--wub-hdr-shadow); overflow: hidden;
	}
	/* Dim the page under an open panel (the header sits above it). */
	body:has(.wub-hdr .wub-mm .e-n-menu-content > .e-con.e-active)::after {
		content: ""; position: fixed; inset: 0; z-index: 99; pointer-events: none;
		background: rgba(18, 45, 55, .28);
	}
}

.wub-mm-panel {
	--wub-mm-tint: var(--e-global-color-wbl100, #e9f4f6);
	--wub-mm-fg: var(--wub-hdr-blue-text);
	--wub-mm-solid: var(--wub-hdr-blue);
	--wub-mm-rail: var(--e-global-color-wbl800, #1a4351);
}
/* Every menu is teal (her call, 2026-10-28 – the old "clay for events" rule is retired). The `wub-mm--clay` class on the Events panel no longer changes anything. */
/* …except the link icons: coral-brown in every menu (her call, 2026-10-28). */
.wub-mm-panel { --wub-mm-icon: var(--e-global-color-wcoink, #a8461a); }

.wub-hdr .e-con.wub-mm-grid {
	--display: grid; --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0; --gap: 0;
	grid-template-columns: 280px minmax(0, 1fr) 300px; align-items: stretch; min-height: 266px;
}

/* Rail: the section's name, a line, and "view all". */
.wub-hdr .e-con.wub-mm-rail {
	--padding-top: 26px; --padding-bottom: 26px; --padding-left: 22px; --padding-right: 22px; --gap: 9px;
	background: var(--wub-mm-rail); color: var(--wub-hdr-light-text);
}
.wub-hdr .wub-mm-rail__title .elementor-heading-title {
	font-family: var(--e-global-typography-wh2-font-family, Georgia, serif); font-weight: 400;
	font-size: 34px; line-height: 1.05; color: var(--wub-hdr-light-text);
}
.wub-hdr .wub-mm-rail__text, .wub-hdr .wub-mm-rail__text p { margin: 0; font-size: 15px; line-height: 1.45; color: var(--wub-hdr-light-text); }
.wub-hdr .wub-mm-rail__all { margin-top: auto; }
.wub-hdr .wub-mm-rail__all .elementor-button {
	display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 999px;
	background: transparent; border: 1px solid rgba(250, 246, 238, .55); color: var(--wub-hdr-light-text);
	font: 600 14px/1.2 var(--e-global-typography-wnav-font-family, sans-serif);
}
.wub-hdr .wub-mm-rail__all .elementor-button:hover { background: rgba(250, 246, 238, .14); color: #fff; }
.wub-hdr .wub-mm-rail__all .elementor-button-icon svg { width: 16px; height: 16px; stroke: currentColor; fill: none; }

/* Links: big single rows with an icon and an arrow. */
.wub-hdr .e-con.wub-mm-links { --padding-top: 16px; --padding-bottom: 16px; --padding-left: 22px; --padding-right: 22px; --gap: 0; }
.wub-hdr .wub-mm-link { border-bottom: 1px solid var(--wub-hdr-divider); }
/* The last item has no line – the strip below brings its own (no double line). */
.wub-hdr .wub-mm-link:last-child { border-bottom: 0; }
.wub-hdr .wub-mm-link .elementor-icon-box-wrapper {
	position: relative; display: flex; align-items: center; gap: 14px; padding: 12px 34px 12px 8px; border-radius: 12px;
	transition: background-color .15s;
}
.wub-hdr .wub-mm-link:hover .elementor-icon-box-wrapper { background: var(--wub-mm-tint); }
.wub-hdr .wub-mm-link .elementor-icon-box-wrapper::after {
	content: "→"; position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
	font-size: 16px; color: var(--e-global-color-wmuted, #57524a); transition: transform .15s;
}
.wub-hdr .wub-mm-link:hover .elementor-icon-box-wrapper::after { transform: translate(3px, -50%); }
.wub-hdr .wub-mm-link .elementor-icon-box-icon { margin: 0 !important; flex: none; }
.wub-hdr .wub-mm-link .elementor-icon { display: flex; color: var(--wub-mm-icon, var(--wub-mm-fg)); font-size: 22px; }
.wub-hdr .wub-mm-link .elementor-icon svg { width: 22px; height: 22px; stroke: currentColor; fill: none; }
.wub-hdr .wub-mm-link .elementor-icon-box-title { margin: 0; font: 700 16px/1.25 var(--e-global-typography-text-font-family, sans-serif); color: var(--wub-hdr-ink); }
.wub-hdr .wub-mm-link .elementor-icon-box-title a { color: inherit; text-decoration: none; }
.wub-hdr .wub-mm-link .elementor-icon-box-title a::after { content: ""; position: absolute; inset: 0; } /* the whole row clicks */
.wub-hdr .wub-mm-link .elementor-icon-box-description { margin: 2px 0 0; font-size: 13px; line-height: 1.35; color: var(--e-global-color-wmuted, #57524a); }

/* Featured: a photo with a card on it. */
.wub-hdr .e-con.wub-mm-feature-wrap { --padding-top: 16px; --padding-bottom: 16px; --padding-left: 0; --padding-right: 16px; }
.wub-hdr .wub-mm-feature-loop, .wub-hdr .wub-mm-feature-loop .elementor-loop-container, .wub-hdr .wub-mm-feature-loop .e-loop-item { height: 100%; }
.wub-hdr .wub-mm-feature-loop .elementor-widget-container { height: 100%; }
.wub-hdr .e-con.wub-mm-feature {
	--padding-top: 12px; --padding-bottom: 12px; --padding-left: 12px; --padding-right: 12px; --justify-content: flex-end;
	min-height: 234px; height: 100%; border-radius: 18px; overflow: hidden;
	background-color: var(--e-global-color-wnt200, #efe8db);
}
/* Containers take margin from these variables; a plain margin is overridden. */
.wub-hdr .wub-mm-grid > .e-con.wub-mm-feature { --margin-top: 16px; --margin-right: 16px; --margin-bottom: 16px; --margin-left: 0px; --width: auto; height: auto; }
.wub-hdr .e-con.wub-mm-card {
	--padding-top: 14px; --padding-bottom: 14px; --padding-left: 16px; --padding-right: 16px;
	--row-gap: 4px; --column-gap: 4px; /* containers read these, not --gap (it fell back to Elementor's 20px) */
	background: var(--wub-hdr-raised); border-radius: 12px; box-shadow: 0 1px 2px rgba(74, 58, 34, .12);
}
.wub-hdr .wub-mm-card__kicker .elementor-heading-title {
	font: 700 11px/1.3 var(--e-global-typography-text-font-family, sans-serif); letter-spacing: .1em; text-transform: uppercase;
	color: var(--e-global-color-wcl600, #b2622d);
}
.wub-hdr .wub-mm-card__title .elementor-heading-title { text-wrap: balance;
	font-family: var(--e-global-typography-wh2-font-family, Georgia, serif); font-weight: 400; font-size: 20px; line-height: 1.15; color: var(--wub-hdr-ink);
}
.wub-hdr .wub-mm-card__meta .elementor-heading-title { margin: 0; text-wrap: pretty; font-size: 13px; line-height: 1.35; color: var(--e-global-color-wmuted, #57524a); }
/* Kicker, title and line sit together; the button steps down from them. */
.wub-hdr .wub-mm-card .wub-mm-card__cta { margin-top: 10px; }
.wub-hdr .wub-mm-card__cta .elementor-button,
/* Only the card's own Book button – the booking pop-up lives inside the card and keeps its own buttons. */
.wub-hdr .wub-mm-card__cta .wpsess-booking > .wpsess-btn {
	display: inline-flex; align-items: center; padding: 8px 16px; border-radius: 999px; border: 0;
	background: var(--e-global-color-wcl600, #b2622d); color: #fff;
	font: 600 13px/1.2 var(--e-global-typography-wnav-font-family, sans-serif); cursor: pointer;
}
/* Every card on the right is clay – eyebrow and button – whatever the menu (her call, 2026-10-28). */
.wub-hdr .wub-mm-card__cta .elementor-button:hover,
.wub-hdr .wub-mm-card__cta .wpsess-booking > .wpsess-btn:hover { background: var(--e-global-color-wcl700, #8c491a); color: #fff; }
/* The photo opens the event too (2026-10-30): the name's link is stretched over the whole photo + card;
   the card goes static so the link measures from the photo box; the Book button sits above it. */
.wub-hdr .e-con.wub-mm-feature .e-con.wub-mm-card,
.wub-hdr .wub-mm-feature .wub-mm-card__title,
.wub-hdr .wub-mm-feature .wub-mm-card__title .elementor-widget-container,
.wub-hdr .wub-mm-feature .wub-mm-card__title .elementor-heading-title { --position: static; position: static; }
.wub-hdr .wub-mm-feature .wub-mm-card__title .elementor-heading-title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.wub-hdr .wub-mm-card .wub-mm-card__cta { position: relative; z-index: 2; }
.wub-hdr .wub-mm-feature:hover .wub-mm-card__title .elementor-heading-title a { text-decoration-color: currentColor; }
.wub-hdr .wub-mm-card__cta .wpsess-booking__seats { display: none; }
.wub-hdr .wub-mm-card__cta .wpsess-booking { margin: 0; }

/* Strip along the bottom. */
.wub-hdr .e-con.wub-mm-strip {
	--padding-top: 12px; --padding-bottom: 12px; --padding-left: 22px; --padding-right: 22px;
	border-top: 1px solid var(--wub-hdr-divider);
}
.wub-hdr .wub-mm-strip p { margin: 0; font-size: 14px; color: var(--e-global-color-wnt800, #3c3934); }
.wub-hdr .wub-mm-strip a { margin-left: 4px; font-weight: 700; color: var(--wub-mm-fg); text-decoration: none; }
.wub-hdr .wub-mm-strip a:hover { text-decoration: underline; }

/* The phone menu's bottom bar exists only in the open phone menu. */
.wub-hdr .wub-mm-mobilebar { display: none !important; }

/* ── tablet + phone: accordion ─────────────────────────────────────────── */

@media (max-width: 1024px) {
	.wub-hdr .wub-hdr__logo { order: 1; }
	.wub-hdr .wub-hdr__right.e-con { order: 2; margin-left: auto; }
	.wub-hdr .wub-mm.elementor-widget-n-menu { order: 3; flex: none; }
	.wub-hdr .wub-hdr__acct, .wub-hdr .wub-hdr__book { display: none !important; }

	.wub-hdr .wub-mm .e-n-menu-toggle {
		width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
		border: 1px solid var(--wub-hdr-icon-border);
	}
	.wub-hdr .wub-mm .e-n-menu-toggle[aria-expanded="true"] { background: var(--wub-hdr-ink); border-color: var(--wub-hdr-ink); --n-menu-toggle-icon-color-active: #fff; }

	/* The open menu fills the screen under the bar; the page can't scroll behind it. */
	.wub-hdr .wub-mm .e-n-menu[data-layout] .e-n-menu-wrapper {
		/* !important: Elementor pins the dropdown at top:100%. header.js sets --wub-hdr-h. */
		position: fixed !important; top: var(--wub-hdr-h, 82px) !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
		width: auto !important; height: auto !important; max-height: none !important;
		overflow-y: auto; background: var(--wub-hdr-cream); color: var(--wub-hdr-ink);
		padding: 6px 20px 190px; box-sizing: border-box; border-top: 1px solid var(--wub-hdr-divider);
	}
	body:has(.wub-hdr .wub-mm .e-n-menu-toggle[aria-expanded="true"]) { overflow: hidden; }
	.wub-hdr .wub-mm.elementor-widget-n-menu { --n-menu-title-color-normal: var(--wub-hdr-ink); --n-menu-title-color-hover: var(--wub-hdr-blue-text); --n-menu-title-color-active: var(--wub-hdr-blue-text); --n-menu-title-font-size: 18px; --n-menu-title-padding: 16px 4px; --n-menu-dropdown-indicator-size: 14px; }
	/* Elementor sizes each item to the screen width; let the padded wrapper set it. */
	.wub-hdr .wub-mm .e-n-menu[data-layout] .e-n-menu-item,
	.wub-hdr .wub-mm .e-n-menu[data-layout] .e-n-menu-content { width: 100%; }
	.wub-hdr .wub-mm .e-n-menu[data-layout] .e-n-menu-item { border-bottom: 1px solid var(--wub-hdr-divider); }
	/* [data-layout] outranks Elementor's dropdown rules (white title pills). */
	.wub-hdr .wub-mm .e-n-menu[data-layout] .e-n-menu-title { background: transparent; border-radius: 0; justify-content: space-between; }

	.wub-hdr .wub-mm .e-n-menu-content > .e-con.wub-mm-panel { --padding-top: 0; --padding-bottom: 12px; --padding-left: 0; --padding-right: 0; background: transparent; box-shadow: none; border-radius: 0; width: 100%; }
	.wub-hdr .e-con.wub-mm-grid { --display: flex; min-height: 0; }
	.wub-hdr .e-con.wub-mm-rail { --padding-top: 0; --padding-bottom: 0; --padding-left: 0; --padding-right: 0; background: transparent; order: 2; }
	.wub-hdr .wub-mm-rail__title, .wub-hdr .wub-mm-rail__text, .wub-hdr .wub-mm-feature-wrap, .wub-hdr .wub-mm-grid > .wub-mm-feature, .wub-hdr .wub-mm-strip { display: none !important; }
	.wub-hdr .wub-mm-rail__all .elementor-button { border: 0; padding: 6px 4px; color: var(--wub-mm-fg); }
	.wub-hdr .e-con.wub-mm-links { --padding-top: 0; --padding-bottom: 4px; --padding-left: 0; --padding-right: 0; order: 1; }
	.wub-hdr .wub-mm-link { border-bottom: 0; }
	.wub-hdr .wub-mm-link .elementor-icon-box-wrapper { padding: 9px 4px; gap: 12px; }
	.wub-hdr .wub-mm-link .elementor-icon-box-wrapper::after { display: none; }
	.wub-hdr .wub-mm-link .elementor-icon { width: 36px; height: 36px; border-radius: 10px; align-items: center; justify-content: center; background: var(--wub-mm-tint); }
	.wub-hdr .wub-mm-link .elementor-icon svg { width: 20px; height: 20px; }
	.wub-hdr .wub-mm-link .elementor-icon-box-title { font-size: 15px; }

	.wub-hdr:has(.wub-mm .e-n-menu-toggle[aria-expanded="true"]) .wub-mm-mobilebar {
		display: flex !important; position: fixed; left: 0; right: 0; bottom: 0; z-index: 2147483641; /* above Elementor's menu (…640) */
		--flex-direction: column; --gap: 12px; --row-gap: 12px; --padding-top: 16px; --padding-left: 16px; --padding-right: 16px;
		--padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px)); /* clear the iPhone home bar */
		background: var(--wub-hdr-raised); border-top: 1px solid var(--wub-hdr-divider); color: var(--wub-hdr-ink);
	}
	.wub-hdr .wub-mm-mobilebar__book, .wub-hdr .wub-mm-mobilebar__book .elementor-button { width: 100%; justify-content: center; }
	.wub-hdr .wub-mm-mobilebar__book .elementor-button { min-height: 52px; align-items: center; border-radius: 999px; font-size: 17px; font-weight: 600; }
}

/* ── the header sits ON the hero (like the 1a/1b/1c mockups) ──────────────
   A page's first section carries `wub-hero`: the bar turns see-through, the
   hero slides up under it by the header's height (and pads its content back
   down by the same), and its decoration shapes move down the same amount –
   so nothing moves on the page, the shapes just aren't cut off at the bar.
   --wub-hdr-height: measured by header.js; these are the fallbacks. */
:root { --wub-hdr-height: 107px; }
@media (max-width: 767px) { :root { --wub-hdr-height: 97px; } }
body:has(.wub-hero) .wub-hdr.wub-hdr.e-con { background-color: transparent !important; }
.e-con.wub-hero { margin-top: calc(-1 * var(--wub-hdr-height)) !important; }
/* Full-width containers pad themselves; boxed ones pad their inner wrapper
   (which reads the same --padding-top), so the outer only adds the header. */
.e-con-full.wub-hero { padding-top: calc(var(--padding-top, 0px) + var(--wub-hdr-height)) !important; }
.e-con-boxed.wub-hero { padding-top: var(--wub-hdr-height) !important; }
.e-con.wub-hero > .e-con.wub-blob,
.e-con.wub-hero > .e-con-inner > .e-con.wub-blob { margin-top: var(--wub-hdr-height); }