/* ==========================================================================
   Moonrise — sections built from WPBakery's stock elements
   A Row's Moonrise → Section style (inc/stock.php) puts `mr-s mr-s--<style>`
   on the row; everything below styles WPBakery's own markup inside it:

     .vc_row.mr-s
       .wpb_column > .vc_column-inner > .wpb_wrapper
         .wpb_single_image > figure.vc_figure > .vc_single_image-wrapper > img
         .wpb_text_column > .wpb_wrapper > h1, h2, p
         .vc_btn3-container > a.vc_btn3.vc_btn3-style-moonrise

   Rules are prefixed `.mr-builder` or the section class so they outrank
   WPBakery's own two- and three-class rules without !important.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Shared
   -------------------------------------------------------------------------- */

.mr-builder .vc_row.mr-s {
	position: relative;
	margin-block: var(--wp--preset--spacing--30);
}

/* Two styled rows in a row: the design's full gap, not a collapsed half. */
.mr-builder .vc_row.mr-s + .vc_row.mr-s {
	margin-block-start: calc(2 * var(--wp--preset--spacing--30));
}

.mr-s .wpb_content_element,
.mr-s .vc_btn3-container {
	margin-bottom: 0;
}

.mr-s .vc_column-inner > .wpb_wrapper > * + * {
	margin-block-start: var(--wp--preset--spacing--30);
}

.mr-s .wpb_text_column > .wpb_wrapper > * {
	margin-block: 0;
}

.mr-s .wpb_text_column > .wpb_wrapper > * + * {
	margin-block-start: var(--wp--preset--spacing--20);
}

.mr-s .wpb_text_column > .wpb_wrapper > :is(h1, h2) + * {
	margin-block-start: var(--wp--preset--spacing--30);
}

.mr-s :is(h1, h2) {
	color: var(--wp--preset--color--heading);
	font-weight: 400;
	text-wrap: balance;
}

.mr-s h1 {
	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);
	letter-spacing: var(--wp--custom--tracking--display);
}

.mr-s h2 {
	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);
	letter-spacing: var(--wp--custom--tracking--heading);
}

.mr-s .wpb_text_column p {
	font-size: var(--wp--preset--font-size--medium);
	line-height: var(--wp--custom--line-height--body);
}

.mr-s .wpb_text_column strong {
	font-weight: 600;
}

/* A heading's line breaks are the design's, for a wide screen; on a phone the
   words wrap to the screen. The newline after each <br> keeps them apart. */
@media (max-width: 781px) {
	.mr-s :is(h1, h2) br {
		display: none;
	}
}

.mr-s .wpb_single_image :is(.vc_figure, .vc_single_image-wrapper) {
	display: block;
	width: 100%;
}

.mr-s .wpb_single_image img {
	display: block;
	width: 100%;
}

/* --------------------------------------------------------------------------
   The Button's Moonrise style
   -------------------------------------------------------------------------- */

.mr-builder .vc_general.vc_btn3.vc_btn3-style-moonrise {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0.8em 1.9em;
	border: 0;
	border-radius: var(--wp--custom--radius--sm);
	background: var(--wp--preset--color--primary);
	box-shadow: var(--wp--preset--shadow--button);
	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;
	transition:
		background-color 0.3s var(--mr-ease),
		box-shadow 0.3s var(--mr-ease),
		translate 0.3s var(--mr-ease);
}

.mr-builder .vc_general.vc_btn3.vc_btn3-style-moonrise:hover,
.mr-builder .vc_general.vc_btn3.vc_btn3-style-moonrise:focus-visible {
	background: var(--wp--preset--color--primary-deep);
	box-shadow: var(--wp--preset--shadow--button-hover);
	color: var(--wp--preset--color--base);
	translate: 0 -2px;
}

.mr-builder .vc_general.vc_btn3.vc_btn3-style-moonrise:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 3px;
}

.mr-builder .vc_general.vc_btn3.vc_btn3-style-moonrise.vc_btn3-size-lg {
	font-size: var(--wp--preset--font-size--medium);
}

/* --------------------------------------------------------------------------
   Eyebrow label — a paragraph with the text editor's "Eyebrow label" format
   -------------------------------------------------------------------------- */

.mr-builder p.mr-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
	width: fit-content;
	padding: 0.55em 1.15em;
	/* Round at one line, and still soft if a long label wraps to two. */
	border-radius: 1.4em;
	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;
}

/* The crescent before the label, in the label's own color. */
.mr-builder p.mr-eyebrow::before {
	content: "";
	flex-shrink: 0;
	width: 1.15em;
	height: 1.15em;
	background: currentColor;
	-webkit-mask: url("../img/moon.svg") center / contain no-repeat;
	mask: url("../img/moon.svg") center / contain no-repeat;
}

/* --------------------------------------------------------------------------
   Hero — a Single Image in the row is the background photo
   -------------------------------------------------------------------------- */

.mr-builder .vc_row.mr-s:is(.mr-s--hero, .mr-s--hero-gradient) {
	display: flex;
	align-items: center;
	width: 100%;
	min-height: clamp(560px, 45.5vw, 760px);
	margin: 0 0 var(--wp--preset--spacing--30);
	overflow: hidden;
	/* Full bleed and square: the hero runs edge to edge under the header. */
	border-radius: 0;
	background: var(--wp--preset--color--secondary);
	isolation: isolate;
}

/* The photo is placed against the row, not the column. */
.mr-s:is(.mr-s--hero, .mr-s--hero-gradient, .mr-s--cta) :is(.vc_column_container, .vc_column-inner, .vc_column-inner > .wpb_wrapper) {
	position: static;
}

.mr-s:is(.mr-s--hero, .mr-s--hero-gradient) > .vc_column_container {
	width: 100%;
}

.mr-s:is(.mr-s--hero, .mr-s--hero-gradient) .vc_column-inner {
	width: 100%;
	max-width: calc(var(--mr-wide) + 2 * var(--mr-gutter));
	margin-inline: auto;
	padding: var(--wp--preset--spacing--50) var(--mr-gutter);
}

.mr-s:is(.mr-s--hero, .mr-s--hero-gradient) .vc_column-inner > .wpb_wrapper > :not(.wpb_single_image) {
	max-width: 38rem;
	padding-inline-start: var(--wp--preset--spacing--20);
}

.mr-s:is(.mr-s--hero, .mr-s--hero-gradient, .mr-s--cta) .wpb_single_image {
	position: absolute;
	inset: 0;
	z-index: -2;
	margin: 0;
}

.mr-s:is(.mr-s--hero, .mr-s--hero-gradient, .mr-s--cta) .wpb_single_image :is(.vc_figure, .vc_single_image-wrapper),
.mr-s:is(.mr-s--hero, .mr-s--hero-gradient, .mr-s--cta) .wpb_single_image img {
	height: 100%;
}

.mr-s:is(.mr-s--hero, .mr-s--hero-gradient, .mr-s--cta) .wpb_single_image img {
	object-fit: cover;
}

.mr-s--hero .wpb_single_image img {
	object-position: 70% 30%;
}

.mr-builder .vc_row.mr-s--hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	display: block;
	background: var(--wp--preset--gradient--hero-scrim);
}

.mr-s:is(.mr-s--hero, .mr-s--hero-gradient) .wpb_text_column p {
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--small-plus);
	line-height: 1.76;
}

.mr-s--hero h1 {
	color: var(--wp--preset--color--base);
}

.mr-s:is(.mr-s--hero, .mr-s--hero-gradient) .wpb_text_column p.mr-eyebrow {
	font-size: var(--wp--preset--font-size--eyebrow);
	line-height: 1.2;
}

.mr-s:is(.mr-s--hero, .mr-s--hero-gradient) .wpb_text_column > .wpb_wrapper > .mr-eyebrow + * {
	margin-block-start: var(--wp--preset--spacing--20);
}

/* Hero, gradient: a dawn wash on the left, the photo fading in on the right. */
.mr-builder .vc_row.mr-s.mr-s--hero-gradient {
	background: var(--wp--preset--gradient--hero-dawn);
}

.mr-s.mr-s--hero-gradient .wpb_single_image {
	left: 38%;
}

/* A long, soft fade: the photo should dissolve into the wash, not butt up
   against it. */
.mr-s.mr-s--hero-gradient .wpb_single_image img {
	object-position: 60% 30%;
	-webkit-mask-image: linear-gradient(to right, transparent 0, rgb(0 0 0 / 0.35) 18%, rgb(0 0 0 / 0.8) 34%, #000 48%);
	mask-image: linear-gradient(to right, transparent 0, rgb(0 0 0 / 0.35) 18%, rgb(0 0 0 / 0.8) 34%, #000 48%);
}

.mr-s--hero-gradient h1 {
	color: var(--wp--preset--color--navy);
}

.mr-s.mr-s--hero-gradient .wpb_text_column p.mr-eyebrow {
	background: var(--wp--preset--color--pill-light);
	color: var(--wp--preset--color--periwinkle);
}

@media (max-width: 781px) {
	.mr-builder .vc_row.mr-s:is(.mr-s--hero, .mr-s--hero-gradient) {
		align-items: flex-end;
		min-height: min(88svh, 720px);
	}

	.mr-builder .vc_row.mr-s--hero::before {
		background: var(--wp--preset--gradient--hero-scrim-mobile);
	}

	.mr-s:is(.mr-s--hero, .mr-s--hero-gradient) .vc_column-inner > .wpb_wrapper > :not(.wpb_single_image) {
		padding-inline-start: 0;
	}

	/* Narrow, the photo sits above the copy and fades down into the wash. */
	.mr-builder .vc_row.mr-s.mr-s--hero-gradient {
		display: block;
		min-height: 0;
	}

	/* Full bleed: out past the column's gutter to the screen edges. */
	.mr-s.mr-s--hero-gradient .wpb_single_image {
		position: relative;
		inset: auto;
		height: 70vw;
		margin-inline: calc(-1 * var(--mr-gutter));
		z-index: 0;
	}

	.mr-s.mr-s--hero-gradient .wpb_single_image img {
		-webkit-mask-image: linear-gradient(to bottom, #000 55%, transparent);
		mask-image: linear-gradient(to bottom, #000 55%, transparent);
	}

	.mr-s.mr-s--hero-gradient .vc_column-inner {
		padding-block-start: 0;
	}

	.mr-s.mr-s--hero-gradient .vc_column-inner > .wpb_wrapper > .wpb_single_image + * {
		margin-block-start: calc(-1 * var(--wp--preset--spacing--30));
	}
}

/* --------------------------------------------------------------------------
   Image & Text — rounded photo beside copy
   -------------------------------------------------------------------------- */

.mr-builder .vc_row.mr-s:is(.mr-s--split, .mr-s--statement) {
	max-width: calc(var(--mr-wide) + 30px);
	margin-inline: auto;
	padding-inline: max(0px, calc(var(--mr-gutter) - 15px));
}

.mr-s--split .wpb_single_image .vc_single_image-wrapper {
	overflow: hidden;
	border-radius: var(--wp--custom--radius--xl);
	box-shadow: var(--wp--preset--shadow--photo);
}

.mr-s--split .wpb_single_image img {
	aspect-ratio: 624 / 632;
	object-fit: cover;
	transition: scale 1.2s var(--mr-ease);
}

.mr-s--split .wpb_single_image:hover img {
	scale: 1.03;
}

.mr-s--split .wpb_column:not(:has(.wpb_single_image)) > .vc_column-inner {
	padding-inline-start: var(--wp--preset--spacing--30);
}

.mr-s--split .wpb_text_column p {
	max-width: 33rem;
}

/* --------------------------------------------------------------------------
   Image & Text, panel — the row is the panel; the photo runs to its edge
   -------------------------------------------------------------------------- */

.mr-builder .vc_row.mr-s:is(.mr-s--split-panel, .mr-s--cta) {
	width: min(100% - 2 * var(--mr-gutter), var(--mr-panel));
	margin-inline: auto;
	overflow: hidden;
	isolation: isolate;
}

.mr-builder .vc_row.mr-s--split-panel {
	border-radius: var(--wp--custom--radius--xl);
	background: var(--wp--preset--gradient--panel);
}

.mr-s--split-panel .wpb_column:has(.wpb_single_image) > .vc_column-inner {
	position: relative;
	min-height: 520px;
	padding: 0;
}

.mr-s--split-panel .wpb_single_image {
	position: absolute;
	inset: 0;
	margin: 0;
}

.mr-s--split-panel .wpb_single_image :is(.vc_figure, .vc_single_image-wrapper),
.mr-s--split-panel .wpb_single_image img {
	height: 100%;
}

.mr-s--split-panel .wpb_single_image img {
	object-fit: cover;
}

.mr-s--split-panel .wpb_column:not(:has(.wpb_single_image)) > .vc_column-inner {
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--30) var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
}

.mr-s--split-panel h2 {
	font-size: var(--wp--preset--font-size--heading-sm);
}

.mr-s--split-panel .wpb_text_column p {
	max-width: 37rem;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small-plus);
}

.mr-s--split-panel .wpb_text_column p strong {
	color: var(--wp--preset--color--ink);
}

/* The wake-to-sleep line down the photo's edge (Row → Moonrise → Wake /
   sleep line). Drawn from the image's own boxes: the labels on the image
   block, the line and dot on its figure. Generated text is hidden from
   assistive technology with the empty alternative after the slash. */
.mr-s--timeline .wpb_single_image .vc_figure {
	position: static;
}

.mr-s--timeline .wpb_single_image::before,
.mr-s--timeline .wpb_single_image::after {
	position: absolute;
	left: var(--wp--preset--spacing--20);
	z-index: 1;
	width: 3rem;
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--tiny);
	font-weight: 500;
	letter-spacing: 0.22em;
	text-align: center;
	text-transform: uppercase;
	opacity: 0.85;
}

.mr-s--timeline .wpb_single_image::before {
	content: "Wake" / "";
	top: var(--wp--preset--spacing--30);
}

.mr-s--timeline .wpb_single_image::after {
	content: "Sleep" / "";
	bottom: var(--wp--preset--spacing--30);
}

.mr-s--timeline .wpb_single_image .vc_figure::before {
	content: "";
	position: absolute;
	top: calc(var(--wp--preset--spacing--30) + 1.5rem);
	bottom: calc(var(--wp--preset--spacing--30) + 1.5rem);
	left: calc(var(--wp--preset--spacing--20) + 1.5rem);
	z-index: 1;
	width: 1px;
	background:
		radial-gradient(circle, var(--wp--preset--color--base) 0 3px, transparent 3.5px) 50% 12% / 7px 7px no-repeat,
		linear-gradient(to bottom, var(--wp--preset--color--line-on-dark), var(--wp--preset--color--timeline));
	overflow: visible;
}

.mr-s--timeline .wpb_single_image .vc_figure::after {
	content: "";
	position: absolute;
	top: calc(var(--wp--preset--spacing--30) + 1.5rem);
	left: calc(var(--wp--preset--spacing--20) + 1.5rem - 7px);
	z-index: 1;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: var(--wp--preset--color--base);
	box-shadow: 0 0 0 5px var(--wp--preset--color--line-on-dark);
}

@media (max-width: 767px) {
	.mr-s--split .wpb_column:not(:has(.wpb_single_image)) > .vc_column-inner {
		padding-inline-start: 15px;
	}

	.mr-s--split .wpb_single_image img {
		aspect-ratio: 4 / 3;
	}

	.mr-s--split-panel .wpb_column:has(.wpb_single_image) > .vc_column-inner {
		min-height: 0;
		aspect-ratio: 4 / 3;
	}

	.mr-s--split-panel .wpb_column:not(:has(.wpb_single_image)) > .vc_column-inner {
		padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30);
	}
}

/* --------------------------------------------------------------------------
   Statement — centered heading and copy
   -------------------------------------------------------------------------- */

.mr-s--statement {
	text-align: center;
}

.mr-s--statement .wpb_single_image img {
	width: 72px;
	margin-inline: auto;
}

.mr-s--statement .wpb_text_column p {
	max-width: 51rem;
	margin-inline: auto;
}

.mr-s--statement .wpb_text_column > .wpb_wrapper > p + p {
	margin-block-start: var(--wp--preset--spacing--30);
}

/* --------------------------------------------------------------------------
   Call to Action — a large heading over a washed photo
   -------------------------------------------------------------------------- */

.mr-builder .vc_row.mr-s--cta {
	display: flex;
	align-items: center;
	min-height: clamp(520px, 45vw, 680px);
	border-radius: var(--wp--custom--radius--lg);
	background: var(--wp--preset--color--lavender);
	text-align: center;
}

.mr-builder .vc_row.mr-s--cta::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	display: block;
	background: var(--wp--preset--gradient--cta-wash);
}

.mr-s--cta > .vc_column_container {
	width: 100%;
}

.mr-s--cta .vc_column-inner {
	max-width: 54rem;
	margin-inline: auto;
	padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--30);
}

/* Taller than its frame, so the parallax never shows an edge. */
.mr-s.mr-s--cta .wpb_single_image {
	inset: -6% 0;
}

.mr-s--cta h2 {
	color: var(--wp--preset--color--base);
	font-family: var(--wp--preset--font-family--display);
	font-optical-sizing: auto;
	font-size: var(--wp--preset--font-size--mega);
	line-height: var(--wp--custom--line-height--mega);
	letter-spacing: var(--wp--custom--tracking--display);
	text-shadow: var(--wp--custom--cta-title-shadow);
}

.mr-s--cta .wpb_text_column p {
	max-width: 37rem;
	margin-inline: auto;
	color: var(--wp--preset--color--cta-ink);
	font-size: var(--wp--preset--font-size--medium-plus);
	line-height: 1.65;
}

.mr-s--cta .wpb_text_column > .wpb_wrapper > p + p {
	margin-block-start: 0;
}

@media (max-width: 781px) {
	.mr-builder .vc_row.mr-s--cta::before {
		background: var(--wp--preset--gradient--cta-wash-mobile);
	}
}

/* --------------------------------------------------------------------------
   Gravity Forms in a section (the Contact page's consultation form)

   Orbital's button rule runs six classes deep, so the button rules here run
   seven. Fields take the form's own variables rather than fighting its rules.
   -------------------------------------------------------------------------- */

.mr-s .gform_wrapper.gform-theme {
	--gf-ctrl-border-color: var(--wp--preset--color--border);
	--gf-ctrl-radius: var(--wp--custom--radius--sm);
	--gf-ctrl-label-color-primary: var(--wp--preset--color--contrast);
	--gf-ctrl-font-family: var(--wp--preset--font-family--body);
	--gf-ctrl-label-font-family-primary: var(--wp--preset--font-family--body);
	--gf-color-primary: var(--wp--preset--color--primary);
	margin-block-start: var(--wp--preset--spacing--30);
}

/* The asterisks mark the required fields; the legend above them is redundant. */
.mr-s .gform_wrapper .gform_required_legend {
	display: none;
}

.mr-s .gform-theme.gform-theme--framework.gform_wrapper .gform_footer .gform_button.button {
	min-height: 48px;
	padding-inline: 1.9em;
	border-radius: var(--wp--custom--radius--sm);
	background: var(--wp--preset--color--primary);
	box-shadow: var(--wp--preset--shadow--button);
	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;
	letter-spacing: 0.02em;
	transition: background-color 0.3s var(--mr-ease), translate 0.3s var(--mr-ease);
}

.mr-s .gform-theme.gform-theme--framework.gform_wrapper .gform_footer .gform_button.button:hover,
.mr-s .gform-theme.gform-theme--framework.gform_wrapper .gform_footer .gform_button.button:focus-visible {
	background: var(--wp--preset--color--primary-deep);
	translate: 0 -2px;
}