/*
 * RPCN Search: the box in the page title band, and the page not found
 * screen. Loaded on every page, so it is kept small. The panel's style
 * loads the first time someone uses the box.
 *
 * Colours and type follow the site: teal #007F7B, cream #F8F7F3, Roboto and
 * Roboto Condensed. Rules are doubled up (.rpcns-box.rpcns-box) where the
 * theme or Elementor style plain links, so the box looks the same on every
 * page.
 */

/* The title band holding the box. Long page names stay clear of it. */
.rpcns-host {
	position: relative;
	--rpcns-room: 456px;
}

.rpcns-host h1 {
	padding-right: var(--rpcns-room);
}

.rpcns-box {
	position: absolute;
	top: 50%;
	right: 0;
	z-index: 5;
	display: flex;
	align-items: center;
	transform: translateY(-50%);
}

.rpcns-box[hidden] {
	display: none;
}

.rpcns-box.rpcns-box--wide {
	position: relative;
	top: auto;
	right: auto;
	display: block;
	max-width: 640px;
	margin: 0 0 8px;
	transform: none;
}

/* The border is dark enough to stand out 3 to 1 from the white field and
   the cream band (WCAG 1.4.11). */
.rpcns-box.rpcns-box a.rpcns-box__field {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	gap: 10px;
	width: 430px;
	height: 48px;
	margin: 0;
	padding: 0 8px 0 14px;
	border: 1.5px solid #928d81;
	border-radius: 4px;
	background: #fff;
	box-shadow: none;
	color: #6f6f6f;
	font: 400 16px/1 Roboto, Arial, sans-serif;
	letter-spacing: 0;
	text-decoration: none;
	text-transform: none;
	cursor: text;
}

.rpcns-box.rpcns-box--wide a.rpcns-box__field {
	width: 100%;
	height: 56px;
	padding: 0 10px 0 18px;
	font-size: 17px;
}

.rpcns-box.rpcns-box a.rpcns-box__field:hover {
	border-color: #007f7b;
	color: #6f6f6f;
}

.rpcns-box.rpcns-box a:focus-visible {
	outline: 3px solid #007f7b;
	outline-offset: 2px;
}

.rpcns-box .rpcns-ic {
	flex: none;
	color: #007f7b;
}

.rpcns-box .rpcns-box__text {
	flex: 1;
	color: #6f6f6f;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* The shortcut shows once the script is in and knows the keyboard. */
.rpcns-box .rpcns-box__key[hidden] {
	display: none;
}

.rpcns-box .rpcns-box__key {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 24px;
	height: 24px;
	padding: 0 6px;
	border: 1px solid #d9d5cb;
	border-bottom-width: 2px;
	border-radius: 4px;
	background: #fafaf8;
	color: #5f5f5f;
	font: 500 12px/1 Roboto, Arial, sans-serif;
}

.rpcns-box.rpcns-box a.rpcns-box__round {
	box-sizing: border-box;
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: 0;
	padding: 0;
	border: 1.5px solid #8c877c;
	border-radius: 50%;
	background: #fff;
	color: #00615e;
	text-decoration: none;
}

.rpcns-box.rpcns-box a.rpcns-box__round .rpcns-ic {
	color: #00615e;
}

/* While the panel loads, the magnifier pulses. */
.rpcns-box--busy a {
	cursor: progress;
}

.rpcns-box--busy .rpcns-ic {
	animation: rpcns-pulse 0.9s ease-in-out infinite alternate;
}

@keyframes rpcns-pulse {
	from {
		opacity: 1;
	}

	to {
		opacity: 0.35;
	}
}

@media (prefers-reduced-motion: reduce) {
	.rpcns-box--busy .rpcns-ic {
		animation: none;
		opacity: 0.6;
	}
}

@media (min-width: 761px) and (max-width: 1099px) {
	.rpcns-host {
		--rpcns-room: calc(min(430px, 44vw) + 26px);
	}

	.rpcns-box.rpcns-box a.rpcns-box__field {
		width: min(430px, 44vw);
	}
}

@media (max-width: 760px) {
	.rpcns-host {
		--rpcns-room: 56px;
	}

	.rpcns-box.rpcns-box a.rpcns-box__field {
		display: none;
	}

	.rpcns-box.rpcns-box a.rpcns-box__round {
		display: inline-flex;
	}

	.rpcns-box.rpcns-box--wide a.rpcns-box__field {
		display: flex;
		height: 52px;
		font-size: 16px;
	}

	.rpcns-box--wide .rpcns-box__key {
		display: none;
	}
}

/* Page not found. Where the site's Elementor template draws the banner and
   title band, its empty content area, where a page's own words would go,
   is hidden, and the screen's own words follow the band. */
.rpcns-nf-page .elementor-location-single > .e-con:last-child:not(:has(.elementor-widget)) {
	display: none;
}

/* Without that template, the screen's own band matches the cream title
   band on every page. */
.rpcns-nf__band {
	background: #f8f7f3;
}

.rpcns-nf__in,
.rpcns-nf__body {
	box-sizing: border-box;
	max-width: 1080px;
	margin: 0 auto;
	padding: 15px 20px 16px;
}

.rpcns-nf .rpcns-nf__title {
	margin: 0;
	padding: 0;
	color: #415a3e;
	font: 500 36px/1.4 "Roboto Condensed", "Arial Narrow", Arial, sans-serif;
	letter-spacing: 0;
	text-transform: uppercase;
}

.rpcns-nf__body {
	padding-top: 40px;
	padding-bottom: 64px;
	color: #555;
	font: 400 16px/1.6 Roboto, Arial, sans-serif;
}

.rpcns-nf .rpcns-nf__lede {
	margin: 0 0 22px;
	color: #333;
	font-size: 18px;
}

.rpcns-nf .rpcns-nf__h2 {
	margin: 36px 0 14px;
	padding: 0;
	color: #415a3e;
	font: 500 15px/1.2 "Roboto Condensed", "Arial Narrow", Arial, sans-serif;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.rpcns-nf .rpcns-nf__links {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.rpcns-nf .rpcns-nf__links li {
	margin: 0;
	padding: 0;
}

.rpcns-nf .rpcns-nf__links a {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 18px;
	border: 1.5px solid #007f7b;
	border-radius: 22px;
	background: #fff;
	color: #00615e;
	font: 500 14px/1 "Roboto Condensed", "Arial Narrow", Arial, sans-serif;
	letter-spacing: 1px;
	text-decoration: none;
	text-transform: uppercase;
}

.rpcns-nf .rpcns-nf__links a:hover {
	background: #eef6f5;
}

.rpcns-nf .rpcns-nf__links a:focus-visible,
.rpcns-nf .rpcns-nf__help a:focus-visible {
	outline: 3px solid #007f7b;
	outline-offset: 2px;
}

.rpcns-nf .rpcns-nf__help {
	margin: 30px 0 0;
}

.rpcns-nf .rpcns-nf__help a {
	color: #00615e;
	font-weight: 500;
	text-decoration: underline;
}

@media (max-width: 760px) {
	.rpcns-nf .rpcns-nf__title {
		font-size: 30px;
	}

	.rpcns-nf__body {
		padding-top: 24px;
	}
}