/* Custom Header Anywhere - Frontend Styles */

/* Safety: the full-bleed header below uses a 100vw breakout, which can add a
   horizontal scrollbar on some browsers if the page doesn't already hide it. */
body { overflow-x: hidden; }

/* This theme adds top padding to <body> (a colored "frame" around the whole
   site). That pushes our header down from the very top of the browser,
   leaving a visible gap/strip above it. Remove just the top padding so the
   header sits flush at the top; bottom padding is left untouched. */
body { padding-top: 0 !important; }

.cha-container {
	max-width: var(--cha-container, 1200px);
	margin: 0 auto;
	padding: 0 20px;
	display: flex;
	align-items: center;
}

/* ---------- Top bar ---------- */
.cha-topbar {
	background: var(--cha-topbar-bg, #0B1F5C);
	color: var(--cha-topbar-text, #fff);
	font-size: 13px;
	letter-spacing: .01em;
	width: 100vw;
	max-width: 100vw;
	position: relative;
	margin-left: calc(-50vw + 50%);
	margin-right: calc(-50vw + 50%);
	box-sizing: border-box;
}
.cha-topbar-inner {
	justify-content: flex-end;
	gap: 28px;
	padding-top: 7px;
	padding-bottom: 7px;
	flex-wrap: wrap;
}
.cha-topbar-align-left .cha-topbar-inner { justify-content: flex-start; }
.cha-topbar-align-center .cha-topbar-inner { justify-content: center; }
.cha-topbar-align-right .cha-topbar-inner { justify-content: flex-end; }
.cha-topbar-item {
	color: var(--cha-topbar-text, #fff);
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	opacity: .95;
	transition: opacity .2s ease;
}
.cha-topbar-item:hover { opacity: 1; text-decoration: underline; }
.cha-icon { width: 14px; height: 14px; display: inline-block; }
.cha-icon-phone::before { content: "\260E"; }
.cha-icon-mail::before { content: "\2709"; }

/* ---------- Header ---------- */
.cha-header {
	background: var(--cha-header-bg, #fff);
	width: 100vw;
	max-width: 100vw;
	z-index: 999;
	position: relative;
	margin-left: calc(-50vw + 50%);
	margin-right: calc(-50vw + 50%);
	box-sizing: border-box;
}
.cha-header.cha-sticky {
	position: sticky;
	top: 0;
}
/* Signature: a thin strip in the logo's crimson gradient across the very top. */
.cha-header::before {
	content: "";
	display: block;
	height: 3px;
	background: var(--kms-gradient, linear-gradient(90deg, #F2132C 0%, #D9192D 55%, #C31D2C 100%));
}
.cha-header {
	border-bottom: 1px solid var(--kms-border, #E3E6EF);
	transition: box-shadow .25s ease;
}
.cha-header.cha-shadow {
	box-shadow: 0 1px 2px rgba(11,31,92,.05), 0 6px 20px rgba(11,31,92,.06);
}
.cha-header.cha-shadow.cha-scrolled {
	box-shadow: 0 1px 2px rgba(11,31,92,.08), 0 10px 28px rgba(11,31,92,.12);
}
.cha-header-inner {
	justify-content: space-between;
	padding-top: 10px;
	padding-bottom: 10px;
	gap: 24px;
	position: relative;
	transition: padding .25s ease;
}
/* Compact the header once the page scrolls (sticky mode). */
.cha-header.cha-scrolled .cha-header-inner { padding-top: 6px; padding-bottom: 6px; }
.cha-header.cha-scrolled .cha-logo-img { width: calc(var(--cha-logo-width, 110px) * .82); }

/* Layout variants */
.cha-layout-logo-center .cha-header-inner {
	flex-wrap: wrap;
	justify-content: center;
	text-align: center;
}
.cha-layout-logo-center .cha-logo-wrap { width: 100%; justify-content: center; display: flex; margin-bottom: 10px; }
.cha-layout-logo-right .cha-header-inner { flex-direction: row-reverse; }

/* ---------- Logo ---------- */
.cha-logo-wrap { flex-shrink: 0; }
.cha-logo-link { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
.cha-logo-img { width: var(--cha-logo-width, 110px); height: auto; display: block; transition: width .25s ease; }
.cha-logo-fallback {
	font-size: 20px;
	font-weight: 700;
	color: var(--cha-menu-text, #0B1F5C);
}

/* Two logo images can be provided (desktop + mobile); only one shows at a time. */
.cha-logo-mobile-only { display: none; }

/* ---------- Stacked / custom site title next to logo ---------- */
.cha-site-title {
	display: flex;
	flex-direction: column;
	font-family: var(--cha-title-font, inherit);
	font-size: var(--cha-title-size, 22px);
	font-weight: var(--cha-title-weight, 800);
	line-height: var(--cha-title-line-height, 1.15);
	color: var(--cha-title-color, #0B1F5C);
}
.cha-title-line { display: block; white-space: nowrap; }
.cha-title-lines-single { display: none; } /* only shown on mobile when "combine into one line" is selected */
.cha-title-align-left { align-items: flex-start; text-align: left; }
.cha-title-align-center { align-items: center; text-align: center; }
.cha-title-align-right { align-items: flex-end; text-align: right; }
.cha-title-has-underline {
	border-bottom: 2px solid var(--cha-title-underline-color, #0B1F5C);
	padding-bottom: 8px;
	margin-bottom: 2px;
}
@media (min-width: 993px) {
	.cha-title-hide-desktop { display: none; }
}
@media (max-width: 992px) {
	.cha-title-line { white-space: normal; }
	.cha-site-title { font-size: calc(var(--cha-title-size, 22px) * 0.75); }
	.cha-title-hide-mobile { display: none; }

	/* Swap to the mobile logo image (or fall back to main logo) below the breakpoint */
	.cha-logo-desktop-only { display: none; }
	.cha-logo-mobile-only {
		display: block;
		width: var(--cha-mobile-logo-width, 120px);
		height: auto;
	}
}

/* ---------- Nav wrap ---------- */
.cha-nav-wrap {
	display: flex;
	align-items: center;
	gap: 24px;
	flex: 1;
	justify-content: flex-end;
}

/* ---------- Menu ---------- */
.cha-menu {
	list-style: none;
	display: flex;
	align-items: center;
	margin: 0;
	padding: 0;
	gap: var(--cha-menu-spacing, 30px);
}
.cha-menu li { position: relative; }
.cha-menu a {
	color: var(--cha-menu-text, #0B1F5C);
	text-decoration: none;
	font-size: var(--cha-menu-font-size, 15px);
	font-weight: var(--cha-menu-weight, 600);
	letter-spacing: .01em;
	display: inline-block;
	padding: 10px 2px;
	position: relative;
	transition: color .25s ease, background-color .25s ease, transform .2s ease;
	white-space: nowrap;
}
.cha-menu > li.current-menu-item > a,
.cha-menu > li.current_page_item > a {
	color: var(--cha-menu-active, #D9192D);
}

/* Hover effect: underline */
.cha-hover-underline .cha-menu a::after {
	content: "";
	position: absolute;
	left: 2px;
	right: 2px;
	bottom: 2px;
	height: 2px;
	border-radius: 2px;
	background: var(--cha-menu-hover, #D9192D);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .25s ease;
}
.cha-hover-underline .cha-menu a:hover::after,
.cha-hover-underline .cha-menu a:focus::after,
.cha-hover-underline .cha-menu > li.current-menu-item > a::after,
.cha-hover-underline .cha-menu > li.current_page_item > a::after,
.cha-hover-underline .cha-menu > li.current-menu-ancestor > a::after { transform: scaleX(1); }
.cha-hover-underline .cha-menu a:hover { color: var(--cha-menu-hover, #D9192D); }

/* Hover effect: fade */
.cha-hover-fade .cha-menu a:hover { color: var(--cha-menu-hover, #D9192D); }

/* Hover effect: slide-bg pill */
.cha-hover-slide-bg .cha-menu a { border-radius: 999px; padding: 8px 16px; }
.cha-hover-slide-bg .cha-menu a:hover {
	background: var(--cha-menu-hover, #D9192D);
	color: #fff;
}

/* Hover effect: grow */
.cha-hover-grow .cha-menu a:hover {
	color: var(--cha-menu-hover, #D9192D);
	transform: scale(1.08);
}

/* ---------- Submenu (dropdown) ---------- */
.cha-menu ul.sub-menu {
	list-style: none;
	position: absolute;
	top: 100%;
	left: 0;
	background: var(--cha-submenu-bg, #fff);
	min-width: 230px;
	margin: 0;
	padding: 8px 0;
	border-top: 3px solid var(--kms-primary, #D9192D);
	box-shadow: 0 16px 36px rgba(11,31,92,.16);
	border-radius: 0 0 8px 8px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
	z-index: 100;
}
.cha-menu ul.sub-menu ul.sub-menu { top: 0; left: 100%; }
.cha-menu li:hover > ul.sub-menu,
.cha-menu li.cha-open > ul.sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.cha-menu ul.sub-menu a {
	color: var(--cha-submenu-text, #0B1F5C);
	display: block;
	padding: 10px 18px;
	font-size: calc(var(--cha-menu-font-size, 16px) - 1px);
	white-space: nowrap;
}
.cha-menu ul.sub-menu a::after { display: none; }
.cha-menu ul.sub-menu a:hover { background: var(--kms-soft, #F4F6FC); color: var(--kms-primary, #D9192D); }
.cha-menu li.menu-item-has-children > a { padding-right: 16px; }
.cha-menu li.menu-item-has-children > a::before {
	content: "";
	position: absolute;
	right: 2px;
	top: 50%;
	width: 5px; height: 5px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-70%) rotate(45deg);
	opacity: .65;
	transition: transform .2s ease;
}
.cha-menu li.menu-item-has-children:hover > a::before { transform: translateY(-30%) rotate(225deg); }
/* The dropdown already has a crimson top edge, so drop the parent's underline while it is open. */
.cha-hover-underline .cha-menu li.menu-item-has-children:hover > a::after { transform: scaleX(0); }
.cha-menu ul.sub-menu li.menu-item-has-children > a::before { right: 14px; transform: translateY(-50%) rotate(-45deg); }

/* ---------- Button ---------- */
.cha-quote-btn {
	background: var(--cha-btn-bg, #D9192D);
	color: var(--cha-btn-text, #fff);
	border: 2px solid var(--cha-btn-bg, #D9192D);
	border-radius: var(--cha-btn-radius, 6px);
	padding: 11px 26px;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: .02em;
	line-height: 1.2;
	box-shadow: 0 4px 14px rgba(217,25,45,.25);
	text-decoration: none;
	display: inline-block;
	transition: background-color .25s ease, color .25s ease, transform .2s ease, box-shadow .25s ease;
	flex-shrink: 0;
}
.cha-quote-btn:hover {
	background: var(--cha-btn-hover-bg, #0B1F5C);
	border-color: var(--cha-btn-hover-bg, #0B1F5C);
	color: var(--cha-btn-hover-text, #fff);
	transform: translateY(-1px);
	box-shadow: 0 8px 20px rgba(11,31,92,.25);
}
.cha-btn-outline .cha-quote-btn {
	box-shadow: none;
	background: transparent;
	color: var(--cha-btn-bg, #D9192D);
}
.cha-btn-outline .cha-quote-btn:hover {
	background: var(--cha-btn-hover-bg, #0B1F5C);
	color: var(--cha-btn-hover-text, #fff);
}
.cha-quote-btn-mobile { display: none; }

/* ---------- Mobile toggle ---------- */
.cha-toggle {
	display: none;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 34px;
	height: 34px;
	background: transparent;
	border: none;
	cursor: pointer;
	padding: 0;
	flex-shrink: 0;
}
.cha-toggle .cha-bar {
	display: block;
	height: 2px;
	width: 100%;
	background: var(--cha-menu-text, #0B1F5C);
	border-radius: 2px;
	transition: transform .25s ease, opacity .25s ease;
}
.cha-toggle[aria-expanded="true"] .cha-bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.cha-toggle[aria-expanded="true"] .cha-bar:nth-child(2) { opacity: 0; }
.cha-toggle[aria-expanded="true"] .cha-bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---------- Banner-split layout ---------- */
/* A hero/banner image with a logo on each side of a centered title + subtitle,
   topped by the (existing) top bar and followed by the nav menu as its own
   full-width strip — see .cha-layout-banner-split. */
.cha-layout-banner-split .cha-banner {
	position: relative;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(-50vw + 50%);
	margin-right: calc(-50vw + 50%);
	box-sizing: border-box;
	min-height: var(--cha-banner-min-height, 340px);
	background-size: cover;
	background-position: center;
	background-color: var(--cha-banner-overlay-color, #0B1F5C);
	display: flex;
	align-items: center;
}
.cha-banner-overlay {
	position: absolute;
	inset: 0;
	background: var(--cha-banner-overlay-color, #0B1F5C);
	opacity: var(--cha-banner-overlay-opacity, .55);
}
.cha-banner-inner {
	position: relative;
	z-index: 1;
	justify-content: center;
	gap: 40px;
	text-align: center;
	padding-top: 30px;
	padding-bottom: 30px;
}
.cha-banner-logo { flex-shrink: 0; display: inline-flex; text-decoration: none; }
.cha-banner-logo img {
	width: var(--cha-banner-logo-size, 90px);
	height: var(--cha-banner-logo-size, 90px);
	object-fit: contain;
	border-radius: 50%;
	background: #fff;
	padding: 6px;
	box-shadow: 0 4px 14px rgba(0,0,0,.25);
	display: block;
}
.cha-banner-title-wrap { flex: 1; min-width: 0; }
.cha-layout-banner-split .cha-banner-title-wrap .cha-site-title {
	align-items: center;
	text-align: center;
	color: var(--cha-title-color, #fff);
}
.cha-banner-subtitle {
	display: block;
	font-style: italic;
	font-size: 14px;
	color: var(--cha-banner-subtitle-color, #e8ecf7);
	margin-top: 6px;
}

/* Menu bar strip below the banner */
.cha-menubar {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(-50vw + 50%);
	margin-right: calc(-50vw + 50%);
	box-sizing: border-box;
	background: var(--cha-menubar-bg, #5cb82e);
}
.cha-menubar-inner { gap: 20px; padding-top: 6px; padding-bottom: 6px; position: relative; }
.cha-menubar .cha-nav-wrap { flex: 0 1 auto; justify-content: center; gap: var(--cha-menu-spacing, 30px); }
.cha-menubar .cha-menu a { color: var(--cha-menubar-text, #fff); }
.cha-menubar .cha-menu > li.current-menu-item > a,
.cha-menubar .cha-menu > li.current_page_item > a,
.cha-menubar .cha-menu a:hover { color: var(--cha-menubar-text, #fff); }
.cha-hover-underline .cha-menubar .cha-menu a::after { background: var(--kms-primary-light, #F2132C); }
.cha-menubar-align-left .cha-menubar-inner { justify-content: flex-start; }
.cha-menubar-align-center .cha-menubar-inner { justify-content: center; }
.cha-menubar-align-right .cha-menubar-inner { justify-content: flex-end; }

.cha-search-toggle {
	width: 30px;
	height: 30px;
	border: none;
	background: transparent;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--cha-menubar-text, #ffffff);
	flex-shrink: 0;
}
.cha-search-icon::before { content: "\1F50D"; font-size: 16px; }
.cha-search-form {
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	background: rgba(0,0,0,.08);
	transition: max-height .25s ease, opacity .25s ease;
}
.cha-search-form.cha-search-open { max-height: 70px; opacity: 1; }
.cha-search-form-inner { gap: 10px; padding-top: 10px; padding-bottom: 10px; }
.cha-search-form input[type="search"] {
	flex: 1;
	padding: 8px 12px;
	border: none;
	border-radius: 4px;
}
.cha-search-form button {
	border: none;
	border-radius: 4px;
	padding: 8px 18px;
	background: var(--cha-btn-bg, #D9192D);
	color: var(--cha-btn-text, #fff);
	cursor: pointer;
}

@media (min-width: 993px) {
	.cha-menubar-inner .cha-nav-wrap { order: 1; }
	.cha-menubar-inner .cha-search-toggle { order: 2; }
	.cha-menubar-inner .cha-quote-btn-desktop { order: 3; }
}

@media (max-width: 640px) {
	.cha-topbar { font-size: 12px; }
	.cha-topbar-inner { justify-content: space-between; gap: 12px; padding-top: 6px; padding-bottom: 6px; flex-wrap: nowrap; }
	.cha-topbar-text { display: none; }
	.cha-topbar-item { min-width: 0; white-space: nowrap; }
}

/* ---------- Accessibility ---------- */
.cha-menu a:focus-visible,
.cha-quote-btn:focus-visible,
.cha-toggle:focus-visible,
.cha-logo-link:focus-visible,
.cha-search-toggle:focus-visible {
	outline: 2px solid var(--kms-secondary, #1446D8);
	outline-offset: 3px;
	border-radius: 4px;
}
@media (prefers-reduced-motion: reduce) {
	.cha-header, .cha-header *, .cha-topbar * { transition: none !important; }
}

/* ---------- Responsive ---------- */
@media (max-width: 992px) {
	.cha-header-inner { flex-wrap: wrap; }
	.cha-toggle { display: flex; }

	/* Full-bleed panel: cancel the container's 20px side padding so the navy menu spans the screen. */
	.cha-header-inner { row-gap: 0; }
	.cha-nav-wrap {
		flex-basis: calc(100% + 40px);
		margin: 0 -20px;
		flex-direction: column;
		align-items: stretch;
		max-height: 0;
		overflow: hidden;
		opacity: 0;
		transition: max-height .3s ease, opacity .3s ease;
		background: var(--cha-mobile-bg, #0B1F5C);
		border-radius: 0;
	}
	.cha-nav-wrap.cha-nav-open {
		max-height: 1000px;
		opacity: 1;
		padding: 8px 0 20px;
		margin-top: 10px;
		margin-bottom: -10px; /* sit flush with the header's bottom edge */
	}
	.cha-menu {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		width: 100%;
	}
	.cha-menu > li { width: 100%; }
	.cha-menu a {
		color: var(--cha-mobile-text, #fff);
		width: 100%;
		box-sizing: border-box;
		padding: 13px 20px;
	}
	.cha-menu li.menu-item-has-children > a { padding-right: 44px; }
	.cha-menu li.menu-item-has-children > a::before { right: 22px; }
	.cha-menu li.menu-item-has-children.cha-open > a::before { transform: translateY(-30%) rotate(225deg); }
	.cha-menu a::after { display: none !important; }
	.cha-menu a:hover { background: rgba(255,255,255,.08); transform: none; }
	/* Crimson on navy is unreadable, so the active item gets a crimson edge instead. */
	.cha-menu > li.current-menu-item > a,
	.cha-menu > li.current_page_item > a,
	.cha-menu > li.current-menu-ancestor > a {
		color: var(--cha-mobile-text, #fff);
		background: rgba(255,255,255,.08);
		box-shadow: inset 4px 0 0 var(--kms-primary, #D9192D);
	}
	.cha-menu ul.sub-menu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		background: rgba(0,0,0,.15);
		display: none;
		border-radius: 0;
	}
	.cha-menu li.cha-open > ul.sub-menu { display: block; }
	.cha-menu ul.sub-menu a { color: var(--cha-mobile-text, #fff); padding-left: 36px; }

	.cha-quote-btn-desktop { display: none; }
	.cha-quote-btn-mobile {
		display: block;
		margin: 14px 20px 0;
		text-align: center;
	}
	.cha-layout-logo-right .cha-header-inner { flex-direction: row; }

	/* Logo + title: stack vertically; horizontal position configurable via Mobile tab */
	.cha-logo-wrap {
		width: 100%;
		display: flex;
		justify-content: center; /* default: center */
	}
	.cha-mobile-logo-align-left .cha-logo-wrap { justify-content: flex-start; }
	.cha-mobile-logo-align-center .cha-logo-wrap { justify-content: center; }
	.cha-mobile-logo-align-right .cha-logo-wrap { justify-content: flex-end; }

	/* Option 2: keep the menu icon on the same row as the logo/title, instead of
	   letting the logo block take the full row width and pushing it down. */
	.cha-mobile-toggle-same-row .cha-logo-wrap {
		width: auto;
		flex: 1 1 0%; /* basis 0, not auto — sizes purely from available space instead of
		                 content width, so it actually shrinks instead of forcing the
		                 toggle onto a new line */
		min-width: 0;
		overflow: hidden;
	}
	.cha-mobile-toggle-same-row .cha-header-inner { align-items: center; gap: 12px; }
	.cha-mobile-toggle-same-row .cha-toggle {
		position: static;
		margin: 0;
		order: 0;
	}
	.cha-mobile-toggle-same-row .cha-nav-wrap { order: 2; }
	.cha-mobile-toggle-same-row .cha-logo-link { max-width: 100%; overflow: hidden; }
	.cha-mobile-toggle-same-row .cha-logo-wrap img.cha-logo-img { max-width: 100%; height: auto; }
	.cha-mobile-toggle-same-row .cha-site-title { font-size: calc(var(--cha-title-size, 22px) * 0.4); }

	.cha-logo-link {
		flex-direction: column;
		align-items: center;
		gap: 6px;
		text-align: center;
		max-width: 100%;
	}
	.cha-site-title { font-size: calc(var(--cha-title-size, 22px) * 0.55); }
	.cha-title-line { white-space: normal; }
	.cha-title-has-underline { border-bottom-width: 1px; padding-bottom: 5px; }

	/* Configurable text alignment for mobile — works with either title layout */
	.cha-mobile-title-align-left .cha-site-title,
	.cha-mobile-title-align-left .cha-title-align-left,
	.cha-mobile-title-align-left .cha-title-align-right {
		align-items: flex-start !important;
		text-align: left !important;
	}
	.cha-mobile-title-align-center .cha-site-title,
	.cha-mobile-title-align-center .cha-title-align-left,
	.cha-mobile-title-align-center .cha-title-align-right {
		align-items: center !important;
		text-align: center !important;
	}
	.cha-mobile-title-align-right .cha-site-title,
	.cha-mobile-title-align-right .cha-title-align-left,
	.cha-mobile-title-align-right .cha-title-align-right {
		align-items: flex-end !important;
		text-align: right !important;
	}

	/* Option 2: title beside the logo instead of stacked below it */
	.cha-mobile-title-inline .cha-logo-link {
		flex-direction: row;
		align-items: center;
		gap: 10px;
	}
	.cha-mobile-title-inline .cha-site-title { font-size: calc(var(--cha-title-size, 22px) * 0.42); }

	/* Single-line vs multi-line title text on mobile */
	.cha-mobile-title-format-singleline .cha-title-lines-multi { display: none; }
	.cha-mobile-title-format-singleline .cha-title-lines-single {
		display: block;
		white-space: normal;
	}

	/* Banner-split layout on mobile: shrink the side logos, let the banner
	   height come from content instead of the fixed min-height, and keep the
	   toggle + search icon on the menu bar's first row with the nav collapsing
	   below (same open/close mechanics as the standard layout's nav-wrap). */
	.cha-layout-banner-split .cha-banner { min-height: 0; padding: 24px 0; }
	.cha-banner-inner { flex-wrap: wrap; gap: 14px; padding-top: 0; padding-bottom: 0; }
	.cha-banner-logo img {
		width: calc(var(--cha-banner-logo-size, 90px) * 0.6);
		height: calc(var(--cha-banner-logo-size, 90px) * 0.6);
	}
	.cha-layout-banner-split .cha-banner-title-wrap .cha-site-title { font-size: calc(var(--cha-title-size, 22px) * 0.75); }
	.cha-menubar-inner { flex-wrap: wrap; justify-content: flex-start; }
	.cha-menubar .cha-toggle .cha-bar { background: var(--cha-menubar-text, #ffffff); }
	.cha-menubar .cha-nav-wrap { background: var(--cha-mobile-bg, #0B1F5C); }
}

@media (max-width: 420px) {
	.cha-site-title { font-size: calc(var(--cha-title-size, 22px) * 0.46); }
}

/* ---------- WhatsApp button ---------- */
.cha-wa-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	flex-shrink: 0;
	width: 44px;
	height: 44px;
	margin-left: 12px;
	border-radius: 999px;
	background: var(--cha-wa-bg, #25D366);
	color: #fff;
	text-decoration: none;
	font-size: 15px;
	font-weight: 700;
	line-height: 1;
	box-shadow: 0 4px 14px rgba(37,211,102,.35);
	transition: transform .2s ease, box-shadow .25s ease, filter .2s ease;
}
.cha-wa-btn:hover,
.cha-wa-btn:focus-visible {
	color: #fff;
	transform: translateY(-1px);
	filter: brightness(.92);
	box-shadow: 0 8px 20px rgba(37,211,102,.4);
}
.cha-wa-btn .cha-wa-icon { display: block; flex-shrink: 0; }
.cha-wa-btn .cha-wa-label { display: none; }
.cha-wa-btn.cha-wa-has-label { width: auto; padding: 0 20px; }
.cha-wa-btn.cha-wa-has-label .cha-wa-label { display: inline; }
.cha-wa-mobile { display: none; }
.cha-wa-btn:focus-visible { outline: 2px solid var(--kms-secondary, #1446D8); outline-offset: 2px; }

@media (min-width: 993px) {
	.cha-menubar-inner .cha-wa-desktop { order: 2; }
}

@media (max-width: 992px) {
	.cha-wa-desktop { display: none; }
	.cha-wa-mobile {
		display: flex;
		margin: 12px 20px 0;
		width: auto;
		height: 46px;
		border-radius: var(--cha-btn-radius, 6px);
	}
}
