/*
 * Meld: Engine, the kit's menus: the desktop dropdowns (a list of buttons,
 * each opening a native popover panel under it) and the phone menu (the
 * header's Menu button and the dialog kit-menu.js draws from it, one per
 * page), plus what Meld draws from the operator's settings: the header's
 * contact menu (k-ctamenu, a popover like the dropdowns), the social icons
 * (k-social) and the rating moved into the trust section
 * (k-trust__fact--rating).
 *
 * Loaded right after kit-media.css, before a rebuilt section's sheet. Every
 * rule here is a k-menu, k-mainnav, k-ctamenu or k-social class or a
 * descendant of one (the rating's rules descend from .k-trust, and the
 * operator's buttons are found by their data-k-action); none
 * reaches a section root, so a rebuilt header's own root rule (and the weight
 * guard on kit.css) are untouched. The dropdowns sit inside the header, so
 * they answer to the kit's reset for anything classed k-* in a .k-sec
 * (margin, padding, max-width) and, for a Play Video button, to .k-video__play
 * (a white pill in the corner of a picture), which is put back to a plain row
 * here. The phone dialog is a child of <body>, outside any .k-sec, so its
 * rules carry their own two classes against the page shell's bare ones
 * (.se-page a, .se-page ul, .se-page li) and set what those would give it.
 * Theming is through the custom properties only.
 */

/* ---------------------------------------------------------------- Dropdowns */

/*
 * The desktop list of a menu with groups, printed by Meld in place of the
 * header's own list: plain links, and buttons that each open a native popover
 * panel. The panel is in the top layer, so the header's max-height and
 * clipping cannot cut it; kit-menu.js puts it under its button. Without
 * popovers (html.k-no-popover) the whole list is hidden, and the phone Menu
 * button, which counts the links on screen, shows at every width.
 */
html.k-no-popover .k-mainnav {
	display: none !important;
}

/*
 * What a top item looks like is the header's say, through the class Meld
 * copied from its first link (k-hd__link, k-nav__link). These baselines have
 * no weight at all (:where), so that class, and any rule of the header's,
 * wins on any tie. They take the browser's button look off (border,
 * background, font, colour) so a button reads as the link beside it, and give
 * the list a row of its own when nothing else does.
 */
:where(.k-mainnav) {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 0;
	padding: 0;
	list-style: none;
}

:where(.k-mainnav__item) {
	margin: 0;
	padding: 0;
	list-style: none;
}

:where(.k-mainnav__open) {
	display: inline-flex;
	align-items: center;
	appearance: none;
	border: 0;
	background: none;
	color: inherit;
	font: inherit;
	text-align: inherit;
	cursor: pointer;
}

/*
 * A small chevron after the word, from the text's own colour. Its right
 * margin is negative, so it sits in the item's own padding and costs little
 * of the bar's width (a bar that cannot hold the whole list wraps it).
 */
.k-mainnav .k-mainnav__open::after {
	content: "";
	display: inline-block;
	flex: none;
	box-sizing: border-box;
	width: 0.4em;
	height: 0.4em;
	margin: 0 -0.25em 0 0.4em;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-0.15em) rotate(45deg);
}

.k-mainnav .k-mainnav__open[aria-expanded="true"]::after {
	transform: translateY(0.1em) rotate(225deg);
}

.k-mainnav .k-mainnav__open:focus-visible {
	border-radius: 4px;
	outline: 2px solid var(--k-brand-ink);
	outline-offset: 2px;
}

/*
 * The panel. It is hidden here, and the grid is set on the open state alone
 * (below), so a panel never paints open without popover support or without
 * script. Its width is its content's, up to 56rem or the window less its
 * gutters, whichever is less, with a column for each group that has 12rem to
 * itself; kit-menu.js sets left and top (from the button) and, with the
 * window's real size, max-width and max-height.
 */
.k-mainnav .k-mainnav__panel {
	display: none;
	position: fixed;
	box-sizing: border-box;
	inset: auto;
	width: max-content;
	max-width: min(56rem, calc(100vw - 32px));
	max-height: calc(100vh - 6rem);
	margin: 0;
	padding: 1.25rem 1.5rem;
	overflow: hidden auto;
	overscroll-behavior: contain;
	border: 1px solid var(--k-line);
	border-radius: var(--k-radius-lg);
	background: var(--k-bg);
	box-shadow: var(--k-shadow);
	color: var(--k-ink);
	font-family: var(--k-font-body);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: normal;
	text-align: left;
	text-decoration: none;
	text-transform: none;
	white-space: normal;
}

.k-mainnav .k-mainnav__panel.k-mainnav__panel:popover-open {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
	align-items: start;
	gap: 1.25rem 2rem;
}

/* Three classes from here down: a header's own rules for its lists and
   paragraphs (.k-hd__nav li, .k-hd__nav p) must not reach into the panel. */
.k-mainnav .k-mainnav__panel .k-mainnav__group {
	min-width: 0;
	margin: 0;
	padding: 0;
}

.k-mainnav .k-mainnav__panel .k-mainnav__heading {
	margin: 0 0 0.375rem;
	padding: 0 0.75rem;
	color: var(--k-brand-ink);
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.k-mainnav .k-mainnav__panel .k-mainnav__links {
	display: block;
	max-width: none;
	margin: 0;
	padding: 0;
	list-style: none;
}

.k-mainnav .k-mainnav__panel .k-mainnav__links li {
	display: block;
	margin: 0;
	padding: 0;
	list-style: none;
}

/*
 * A link, or a button (Play Video) standing in for one. A button also wears
 * kit-media's .k-video__play, a white pill pinned to the corner of a picture,
 * with its own hover and focus looks at three classes; each part of it is put
 * back here, hover and focus included.
 */
.k-mainnav .k-mainnav__panel .k-mainnav__link {
	position: static;
	z-index: auto;
	display: flex;
	align-items: center;
	box-sizing: border-box;
	gap: 0.5rem;
	inset: auto;
	width: 100%;
	min-height: 2.5rem;
	margin: 0;
	padding: 0.375rem 0.75rem;
	appearance: none;
	border: 0;
	border-radius: var(--k-radius);
	background: none;
	box-shadow: none;
	color: var(--k-ink-strong);
	font-family: var(--k-font-body);
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: 1.35;
	letter-spacing: normal;
	text-align: left;
	text-decoration: none;
	text-transform: none;
	white-space: normal;
	cursor: pointer;
	transform: none;
}

.k-mainnav .k-mainnav__panel .k-mainnav__link:hover {
	background: color-mix(in srgb, var(--k-brand) 9%, transparent);
	box-shadow: none;
	color: var(--k-brand-ink);
	transform: none;
}

/* Inside the panel's edge, where its scrolling box would not cut it off. */
.k-mainnav .k-mainnav__panel .k-mainnav__link:focus-visible {
	background: color-mix(in srgb, var(--k-brand) 9%, transparent);
	box-shadow: none;
	color: var(--k-brand-ink);
	outline: 2px solid var(--k-brand-ink);
	outline-offset: -2px;
	transform: none;
}

/* A small play mark before a video's words, from the text's own colour. */
.k-mainnav .k-mainnav__panel .k-video__play::before {
	content: "";
	flex: none;
	width: 0;
	height: 0;
	border-block: 0.3125rem solid transparent;
	border-inline-start: 0.5rem solid currentColor;
}

@media (prefers-reduced-motion: no-preference) {
	.k-mainnav .k-mainnav__panel.k-mainnav__panel:popover-open {
		animation: k-mainnav-in 0.16s ease-out;
	}

	.k-mainnav .k-mainnav__open::after {
		transition: transform 0.2s ease;
	}

	.k-mainnav .k-mainnav__panel .k-mainnav__link {
		transition: background-color 0.15s ease, color 0.15s ease;
	}
}

@keyframes k-mainnav-in {
	from {
		opacity: 0;
		transform: translateY(-6px);
	}
}

/* ------------------------------------------------------------------ Button */

/*
 * Drawn by Meld inside the header's first .k-ctas and shown by kit-menu.js
 * only where the header's own links are not on screen. The kit's .k-btn sets
 * a display, which would beat the hidden attribute (an author rule outranks
 * the browser's), so hidden is restated here. The same for the nav beside it,
 * which is only the panel's source and the crawler's links.
 */
.k-menu__open[hidden],
.k-menu[hidden] {
	display: none !important;
}

/* Three short bars before the word, from one element: two borders and a
   gradient between them (a box-shadow would vanish in forced-colours mode). */
.k-sec .k-menu__open::before {
	content: "";
	flex: none;
	box-sizing: border-box;
	width: 1rem;
	height: 12px;
	border-block: 2px solid currentColor;
	background: linear-gradient(currentColor, currentColor) center / 100% 2px no-repeat;
}

.k-sec .k-menu__open:focus-visible {
	outline: 2px solid var(--k-brand);
	outline-offset: 2px;
}

/* ------------------------------------------------------------------- Panel */

/*
 * A drawer from the right edge (the whole width on a phone), in the top layer
 * so the sticky header's max-height and clipping cannot cut it. The dialog
 * has no padding of its own: what lies inside is the panel, so a press on the
 * dialog itself can only be a press on the shade.
 */
.k-menu__dialog.k-menu__dialog {
	position: fixed;
	inset: 0 0 0 auto;
	width: min(26rem, 100%);
	max-width: none;
	height: 100%;
	max-height: none;
	margin: 0;
	padding: 0;
	overflow: hidden auto;
	overscroll-behavior: contain;
	border: 0;
	border-radius: var(--k-radius-lg) 0 0 var(--k-radius-lg);
	background: var(--k-bg);
	box-shadow: -24px 0 60px -30px color-mix(in srgb, var(--k-ink) 55%, transparent);
	color: var(--k-ink);
	font-family: var(--k-font-body);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	text-align: left;
}

.k-menu__dialog::backdrop {
	/* Older browsers do not pass custom properties to ::backdrop: a fallback ink. */
	background: color-mix(in srgb, var(--k-ink, #26302e) 62%, transparent);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
}

.k-menu__dialog .k-menu__panel {
	display: flex;
	flex-direction: column;
	min-height: 100%;
	padding: 0 1.25rem calc(1.5rem + env(safe-area-inset-bottom, 0px));
}

.k-menu__dialog .k-menu__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	min-height: 4.5rem;
}

.k-menu__dialog .k-menu__title {
	color: var(--k-ink-strong);
	font-family: var(--k-font-head);
	font-size: 1.375rem;
	font-weight: 600;
	line-height: 1.15;
	letter-spacing: -0.01em;
}

.k-menu__dialog .k-menu__close {
	display: grid;
	flex: none;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--k-soft);
	color: var(--k-ink-strong);
	cursor: pointer;
}

.k-menu__dialog .k-menu__close:hover {
	background: color-mix(in srgb, var(--k-soft) 70%, var(--k-brand));
}

.k-menu__dialog .k-menu__close:focus-visible {
	outline: 2px solid var(--k-brand);
	outline-offset: 2px;
}

/* ------------------------------------------------------------------- Links */

.k-menu__dialog .k-menu__list,
.k-menu__dialog .k-menu__actions {
	max-width: none;
	margin: 0;
	padding: 0;
	list-style: none;
}

.k-menu__dialog .k-menu__item {
	margin: 0;
	padding: 0;
	list-style: none;
}

.k-menu__dialog .k-menu__list .k-menu__item {
	border-bottom: 1px solid var(--k-line);
}

.k-menu__dialog .k-menu__link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	box-sizing: border-box;
	gap: 1rem;
	width: 100%;
	min-height: 3.5rem;
	margin: 0;
	padding: 0.75rem 0;
	appearance: none;
	border: 0;
	background: none;
	color: var(--k-ink-strong);
	font-family: inherit;
	font-size: 1.1875rem;
	font-weight: 600;
	line-height: 1.3;
	text-align: left;
	text-decoration: none;
	cursor: pointer;
}

.k-menu__dialog .k-menu__link:hover {
	color: var(--k-brand-ink);
}

.k-menu__dialog .k-menu__link:focus-visible {
	outline: 2px solid var(--k-brand);
	outline-offset: 2px;
	border-radius: var(--k-radius);
}

/* A small arrow at the far end of each page link. */
.k-menu__dialog .k-menu__list .k-menu__link::after {
	content: "";
	flex: none;
	width: 0.5rem;
	height: 0.5rem;
	border-top: 2px solid currentColor;
	border-right: 2px solid currentColor;
	opacity: 0.55;
	transform: rotate(45deg);
}

/*
 * A group with a heading is an accordion: a native <details>, closed, with its
 * heading as the summary. What is inside keeps the page links' look, a size
 * smaller and without the arrow, under small headings for the sub-groups.
 */
.k-menu__dialog .k-menu__more {
	margin: 0;
	padding: 0;
}

.k-menu__dialog .k-menu__summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	box-sizing: border-box;
	gap: 1rem;
	min-height: 3.5rem;
	margin: 0;
	padding: 0.75rem 0;
	color: var(--k-ink-strong);
	font-size: 1.1875rem;
	font-weight: 600;
	line-height: 1.3;
	list-style: none;
	cursor: pointer;
}

.k-menu__dialog .k-menu__summary::-webkit-details-marker {
	display: none;
}

.k-menu__dialog .k-menu__summary::after {
	content: "";
	flex: none;
	width: 0.5rem;
	height: 0.5rem;
	border-top: 2px solid currentColor;
	border-right: 2px solid currentColor;
	opacity: 0.55;
	transform: rotate(135deg);
}

.k-menu__dialog .k-menu__more[open] .k-menu__summary::after {
	transform: translateY(0.2rem) rotate(-45deg);
}

.k-menu__dialog .k-menu__summary:hover {
	color: var(--k-brand-ink);
}

.k-menu__dialog .k-menu__summary:focus-visible {
	outline: 2px solid var(--k-brand);
	outline-offset: 2px;
	border-radius: var(--k-radius);
}

.k-menu__dialog .k-menu__body {
	padding: 0 0 0.75rem;
}

.k-menu__dialog .k-menu__subheading {
	max-width: none;
	margin: 0.75rem 0 0.125rem;
	padding: 0;
	color: var(--k-brand-ink);
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.k-menu__dialog .k-menu__sublist {
	max-width: none;
	margin: 0;
	padding: 0;
	list-style: none;
}

.k-menu__dialog .k-menu__more .k-menu__item {
	border-bottom: 0;
}

.k-menu__dialog .k-menu__more .k-menu__link {
	min-height: 3rem;
	padding: 0.5rem 0 0.5rem 0.75rem;
	font-size: 1.0625rem;
	font-weight: 500;
}

.k-menu__dialog .k-menu__more .k-menu__link::after {
	content: none;
}

/* A video's words, with a small play mark before them. */
.k-menu__dialog .k-menu__more .k-video__play {
	justify-content: flex-start;
	gap: 0.5rem;
}

.k-menu__dialog .k-menu__more .k-video__play::before {
	content: "";
	flex: none;
	width: 0;
	height: 0;
	border-block: 0.3125rem solid transparent;
	border-inline-start: 0.5rem solid currentColor;
}

/* The practice's own two actions, pinned to the foot of the panel. */
.k-menu__dialog .k-menu__actions {
	display: grid;
	gap: 0.75rem;
	margin-top: auto;
	padding-top: 2rem;
}

.k-menu__dialog .k-menu__actions:empty {
	display: none;
}

.k-menu__dialog .k-menu__actions .k-menu__link {
	justify-content: center;
	min-height: 3.5rem;
	padding: 0.75rem 1.5rem;
	border: 2px solid transparent;
	border-radius: var(--k-radius-lg);
	font-size: 1.0625rem;
	font-weight: 700;
	text-align: center;
}

.k-menu__dialog .k-menu__actions .k-menu__link--book {
	background: var(--k-go);
	color: var(--k-on-brand);
}

.k-menu__dialog .k-menu__actions .k-menu__link--book:hover {
	background: color-mix(in srgb, var(--k-go) 82%, #000);
	color: var(--k-on-brand);
}

.k-menu__dialog .k-menu__actions .k-menu__link--call {
	border-color: var(--k-brand-ink);
	background: transparent;
	color: var(--k-brand-ink);
}

.k-menu__dialog .k-menu__actions .k-menu__link--call:hover {
	background: color-mix(in srgb, var(--k-brand) 10%, transparent);
	color: var(--k-brand-ink);
}

/* The page stays put behind the open menu. */
html.k-menu-open {
	overflow: hidden;
}

/* Phone: the panel takes the whole window. */
@media (max-width: 479.98px) {
	.k-menu__dialog.k-menu__dialog {
		width: 100%;
		border-radius: 0;
	}
}

/* Slides in from the edge, and the shade fades up; with less motion, neither. */
@media (prefers-reduced-motion: no-preference) {
	.k-menu__dialog[open] {
		animation: k-menu-in 0.24s cubic-bezier(0.2, 0.7, 0.2, 1);
	}

	.k-menu__dialog[open]::backdrop {
		animation: k-menu-shade 0.24s ease-out;
	}

	.k-menu__dialog .k-menu__link,
	.k-menu__dialog .k-menu__summary {
		transition: color 0.2s ease, background-color 0.2s ease;
	}

	.k-menu__dialog .k-menu__summary::after {
		transition: transform 0.2s ease;
	}
}

@keyframes k-menu-in {
	from {
		opacity: 0;
		transform: translateX(1.5rem);
	}
}

@keyframes k-menu-shade {
	from {
		opacity: 0;
	}
}

/* The footer's menu: each group a block in a column, its heading the
   footer's own label, a smaller muted subheading above each list. */
.k-footer .k-footer__group {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	min-width: 0;
}

.k-footer .k-footer__group .k-footer__label {
	margin-bottom: 0.25rem;
}

.k-footer .k-footer__subheading {
	margin-top: 0.5rem;
	color: var(--k-muted);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.k-footer .k-footer__menu {
	display: flex;
	flex-direction: column;
	gap: 0.125rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.k-footer .k-footer__item {
	margin: 0;
	padding: 0;
}

/* ------------------------------------------------------------ Contact menu */

/*
 * The header's Book button made a contact menu by Meld (SE_Home_Actions):
 * the Book link kept for browsers without popovers, the button that opens the
 * panel, and the panel, all in one wrapper that takes no box of its own, so
 * the header's row of buttons lays them out as before. The sheet shows the
 * link or the button, never both; the header's own display for its buttons
 * would otherwise show both, hence !important.
 */
.k-ctamenu {
	display: contents;
}

@supports selector(:popover-open) {
	.k-ctamenu .k-ctamenu__fallback {
		display: none !important;
	}
}

@supports not selector(:popover-open) {
	.k-ctamenu .k-ctamenu__open,
	.k-ctamenu .k-ctamenu__panel {
		display: none !important;
	}
}

.k-ctamenu .k-ctamenu__open {
	cursor: pointer;
}

/* The chevron after the words, from the text's own colour. */
.k-ctamenu .k-ctamenu__chev {
	display: inline-block;
	flex: none;
	width: 0.75rem;
	height: 0.75rem;
	margin: 0 0 0 0.375rem;
	transform: translateY(0.05em);
}

.k-ctamenu .k-ctamenu__open[aria-expanded="true"] .k-ctamenu__chev {
	transform: rotate(180deg);
}

/*
 * The panel, as the dropdowns' panel: hidden here and shown only open, in the
 * top layer, placed under the button by kit-menu.js. One column of links.
 */
.k-ctamenu .k-ctamenu__panel {
	display: none;
	position: fixed;
	box-sizing: border-box;
	inset: auto;
	width: max-content;
	min-width: 14rem;
	max-width: min(22rem, calc(100vw - 32px));
	max-height: calc(100vh - 6rem);
	margin: 0;
	padding: 0.5rem;
	overflow: hidden auto;
	overscroll-behavior: contain;
	border: 1px solid var(--k-line);
	border-radius: var(--k-radius-lg);
	background: var(--k-bg);
	box-shadow: var(--k-shadow);
	color: var(--k-ink);
	font-family: var(--k-font-body);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: normal;
	text-align: left;
	text-transform: none;
	white-space: normal;
}

.k-ctamenu .k-ctamenu__panel.k-ctamenu__panel:popover-open {
	display: block;
}

.k-ctamenu .k-ctamenu__panel .k-ctamenu__list {
	display: block;
	max-width: none;
	margin: 0;
	padding: 0;
	list-style: none;
}

.k-ctamenu .k-ctamenu__panel .k-ctamenu__item {
	display: block;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* A link, or a button standing in for one (a video). */
.k-ctamenu .k-ctamenu__panel .k-ctamenu__link {
	position: static;
	display: flex;
	align-items: center;
	box-sizing: border-box;
	gap: 0.5rem;
	width: 100%;
	min-height: 2.75rem;
	margin: 0;
	padding: 0.5rem 0.75rem;
	appearance: none;
	border: 0;
	border-radius: var(--k-radius);
	background: none;
	box-shadow: none;
	color: var(--k-ink-strong);
	font-family: var(--k-font-body);
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: 1.35;
	text-align: left;
	text-decoration: none;
	white-space: normal;
	cursor: pointer;
	transform: none;
}

.k-ctamenu .k-ctamenu__panel .k-ctamenu__link:hover {
	background: color-mix(in srgb, var(--k-brand) 9%, transparent);
	color: var(--k-brand-ink);
}

.k-ctamenu .k-ctamenu__panel .k-ctamenu__link:focus-visible {
	background: color-mix(in srgb, var(--k-brand) 9%, transparent);
	color: var(--k-brand-ink);
	outline: 2px solid var(--k-brand-ink);
	outline-offset: -2px;
}

/* A small play mark before a video's words. */
.k-ctamenu .k-ctamenu__panel button.k-ctamenu__link::before {
	content: "";
	flex: none;
	width: 0;
	height: 0;
	border-block: 0.3125rem solid transparent;
	border-inline-start: 0.5rem solid currentColor;
}

/* --------------------------------------------------------- Social icons */

/* A row of round icon links: under the contact menu's links, and at the foot
   of the phone menu. */
.k-ctamenu .k-ctamenu__panel .k-social,
.k-menu__dialog .k-menu__foot .k-social {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
}

.k-ctamenu .k-ctamenu__panel .k-social {
	margin-top: 0.375rem;
	padding: 0.625rem 0.75rem 0.25rem;
	border-top: 1px solid var(--k-line);
}

.k-ctamenu .k-ctamenu__panel .k-social__link,
.k-menu__dialog .k-menu__foot .k-social__link {
	display: grid;
	flex: none;
	place-items: center;
	box-sizing: border-box;
	width: 2.75rem;
	height: 2.75rem;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--k-soft);
	box-shadow: none;
	color: var(--k-brand-ink);
	text-decoration: none;
	transform: none;
}

.k-ctamenu .k-ctamenu__panel .k-social__link:hover,
.k-menu__dialog .k-menu__foot .k-social__link:hover {
	background: color-mix(in srgb, var(--k-soft) 70%, var(--k-brand));
	color: var(--k-brand-ink);
}

.k-ctamenu .k-ctamenu__panel .k-social__link:focus-visible,
.k-menu__dialog .k-menu__foot .k-social__link:focus-visible {
	outline: 2px solid var(--k-brand-ink);
	outline-offset: 2px;
}

.k-ctamenu .k-ctamenu__panel .k-social__link svg,
.k-menu__dialog .k-menu__foot .k-social__link svg {
	display: block;
	width: 1.25rem;
	height: 1.25rem;
}

/* The hidden list's copy is only the dialog's source. */
.k-menu .k-menu__social {
	display: none;
}

.k-menu__dialog .k-menu__foot {
	padding-top: 1.25rem;
}

.k-menu__dialog .k-menu__foot[hidden] {
	display: none;
}

.k-menu__dialog .k-menu__actions:empty + .k-menu__foot {
	margin-top: auto;
}

/* ------------------------------------------------ The operator's buttons */

/*
 * A section's buttons set by the operator (data-k-action) may be more than
 * the single button a __cta paragraph was made to hold: two or more sit in a
 * wrapping row with a gap, rather than touching. A .k-ctas row is the kit's
 * own and already spaced.
 */
.k-sec [class*="__cta"]:not(.k-ctas):has(> [data-k-action] ~ [data-k-action]) {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
}

/* ------------------------------------------------- The rating in the trust */

/*
 * The hero's rating moved into the trust section's list by Meld
 * (homepage.rating_place = trust). Its item wears the class of the facts
 * beside it, so it takes their row and spacing; here it gets what a fact has
 * that the rating's markup does not: a tile before it (a star where a fact
 * has its icon), and words at the facts' size and weight. The stars stay as
 * a small line over the words.
 */
.k-trust .k-trust__fact--rating {
	display: flex;
	align-items: center;
	gap: 14px;
	min-width: 0;
}

.k-trust .k-trust__fact--rating::before {
	content: "\2605";
	display: grid;
	flex: 0 0 40px;
	place-items: center;
	width: 40px;
	height: 40px;
	border-radius: var(--k-radius);
	background: var(--k-accent-tile, var(--k-soft));
	color: var(--k-star);
	font-size: 1.25rem;
	line-height: 1;
}

.k-trust .k-trust__fact--rating .k-rating {
	display: block;
	min-width: 0;
	max-width: none;
	margin: 0;
	padding: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	font-size: 1rem;
}

.k-trust .k-trust__fact--rating .k-rating__link {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	row-gap: 2px;
	min-height: 44px;
	justify-content: center;
	padding: 0;
	color: var(--k-ink);
	white-space: normal;
}

.k-trust .k-trust__fact--rating .k-rating__stars {
	color: var(--k-star);
	font-size: 0.875rem;
	letter-spacing: 0.12em;
	line-height: 1;
}

.k-trust .k-trust__fact--rating .k-rating__text {
	color: var(--k-ink);
	font-weight: 500;
	line-height: 1.4;
}

.k-trust .k-trust__fact--rating .k-rating__link:focus-visible {
	border-radius: 4px;
	outline: 2px solid var(--k-brand);
	outline-offset: 3px;
}

/* A row of three facts has room for the rating as a fourth on a wide screen;
   a list laid out some other way ignores this. */
@media (min-width: 1100.02px) {
	.k-trust ul:has(> .k-trust__fact--rating) {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media print {
	.k-menu__open,
	.k-menu__dialog,
	.k-mainnav__panel,
	.k-ctamenu__panel {
		display: none !important;
	}
}

/* ---- The appointment form (SE_Renderer wraps the Gravity Forms output in
   section.se-form): the page's column, the site's fields and button. ---- */
.se-form {
	padding: clamp(2.5rem, 6vw, 4.5rem) var(--k-gutter, 16px);
	background: var(--k-band-a, transparent);
}
.se-form .se-form__inner {
	max-width: 46rem;
	margin: 0 auto;
}
.se-form .gform_wrapper,
.se-form .gform_wrapper.gform-theme {
	/* Gravity Forms prints its own colours per form under the form's id, so
	   these are the one place the site's tokens need !important to win. */
	--gf-color-primary: var(--k-brand, #1f5c57) !important;
	--gf-color-primary-contrast: var(--k-on-brand, #fff) !important;
	--gf-color-primary-darker: var(--k-deep, var(--k-brand, #1f5c57)) !important;
	--gf-color-in-ctrl-primary: var(--k-brand, #1f5c57) !important;
	--gf-ctrl-btn-bg-color-primary: var(--k-brand, #1f5c57) !important;
	--gf-ctrl-btn-bg-color-hover-primary: var(--k-deep, var(--k-brand, #1f5c57)) !important;
	--gf-ctrl-btn-color-primary: var(--k-on-brand, #fff) !important;
	--gf-ctrl-border-color: var(--k-line, rgba(28, 42, 43, 0.18));
	--gf-ctrl-radius: var(--k-radius, 12px);
	--gf-ctrl-btn-radius: 999px;
	--gf-font-family-base: var(--k-font-body, inherit);
	font-family: var(--k-font-body, inherit);
	color: var(--k-ink, inherit);
}
.se-form .gform_wrapper .gfield_label,
.se-form .gform_wrapper legend.gfield_label {
	color: var(--k-ink-strong, var(--k-ink, inherit));
	font-weight: 600;
}
.se-form .gform_wrapper input[type="text"],
.se-form .gform_wrapper input[type="email"],
.se-form .gform_wrapper input[type="tel"],
.se-form .gform_wrapper textarea {
	width: 100%;
	padding: 0.75rem 0.9rem;
	border: 1px solid var(--k-line, rgba(28, 42, 43, 0.18));
	border-radius: var(--k-radius, 12px);
	background: var(--k-bg, #fff);
	color: var(--k-ink, inherit);
	font: inherit;
	box-shadow: none;
}
.se-form .gform_wrapper input:focus-visible,
.se-form .gform_wrapper textarea:focus-visible {
	outline: 2px solid var(--k-brand, #1f5c57);
	outline-offset: 2px;
	border-color: var(--k-brand, #1f5c57);
}
.se-form .gform_wrapper .gform_footer input[type="submit"],
.se-form .gform_wrapper .gform_footer button,
.se-form .gform_wrapper .gform_button {
	appearance: none;
	border: 0;
	border-radius: 999px;
	padding: 0.85rem 1.75rem;
	background: var(--k-brand, #1f5c57);
	color: var(--k-on-brand, #fff);
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}
.se-form .gform_wrapper .gform_footer input[type="submit"]:hover,
.se-form .gform_wrapper .gform_button:hover {
	filter: brightness(1.08);
}
.se-form .gform_wrapper .gfield_required {
	color: var(--k-muted, inherit);
	font-weight: 400;
}

/* The number beside a contact menu's call item. */
.k-ctamenu .k-ctamenu__num {
	display: block;
	font-size: 0.86em;
	color: var(--k-muted, inherit);
	font-variant-numeric: tabular-nums;
}

/* The whole menu as a site map in a rebuilt footer (SE_Home_Actions::
   footer_sitemap), in the footer's own colours. */
.k-footer .k-footer__sitemap {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
	gap: 1.75rem 2rem;
	margin-top: clamp(1.5rem, 4vw, 2.5rem);
	padding-top: clamp(1.5rem, 4vw, 2.5rem);
	border-top: 1px solid color-mix(in srgb, currentColor 18%, transparent);
	color: inherit;
}
.k-footer .k-footer__sitemap .k-footer__group {
	min-width: 0;
}
.k-footer .k-footer__sitemap .k-footer__label {
	margin: 0 0 0.6rem;
	font-size: 0.78rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	opacity: 0.75;
	color: inherit;
}
.k-footer .k-footer__sitemap .k-footer__subheading {
	margin: 0.9rem 0 0.35rem;
	font-size: 0.86rem;
	font-weight: 600;
	color: inherit;
}
.k-footer .k-footer__sitemap .k-footer__menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.35rem;
}
.k-footer .k-footer__sitemap .k-footer__link {
	color: inherit;
	text-decoration: none;
	opacity: 0.9;
	font-size: 0.95rem;
}
.k-footer .k-footer__sitemap .k-footer__link:hover,
.k-footer .k-footer__sitemap .k-footer__link:focus-visible {
	opacity: 1;
	text-decoration: underline;
	text-underline-offset: 3px;
}
.k-sec.k-footer .k-footer__sitemap a.k-footer__link {
	display: inline-block;
	min-height: 0;
	padding: 0.15rem 0;
	line-height: 1.4;
}
@media (pointer: coarse) {
	.k-sec.k-footer .k-footer__sitemap a.k-footer__link {
		min-height: 2.25rem;
		padding: 0.45rem 0;
	}
}

/* A list of quotes scrolling up the page in a loop (SE_Home_Actions::vertical_scroll).
   The reel holds the quotes twice and moves by half its height, so the
   second copy lands where the first began. Paused while pointed at or
   focused, and still (with its own scrollbar) for reduced motion. */
.k-sec .k-vscroll {
	position: relative;
	height: var(--k-vscroll-h, 30rem);
	overflow: hidden;
	-webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 12%, #000 88%, transparent 100%);
	mask-image: linear-gradient(to bottom, transparent 0, #000 12%, #000 88%, transparent 100%);
}
.k-sec .k-vscroll__reel {
	display: flow-root;
	animation: k-vscroll calc(var(--k-vscroll-n, 3) * 8s) linear infinite;
	will-change: transform;
}
.k-sec .k-vscroll__track {
	display: flow-root;
	padding-bottom: 2.5rem;
	margin-bottom: 2.5rem;
	border-bottom: 1px solid color-mix(in srgb, currentColor 18%, transparent);
}
.k-sec .k-vscroll:hover .k-vscroll__reel,
.k-sec .k-vscroll:focus-within .k-vscroll__reel {
	animation-play-state: paused;
}
@keyframes k-vscroll {
	from { transform: translateY(0); }
	to { transform: translateY(-50%); }
}
@media (max-width: 767px) {
	.k-sec .k-vscroll {
		--k-vscroll-h: 26rem;
	}
}
@media (prefers-reduced-motion: reduce) {
	.k-sec .k-vscroll {
		overflow-y: auto;
	}
	.k-sec .k-vscroll__reel {
		animation: none;
	}
	.k-sec .k-vscroll__track[aria-hidden="true"] {
		display: none;
	}
}