/**
 * Native header + footer for the Akoma member/auth pages.
 * In-flow (not overlapping), brand-matched, with a reliable mobile burger.
 */
.akoma-member-chrome {
	--akoma-brown: #944000;
	--akoma-dark: #2d1a0a;
	--akoma-text: #592600;
	--akoma-coral: #e07a5f;
	--akoma-coral-dark: #c9674d;
	--akoma-cream: #f5f3f0;
	--akoma-light-coral: #ffecdd;
	/* The header is an absolute overlay; the content wraps add this as top padding so
	   their background extends up under it (matches the Elementor overlay-header
	   pattern). Overridden per breakpoint below. */
	--akoma-header-h: 186px;
	position: relative;
	background: var(--akoma-cream);
}

/* ---- Header ---------------------------------------------------------- */
.akoma-mh {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 30;
	width: 100%;
	background: transparent;
	font-family: "sofia-pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.akoma-mh * {
	box-sizing: border-box;
}

.akoma-mh__inner {
	position: relative;
	z-index: 1;
	max-width: 1360px;
	margin: 0 auto;
	padding: 18px 24px;
	display: flex;
	align-items: center;
	gap: 24px;
}

.akoma-mh__logo {
	flex: 0 0 auto;
	display: block;
	line-height: 0;
}

.akoma-mh__logo img {
	display: block;
	height: 150px;
	width: auto;
}

/* Decorative white shape behind the logo – only visible on dark-hero (.dark-theme)
   pages, where it keeps the full-colour logo legible over the dark background. It sits
   behind the header content (z-index below .akoma-mh__inner) and ignores pointer events. */
.akoma-mh__shape {
	position: absolute;
	top: -105px;
	/* Mirrors the live site (weareakoma.co.uk): the shape is anchored to the 1360px
	   content container rather than the viewport, so it tracks the logo at every width
	   (live: left:-591px from a container whose edge is max(0, (100vw - 1360)/2)). */
	left: calc(max(0px, (100% - 1360px) / 2) - 591px);
	z-index: 0;
	display: none;
	line-height: 0;
	pointer-events: none;
}

.akoma-mh__shape img {
	display: block;
	width: 827px;
	max-width: none;
	height: auto;
	opacity: 0.91;
}

.akoma-mh__panel {
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 30px;
}

.akoma-mh__navwrap {
	flex: 1 1 auto;
	display: flex;
	justify-content: center;
}

.akoma-mh__menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 0;
}

.akoma-mh__menu li {
	position: relative;
}

.akoma-mh__menu a {
	display: block;
	position: relative;
	padding: 13px 20px;
	text-decoration: none;
	color: var(--akoma-dark);
	font-size: 20px;
	font-weight: 300;
	white-space: nowrap;
}

.akoma-mh__menu a:hover,
.akoma-mh__menu .current-menu-item > a {
	color: var(--akoma-brown);
}

/* Active-page underline – matches the Elementor header: a 1px full-width rule under the
   current nav item (brand text colour on light pages, white on dark – see below). */
.akoma-mh__menu .current-menu-item > a::after,
.akoma-mh__menu .current-menu-ancestor > a::after,
.akoma-mh__menu .current_page_item > a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 1px;
	background: var(--akoma-text);
}

.akoma-mh__menu .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 210px;
	margin: 0;
	padding: 8px 0;
	list-style: none;
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 14px 34px rgba(45, 26, 10, 0.14);
	display: none;
	z-index: 40;
}

.akoma-mh__menu li:hover > .sub-menu {
	display: block;
}

.akoma-mh__menu .sub-menu a {
	display: block;
	padding: 9px 18px;
	font-size: 16px;
}

.akoma-mh__cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 20px 12px;
	font-size: 19px;
	text-transform: capitalize;
	white-space: nowrap;
	color: #fff;
	text-decoration: none;
	background: var(--akoma-coral);
	border-radius: 20px;
	transition: background 0.15s ease;
}

.akoma-mh__cta:hover {
	background: var(--akoma-coral-dark);
	color: #fff;
}

.akoma-mh__account {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	margin-left: 4px;
	padding: 0;
	color: var(--akoma-coral-dark);
	background: transparent;
	border: 0;
	line-height: 0;
	cursor: pointer;
}

.akoma-mh__account:hover {
	color: #a8543c;
}

.akoma-mh__account svg {
	width: auto;
	height: 32px;
}

/* Account dropdown menu */
.akoma-mh__accountwrap {
	position: relative;
	flex: 0 0 auto;
	margin-left: 4px;
}

.akoma-mh__accountwrap .akoma-mh__account {
	margin-left: 0;
}

.akoma-mh__accountmenu {
	position: absolute;
	top: calc(100% + 12px);
	right: 0;
	min-width: 214px;
	padding: 8px;
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 16px 40px rgba(45, 26, 10, 0.16);
	display: none;
	flex-direction: column;
	z-index: 50;
}

.akoma-mh__accountwrap.is-open .akoma-mh__accountmenu {
	display: flex;
}

.akoma-mh__accountitem {
	display: block;
	width: 100%;
	padding: 11px 16px;
	text-align: left;
	font-family: inherit;
	font-size: 16px;
	font-weight: 300;
	color: var(--akoma-dark);
	background: transparent;
	border: 0;
	border-radius: 8px;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
}

.akoma-mh__accountitem:hover,
.akoma-mh__accountitem:focus {
	background: var(--akoma-cream);
	color: var(--akoma-brown);
	outline: none;
}

.akoma-mh__toggle {
	display: none;
	flex: 0 0 auto;
	width: 46px;
	height: 46px;
	padding: 11px;
	margin-left: 4px;
	background: transparent;
	border: 0;
	cursor: pointer;
}

.akoma-mh__toggle span {
	display: block;
	height: 2px;
	margin: 5px 0;
	background: var(--akoma-dark);
	border-radius: 2px;
	transition: transform 0.2s ease, opacity 0.2s ease;
}

/* Branded focus ring on the menu / close toggle (was the browser default blue). */
.akoma-mh__toggle:focus {
	outline: 2px solid #dfcbbc;
	outline-offset: 3px;
	border-radius: 6px;
}

/* ---- Header: mobile -------------------------------------------------- */
@media (max-width: 1000px) {
	.akoma-member-chrome {
		--akoma-header-h: 132px;
	}

	.akoma-mh__logo img {
		height: 96px;
	}

	/* Scale the dark-page shape down so it sits behind the smaller mobile logo. */
	.akoma-mh__shape {
		top: -72px;
		left: -320px;
	}

	.akoma-mh__shape img {
		width: 560px;
	}

	.akoma-mh__toggle {
		display: block;
		width: 54px;
		height: 54px;
		padding: 12px;
	}

	.akoma-mh__toggle span {
		height: 3px;
		background: var(--akoma-brown);
	}

	.akoma-mh__account,
	.akoma-mh__accountwrap {
		margin-left: auto;
	}

	.akoma-mh__accountwrap .akoma-mh__account {
		margin-left: 0;
	}

	.akoma-mh__account svg {
		width: auto;
		height: 32px;
	}

	.akoma-mh__panel {
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		gap: 0;
		padding: 8px 0 16px;
		background: #fff;
		box-shadow: 0 16px 34px rgba(45, 26, 10, 0.14);
		display: none;
		z-index: 45;
	}

	.akoma-mh__navwrap {
		display: block;
		width: 100%;
	}

	.akoma-mh.is-open .akoma-mh__panel {
		display: flex;
	}

	.akoma-mh__menu {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.akoma-mh__menu a {
		display: block;
		padding: 14px 26px;
		font-size: 18px;
	}

	.akoma-mh__menu .sub-menu {
		position: static;
		display: none;
		box-shadow: none;
		border-radius: 0;
		padding: 0;
	}

	.akoma-mh__menu li.is-expanded > .sub-menu {
		display: block;
	}

	.akoma-mh__menu .sub-menu a {
		padding-left: 44px;
	}

	.akoma-mh__cta {
		margin: 14px 26px 4px;
		justify-content: center;
	}

	.akoma-mh.is-open .akoma-mh__toggle span:nth-child(1) {
		transform: translateY(7px) rotate(45deg);
	}

	.akoma-mh.is-open .akoma-mh__toggle span:nth-child(2) {
		opacity: 0;
	}

	.akoma-mh.is-open .akoma-mh__toggle span:nth-child(3) {
		transform: translateY(-7px) rotate(-45deg);
	}
}

/* ---- Header: dark-theme (light-on-dark) variant --------------------- */
/* Matches the site's convention: a page carrying the `dark-theme` body class (its own
   dark hero – set by theme_type=dark_theme meta or any single blog post) keeps the
   full-colour logo but reveals the white shape behind it, and gets white nav/icons and
   an inverted (white) CTA. */
.dark-theme .akoma-mh__shape {
	display: block;
}

.dark-theme .akoma-mh__menu a {
	color: #fff;
}

.dark-theme .akoma-mh__menu a:hover {
	color: #ffe4d8;
}

.dark-theme .akoma-mh__menu .current-menu-item > a::after,
.dark-theme .akoma-mh__menu .current-menu-ancestor > a::after,
.dark-theme .akoma-mh__menu .current_page_item > a::after {
	background: #fff;
}

.dark-theme .akoma-mh__account {
	color: #fff;
}

.dark-theme .akoma-mh__account:hover {
	color: #ffe4d8;
}

.dark-theme .akoma-mh__toggle span {
	background: #fff;
}

.dark-theme .akoma-mh__cta {
	background: #fff;
	color: var(--akoma-brown);
}

.dark-theme .akoma-mh__cta:hover {
	background: #f3ece5;
	color: var(--akoma-brown);
}

/* ---- Footer ---------------------------------------------------------- */
.akoma-mf {
	background: #fff;
	font-family: "sofia-pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.5em;
}

.akoma-mf * {
	box-sizing: border-box;
}

.akoma-mf__inner {
	max-width: 1360px;
	margin: 0 auto;
	padding: 56px 40px 36px;
	display: flex;
	align-items: center;
	gap: 48px;
}

.akoma-mf__left {
	flex: 0 0 auto;
}

.akoma-mf__logo {
	display: block;
	line-height: 0;
}

.akoma-mf__logo img {
	display: block;
	height: 200px;
	width: auto;
}

.akoma-mf__right {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 58px;
}

.akoma-mf__menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 2px 6px;
}

.akoma-mf__menu a {
	display: block;
	padding: 6px 14px;
	text-decoration: none;
	color: var(--akoma-brown);
	font-size: 20px;
	font-weight: 300;
}

.akoma-mf__menu a:hover,
.akoma-mf__menu .current-menu-item > a {
	color: var(--akoma-coral);
}

.akoma-mf__badges {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 34px;
}

.akoma-mf__badges img {
	display: block;
	width: auto;
}

.akoma-mf__newsletter {
	/* Wide enough that the email field reaches its 500px cap with the button beside
	   it; max-width keeps it responsive below. */
	width: 640px;
	max-width: 100%;
}

.akoma-mf__newsletter .gform_wrapper {
	margin: 0;
}

.akoma-mf__newsletter form {
	display: flex;
	gap: 20px;
	align-items: center;
	margin: 0;
}

.akoma-mf__newsletter .gform-body,
.akoma-mf__newsletter .gform_body {
	flex: 1 1 auto;
	margin: 0;
}

.akoma-mf__newsletter .gfield {
	margin: 0 !important;
	padding: 0 !important;
}

.akoma-mf__newsletter .gfield_label,
.akoma-mf__newsletter .gform_required_legend {
	display: none;
}

.akoma-mf__newsletter input[type="email"] {
	width: 100% !important;
	max-width: 500px !important;
	height: 48px;
	padding: 6px 2px !important;
	box-sizing: border-box;
	font-family: inherit;
	font-size: 20px !important;
	font-weight: 300 !important;
	line-height: 1.5em !important;
	color: var(--akoma-text);
	background: transparent !important;
	border: 0 !important;
	border-bottom: 1px solid var(--akoma-coral) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.akoma-mf__newsletter input[type="email"]::placeholder {
	color: #9a8674;
}

.akoma-mf__newsletter .gform_footer {
	margin: 0 !important;
	padding: 0 !important;
	flex: 0 0 auto;
}

.akoma-mf__newsletter input[type="submit"],
.akoma-mf__newsletter .gform_button,
.akoma-mf__newsletter button[type="submit"] {
	height: 48px;
	padding: 0 30px !important;
	font-family: inherit;
	font-size: 18px !important;
	color: #fff !important;
	background: var(--akoma-coral) !important;
	border: 0 !important;
	border-radius: 24px !important;
	cursor: pointer;
	white-space: nowrap;
}

.akoma-mf__newsletter input[type="submit"]:hover,
.akoma-mf__newsletter .gform_button:hover {
	background: var(--akoma-coral-dark) !important;
}

.akoma-mf__newsletter .gform_confirmation_message {
	color: var(--akoma-brown);
	font-size: 14px;
}

.akoma-mf__legal {
	max-width: 1360px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 8px 22px;
	padding: 28px 40px 40px;
	font-size: 16px;
	color: var(--akoma-text);
}

.akoma-mf__legal-links {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
}

.akoma-mf__legal-links a {
	color: var(--akoma-text);
	text-decoration: none;
}

.akoma-mf__legal-links a:hover {
	color: var(--akoma-brown);
}

@media (max-width: 900px) {
	.akoma-mf__inner {
		flex-direction: column;
		align-items: center;
		text-align: center;
		gap: 30px;
		padding: 40px 24px 28px;
	}

	.akoma-mf__logo img {
		height: 150px;
	}

	.akoma-mf__right {
		width: 100%;
		align-items: center;
	}

	.akoma-mf__menu {
		justify-content: center;
	}

	.akoma-mf__badges {
		justify-content: center;
		flex-wrap: wrap;
	}

	.akoma-mf__legal {
		justify-content: center;
	}
}