/* Site chrome (header/footer) — loads on every page.
   Owns the :root design tokens; home.css depends on this file. */

:root {
	/* Type system: Inter for body/subtitles, Figtree for headings.
	   The legacy per-font tokens below alias into these two — keep using
	   --font-body / --font-heading in new code. */
	--font-body: 'Inter', system-ui, -apple-system, sans-serif;
	--font-heading: 'Figtree', var(--font-body);
	--font-sora: var(--font-body);
	--font-figtree: var(--font-heading);
	--c-white: #ffffff;        /* text/white, surface/white, surface/surface_0 */
	--c-bg: #fbfbfb;           /* surface/surface_bg */
	--c-black: #000000;        /* surface/black, text/black */
	--c-blue: #1961b0;         /* text/brand_secondary_em */
	--c-muted: #6d6d6d;        /* text/low_em */
	--c-ink: #242424;          /* text/high_em */
	--c-navy: #173861;         /* raw fill — dark section nav/CTA card bg */
	--c-surface-1: #f3f3f3;    /* surface/surface_1 */
	--c-outline-low: #ececec;  /* outline/low_em */
	--c-outline-med: #dadada;  /* outline/med_em */
	--c-med-em: #d0d0d0;       /* text/med_em */
	--c-disabled: #afafaf;     /* text/disabled */
	--c-blue-main: #277bd0;    /* surface/brand_secondary_main */
	--c-blue-accent-3: #4e98e2; /* surface/brand_secondary_accent_3 */
	--c-blue-accent-2: #c2daf5; /* surface/brand_secondary_accent_2 */
	--c-blue-accent-1: #e3edfb; /* surface/brand_secondary_accent_1 */
	--c-red-bright: #ff0000;   /* text/brand_primary_em */
	--c-warning: #fc9e0b;      /* surface/warning_main — star/rating gold */
	--c-grid-line: #d0d8e8;    /* raw decorative grid line fill (not a Figma token) */
	/* The actual Figma Grid_1 asset: 737x645 line grid with a baked-in radial fade */
	--kl-grid-svg: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 737 645%22 fill=%22none%22%3E%3Cpath d=%22M90.4297 0.500026V644.5M2.64131e-08 644.5L737 644.5M183.12 0.500026V644.5M2.64131e-08 537.167L737 537.167M275.81 0.500026V644.5M2.64131e-08 429.833L737 429.833M368.5 0.500026V644.5M2.64131e-08 322.5L737 322.5M461.19 0.500026V644.5M2.64131e-08 215.167L737 215.167M553.88 0.500026V644.5M2.64131e-08 107.833L737 107.833M646.57 0.500026V644.5M2.64131e-08 0.500026L737 0.5%22 stroke=%22url(%23g)%22/%3E%3Cdefs%3E%3CradialGradient id=%22g%22 cx=%220%22 cy=%220%22 r=%221%22 gradientUnits=%22userSpaceOnUse%22 gradientTransform=%22translate(368.5 322.5) rotate(90) scale(322 368.5)%22%3E%3Cstop offset=%220.326923%22 stop-color=%22%23808080%22 stop-opacity=%220.15%22/%3E%3Cstop offset=%221%22 stop-color=%22white%22 stop-opacity=%220%22/%3E%3C/radialGradient%3E%3C/defs%3E%3C/svg%3E");
	--radius-8: 8px;
	--radius-16: 16px;
	--radius-20: 20px;
	--radius-12: 12px;
	--radius-pill: 100px;
	--gutter: 3em;
	--content-max: 1280px;
	--container-edge: max(var(--gutter), calc((100vw - var(--content-max)) / 2));
	--space-1: 4px;  --space-2: 8px;  --space-3: 16px;
	--space-4: 24px; --space-5: 48px; --space-6: 80px; --space-7: 128px;
	--fs-title: 3rem; --fs-h2: 24px; --fs-body: 1rem; --fs-sm: 0.875rem;

	/* Site chrome tokens (from the live Elementor header/footer) */
	--font-roboto: var(--font-body);
	--font-inter: var(--font-body);
	--c-brand-red: #b80000;    /* Elementor "secondary"/danger — CTAs */
	--c-red-dark: #8f0000;     /* CTA hover */
	--c-hover-blue: #add8e6;   /* link/icon hover on navy */
	--c-off-white: #f5f5f5;    /* light buttons on dark */
	--c-nav-border: #a1aeb8;   /* dropdown borders */
}

@media (max-width: 1024px) { :root { --gutter: 40px; } }
@media (max-width: 600px)  { :root { --gutter: 20px; --fs-title: 2rem; } }

/* All headings are Figtree; body/subtitle text is Inter (inherited).
   Class-level font-family declarations on a heading still win — use
   var(--font-heading) there. */
body { font-family: var(--font-body); }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); }

/* ── Site-chrome button hover/focus states ──
   (The parent reset.css and its pink button states are replaced by the
   child's neutral assets/css/reset.css — buttons are styled only by
   kl- classes, including their states below.) */
.kl-mobile-menu__close:hover, .kl-mobile-menu__close:focus,
.kl-mobile-nav__toggle:hover, .kl-mobile-nav__toggle:focus,
.kl-mobile-navbar button:hover, .kl-mobile-navbar button:focus {
	background-color: transparent;
	border-color: transparent;
	color: var(--c-hover-blue);
}

.kl-navbar__consult:hover, .kl-navbar__consult:focus {
	background-color: var(--c-red-dark);
	border-color: transparent;
	color: var(--c-white);
}

.kl-evaluate:hover, .kl-evaluate:focus {
	background-color: var(--c-white);
	border-color: transparent;
	color: var(--c-brand-red);
}

.kl-page-hero__btn--consult:hover, .kl-page-hero__btn--consult:focus {
	background-color: var(--c-red-dark);
	border-color: var(--c-red-dark);
	color: var(--c-off-white);
}

/* ── Box sizing for all site-chrome subtrees ── */
.kl-navbar, .kl-navbar *, .kl-navbar *::before, .kl-navbar *::after,
.kl-page-hero, .kl-page-hero *,
.kl-breadcrumbs, .kl-breadcrumbs *,
.kl-mobile-navbar, .kl-mobile-navbar *,
.kl-mobile-menu, .kl-mobile-menu *, .kl-mobile-menu *::before, .kl-mobile-menu *::after,
.kl-evaluate, .kl-evaluate * {
	box-sizing: border-box;
}

/* ═══════════════════ Top navbar ═══════════════════ */

.kl-navbar {
	position: sticky;
	top: 0;
	z-index: 1050;
	background: var(--c-navy);
	padding: 0.5em 2em;
	font-family: var(--font-roboto);
}

body.admin-bar .kl-navbar { top: 32px; }

.kl-navbar__inner {
	display: flex;
	align-items: center;
	gap: 0.625em;
	width: 100%;
}

/* Logo */
.kl-navbar__logo {
	flex: 0 1 12%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	text-decoration: none;
}

.kl-navbar__logo-img {
	width: 85%;
	max-width: 160px;
	height: auto;
	display: block;
}

.kl-navbar__logo-text {
	color: var(--c-white);
	font-weight: 700;
	font-size: 1.2rem;
	white-space: nowrap;
}

/* Desktop menu */
.kl-navbar__menu {
	flex: 1 1 auto;
	display: flex;
	justify-content: flex-end;
	padding-bottom: 0.5em;
	min-width: 0;
}

.kl-nav,
.kl-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.kl-nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.kl-nav > li { position: relative; }

.kl-nav a {
	display: block;
	/* Intentionally px, not em: this one declaration styles links at three
	   different sizes (header 1.05rem, footer 1.2rem, dropdown 0.9rem) and
	   they are all meant to share the same hit area. In em each would get a
	   different padding. */
	padding: 10px 7px;
	color: var(--c-white);
	font-size: 1.05rem;
	font-weight: 500;
	letter-spacing: -0.6px;
	text-transform: capitalize;
	text-decoration: none;
	transition: color 0.2s;
	white-space: nowrap;
}

.kl-nav a:hover { color: var(--c-hover-blue); }

/* Chevron on top-level items with children */
.kl-nav > li.menu-item-has-children > a::after {
	content: "";
	display: inline-block;
	width: 0.55em;
	height: 0.55em;
	margin-left: 0.375em;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg) translateY(-2px);
}

/* Dropdown panels */
.kl-nav .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 999;
	min-width: 240px;
	max-height: calc(100vh - 140px);
	overflow-y: auto;
	background: var(--c-navy);
	border: 1px solid var(--c-nav-border);
	box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
	display: none;
}

.kl-nav .sub-menu li { position: relative; }

.kl-nav .sub-menu li + li { border-top: 1px solid rgba(161, 174, 184, 0.41); }

.kl-nav .sub-menu a {
	padding: 0.694444em 1.111111em;
	font-size: 0.9rem;
	font-weight: 500;
	letter-spacing: 0;
	white-space: normal;
}

.kl-nav .sub-menu a:hover {
	background: var(--c-white);
	color: var(--c-navy);
}

/* Sub-item chevron points right (flyout) */
.kl-nav .sub-menu li.menu-item-has-children > a::after {
	content: "";
	position: absolute;
	right: 12px;
	top: 50%;
	width: 0.5em;
	height: 0.5em;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-50%) rotate(-45deg);
}

/* Open on hover/focus */
.kl-nav li:hover > .sub-menu,
.kl-nav li:focus-within > .sub-menu {
	display: block;
}

/* Depth ≥ 2 flies out to the RIGHT by default */
.kl-nav .sub-menu .sub-menu {
	top: 0;
	left: 100%;
	right: auto;
}

/* Right-most top-level dropdowns must not overflow the viewport;
   their flyouts go LEFT instead. */
.kl-nav > li:nth-last-child(-n+2) > .sub-menu {
	left: auto;
	right: 0;
}

.kl-nav > li:nth-last-child(-n+2) .sub-menu .sub-menu {
	left: auto;
	right: 100%;
}

/* CTA group */
.kl-navbar__cta {
	flex: 0 1 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.625em;
}

.kl-navbar__phone {
	display: inline-flex;
	align-items: center;
	gap: 0.669643em;
	color: var(--c-white);
	font-size: 1.4rem;
	font-weight: 600;
	text-decoration: none;
	transition: color 0.2s;
	white-space: nowrap;
}

.kl-navbar__phone:hover { color: var(--c-hover-blue); }

.kl-navbar__phone-icon svg {
	width: 1.1em;
	height: 1.1em;
	display: block;
}

.kl-navbar__consult {
	background: var(--c-brand-red);
	color: var(--c-white);
	font-family: var(--font-roboto);
	font-size: 1.125rem;
	font-weight: 600;
	text-transform: uppercase;
	border: none;
	border-radius: 3px;
	padding: 0.666667em 1.333333em;
	cursor: pointer;
	transition: background 0.2s;
	white-space: nowrap;
}

.kl-navbar__consult:hover { background: var(--c-red-dark); }

/* ── "Evaluate Your Case Instantly!" pill ── */

.kl-evaluate {
	display: flex;
	align-items: center;
	background: var(--c-brand-red);
	border: none;
	border-radius: var(--radius-pill);
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.19);
	padding: 0;
	padding-right: 0.875em;
	cursor: pointer;
	transition: background 0.3s, transform 0.3s;
	text-align: left;
	overflow: hidden;
	font-family: var(--font-roboto);
}

.kl-evaluate__img {
	width: 48px;
	height: 48px;
	object-fit: cover;
	border-radius: var(--radius-pill) 0 0 var(--radius-pill);
	display: block;
	flex: 0 0 auto;
	margin-right: 0.625em;
}

.kl-evaluate__title {
	color: var(--c-white);
	font-size: 0.9375rem;
	font-weight: 500;
	text-transform: uppercase;
	line-height: 1.2;
	transition: color 0.3s;
}

.kl-evaluate:hover { background: var(--c-white); }
.kl-evaluate:hover .kl-evaluate__title { color: var(--c-brand-red); }

.kl-evaluate--fixed {
	position: fixed;
	right: 25px;
	bottom: 26px;
	z-index: 1040;
	width: 250px;
}

.kl-evaluate--fixed:hover { transform: scale(1.1); }

.kl-evaluate--fixed .kl-evaluate__img {
	width: 64px;
	height: 64px;
}

/* Visibility: menu/phone/consult + fixed pill are desktop-only;
   inline pill + bottom navbar are tablet/mobile-only. */
.kl-evaluate--inline { display: none; }

@media (max-width: 1024px) {
	.kl-navbar { padding: 1em 0.5em; }
	.kl-navbar__menu,
	.kl-navbar__phone,
	.kl-navbar__consult,
	.kl-evaluate--fixed { display: none; }
	.kl-evaluate--inline { display: flex; }
	.kl-navbar__logo { flex: 0 1 50%; }
	.kl-navbar__cta { flex: 0 1 50%; }
}

@media (max-width: 767px) {
	.kl-navbar__logo { flex: 0 1 40%; }
	.kl-navbar__logo-img { width: 75%; }
	.kl-navbar__cta { flex: 0 1 55%; }
	.kl-evaluate__title { font-size: 0.75rem; }
	.kl-evaluate__img { width: 42px; height: 42px; }
}

/* ═══════════════════ Interior page hero ═══════════════════ */

.kl-page-hero {
	position: relative;
	z-index: 2;
	overflow: hidden;
	background: #222222;
	min-height: 450px;
	display: flex;
	align-items: center;
	padding: 7.5em 0 5em;
}

.kl-page-hero__bg {
	position: absolute;
	inset: 0;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	filter: brightness(0.25);
	pointer-events: none;
}

.kl-page-hero__inner {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: calc(var(--content-max) + 2 * var(--gutter));
	margin: 0 auto;
	padding-inline: var(--gutter);
	display: flex;
	flex-direction: column;
	gap: 3.125em;
}

.kl-page-hero__title {
	margin: 0;
	color: #f7f7f7;
	font-family: var(--font-heading);
	font-size: clamp(2.2rem, 4vw, 3rem);
	font-weight: 700;
	line-height: 1.2;
	text-align: left;
	max-width: 90%;
}

.kl-page-hero__btns {
	display: flex;
	flex-wrap: wrap;
	gap: 1.25em;
}

.kl-page-hero__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.416667em;
	font-family: var(--font-inter);
	font-size: 1.125rem;
	font-weight: 600;
	text-transform: capitalize;
	line-height: normal;
	text-decoration: none;
	border-radius: 5px;
	padding: 0.75em 1.5em;
	cursor: pointer;
	transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.kl-page-hero__btn-icon svg {
	width: 1.25rem;
	height: 1.25rem;
	display: block;
}

.kl-page-hero__btn--consult {
	background: var(--c-brand-red);
	border: 1px solid var(--c-brand-red);
	color: var(--c-off-white);
}

.kl-page-hero__btn--consult:hover {
	background: var(--c-red-dark);
	border-color: var(--c-red-dark);
}

.kl-page-hero__btn--phone {
	background: var(--c-off-white);
	border: 1px solid var(--c-off-white);
	color: var(--c-navy);
}

.kl-page-hero__btn--phone:hover { color: var(--c-red-dark); }

@media (max-width: 1024px) {
	.kl-page-hero { padding: 5em 0; }
	.kl-page-hero__btn { font-size: 1rem; }
}

@media (max-width: 767px) {
	.kl-page-hero { padding: 7.5em 1em 3em; min-height: 0; }
	.kl-page-hero__title { font-size: 2.2rem; max-width: 95%; }
	.kl-page-hero__btns { gap: 0.625em; }
	.kl-page-hero__btn {
		flex: 1 1 auto;
		padding: 0.5em 0.625em;
	}
	.kl-page-hero__btn-icon svg { width: 1.125rem; height: 1.125rem; }
}

/* ═══════════════════ Breadcrumbs ═══════════════════ */

.kl-breadcrumbs {
	overflow: hidden;
	padding: 1em 0;
	font-family: var(--font-roboto);
}

.kl-breadcrumbs__inner {
	max-width: calc(var(--content-max) + 2 * var(--gutter));
	margin: 0 auto;
	padding-inline: var(--gutter);
	font-size: 0.9rem;
	color: var(--c-muted);
}

.kl-breadcrumbs a {
	color: var(--c-muted);
	text-decoration: none;
}

.kl-breadcrumbs a:hover { color: var(--c-navy); }

.kl-breadcrumbs__sep { margin: 0 0.555556em; }

.kl-breadcrumbs__current { color: var(--c-ink); }

/* ═══════════════════ Mobile bottom navbar ═══════════════════ */

.kl-mobile-navbar {
	display: none;
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index: 99999;
	margin: 0;
	padding: 0.9375em 0 0.3125em;
	list-style: none;
	background: var(--c-navy);
	box-shadow: 0 -2px 9px -2px rgba(0, 0, 0, 0.4);
}

@media (max-width: 1024px) {
	.kl-mobile-navbar { display: flex; }
	/* keep page content clear of the fixed bar — the navbar markup is local-only
	   (staging keeps its own header/footer), so scope this to pages that actually
	   render it; otherwise staging reserves dead space with no bar to fill it */
	body:has(.kl-mobile-navbar) { padding-bottom: 3.375em; }
}

.kl-mobile-navbar li {
	flex: 1 1 25%;
	text-align: center;
	border-left: 1px solid rgba(255, 255, 255, 0.2);
}

.kl-mobile-navbar li:first-child { border-left: none; }

.kl-mobile-navbar a,
.kl-mobile-navbar button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: none;
	border: none;
	padding: 0.25em 0 0.5em;
	cursor: pointer;
	width: 100%;
}

.kl-mobile-navbar svg {
	width: 20px;
	height: 20px;
	fill: var(--c-white);
	transition: fill 0.2s;
}

.kl-mobile-navbar a:hover svg,
.kl-mobile-navbar button:hover svg { fill: var(--c-hover-blue); }

/* ═══════════════════ Mobile slide-in menu ═══════════════════ */

.kl-mobile-menu { font-family: var(--font-roboto); }

.kl-mobile-menu__overlay {
	position: fixed;
	inset: 0;
	z-index: 100000;
	background: rgba(0, 0, 0, 0.55);
	opacity: 0;
	transition: opacity 0.25s;
}

.kl-mobile-menu__panel {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 100001;
	width: min(360px, 88vw);
	background: var(--c-navy);
	display: flex;
	flex-direction: column;
	transform: translateX(100%);
	transition: transform 0.28s ease;
	overflow-y: auto;
}

.kl-mobile-menu.is-open .kl-mobile-menu__overlay { opacity: 1; }
.kl-mobile-menu.is-open .kl-mobile-menu__panel { transform: translateX(0); }

body.kl-menu-open { overflow: hidden; }

.kl-mobile-menu__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1em 1.25em;
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.kl-mobile-menu__logo-img {
	width: 130px;
	height: auto;
	display: block;
}

.kl-mobile-menu__close {
	background: none;
	border: none;
	color: var(--c-white);
	cursor: pointer;
	padding: 0.375em;
}

.kl-mobile-menu__close svg { width: 26px; height: 26px; display: block; }
.kl-mobile-menu__close:hover { color: var(--c-hover-blue); }

.kl-mobile-menu__nav { flex: 1 1 auto; padding: 0.5em 1.25em 1.25em; }

.kl-mobile-nav,
.kl-mobile-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.kl-mobile-nav li { border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
.kl-mobile-nav li:last-child { border-bottom: none; }

.kl-mobile-nav li.menu-item-has-children {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.kl-mobile-nav a {
	flex: 1 1 auto;
	display: block;
	padding: 0.714286em 0;
	color: var(--c-white);
	font-size: 1.05rem;
	font-weight: 500;
	text-transform: capitalize;
	text-decoration: none;
}

.kl-mobile-nav a:hover { color: var(--c-hover-blue); }

/* Injected submenu toggles */
.kl-mobile-nav__toggle {
	flex: 0 0 auto;
	background: none;
	border: none;
	color: var(--c-white);
	cursor: pointer;
	padding: 0.75em 0.25em 0.75em 1em;
}

.kl-mobile-nav__toggle::after {
	content: "";
	display: block;
	width: 0.55em;
	height: 0.55em;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform 0.2s;
}

.kl-mobile-nav__toggle[aria-expanded="true"]::after {
	transform: rotate(225deg);
}

.kl-mobile-nav .sub-menu {
	flex: 1 1 100%;
	display: none;
	padding-left: 0.875em;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.kl-mobile-nav li.is-open > .sub-menu { display: block; }

.kl-mobile-nav .sub-menu a {
	font-size: 0.95rem;
	font-weight: 400;
	padding: 0.657895em 0;
}

.kl-mobile-menu__cta {
	padding: 1em 1.25em calc(1em + env(safe-area-inset-bottom, 0));
	border-top: 1px solid rgba(255, 255, 255, 0.15);
}

.kl-mobile-menu__call {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.568182em;
	background: var(--c-brand-red);
	color: var(--c-white);
	font-size: 1.1rem;
	font-weight: 600;
	text-decoration: none;
	border-radius: 5px;
	padding: 0.75em 1em;
	transition: background 0.2s;
}

.kl-mobile-menu__call:hover { background: var(--c-red-dark); }

.kl-mobile-menu__call-icon svg { width: 1em; height: 1em; display: block; }

/* ═══════════════════ Footer ═══════════════════ */

.kl-footer,
.kl-footer *, .kl-footer *::before, .kl-footer *::after {
	box-sizing: border-box;
}

.kl-footer { font-family: var(--font-roboto); }

.kl-footer ul { list-style: none; margin: 0; padding: 0; }

/* ── Regions accordion ("Fighting for Justice Across Arkansas") ── */

.kl-footer-regions {
	background: #222222;
	overflow: hidden;
	padding: 5em 10em;
}

.kl-footer-regions__inner {
	max-width: 1400px;
	margin: 0 auto;
}

.kl-footer-regions__heading {
	margin: 0 0 0.5em;
	color: var(--c-white);
	font-size: 2.4rem;
	font-weight: 600;
	text-align: center;
}

.kl-footer-regions__heading-em { color: var(--c-brand-red); }

.kl-footer-regions__divider {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 75%;
	margin: 0 auto 2em;
}

.kl-footer-regions__divider-line {
	flex: 1 1 auto;
	height: 1px;
	background: rgba(255, 255, 255, 0.85);
}

.kl-footer-regions__divider-icon {
	width: 34px;
	height: 34px;
	color: var(--c-brand-red);
	margin: 0 0.875em;
	flex: 0 0 auto;
}

.kl-footer-regions__item {
	border-bottom: 1px solid #5a5357;
}

.kl-footer-regions__trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1em;
	width: 100%;
	background: transparent;
	border: none;
	cursor: pointer;
	padding: 0.5em 1em 0.5em 0;
	color: var(--c-white);
	font-family: var(--font-roboto);
	font-size: 1.6em;
	font-weight: 600;
	letter-spacing: 1px;
	line-height: 1.9;
	text-align: left;
	transition: color 0.2s;
}

.kl-footer-regions__trigger:hover,
.kl-footer-regions__trigger:focus {
	background: transparent;
	border-color: transparent;
	color: var(--c-brand-red);
}

.kl-footer-regions__trigger[aria-expanded="true"] { color: var(--c-brand-red); }

.kl-footer-regions__icon {
	width: 22px;
	height: 22px;
	flex: 0 0 auto;
	color: var(--c-brand-red);
}

.kl-footer-regions__trigger[aria-expanded="true"] .kl-footer-regions__icon { color: var(--c-white); }
.kl-footer-regions__trigger .kl-footer-regions__icon--minus { display: none; }
.kl-footer-regions__trigger[aria-expanded="true"] .kl-footer-regions__icon--minus { display: block; }
.kl-footer-regions__trigger[aria-expanded="true"] .kl-footer-regions__icon--plus { display: none; }

.kl-footer-regions__panel { padding: 0 5em 1em 1.5em; }

.kl-footer-regions__links {
	columns: 220px;
	column-gap: 2em;
}

.kl-footer-regions__links li {
	break-inside: avoid;
	padding: 0.25em 0;
}

.kl-footer-regions__links a {
	color: var(--c-white);
	font-size: 0.95rem;
	text-decoration: none;
	transition: color 0.2s;
}

.kl-footer-regions__links a:hover { color: var(--c-hover-blue); }

@media (max-width: 1024px) {
	.kl-footer-regions { padding: 5em 1em; }
	.kl-footer-regions__heading { font-size: 2rem; }
	.kl-footer-regions__trigger { font-size: 1.5rem; }
	.kl-footer-regions__panel { padding: 0 1em 1em; }
	body.admin-bar .kl-navbar { top: 0; }
}

@media (max-width: 767px) {
	.kl-footer-regions__heading { font-size: 1.7rem; }
	.kl-footer-regions__trigger { font-size: 1.4rem; padding: 0.75em 0; line-height: 1.3; }
	.kl-footer-regions__panel { padding: 0 0 1em 0.5em; }
}

/* ── Main footer (navy) ── */

.kl-footer-main {
	background: var(--c-navy);
	overflow: hidden;
	padding: 4em 1em;
}

.kl-footer-main__menu {
	max-width: 1400px;
	margin: 0 auto 3em;
}

.kl-nav--footer {
	justify-content: center;
	flex-wrap: wrap;
}

.kl-nav--footer > li > a { font-size: 1.2rem; }

/* Footer dropdowns open upward */
.kl-nav--footer .sub-menu {
	top: auto;
	bottom: 100%;
}

.kl-nav--footer .sub-menu .sub-menu {
	top: auto;
	bottom: 0;
}

.kl-footer-main__cols {
	display: flex;
	gap: 2em;
	align-items: flex-start;
	max-width: 1400px;
	margin: 0 auto;
}

.kl-footer-main__col--brand { flex: 1 1 30%; }
.kl-footer-main__col--offices { flex: 1 1 27%; }
.kl-footer-main__col--map { flex: 1 1 40%; }

.kl-footer-main__logo { display: inline-block; margin-bottom: 1.5em; }

.kl-footer-main__logo-img {
	width: 235px;
	height: auto;
	display: block;
}

.kl-footer-social {
	display: flex;
	gap: 1.25em;
	flex-wrap: wrap;
}

.kl-footer-social__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	color: var(--c-white);
	transition: opacity 0.2s;
}

.kl-footer-social__link svg { width: 20px; height: 20px; }
.kl-footer-social__link:hover { opacity: 0.8; color: var(--c-white); }

.kl-footer-social--facebook { background: #3b5998; }
.kl-footer-social--linkedin { background: #0077b5; }
.kl-footer-social--youtube { background: #cd201f; }
.kl-footer-social--instagram { background: #c13584; }
.kl-footer-social--twitter { background: #1da1f2; }

/* Office accordions */
.kl-footer-offices__trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5em;
	width: 100%;
	background: transparent;
	border: none;
	cursor: pointer;
	padding: 1em 0;
	color: #d9dee5;
	font-family: var(--font-roboto);
	font-size: 1.313rem;
	font-weight: 600;
	letter-spacing: 0.2px;
	line-height: 1.3;
	text-align: left;
	transition: color 0.2s;
}

.kl-footer-offices__trigger:hover,
.kl-footer-offices__trigger:focus {
	background: transparent;
	border-color: transparent;
	color: var(--c-white);
}

.kl-footer-offices__trigger[aria-expanded="true"] { color: var(--c-white); }

.kl-footer-offices__caret {
	width: 14px;
	height: 20px;
	flex: 0 0 auto;
	transition: transform 0.2s;
}

.kl-footer-offices__trigger[aria-expanded="true"] .kl-footer-offices__caret { transform: rotate(180deg); }

.kl-footer-offices__address {
	margin: 0 0 0.75em;
	color: var(--c-white);
	line-height: 1.6;
}

.kl-footer-offices__links li { padding: 0.15625em 0; }

.kl-footer-offices__links a {
	display: inline-flex;
	align-items: center;
	gap: 0.625em;
	color: var(--c-white);
	text-decoration: none;
	transition: color 0.2s;
}

.kl-footer-offices__links a:hover { color: var(--c-hover-blue); }

.kl-footer-offices__link-icon svg {
	width: 15px;
	height: 15px;
	display: block;
	color: var(--c-hover-blue);
}

/* Map */
.kl-footer-main__map {
	width: 100%;
	height: 35vh;
	border: 0;
	display: block;
	filter: brightness(0.55) contrast(1.45) saturate(1.89);
}

@media (max-width: 1024px) {
	.kl-footer-main__menu { display: none; }
	.kl-footer-main__cols { flex-wrap: wrap; }
	/* Live site reverses column order on tablet/mobile: map + offices first, brand last */
	.kl-footer-main__col--map { flex: 1 1 55%; order: 1; }
	.kl-footer-main__col--offices { flex: 1 1 38%; order: 2; }
	.kl-footer-main__col--brand { flex: 1 1 100%; order: 3; margin-top: 2em; }
}

@media (max-width: 767px) {
	.kl-footer-main { padding: 3em 1em; }
	.kl-footer-main__cols { flex-direction: column; }
	.kl-footer-main__col--map,
	.kl-footer-main__col--offices,
	.kl-footer-main__col--brand { flex: 1 1 100%; width: 100%; }
	.kl-footer-main__map { height: 30vh; }
}

/* ── Disclaimer bar ── */

.kl-footer-disclaimer {
	background: var(--c-navy);
	border-top: 1px solid rgba(206, 206, 206, 0.25);
	overflow: hidden;
	padding: 1em;
}

.kl-footer-disclaimer__inner {
	max-width: 1400px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 0.625em;
}

.kl-footer-disclaimer__text {
	margin: 0;
	color: var(--c-white);
	opacity: 0.6;
	font-size: 0.8em;
	font-weight: 300;
	line-height: 1.6;
}

.kl-footer-disclaimer__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1em;
	flex-wrap: wrap;
}

.kl-footer-disclaimer__links {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	color: var(--c-white);
	font-size: 0.8em;
	opacity: 0.75;
}

.kl-footer-disclaimer__links li {
	display: inline-flex;
	align-items: center;
	gap: 0.46875em;
}

.kl-footer-disclaimer__links li + li {
	margin-left: 1em;
	padding-left: 1em;
	border-left: 1px solid rgba(255, 255, 255, 0.4);
}

.kl-footer-disclaimer__links a {
	color: var(--c-white);
	text-decoration: none;
	transition: color 0.2s;
}

.kl-footer-disclaimer__links a:hover { color: var(--c-hover-blue); }

.kl-footer-disclaimer__copy-icon svg {
	width: 0.9em;
	height: 0.9em;
	display: block;
}

@media (max-width: 767px) {
	.kl-footer-disclaimer { padding: 1em 1em 2em; }
}
