/* ==========================================================================
   Mpower U Wellness: header, navigation, sticky CTA, footer
   Mobile menu breakpoint: 1259px (7 nav items + CTA need the width).
   ========================================================================== */
:root { --mu-header-h: 76px; }
html { scroll-padding-top: calc(var(--mu-header-h) + 16px); }   /* anchor links land below the sticky header */

/* ---- Header ---- */
.mu-header {
	position: sticky; top: 0; z-index: 1000;
	border-bottom: 1px solid transparent;
	transition: border-color var(--mu-dur) var(--mu-ease), box-shadow var(--mu-dur) var(--mu-ease);
}
.mu-header::before {            /* blurred backdrop lives on a pseudo-element so it does not trap the fixed mobile menu */
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: rgba(247, 243, 234, 0.94);
	-webkit-backdrop-filter: saturate(1.2) blur(10px); backdrop-filter: saturate(1.2) blur(10px);
}
.mu-header.is-scrolled { border-bottom-color: var(--mu-gold-soft); box-shadow: 0 4px 20px rgba(38, 92, 123, 0.07); }
.admin-bar .mu-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .mu-header { top: 46px; } }

.mu-header__inner {
	max-width: 1320px; margin-inline: auto; padding-inline: var(--mu-gutter);
	min-height: var(--mu-header-h); display: flex; align-items: center; justify-content: space-between; gap: var(--mu-space-5);
}

/* Brand: three-colour logo mark + the name set in Gotu (the client's preferred header treatment) */
.mu-brand { min-width: 44px; justify-content: center; display: inline-flex; align-items: center; gap: .65rem; text-decoration: none; color: var(--mu-deep-teal); min-height: 56px; flex: none; }
.mu-brand:hover { color: var(--mu-deep-teal); text-decoration: none; }
.mu-brand__mark { height: 60px; width: auto; display: block; transition: height 300ms var(--mu-ease); }
.mu-header.is-scrolled .mu-brand__mark { height: 48px; }
.mu-brand__word { font-family: var(--mu-font-logo); font-size: 1.375rem; line-height: 1; letter-spacing: 0.005em; white-space: nowrap; }

/* ---- Primary nav (desktop) ---- */
.mu-nav { display: flex; align-items: center; gap: var(--mu-space-4); }
.mu-nav__list { display: flex; align-items: center; gap: 0; list-style: none; margin: 0; padding: 0; }
.mu-nav__list a {
	display: inline-flex; align-items: center; min-height: 44px; padding: .5rem .65rem;
	font-size: 1rem; font-weight: var(--mu-weight-medium); color: var(--mu-slate); text-decoration: none; border-radius: var(--mu-radius-pill); white-space: nowrap;
	position: relative; transition: color var(--mu-dur) var(--mu-ease), background-color var(--mu-dur) var(--mu-ease);
}
.mu-nav__list a:hover { color: var(--mu-deep-teal); text-decoration: none; }
.mu-nav__list .current-menu-item > a, .mu-nav__list .current_page_item > a, .mu-nav__list a[aria-current="page"] { color: var(--mu-deep-teal); }
/* thin gold underline grows from the centre on hover and stays under the current page */
.mu-nav__list a::after { content: ""; position: absolute; left: .65rem; right: .65rem; bottom: 4px; height: 1px; background: var(--mu-gold); transform: scaleX(0); transform-origin: center; transition: transform 300ms var(--mu-ease); }
.mu-nav__list a:hover::after, .mu-nav__list a:focus-visible::after, .mu-nav__list .current-menu-item > a::after, .mu-nav__list .current_page_item > a::after { transform: scaleX(1); }
.mu-nav__cta { white-space: nowrap; padding-inline: 1.25rem; margin-left: .5rem; }

/* Hello Elementor ships a pink hover/focus for every <button>; keep our controls on brand */
.mu-menu-toggle, .mu-menu-toggle:hover, .mu-menu-toggle:focus, button.mu-btn, button.mu-btn:hover, button.mu-btn:focus { box-shadow: none; }
.mu-menu-toggle:hover, .mu-menu-toggle:focus { background: var(--mu-teal-tint); color: var(--mu-deep-teal); border-color: var(--mu-deep-teal); }
.mu-menu-toggle[aria-expanded="true"] { background: var(--mu-deep-teal); color: #fff; }
.mu-menu-toggle[aria-expanded="true"]:hover, .mu-menu-toggle[aria-expanded="true"]:focus { background: var(--mu-deep-teal-dark); color: #fff; }
button.mu-btn--primary:hover, button.mu-btn--primary:focus { background: var(--mu-deep-teal-dark); color: #fff; border-color: transparent; }
button.mu-btn--primary { background: var(--mu-deep-teal); color: #fff; border: 2px solid transparent; }

/* ---- Menu toggle (mobile only) ---- */
.mu-menu-toggle { display: none; }

@media (max-width: 1259px) {
	.mu-menu-toggle {
		display: inline-flex; align-items: center; gap: .6rem; min-height: var(--mu-tap-min); padding: 0 1.1rem;
		font: inherit; font-weight: var(--mu-weight-medium); color: var(--mu-deep-teal);
		background: #fff; border: 1.5px solid var(--mu-deep-teal); border-radius: var(--mu-radius-pill); cursor: pointer;
	}
	.mu-menu-toggle__bars, .mu-menu-toggle__bars::before, .mu-menu-toggle__bars::after {
		display: block; width: 18px; height: 2px; background: currentColor; border-radius: 2px; position: relative;
		transition: transform var(--mu-dur) var(--mu-ease), background-color var(--mu-dur) var(--mu-ease);
	}
	.mu-menu-toggle__bars::before, .mu-menu-toggle__bars::after { content: ""; position: absolute; left: 0; }
	.mu-menu-toggle__bars::before { top: -6px; }
	.mu-menu-toggle__bars::after  { top: 6px; }
	.mu-menu-toggle[aria-expanded="true"] .mu-menu-toggle__bars { background: transparent; }
	.mu-menu-toggle[aria-expanded="true"] .mu-menu-toggle__bars::before { transform: translateY(6px) rotate(45deg); }
	.mu-menu-toggle[aria-expanded="true"] .mu-menu-toggle__bars::after  { transform: translateY(-6px) rotate(-45deg); }

	.mu-nav {
		position: fixed; left: 0; right: 0; top: var(--mu-header-h); bottom: 0;
		flex-direction: column; align-items: stretch; justify-content: flex-start; gap: var(--mu-space-5);
		padding: var(--mu-space-5) var(--mu-gutter) calc(var(--mu-space-7) + env(safe-area-inset-bottom));
		background: var(--mu-ivory); overflow-y: auto; overscroll-behavior: contain;
		visibility: hidden; opacity: 0; transform: translateY(-8px);
		transition: opacity var(--mu-dur) var(--mu-ease), transform var(--mu-dur) var(--mu-ease), visibility 0s linear var(--mu-dur);
	}
	.admin-bar .mu-nav { top: calc(var(--mu-header-h) + 46px); }
	.mu-header.is-open .mu-nav { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
	.mu-header.is-open::before { background: var(--mu-ivory); -webkit-backdrop-filter: none; backdrop-filter: none; }
	.mu-nav__list { flex-direction: column; align-items: stretch; gap: 0; border-top: 1px solid var(--mu-border); }
	.mu-nav__list li { border-bottom: 1px solid var(--mu-border); }
	.mu-nav__list a { font-size: 1.25rem; min-height: 60px; padding: .5rem .25rem; border-radius: 0; width: 100%; }
	.mu-nav__list a:hover { background: transparent; }
	.mu-nav__list .current-menu-item > a::after, .mu-nav__list .current_page_item > a::after { left: .25rem; right: auto; width: 2.5rem; bottom: 10px; }
	.mu-nav__cta { width: 100%; min-height: 56px; font-size: 1.0625rem; }
	body.mu-menu-open { overflow: hidden; }
}
@media (max-width: 420px) {
	.mu-header__inner { gap: var(--mu-space-3); }
	.mu-brand { gap: .5rem; min-width: 0; }
	.mu-brand__word { font-size: 1.1rem; }
	.mu-brand__mark { height: 42px; }
	.mu-menu-toggle { padding: 0 .9rem; gap: .5rem; }
}
@media (max-width: 350px) {
	/* Smallest phones (320px): icon-only menu button; its "Menu" name stays for screen readers */
	.mu-brand__word { font-size: 1rem; }
	.mu-brand__mark { height: 38px; }
	.mu-menu-toggle { padding: 0; width: 48px; justify-content: center; }
	.mu-menu-toggle__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}

/* ---- Sticky "Book a Discovery Call" (mobile/tablet only; the desktop header is already sticky with its own button) ---- */
.mu-sticky-cta { display: none; }
@media (max-width: 1259px) {
	.mu-sticky-cta {
		position: fixed; left: var(--mu-gutter); right: var(--mu-gutter); bottom: calc(14px + env(safe-area-inset-bottom)); z-index: 900;
		display: inline-flex; min-height: 56px; font-size: 1.0625rem; box-shadow: 0 10px 30px rgba(38, 92, 123, 0.35);
		opacity: 0; transform: translateY(16px); pointer-events: none;
		transition: opacity var(--mu-dur) var(--mu-ease), transform var(--mu-dur) var(--mu-ease);
	}
	.mu-sticky-cta[hidden] { display: none; }
	.mu-sticky-cta.is-visible { opacity: 1; transform: none; pointer-events: auto; }
	body.mu-menu-open .mu-sticky-cta { display: none; }
}

/* ---- Footer ---- */
.mu-footer { position: relative; overflow: hidden; overflow: clip; background: var(--mu-deep-teal); color: #fff; padding-top: clamp(4rem, 3rem + 4vw, 6.5rem); }
.mu-footer a { color: #fff; }
.mu-footer a:hover { color: var(--mu-sand); }
.mu-footer a.mu-btn--gold, .mu-footer a.mu-btn--gold:hover { color: var(--mu-slate); }   /* slate on gold = 5.3:1 */
.mu-footer__waveband { position: relative; height: 84px; display: flex; justify-content: center; align-items: center; }
.mu-footer__waveband .mu-motif { position: relative; width: min(520px, 80%); opacity: .55; }
.mu-footer__print { right: -4%; bottom: -60px; width: clamp(220px, 28vw, 380px); opacity: .1; }
.mu-footer__grid { position: relative; display: grid; gap: var(--mu-space-7) var(--mu-space-6); grid-template-columns: 1.1fr .9fr .9fr 1.5fr; padding-bottom: var(--mu-space-7); align-items: start; }
@media (max-width: 1100px) { .mu-footer__grid { grid-template-columns: 1fr 1fr 1fr; } .mu-footer__brand { grid-column: 1 / -1; } .mu-footer__touch { grid-column: span 3; max-width: 36rem; } }
@media (max-width: 760px) { .mu-footer__grid { grid-template-columns: 1fr 1fr; } .mu-footer__touch { grid-column: 1 / -1; } }
@media (max-width: 520px) { .mu-footer__grid { grid-template-columns: 1fr; } }
.mu-footer__brand { display: flex; flex-direction: column; align-self: stretch; }
.mu-footer__brand > a { flex: none; display: block; }
.mu-footer__brand img { height: auto; width: 180px; display: block; }
.mu-footer__tag { margin: var(--mu-space-4) 0 0; font-family: var(--mu-font-logo); font-size: 1.25rem; color: var(--mu-sand); }
.mu-footer__title { font-family: var(--mu-font-body); font-size: var(--mu-fs-label); font-weight: var(--mu-weight-medium); letter-spacing: .16em; text-transform: uppercase; color: var(--mu-sand); margin: 0 0 var(--mu-space-4); }
.mu-footer__list, .mu-social { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .15rem; }
.mu-footer__list a, .mu-social a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; font-size: 1rem; }
.mu-footer__list a:hover, .mu-social a:hover { text-decoration: underline; text-underline-offset: .25em; }
.mu-social { margin-top: var(--mu-space-4); flex-direction: row; flex-wrap: wrap; gap: .5rem; }
.mu-social a { justify-content: center; width: 44px; height: 44px; border: 1px solid rgba(255, 255, 255, .45); border-radius: 50%; transition: background-color var(--mu-dur) var(--mu-ease), border-color var(--mu-dur) var(--mu-ease); }
.mu-social a:hover { background: rgba(255, 255, 255, .14); border-color: #fff; text-decoration: none; }
.mu-footer__note { margin: 0 0 var(--mu-space-4); font-size: var(--mu-fs-small); color: rgba(255, 255, 255, .92); max-width: 28rem; }
.mu-footer__legal-list { list-style: none; margin: 0 0 var(--mu-space-3); padding: 0; display: flex; flex-wrap: wrap; gap: 0 1.5rem; }
.mu-footer__legal-list a { display: inline-flex; align-items: center; min-height: 44px; font-size: var(--mu-fs-small); text-decoration: underline; text-underline-offset: .2em; }
.mu-footer__bottom { border-top: var(--mu-line-gold); }
/* compact contact form on the dark footer */
.mu-footer .mu-form .mu-field label, .mu-footer .mu-form .mu-check { color: #fff; }
.mu-footer .mu-form .mu-field { margin-bottom: var(--mu-space-3); gap: .3rem; }
.mu-footer .mu-form .mu-field input[type="text"], .mu-footer .mu-form .mu-field input[type="email"], .mu-footer .mu-form .mu-field textarea { background: #fff; color: var(--mu-slate); border-color: transparent; padding: .6rem .8rem; min-height: 44px; }
.mu-footer .mu-form .mu-field textarea { min-height: 88px; }
.mu-footer .mu-form .mu-field input:focus, .mu-footer .mu-form .mu-field textarea:focus { outline: 3px solid var(--mu-gold); }
.mu-footer .mu-form__fine { color: rgba(255, 255, 255, .9); margin: var(--mu-space-2) 0 0; }
.mu-footer .mu-form__fine a { color: #fff; }
.mu-footer .mu-form__actions { margin-top: var(--mu-space-3); }
.mu-footer .mu-form .mu-btn--primary { background: var(--mu-gold); color: var(--mu-slate); }
.mu-footer .mu-form .mu-btn--primary:hover { background: #D8AE6A; color: var(--mu-slate); }
.mu-footer .mu-field__error { background: #FBEAE6; padding: .3rem .6rem; border-radius: var(--mu-radius-s); }
.mu-footer .mu-check + .mu-field__error { margin-top: .25rem; }
.mu-footer .mu-req { color: var(--mu-sand); }
.mu-footer__bottom { position: relative; padding-block: var(--mu-space-5); }
.mu-footer__disclaimer { font-size: var(--mu-fs-small); max-width: 60ch; margin: 0 0 var(--mu-space-2); color: rgba(255, 255, 255, 0.92); }
.mu-footer__copy { font-size: var(--mu-fs-small); margin: 0; color: rgba(255, 255, 255, 0.85); }
body.mu-has-sticky .mu-footer__bottom { padding-bottom: calc(var(--mu-space-5) + 72px); }
@media (min-width: 1260px) { body.mu-has-sticky .mu-footer__bottom { padding-bottom: var(--mu-space-5); } }

/* Hello Elementor's own header/footer wrappers are not used; keep the main area clean */
.site-main { min-height: 40vh; }


/* "Opening the calendar…" feedback on the first click (Calendly loads only on request) */
.mu-waiting { position: fixed; inset: 0; z-index: 2147483000; display: flex; align-items: center; justify-content: center; background: rgba(21, 47, 61, 0.45); }
.mu-waiting__box { display: flex; align-items: center; gap: .75rem; background: #fff; color: var(--mu-text); padding: 1rem 1.5rem; border-radius: var(--mu-radius-l); box-shadow: var(--mu-shadow-m); font-weight: var(--mu-weight-medium); }
.mu-waiting__spin { width: 1.1rem; height: 1.1rem; border: 2px solid var(--mu-aqua); border-top-color: var(--mu-deep-teal); border-radius: 50%; animation: mu-spin .8s linear infinite; }
@keyframes mu-spin { to { transform: rotate(360deg); } }


/* ---- Resources dropdown (desktop: hover or keyboard focus; phone: the arrow button opens it) ---- */
.mu-nav__list > li { position: relative; }
.mu-nav__list .sub-menu { list-style: none; margin: 0; padding: .5rem; position: absolute; top: calc(100% - 4px); right: 0; min-width: 16rem; background: #fff; border: var(--mu-line-gold); border-radius: 14px; box-shadow: 0 18px 40px -16px rgba(38,92,123,.35); z-index: 60; opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity 200ms var(--mu-ease), transform 200ms var(--mu-ease), visibility 0s linear 200ms; }
.mu-nav__list .sub-menu a { display: block; min-height: 0; padding: .7rem 1rem; border-radius: 10px; white-space: normal; font-size: .97rem; }
.mu-nav__list .sub-menu a::after { display: none; }
.mu-nav__list .sub-menu a small { display: block; font-size: .82rem; font-weight: 400; color: #3c4d51; margin-top: .1rem; }
.mu-nav__list .sub-menu a:hover, .mu-nav__list .sub-menu a:focus-visible { background: var(--mu-ivory); color: var(--mu-deep-teal); }
.mu-nav__toggle { display: none; }
@media (min-width: 1260px) {
	.mu-nav__list > li.menu-item-has-children:hover > .sub-menu, .mu-nav__list > li.menu-item-has-children:focus-within > .sub-menu, .mu-nav__list > li.menu-item-has-children.is-open > .sub-menu { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
}
@media (max-width: 1259px) {
	.mu-nav__list > li.menu-item-has-children { display: flex; flex-wrap: wrap; align-items: center; }
	.mu-nav__list > li.menu-item-has-children > a { flex: 1 1 0; width: auto; }
	.mu-nav__toggle { display: inline-flex; align-items: center; justify-content: center; width: 52px; min-height: 60px; background: transparent; border: 0; border-left: var(--mu-line-gold); color: var(--mu-deep-teal); cursor: pointer; }
	.mu-nav__toggle svg { width: 16px; height: 16px; transition: transform 200ms var(--mu-ease); }
	.mu-nav__toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
	.mu-nav__toggle:focus-visible { outline: 3px solid var(--mu-deep-teal); outline-offset: -3px; }
	.mu-nav__list .sub-menu { position: static; flex: 0 0 100%; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: 0; border-left: var(--mu-line-gold); border-radius: 0; margin: 0 0 .6rem 1rem; padding: 0 0 0 .5rem; min-width: 0; display: none; }
	.mu-nav__list li.is-open > .sub-menu { display: block; }
	.mu-nav__list .sub-menu li { border-bottom: 0; }
	.mu-nav__list .sub-menu a { font-size: 1.05rem; min-height: 48px; display: flex; flex-direction: column; justify-content: center; }
}
@media (max-width: 1259px) {
	.mu-nav__list .mu-nav__toggle, .mu-nav__list .mu-nav__toggle:hover { background: transparent; color: var(--mu-deep-teal); border-radius: 0; box-shadow: none; padding: 0; min-width: 52px; }
	.mu-nav__list > li.menu-item-has-children > .sub-menu { background: transparent; box-sizing: border-box; flex: 0 0 calc(100% - 1rem); max-width: calc(100% - 1rem); width: auto; text-align: left; }
	.mu-nav__list .sub-menu a { align-items: flex-start; text-align: left; width: 100%; padding: .5rem .75rem; background: transparent; }
	.mu-nav__list .sub-menu a:hover { background: transparent; }
}

/* 3. footer tagline: no hyphen split, balanced lines */
.mu-footer__tag { text-wrap: balance; hyphens: none; }
/* 5. tap areas of at least 44 px */
.mu-brand { min-width: 44px; padding-inline: .25rem; }
.mu-footer a { display: inline-flex; align-items: center; min-height: 44px; }
.mu-footer__social a { min-height: 0; }


/* ---- Footer (round 2): social icons sit under "Get in touch"; phones fold the link lists into accordions ---- */
.mu-footer__touch .mu-social { margin-top: var(--mu-space-3); }
.mu-footer__toggle { all: unset; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; width: 100%; cursor: default; font: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; }
.mu-footer__toggle:disabled { cursor: default; }
.mu-footer__toggle:focus-visible { outline: 3px solid var(--mu-aqua); outline-offset: 4px; border-radius: 4px; }
.mu-footer__panel { display: block; }
@media (max-width: 760px) {
	.mu-footer__col--acc { border-top: 1px solid rgba(255, 255, 255, .22); }
	.mu-footer__col--acc .mu-footer__title { margin: 0; }
	.mu-footer__toggle { min-height: 52px; cursor: pointer; }
	.mu-footer__toggle::after { content: ""; width: .6rem; height: .6rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); margin-right: .25rem; transition: transform 300ms var(--mu-ease); }
	.mu-footer__col--acc.is-open .mu-footer__toggle::after { transform: rotate(-135deg); }
	.mu-footer__col--acc .mu-footer__panel { display: none; padding-bottom: var(--mu-space-3); }
	.mu-footer__col--acc.is-open .mu-footer__panel { display: block; }
	.mu-footer__grid { gap: var(--mu-space-4); padding-bottom: var(--mu-space-5); }
	.mu-footer__touch { margin-top: var(--mu-space-4); }
}

/* ---- Booking calendar: the close button sits at the corner of the calendar, not at the edge of the screen ---- */
@media (min-width: 976px) {
	.calendly-overlay .calendly-popup-close { width: 38px; height: 38px; background-color: rgba(29, 74, 99, .92); border-radius: 50%; background-size: 16px; background-position: center; background-repeat: no-repeat; }
	.calendly-overlay .calendly-popup-close:hover { background-color: #1d4a63; }
}

/* Footer headings are headings: no button fill, no hover or transition from the Elementor kit button styles */
.elementor-kit-4 .mu-footer .mu-footer__toggle, .mu-footer .mu-footer__toggle, .mu-footer .mu-footer__toggle:hover, .mu-footer .mu-footer__toggle:focus, .mu-footer .mu-footer__toggle:active, .mu-footer .mu-footer__toggle:disabled {
	background: none; background-color: transparent; border: 0; border-radius: 0; box-shadow: none; padding: 0; color: inherit; transform: none; opacity: 1; transition: none; text-shadow: none;
}
@media (min-width: 761px) { .mu-footer .mu-footer__toggle { pointer-events: none; cursor: default; } }
@media (max-width: 760px) {
	.elementor-kit-4 .mu-footer .mu-footer__toggle { padding: .6rem 0; transition: none; }
	.elementor-kit-4 .mu-footer .mu-footer__toggle:hover { background: none; color: #fff; }
	.elementor-kit-4 .mu-footer .mu-footer__toggle::after { transition: transform 300ms var(--mu-ease); }
}

/* Option 1: on phones the tappable footer rows get a soft gold tint (same as the arrow buttons); on desktop they stay plain headings */
@media (max-width: 760px) {
	.elementor-kit-4 .mu-footer .mu-footer__toggle { padding: .6rem .9rem; border-radius: 12px; transition: background-color 300ms var(--mu-ease); }
	.elementor-kit-4 .mu-footer .mu-footer__toggle:hover, .elementor-kit-4 .mu-footer .mu-footer__toggle:active,
	.elementor-kit-4 .mu-footer .mu-footer__col--acc.is-open .mu-footer__toggle { background: rgba(240, 219, 176, .18); color: #fff; }
	.mu-footer__col--acc { border-top: 0; margin-bottom: .35rem; }
	.mu-footer__col--acc .mu-footer__panel { padding-left: .9rem; }
}