/* ==========================================================================
   Moonrise — base, type, buttons, header, footer
   Every value is a theme.json preset (--wp--preset--*) or custom token
   (--wp--custom--*). Section rules are in sections.css; motion in motion.css.
   ========================================================================== */

:root {
	--mr-wide: var(--wp--style--global--wide-size, 1342px);
	--mr-gutter: var(--wp--preset--spacing--20);
	/* Panels (concerns, CTA, footer card) sit a little wider than the copy. */
	--mr-panel: calc(var(--mr-wide) + 2 * var(--wp--custom--panel-overhang, 20px));
	--mr-ease: var(--wp--custom--motion--ease, cubic-bezier(0.22, 1, 0.36, 1));
	--fwf--header--height: var(--wp--custom--header-height, 6.4rem);
	--fwf--button--radius: var(--wp--custom--radius--sm, 4px);
	--fwf--logo--height: var(--wp--custom--logo-height, 58px);
	--fwf--logo--height-mobile: var(--wp--custom--logo-height-mobile, 42px);
}

/* --------------------------------------------------------------------------
   Page
   -------------------------------------------------------------------------- */

body {
	background: var(--wp--preset--color--canvas);
	color: var(--wp--preset--color--contrast);
	font-family: var(--wp--preset--font-family--body);
	/* Inter at its text optical size, as the comp sets it. Automatic sizing
	   picks a tighter cut at 19px. Fraunces opts back in below. */
	font-optical-sizing: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

/* The page is shaded just under the hero, lightens, turns cream further
   down, and warms toward peach behind the call to action and footer. */
.mr-builder-page .site__main {
	background:
		var(--wp--preset--gradient--page-dusk) bottom / 100% var(--wp--custom--dusk-height, 900px) no-repeat,
		var(--wp--preset--gradient--page);
}

.mr-container {
	width: 100%;
	max-width: calc(var(--mr-wide) + 2 * var(--mr-gutter));
	margin-inline: auto;
	padding-inline: var(--mr-gutter);
}

/* The parent's layout.css caps every direct child of the post content at the
   820px content width. On a WPBakery page that child is WPBakery's own
   .wpb-content-wrapper around the whole page, so the cap squeezed every
   section into one narrow column. The same sheet pads the post content by a
   gutter, which kept the hero and testimonials off the page edge. Sections set
   their own widths and gutters. */
.mr-builder .entry__content {
	padding-inline: 0;
}

.mr-builder .entry__content > * {
	max-width: none;
	margin-block: 0;
	margin-inline: 0;
}

/* WPBakery rows hold one full-bleed Moonrise section each: no gutters, no
   bottom margin, nothing between the section and the page edge. */
.mr-builder .vc_row:has(> .vc_column_container > .vc_column-inner > .wpb_wrapper > .mr-section) {
	margin-inline: 0;
}

.mr-builder .vc_row:has(> .vc_column_container > .vc_column-inner > .wpb_wrapper > .mr-section) > .vc_column_container > .vc_column-inner {
	padding-inline: 0;
	padding-block-start: 0;
}

/* A plain row of WPBakery's own elements (Text Block, Single Image…) keeps to
   the content width, as it would on a page without sections. Rows with a
   Section style (.mr-s) set their own widths in stock.css. */
.mr-builder .vc_row:not(.mr-s):not(:has(.mr-section)) {
	max-width: calc(var(--mr-wide) + 2 * var(--mr-gutter));
	margin-inline: auto;
	padding-inline: calc(var(--mr-gutter) - 15px);
}

/* Links that are not running text — logos, images, buttons, card and menu
   links — never take an underline. The parent underlines every link on hover
   (its theme.json, and footer.css for the footer); that suits a link in a
   sentence, not a logo. `html body` outweighs the footer's `.site-footer
   a:hover` without !important. Header menu links keep their own drawn line
   (::after), which is not a text-decoration. */
html body :is(
	a.site-logo,
	a.site-title,
	a:has(img, svg, picture),
	.wp-block-button__link,
	.mr-button,
	.vc_btn3,
	.mr-card__link,
	.wp-block-navigation-item__content
),
html body :is(
	a.site-logo,
	a.site-title,
	a:has(img, svg, picture),
	.wp-block-button__link,
	.mr-button,
	.vc_btn3,
	.mr-card__link,
	.wp-block-navigation-item__content
):is(:hover, :focus, :focus-visible, :active) {
	text-decoration: none;
}

/* --------------------------------------------------------------------------
   Type
   -------------------------------------------------------------------------- */

.mr-display,
.mr-heading {
	margin: 0;
	color: var(--wp--preset--color--heading);
	font-weight: 400;
	text-wrap: balance;
}

.mr-display {
	font-family: var(--wp--preset--font-family--display);
	font-optical-sizing: auto;
	font-size: var(--wp--preset--font-size--display);
	line-height: var(--wp--custom--line-height--display, 1);
	letter-spacing: var(--wp--custom--tracking--display, -0.035em);
}

.mr-heading {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--xx-large);
	line-height: var(--wp--custom--line-height--heading, 1.05);
	letter-spacing: var(--wp--custom--tracking--heading, -0.03em);
}

.mr-prose {
	font-size: var(--wp--preset--font-size--medium);
	line-height: var(--wp--custom--line-height--body, 1.8);
}

.mr-prose > * {
	margin-block: 0;
}

.mr-prose > * + * {
	margin-block-start: var(--wp--preset--spacing--20);
}

.mr-prose strong {
	font-weight: 600;
}

/* The comp's swash "Et" ampersand. Its own face is not on Google Fonts;
   Arapey Italic's is the nearest, loaded for this one glyph. */
.mr-amp {
	font-family: var(--wp--preset--font-family--swash);
	font-style: italic;
	font-weight: 400;
	letter-spacing: 0;
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */

.mr-button,
.mr-builder .mr-section .mr-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0.8em 1.9em;
	border-radius: var(--wp--custom--radius--sm);
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0.02em;
	text-align: center;
	text-decoration: none;
	box-shadow: var(--wp--preset--shadow--button);
	transition:
		background-color 0.3s var(--mr-ease),
		box-shadow 0.3s var(--mr-ease),
		translate 0.3s var(--mr-ease);
}

.mr-button:hover,
.mr-button:focus-visible,
.mr-builder .mr-section .mr-button:hover,
.mr-builder .mr-section .mr-button:focus-visible {
	background: var(--wp--preset--color--primary-deep);
	color: var(--wp--preset--color--base);
	text-decoration: none;
	box-shadow: var(--wp--preset--shadow--button-hover);
	translate: 0 -2px;
}

.mr-button:focus-visible,
.mr-card__link:focus-visible,
.mr-quotes button:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 3px;
}

/* --------------------------------------------------------------------------
   Pill labels
   -------------------------------------------------------------------------- */

.mr-pill {
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
	margin: 0;
	padding: 0.55em 1.15em;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--pill);
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--eyebrow);
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.mr-pill--outline {
	padding: 0.75em 1.25em;
	border: 1px solid var(--wp--preset--color--pill-line);
	border-radius: var(--wp--custom--radius--xs);
	background: var(--wp--preset--color--pill-soft);
	color: var(--wp--preset--color--eyebrow-soft);
	font-weight: 600;
	letter-spacing: 0.07em;
}

.mr-icon {
	flex-shrink: 0;
	width: 1em;
	height: 1em;
}

.mr-pill .mr-icon {
	width: 1.15em;
	height: 1.15em;
}

/* --------------------------------------------------------------------------
   Header
   A bar on the dusk gradient; the hero's top corners sit on the same wash.
   -------------------------------------------------------------------------- */

.site-header {
	border-block-end: 0;
	background: var(--wp--preset--gradient--header);
	color: var(--wp--preset--color--base);
}

.site-header .site-header__inner {
	max-width: calc(var(--mr-wide) + 2 * var(--mr-gutter));
	padding-inline: var(--mr-gutter);
	gap: var(--wp--preset--spacing--40);
}

.site-header .site-logo__image {
	max-width: 300px;
}

.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container {
	gap: var(--wp--preset--spacing--40);
}

.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	position: relative;
	padding-block: 0.5rem;
	color: var(--wp--preset--color--nav);
	font-family: var(--wp--preset--font-family--nav);
	font-optical-sizing: auto;
	font-size: var(--wp--preset--font-size--nav);
	font-weight: 600;
	letter-spacing: 0.015em;
}

/* An underline that draws in from the left. */
.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	inset-inline: 0;
	bottom: 0.2rem;
	height: 1px;
	background: currentColor;
	transform-origin: left;
	scale: 0 1;
	transition: scale 0.35s var(--mr-ease);
}

.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:hover,
.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .current-menu-item > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--base);
}

.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:hover::after,
.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .current-menu-item > .wp-block-navigation-item__content::after {
	scale: 1 1;
}

.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container .has-child .wp-block-navigation__submenu-container {
	border: 0;
	border-radius: var(--wp--custom--radius--md);
	background: var(--wp--preset--color--canvas);
}

.site-header .mr-header__cta {
	flex-shrink: 0;
}

.site-header .mr-header__cta .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	padding: 0.7em 1.6em;
	border-radius: var(--wp--custom--radius--sm);
	background: var(--wp--preset--color--cream);
	color: var(--wp--preset--color--periwinkle);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--nav);
	font-weight: 500;
	letter-spacing: 0.02em;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color 0.3s var(--mr-ease), color 0.3s var(--mr-ease), translate 0.3s var(--mr-ease);
}

.site-header .mr-header__cta .wp-block-button__link:hover,
.site-header .mr-header__cta .wp-block-button__link:focus-visible {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	translate: 0 -1px;
}

.site-header .mr-header__cta .wp-block-button__link:focus-visible {
	outline: 2px solid var(--wp--preset--color--base);
	outline-offset: 3px;
}

.site-header .wp-block-navigation__responsive-container-open {
	color: var(--wp--preset--color--base);
}

.site-header.is-scrolled {
	box-shadow: var(--wp--preset--shadow--header);
}

/* The header button moves into the menu below this width. */
@media (max-width: 900px) {
	.site-header .mr-header__cta {
		display: none;
	}
}

/* Mobile menu: the same dusk, so the light logo reads. */
.site-header .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--gradient--overlay);
	color: var(--wp--preset--color--base);
}

.fwf-nav-overlay .fwf-nav-overlay__bar {
	border-block-end-color: var(--wp--preset--color--line-on-dark);
}

.fwf-nav-overlay .fwf-nav-overlay__menu .wp-block-navigation-item__content {
	border-block-end-color: var(--wp--preset--color--line-on-dark);
	color: var(--wp--preset--color--base);
	font-family: var(--wp--preset--font-family--nav);
	font-optical-sizing: auto;
	font-size: var(--wp--preset--font-size--large);
}

.fwf-nav-overlay .fwf-nav-overlay__menu .current-menu-item > .wp-block-navigation-item__content,
.fwf-nav-overlay .fwf-nav-overlay__menu .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--peach);
}

.fwf-nav-overlay .wp-block-navigation__responsive-container-close,
.site-header .wp-block-navigation__responsive-container-close {
	color: var(--wp--preset--color--base);
}

.fwf-nav-overlay .fwf-nav-overlay__cta .wp-block-button__link {
	width: 100%;
	border-radius: var(--wp--custom--radius--sm);
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	font-weight: 500;
}

/* --------------------------------------------------------------------------
   Footer
   A rounded dusk band holding a pale glass card.
   -------------------------------------------------------------------------- */

.site-footer {
	padding-block: 0;
	background: var(--wp--preset--color--peach);
	color: var(--wp--preset--color--contrast);
}

.site-footer .mr-footer {
	padding-block: var(--wp--preset--spacing--50);
	border-radius: var(--wp--custom--radius--xl) var(--wp--custom--radius--xl) 0 0;
	background: var(--wp--preset--gradient--footer);
}

.site-footer .mr-footer > .fwf-container {
	max-width: calc(var(--mr-panel) + 2 * var(--mr-gutter));
	padding-inline: var(--mr-gutter);
}

.site-footer .mr-footer__card {
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--60) var(--wp--preset--spacing--30);
	border: 1px solid var(--wp--preset--color--glass-line);
	border-radius: var(--wp--custom--radius--lg);
	background: var(--wp--preset--gradient--glass);
	box-shadow: var(--wp--preset--shadow--glass);
	backdrop-filter: blur(24px);
}

.site-footer .mr-footer__top {
	grid-template-columns: minmax(260px, 2.3fr) repeat(2, minmax(160px, 1fr));
	gap: var(--wp--preset--spacing--50);
	padding-block-end: var(--wp--preset--spacing--50);
}

.site-footer .site-logo__image {
	max-width: 400px;
	width: 100%;
}

.site-footer .site-footer__description {
	color: var(--wp--preset--color--muted);
}

.site-footer .site-footer__description:empty {
	display: none;
}

.site-footer .mr-footer__cta {
	margin-block-start: var(--wp--preset--spacing--30);
}

.site-footer .mr-footer__cta .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	padding: 0.8em 1.6em;
	border-radius: var(--wp--custom--radius--sm);
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	text-decoration: none;
	transition: background-color 0.3s var(--mr-ease), translate 0.3s var(--mr-ease);
}

.site-footer .mr-footer__cta .wp-block-button__link:hover,
.site-footer .mr-footer__cta .wp-block-button__link:focus-visible {
	background: var(--wp--preset--color--primary-deep);
	text-decoration: none;
	translate: 0 -2px;
}

.site-footer .widget__title {
	margin-block: 0 var(--wp--preset--spacing--20);
	color: var(--wp--preset--color--label);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
	letter-spacing: 0.07em;
}

.site-footer a {
	color: var(--wp--preset--color--contrast);
}

.site-footer .site-footer__menu .wp-block-navigation__container {
	gap: 0.85rem;
}

.site-footer .site-footer__menu .wp-block-navigation-item__content {
	font-size: var(--wp--preset--font-size--nav);
	letter-spacing: 0.015em;
	color: var(--wp--preset--color--muted);
	transition: color 0.25s var(--mr-ease);
}

.site-footer .site-footer__menu .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--heading);
	text-decoration: none;
}

.site-footer .mr-footer__bottom {
	border-block-start: 1px solid var(--wp--preset--color--glass-rule);
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
}

.site-footer .mr-footer__credit {
	gap: 0;
}

.site-footer .mr-footer__credit .site-footer__note {
	margin-inline-start: 0;
}

.site-footer .mr-footer__credit .site-footer__note:not(:empty)::before {
	content: "\00a0·\00a0";
}

.site-footer .site-footer__legal .wp-block-navigation__container {
	gap: var(--wp--preset--spacing--30);
}

.site-footer .site-footer__legal .wp-block-navigation-item__content {
	color: var(--wp--preset--color--muted);
}

@media (max-width: 900px) {
	.site-footer .mr-footer__card {
		padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30) var(--wp--preset--spacing--20);
	}

	.site-footer .mr-footer__top {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 560px) {
	.site-footer .mr-footer__top {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--20);
	}
}

/* --------------------------------------------------------------------------
   Default page template (the legal pages): the crumbs and title line up with
   the text column, headings drop to a reading size, and the text ends with
   room before the footer.
   -------------------------------------------------------------------------- */

.entry:not(.entry--full-width) > .entry__breadcrumbs .fwf-container,
.entry:not(.entry--full-width) > .entry__header.fwf-container {
	max-width: calc(var(--wp--style--global--content-size) + 2 * var(--wp--preset--spacing--20));
}

.entry:not(.entry--full-width) > .entry__content {
	padding-block-end: var(--wp--preset--spacing--60);
}

.entry:not(.entry--full-width) > .entry__content h2 {
	margin-block-start: var(--wp--preset--spacing--40);
	font-size: var(--wp--preset--font-size--x-large);
	line-height: 1.2;
}

.entry:not(.entry--full-width) > .entry__content h3 {
	font-size: var(--wp--preset--font-size--large);
}


/* ------------------------------------------------------------------
 * Mobile menu: collapsible submenus (overlay only).
 * Toggle buttons are added by the script at the end of motion.js.
 * ------------------------------------------------------------------ */
.fwf-nav-overlay__menu .has-child {
	flex-wrap: wrap;
}

.fwf-nav-overlay__menu .has-child > .wp-block-navigation-item__content {
	flex: 1 1 auto;
	width: auto;
}

.fwf-nav-overlay__menu .has-child > .wp-block-navigation__submenu-container {
	flex: 0 0 100%;
}

.fwf-nav-overlay__menu .has-child.fwf-sub-collapsed > .wp-block-navigation__submenu-container {
	display: none;
}

.fwf-subtoggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: 0;
	padding: 0;
	background: none;
	border: 0;
	color: inherit;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

.fwf-subtoggle svg {
	width: 14px;
	height: 14px;
	transition: transform 0.25s ease;
}

.fwf-subtoggle[aria-expanded="true"] svg {
	transform: rotate(180deg);
}

.fwf-subtoggle:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: -4px;
	border-radius: 4px;
}
