/* =========================================================================
   Chauncey Sjostedt Header & Footer
   -------------------------------------------------------------------------
   SCOPING CONTRACT
   Every selector in this file begins with .csj-hdr, .csj-ftr or
   .csj-hdr-spacer. There are no rules on html, body, *, or any bare element
   selector, so this stylesheet cannot affect Elementor, the theme, or any
   other content on the page.
   Conversely every element inside the widgets has its inherited typography,
   spacing and box model reset locally, so Elementor and theme styles cannot
   affect the widgets either.
   All inner class names carry the csj- prefix, so they cannot collide with
   theme or plugin classes.
   ========================================================================= */

/* -------------------------------------------------------------------------
   HEADER
   ---------------------------------------------------------------------- */
.csj-hdr {
	--csj-ink: #2B382F;
	--csj-body: #4A554D;
	--csj-muted: #5F6A63;
	--csj-sand: #F5F0E7;
	--csj-cream: #FFFDF9;
	--csj-sage: #E6ECE3;
	--csj-rose: #A6415A;
	--csj-rose-d: #8A3149;
	--csj-line: #E3DBCF;
	--csj-h: 78px;
	--csj-z: 9990;
	--csj-dis: "Fraunces", Georgia, "Times New Roman", serif;
	--csj-txt: "Karla", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

	position: relative;
	display: block;
	margin: 0;
	padding: 0;
	font-family: var(--csj-txt);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: normal;
	text-transform: none;
	color: var(--csj-ink);
	background: rgba(255, 253, 249, .94);
	-webkit-backdrop-filter: saturate(1.6) blur(10px);
	backdrop-filter: saturate(1.6) blur(10px);
	box-sizing: border-box;

	/* Neutralise anything a theme may have put on the <header> element. */
	border: 0;
	border-bottom: 1px solid var(--csj-line);
	border-radius: 0;
	box-shadow: none;
	outline: 0;
	text-align: left;
	float: none;
	width: auto;
	max-width: none;
	min-height: 0;
	transform: none;
	opacity: 1;
	visibility: visible;
}

.csj-hdr.is-fixed {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: var(--csj-z);
}

/* Reserve the header height when the page content does not already do it. */
.csj-hdr-spacer {
	display: block;
	height: 78px;
	margin: 0;
	padding: 0;
	pointer-events: none;
}

/* Local reset. Stops Elementor and theme rules leaking in. */
.csj-hdr *,
.csj-hdr *::before,
.csj-hdr *::after {
	box-sizing: border-box;
}

.csj-hdr a,
.csj-hdr p,
.csj-hdr ul,
.csj-hdr ol,
.csj-hdr li,
.csj-hdr span,
.csj-hdr div,
.csj-hdr nav,
.csj-hdr button,
.csj-hdr b,
.csj-hdr strong,
.csj-hdr em,
.csj-hdr h1,
.csj-hdr h2,
.csj-hdr h3,
.csj-hdr h4,
.csj-hdr svg,
.csj-hdr figure {
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	background-color: transparent;
	box-shadow: none;
	outline: 0;
	float: none;
	color: inherit;
	font-family: inherit;
	font-weight: inherit;
	font-style: normal;
	letter-spacing: inherit;
	line-height: inherit;
	text-transform: none;
	text-decoration: none;
	text-align: inherit;
	text-shadow: none;
	transform: none;
	min-width: 0;
	min-height: 0;
	max-width: none;
}

.csj-hdr a:hover,
.csj-hdr a:focus,
.csj-hdr a:active {
	text-decoration: none;
	box-shadow: none;
	outline: 0;
}

.csj-hdr ul {
	list-style: none;
}

.csj-hdr button {
	font: inherit;
	color: inherit;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
}

.csj-hdr img,
.csj-hdr svg {
	display: block;
	max-width: 100%;
	height: auto;
}

.csj-hdr .csj-wrap {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 24px;
	/* minus the 1px bottom border, so the header measures exactly --csj-h
	   and the page offset / spacer line up to the pixel. */
	height: calc(var(--csj-h) - 1px);
	display: flex;
	align-items: center;
	gap: 20px;
}

/* Brand ---------------------------------------------------------------- */
.csj-hdr .csj-brand {
	display: flex;
	align-items: center;
	gap: 11px;
	margin-right: auto;
	min-width: 0;
	text-decoration: none;
}

.csj-hdr .csj-fl {
	width: 30px;
	height: 30px;
	flex: 0 0 30px;
	color: var(--csj-rose);
}

.csj-hdr .csj-fl-p { fill: currentColor; opacity: .9; }
.csj-hdr .csj-fl-c { fill: #D9C489; }

.csj-hdr .csj-bt {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.csj-hdr .csj-bn {
	font-family: var(--csj-dis);
	font-weight: 600;
	font-size: 19px;
	line-height: 1.15;
	letter-spacing: -.01em;
	color: var(--csj-ink);
	white-space: nowrap;
}

.csj-hdr .csj-bs {
	font-size: 10.5px;
	font-weight: 400;
	letter-spacing: .15em;
	text-transform: uppercase;
	color: var(--csj-muted);
	margin-top: 2px;
	white-space: nowrap;
}

/* Desktop nav ---------------------------------------------------------- */
.csj-hdr .csj-nav {
	display: flex;
	align-items: center;
	gap: 4px;
}

.csj-hdr .csj-nav a {
	display: block;
	padding: 9px 14px;
	background: transparent;
	border-radius: 999px;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.4;
	color: var(--csj-body);
	transition: background .18s ease, color .18s ease;
}

.csj-hdr .csj-nav a:hover,
.csj-hdr .csj-nav a:focus-visible {
	background: var(--csj-sage);
	color: var(--csj-ink);
}

.csj-hdr .csj-nav a.csj-on {
	color: var(--csj-rose);
	font-weight: 600;
}

/* Button --------------------------------------------------------------- */
.csj-hdr .csj-cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 21px;
	border-radius: 999px;
	background: var(--csj-rose);
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.4;
	border: 1px solid var(--csj-rose);
	transition: background .18s ease, transform .18s ease;
	white-space: nowrap;
}

.csj-hdr .csj-cta:hover,
.csj-hdr .csj-cta:focus-visible {
	background: var(--csj-rose-d);
	color: #fff;
	transform: translateY(-1px);
}

.csj-hdr .csj-cta svg {
	width: 14px;
	height: 14px;
	flex: 0 0 14px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
}

/* Burger --------------------------------------------------------------- */
.csj-hdr .csj-burger {
	display: none;
	width: 44px;
	height: 44px;
	flex: 0 0 44px;
	border-radius: 12px;
	border: 1px solid var(--csj-line);
	align-items: center;
	justify-content: center;
	background: transparent;
}

.csj-hdr .csj-burger span {
	display: block;
	width: 19px;
	height: 2px;
	background: var(--csj-ink);
	border-radius: 2px;
	position: relative;
	transition: background .18s ease;
}

.csj-hdr .csj-burger span::before,
.csj-hdr .csj-burger span::after {
	content: "";
	position: absolute;
	left: 0;
	width: 19px;
	height: 2px;
	background: var(--csj-ink);
	border-radius: 2px;
	transition: transform .22s ease, top .22s ease;
}

.csj-hdr .csj-burger span::before { top: -6px; }
.csj-hdr .csj-burger span::after  { top: 6px; }

.csj-hdr .csj-burger[aria-expanded="true"] span { background: transparent; }
.csj-hdr .csj-burger[aria-expanded="true"] span::before { top: 0; transform: rotate(45deg); }
.csj-hdr .csj-burger[aria-expanded="true"] span::after  { top: 0; transform: rotate(-45deg); }

/* Mobile panel --------------------------------------------------------- */
.csj-hdr .csj-panel {
	display: none;
	border-top: 1px solid var(--csj-line);
	background: var(--csj-cream);
	padding: 14px 24px 22px;
	max-height: calc(100vh - var(--csj-h));
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

/* The [hidden] attribute is the source of truth; .is-open reveals it. */
.csj-hdr .csj-panel[hidden] { display: none; }
.csj-hdr .csj-panel.is-open { display: block; }

.csj-hdr .csj-panel a {
	display: block;
	padding: 13px 4px;
	font-size: 17px;
	font-weight: 500;
	line-height: 1.4;
	color: var(--csj-body);
	border-bottom: 1px solid var(--csj-line);
}

.csj-hdr .csj-panel a.csj-on {
	color: var(--csj-rose);
	font-weight: 600;
}

.csj-hdr .csj-panel .csj-pcta {
	display: block;
	margin-top: 16px;
	padding: 14px 20px;
	border-radius: 999px;
	background: var(--csj-rose);
	color: #fff;
	text-align: center;
	font-weight: 600;
	border-bottom: 0;
}

.csj-hdr .csj-pmeta {
	margin-top: 16px;
	font-size: 13.5px;
	color: var(--csj-muted);
	line-height: 1.65;
}

.csj-hdr .csj-pmeta p { margin: 0; }
.csj-hdr .csj-pmeta b { color: var(--csj-ink); font-weight: 600; }

/* Skip link ------------------------------------------------------------ */
.csj-hdr .csj-skip {
	position: absolute;
	left: -9999px;
	top: 0;
	padding: 10px 16px;
	background: var(--csj-ink);
	color: #fff;
	border-radius: 0 0 8px 0;
	font-size: 15px;
}

.csj-hdr .csj-skip:focus {
	left: 0;
	z-index: 5;
	color: #fff;
}

/* Inside the Elementor editor the header is never fixed, so it cannot
   cover the canvas or trap the editing handles. */
.csj-hdr.is-editing {
	position: relative !important;
	top: auto !important;
}

@media (max-width: 1000px) {
	.csj-hdr .csj-nav,
	.csj-hdr .csj-cta { display: none; }
	.csj-hdr .csj-burger { display: flex; }
}

@media (max-width: 600px) {
	.csj-hdr { --csj-h: 66px; }
	.csj-hdr-spacer { height: 66px; }
	.csj-hdr .csj-wrap { padding: 0 16px; gap: 12px; }
	.csj-hdr .csj-bn { font-size: 17px; }
	.csj-hdr .csj-bs { font-size: 9.5px; letter-spacing: .12em; }
	.csj-hdr .csj-fl { width: 26px; height: 26px; flex: 0 0 26px; }
	.csj-hdr .csj-panel { padding: 12px 16px 20px; }
}

@media (prefers-reduced-motion: reduce) {
	.csj-hdr *,
	.csj-hdr *::before,
	.csj-hdr *::after { transition: none !important; }
}

/* -------------------------------------------------------------------------
   FOOTER
   ---------------------------------------------------------------------- */
.csj-ftr {
	--csj-rose: #A6415A;
	--csj-rose-l: #D98BA0;
	--csj-fline: rgba(255, 253, 249, .16);
	--csj-dis: "Fraunces", Georgia, "Times New Roman", serif;
	--csj-txt: "Karla", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

	display: block;
	margin: 0;
	padding: 0;
	font-family: var(--csj-txt);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.6;
	letter-spacing: normal;
	text-transform: none;
	background: #23302A;
	color: #D6DCD5;
	box-sizing: border-box;

	/* Neutralise anything a theme may have put on the <footer> element. */
	border: 0;
	border-radius: 0;
	box-shadow: none;
	outline: 0;
	text-align: left;
	float: none;
	width: auto;
	max-width: none;
	min-height: 0;
	transform: none;
	opacity: 1;
	visibility: visible;
}

.csj-ftr *,
.csj-ftr *::before,
.csj-ftr *::after {
	box-sizing: border-box;
}

.csj-ftr a,
.csj-ftr p,
.csj-ftr ul,
.csj-ftr ol,
.csj-ftr li,
.csj-ftr span,
.csj-ftr div,
.csj-ftr h2,
.csj-ftr h3,
.csj-ftr h4,
.csj-ftr b,
.csj-ftr strong,
.csj-ftr em,
.csj-ftr svg,
.csj-ftr figure {
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	background-color: transparent;
	box-shadow: none;
	outline: 0;
	float: none;
	color: inherit;
	font-family: inherit;
	font-weight: inherit;
	font-style: normal;
	letter-spacing: inherit;
	line-height: inherit;
	text-transform: none;
	text-decoration: none;
	text-align: inherit;
	text-shadow: none;
	transform: none;
	min-width: 0;
	max-width: none;
}

.csj-ftr a:hover,
.csj-ftr a:focus,
.csj-ftr a:active {
	text-decoration: none;
	box-shadow: none;
	outline: 0;
}

.csj-ftr ul { list-style: none; }
.csj-ftr h2, .csj-ftr h3 { font-weight: 600; }

.csj-ftr img,
.csj-ftr svg {
	display: block;
	max-width: 100%;
	height: auto;
}

.csj-ftr .csj-fwrap {
	max-width: 1200px;
	margin: 0 auto;
	padding: 66px 24px 30px;
}

.csj-ftr .csj-fgrid {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.25fr);
	gap: 44px 36px;
	align-items: start;
}

.csj-ftr .csj-fcol { min-width: 0; }

.csj-ftr .csj-fbrand {
	display: flex;
	align-items: center;
	gap: 11px;
	margin-bottom: 16px;
}

.csj-ftr .csj-fl {
	width: 32px;
	height: 32px;
	flex: 0 0 32px;
	color: var(--csj-rose-l);
}

.csj-ftr .csj-fl-p { fill: currentColor; opacity: .92; }
.csj-ftr .csj-fl-c { fill: #E3D2A2; }

.csj-ftr .csj-fbn {
	display: block;
	font-family: var(--csj-dis);
	font-size: 20px;
	font-weight: 600;
	color: #FFFDF9;
	line-height: 1.15;
}

.csj-ftr .csj-fbs {
	display: block;
	font-size: 10.5px;
	letter-spacing: .15em;
	text-transform: uppercase;
	color: #93A099;
	margin-top: 3px;
}

.csj-ftr .csj-fblurb {
	font-size: 14.5px;
	color: #AAB5AD;
	max-width: 38ch;
	margin-bottom: 18px;
}

.csj-ftr .csj-fmail {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 10px 17px;
	font-weight: 400;
	border: 1px solid var(--csj-fline);
	border-radius: 999px;
	font-size: 14.5px;
	color: #FFFDF9;
	transition: background .18s ease, border-color .18s ease;
	word-break: break-all;
}

.csj-ftr .csj-fmail:hover,
.csj-ftr .csj-fmail:focus-visible {
	background: rgba(255, 253, 249, .09);
	border-color: rgba(255, 253, 249, .34);
	color: #FFFDF9;
}

.csj-ftr .csj-fmail svg {
	width: 15px;
	height: 15px;
	flex: 0 0 15px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
}

.csj-ftr .csj-fh {
	font-family: var(--csj-txt);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #8E9B93;
	margin-bottom: 15px;
}

.csj-ftr .csj-flist li + li { margin-top: 10px; }

.csj-ftr .csj-flist a {
	font-size: 14.5px;
	font-weight: 400;
	color: #C7D0C8;
	transition: color .18s ease;
}

.csj-ftr .csj-flist a:hover,
.csj-ftr .csj-flist a:focus-visible { color: #FFFDF9; }

.csj-ftr .csj-fplain li {
	font-size: 14.5px;
	color: #C7D0C8;
}

.csj-ftr .csj-floc li + li { margin-top: 15px; }

.csj-ftr .csj-floc b {
	display: block;
	font-size: 14.5px;
	color: #FFFDF9;
	font-weight: 600;
}

.csj-ftr .csj-floc span {
	display: block;
	font-size: 13.5px;
	color: #9DA9A1;
	margin-top: 2px;
}

.csj-ftr .csj-ack {
	margin-top: 44px;
	padding: 22px 26px;
	border-radius: 16px;
	background: rgba(255, 253, 249, .05);
	border: 1px solid var(--csj-fline);
	font-size: 13.5px;
	color: #AAB5AD;
	line-height: 1.72;
}

.csj-ftr .csj-ack b { color: #FFFDF9; font-weight: 600; }

.csj-ftr .csj-fbot {
	margin-top: 26px;
	padding-top: 22px;
	border-top: 1px solid var(--csj-fline);
	display: flex;
	flex-wrap: wrap;
	gap: 10px 26px;
	align-items: center;
	font-size: 13px;
	color: #8E9B93;
}

.csj-ftr .csj-fbot .csj-pac { color: #C7D0C8; }
.csj-ftr .csj-fbot .csj-sp { margin-left: auto; }

@media (max-width: 960px) {
	.csj-ftr .csj-fgrid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 38px 30px;
	}
}

@media (max-width: 600px) {
	.csj-ftr .csj-fwrap { padding: 48px 16px 26px; }
	.csj-ftr .csj-fgrid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
	.csj-ftr .csj-fbot .csj-sp { margin-left: 0; }
	.csj-ftr .csj-ack { padding: 18px 18px; }
}

@media (prefers-reduced-motion: reduce) {
	.csj-ftr *,
	.csj-ftr *::before,
	.csj-ftr *::after { transition: none !important; }
}