/* Meet Our Team — staging only — 1.0.13-mot-closing-assets-t1258u */
.mot {
	overflow-x: clip;
	--navy: #0c263a;
	--navy-2: #173a56;
	--ivory: #f6f2ea;
	--paper: #fbfaf7;
	--stone: #d8d1c5;
	--gold: #d5ae59;
	--ink: #1f252b;
	--body: #24303a;
	--muted: #4e555b;
	--p: 0;
	color: var(--ink);
	font-family: Inter, Helvetica, Arial, sans-serif;
	font-size: 17px;
	line-height: 1.65;
	background: var(--ivory);
}
.mot *,
.mot *::before,
.mot *::after { box-sizing: border-box; }
.mot h1,
.mot h2,
.mot h3,
.mot p,
.mot ul { margin: 0; }
.mot img { max-width: 100%; display: block; }
.mot a { color: inherit; }
.mot :focus-visible {
	outline: 2px solid var(--navy);
	outline-offset: 3px;
}
.mot-hero :focus-visible,
.mot-standard :focus-visible,
.mot-invite :focus-visible { outline-color: #f6f2ea; }

.mot-ch { scroll-margin-top: 16px; }
.mot-frame {
	max-width: 1440px;
	margin: 0 auto;
	position: relative;
}
.mot-eye {
	font-size: 12px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--navy-2);
	margin-bottom: 10px;
}
.mot h2,
.mot-hero h1 {
	font-family: Cinzel, "Times New Roman", serif;
	font-weight: 500;
	letter-spacing: 0.01em;
	line-height: 1.12;
}
.mot-lead {
	font-family: Cinzel, "Times New Roman", serif;
	font-size: 22px;
	line-height: 1.35;
	margin: 14px 0 16px;
	color: var(--navy);
}
.mot-bio p + p { margin-top: 14px; }
.mot-bio { color: var(--body); font-size: 17px; line-height: 1.65; max-width: 62ch; }
.mot-exp {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.mot-exp li {
	font-size: 13px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1.35;
	color: var(--navy);
	padding-left: 14px;
	border-left: 2px solid var(--gold);
}
.mot-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 12px 18px;
	border: 1px solid var(--navy);
	background: transparent;
	color: var(--navy);
	font-family: Inter, Helvetica, Arial, sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	text-decoration: none;
	line-height: 1.2;
	cursor: pointer;
}
.mot-btn--gold {
	background: var(--gold);
	border-color: var(--gold);
	color: var(--navy);
}
.mot-btn--light {
	border-color: rgba(246, 242, 234, 0.85);
	color: #f6f2ea;
	background: transparent;
}
.mot-btn:hover { transform: translateY(-2px); }
.mot-btn--hold {
	border: 0;
	background: transparent;
	color: var(--gold);
	padding: 0;
	min-height: 0;
	letter-spacing: 0.14em;
	cursor: default;
}
.mot-btn--hold:hover { transform: none; }

.mot-reveal {
	opacity: clamp(0.55, calc(0.55 + (var(--p) - var(--d, 0)) * 1.15), 1);
	transform: translate3d(calc((1 - clamp(0, (var(--p) - var(--d, 0)) * 2.5, 1)) * var(--x, 0px)), calc((1 - clamp(0, (var(--p) - var(--d, 0)) * 2.5, 1)) * var(--y, 0px)), 0);
}
.mot-from-left { --x: -56px; --y: 0px; }
.mot-from-right { --x: 56px; --y: 0px; }
.mot-from-up { --x: 0px; --y: 24px; }

/* 01 skyline */
.mot-hero {
	position: sticky;
	top: 0;
	color: #f6f2ea;
	background: #071624;
	min-height: 620px;
	overflow: hidden;
}
.mot-hero__bleed {
	position: absolute;
	inset: 0;
	overflow: hidden;
}
.mot-hero__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 78% 46%;
	transform: scale(calc(1.02 - (var(--p) * 0.02)));
	transform-origin: center center;
	filter: saturate(0.94);
}
.mot-hero__shade {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(90deg, rgba(5, 20, 34, 0.86) 0%, rgba(5, 20, 34, 0.68) 26%, rgba(5, 20, 34, 0.34) 48%, rgba(5, 20, 34, 0.12) 70%, rgba(5, 20, 34, 0.04) 100%),
		linear-gradient(180deg, rgba(5, 20, 34, 0.16), rgba(5, 20, 34, 0.10));
	pointer-events: none;
}
.mot-hero .mot-frame {
	min-height: 620px;
	position: relative;
	z-index: 1;
	align-items: stretch;
}
.mot-hero__copy { align-self: center; }
.mot-hero__copy {
	width: min(42vw, 720px);
	padding: 36px 10px 40px 36px;
	max-width: 42%;
}
.mot-hero .mot-eye { color: rgba(246, 242, 234, 0.9); }
.mot-hero h1 {
	font-size: clamp(34px, 2.6vw, 39px);
	color: #f7f4ee;
}
.mot-hero h1 span { display: block; }
.mot-hero__support {
	margin-top: 18px;
	font-size: 18px;
	line-height: 1.6;
	max-width: 36ch;
	color: rgba(246, 242, 234, 0.94);
}
.mot-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 26px;
}
.mot-hero .mot-reveal {
	opacity: clamp(0.86, calc(0.86 + var(--p) * 0.16), 1);
}

/* 02 */
.mot-diff { background: var(--ivory); color: var(--ink); }
.mot-diff__grid {
	display: grid;
	grid-template-columns: minmax(240px, 0.78fr) minmax(0, 1.5fr);
	gap: 36px 40px;
	padding: 72px 64px 72px 36px;
	align-items: start;
}
.mot-diff h2 { font-size: clamp(36px, 3vw, 52px); color: var(--navy); max-width: 12ch; }
.mot-diff__lead { margin-top: 16px; color: var(--body); max-width: 38ch; }
.mot-cols {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 22px;
}
.mot-col__icon {
	width: 36px;
	height: 36px;
	color: var(--navy);
	margin-bottom: 14px;
}
.mot-col__icon svg { width: 36px; height: 36px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.mot-col h3 {
	font-family: Inter, Helvetica, Arial, sans-serif;
	font-size: 13px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1.35;
	color: var(--navy);
	font-weight: 600;
	margin-bottom: 8px;
}
.mot-col p { font-size: 16px; line-height: 1.5; color: var(--body); }

/* people — t1214u circular headshots, chapters 03-06 only */
.mot-person--craig,
.mot-person--justin { background: #F8F5EE; }
.mot-person--nelson,
.mot-person--michelle { background: #F2F3F1; }
.mot-person__grid {
	display: grid;
	grid-template-columns: 320px minmax(280px, 1fr) minmax(168px, 220px);
	gap: 28px 36px;
	align-items: center;
	padding: 28px 64px 36px 48px;
}
.mot-photo { grid-column: 1; grid-row: 1; }
.mot-story { grid-column: 2; grid-row: 1; }
.mot-exp { grid-column: 3; grid-row: 1; }
.mot-person--flip .mot-person__grid {
	grid-template-columns: minmax(168px, 220px) minmax(0, 1fr) 320px;
}
.mot-person--flip .mot-exp { grid-column: 1; grid-row: 1; }
.mot-person--flip .mot-story { grid-column: 2; grid-row: 1; }
.mot-person--flip .mot-photo { grid-column: 3; grid-row: 1; }
.mot-photo {
	position: relative;
	width: 290px;
	height: 290px;
	margin: -28px 0 0;
	padding: 0;
	overflow: hidden;
	border-radius: 50%;
	border: 2px solid #C9A65A;
	box-shadow: 0 0 0 7px rgba(12, 38, 58, 0.04);
	background: #efeae2;
	justify-self: start;
	align-self: center;
}
.mot-person--flip .mot-photo { justify-self: end; }
.mot-photo picture {
	position: absolute;
	inset: 0;
	display: block;
	margin: 0;
	border-radius: 50%;
}
.mot-photo img {
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center center;
	display: block;
	border-radius: 50%;
}
.mot-story h2 { font-size: clamp(36px, 3vw, 52px); color: var(--navy); }
.mot-story .mot-btn { margin-top: 22px; }

/* 07 */
.mot-standard { background: var(--navy); color: #f6f2ea; }
.mot-standard__inner { padding: 72px 64px 72px 36px; }
.mot-standard h2 { font-size: clamp(36px, 3.1vw, 56px); max-width: 16ch; color: #f6f2ea; }
.mot-standard__lead { margin-top: 16px; max-width: 54ch; font-size: 18px; line-height: 1.6; color: rgba(246, 242, 234, 0.9); }
.mot-principles {
	margin-top: 40px;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
}
.mot-principle {
	padding: 8px 22px 8px 20px;
	border-left: 1px solid rgba(213, 174, 89, 0.55);
}
.mot-principle .mot-col__icon { color: var(--gold); }
.mot-principle h3 {
	font-family: Inter, Helvetica, Arial, sans-serif;
	font-size: 14px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #f6f2ea;
	font-weight: 600;
	margin: 8px 0;
}
.mot-principle p { color: rgba(246, 242, 234, 0.86); font-size: 16px; }

/* 08 */
.mot-work { background: var(--ivory); }
.mot-work__inner { padding: 64px 64px 72px 36px; }
.mot-work h2 { font-size: clamp(36px, 3vw, 52px); color: var(--navy); }
.mot-work__lead { margin: 14px 0 26px; max-width: 58ch; color: var(--body); font-size: 18px; }
.mot-work__actions { display: flex; flex-wrap: wrap; gap: 12px; }

/* 09 */
.mot-invite { background: #101820; color: #f6f2ea; }
.mot-invite__inner { padding: 64px 72px 120px 36px; max-width: 820px; }
.mot-invite h2 { font-size: clamp(32px, 3vw, 48px); color: #f6f2ea; }
.mot-invite p { margin-top: 14px; max-width: 48ch; color: rgba(246, 242, 234, 0.9); font-size: 17px; }
.mot-invite .mot-btn--hold { margin-top: 22px; display: inline-flex; }

@media (max-width: 1099px) {
	.mot-diff__grid,
	.mot-standard__inner,
	.mot-work__inner,
	.mot-invite__inner,
	.mot-person__grid { padding-left: 36px; padding-right: 36px; }
	.mot-person__grid {
		grid-template-columns: minmax(0, 0.42fr) minmax(0, 0.58fr);
		min-height: 0;
	}
	.mot-exp {
		grid-column: 1 / -1;
		flex-direction: row;
		flex-wrap: wrap;
		gap: 10px 16px;
		order: 4;
	}
	.mot-exp li { flex: 1 1 180px; }
	.mot-person--flip .mot-photo { order: 2; }
	.mot-person--flip .mot-story { order: 1; }
	.mot-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.mot-principles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 0; }
	.mot-hero__copy { width: min(68%, 620px); max-width: 620px; padding-left: 36px; padding-right: 28px; }
	.mot-from-left { --x: -40px; }
	.mot-from-right { --x: 40px; }
}
@media (max-width: 900px) {
	.mot-hero { min-height: 620px; background: #071624; }
	.mot-hero__bleed { position: absolute; height: 100%; width: 100%; }
	.mot-hero__img { height: 100%; width: 100%; object-fit: cover; object-position: 78% 46%; }
	.mot-hero__shade { display: block; }
	.mot-hero .mot-frame { min-height: 620px; }
	.mot-hero__copy { max-width: none; width: auto; }
}
@media (max-width: 759px) {
	.mot { font-size: 16px; }
	.mot-hero { min-height: 620px; }
	.mot-hero__bleed { position: absolute; }
	.mot-hero .mot-frame { min-height: 620px; }
	.mot-bio { font-size: 16px; }
	.mot-diff__grid,
	.mot-standard__inner,
	.mot-work__inner,
	.mot-invite__inner,
	.mot-person__grid,
	.mot-hero__copy { padding-left: 22px; padding-right: 22px; }
	.mot-person__grid { grid-template-columns: 1fr; padding-top: 28px; }
	.mot-photo,
	.mot-story,
	.mot-person--flip .mot-photo,
	.mot-person--flip .mot-story { order: unset; }
	.mot-photo { min-height: 0; }
	.mot-hero { min-height: 620px; background: #071624; }
	.mot-hero .mot-frame { min-height: 620px; }
	.mot-hero__bleed { position: absolute; inset: 0; height: 100%; }
	.mot-hero__img { height: 100%; object-fit: cover; object-position: 78% 46%; }
	.mot-hero__shade {
		display: block;
		background:
			linear-gradient(90deg, rgba(5, 20, 34, 0.9) 0%, rgba(5, 20, 34, 0.78) 46%, rgba(5, 20, 34, 0.5) 100%),
			linear-gradient(180deg, rgba(5, 20, 34, 0.2), rgba(5, 20, 34, 0.16));
	}
	.mot-hero .mot-frame { align-items: start; }
	.mot-hero__copy { max-width: none; width: auto; align-self: start; padding-top: 28px; padding-bottom: 132px; }
	.mot-hero h1 { font-size: clamp(32px, 8vw, 40px); max-width: none; }
	.mot-hero h1 span { white-space: normal; }
	.mot-diff h2,
	.mot-story h2,
	.mot-standard h2,
	.mot-work h2,
	.mot-invite h2 { font-size: clamp(32px, 8vw, 40px); }
	.mot-lead { font-size: 20px; }
	.mot-cols { grid-template-columns: 1fr 1fr; }
	.mot-principles { grid-template-columns: 1fr 1fr; }
	.mot-from-left { --x: -22px; }
	.mot-from-right { --x: 22px; }
	.mot-from-up { --y: 16px; }
	.mot-btn { width: 100%; }
	.mot-hero__actions,
	.mot-work__actions { flex-direction: column; }
	.mot-btn--hold { width: auto; }
}
@media (min-width: 1100px) {
	.mot-hero h1 span { white-space: nowrap; }
}
@media (prefers-reduced-motion: reduce) {
	.mot-reveal,
	.mot-h-piece,
	.mot-hero__img,
	.mot-btn,
	.mot-btn:hover {
		opacity: 1 !important;
		transform: none !important;
	}
	.mot-ch01-travel { display: none; }
	.mot-hero { position: relative; top: auto; }
}

@media (min-width: 1100px) {
	.mot-hero,
	.mot-hero .mot-frame {
		height: 640px;
		min-height: 640px;
	}
}
.mot-hero__copy { margin-top: 0; }

@media (min-width: 1100px) and (max-height: 820px) {
	.mot-hero .mot-frame { align-items: start; }
	.mot-hero__copy { align-self: start; padding-top: 22px; padding-bottom: 18px; }
}

/* t1204u Chapter 01: seated lines, short build, completed hold. Scroll-scrubbed. */
.mot-hero h1 { line-height: 1.02; }
.mot-ch01-pin { --mot-dy: 1; --mot-shift: 52px; }
.mot-hero__copy { transform: translate3d(0, var(--mot-shift, 0px), 0); }
.mot-ch01-travel { pointer-events: none; }
.mot-ch01-build { height: 300px; }
.mot-ch01-hold { height: 220px; }
.mot-h-piece {
	--t: clamp(0, (var(--p, 0) - var(--a, 0)) / (var(--b, 1) - var(--a, 0)), 1);
	opacity: calc(var(--o0, 0) + (1 - var(--o0, 0)) * var(--t));
	transform: translate3d(0, calc(var(--y0, 0) * var(--mot-dy, 1) * (1 - var(--t)) * 1px), 0);
	transition: none !important;
}
.mot-hero__img { transition: none !important; }
@media (max-width: 1099px) {
	.mot-ch01-pin { --mot-dy: 0.6667; --mot-shift: 42px; }
	.mot-ch01-build { height: 260px; }
	.mot-ch01-hold { height: 200px; }
}
@media (max-width: 767px) {
	.mot-ch01-pin { --mot-dy: 0.4444; --mot-shift: 0px; }
	.mot-ch01-build { height: 220px; }
	.mot-ch01-hold { height: 140px; }
}

/* t1247u: restore pre-t1232u (t1214u) headshot CSS framing. Source files unchanged. */
.mot-photo--craig img {
	object-position: center 8%;
	transform: scale(1.08);
	transform-origin: center 16%;
}
/* t1257u: Nelson + Justin use pre-cropped square derivatives; no CSS zoom or offset. */
.mot-photo--nelson img {
	object-position: 50% 50%;
	transform: none;
	transform-origin: 50% 50%;
}
.mot-photo--justin {
	background: #e4ddd2;
}
.mot-photo--justin img {
	object-position: 50% 50%;
	transform: none;
	image-rendering: auto;
	filter: none;
}
.mot-photo--michelle img {
	object-position: 42% 8%;
	transform: scale(1.72);
	transform-origin: 42% 30%;
}

/* Gold profile dividers — STATIC (t1247u). Not scroll-animated. */
.mot-bridge {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 52px;
	pointer-events: none;
}
.mot-bridge__rule {
	display: block;
	width: 200px;
	height: 2px;
	max-width: 70%;
	background: #C9A65A;
	transform: scaleX(1);
	transform-origin: center center;
}

/* t1247u pinned profile tracks (Craig→Nelson→Justin→Michelle) */
.mot-person-pin {
	--p: 0;
	position: relative;
	width: 100%;
}
.mot-person-pin[data-mot-who="craig"],
.mot-person-pin[data-mot-who="justin"] { background: #F8F5EE; }
.mot-person-pin[data-mot-who="nelson"],
.mot-person-pin[data-mot-who="michelle"] { background: #F2F3F1; }
.mot-person-pin__track {
	position: relative;
	width: 100%;
	/* height set by JS = shell + travel */
}
.mot-person-pin__sticky {
	position: sticky;
	top: var(--mot-pin-top, 12vh);
	width: 100%;
	z-index: 2;
}
.mot[data-reduced="1"] .mot-person-pin__track {
	height: auto !important;
}
.mot[data-reduced="1"] .mot-person-pin__sticky {
	position: relative;
	top: auto;
}

/* Direction defaults: LEFT portrait people (Craig, Justin) */
.mot-person {
	--photo-x0: -42;
	--photo-s0: 0.985;
	--head-x0: 32;
	--head-y0: 16;
	--bio-x0: 26;
	--bio-y0: 20;
	--exp-x0: 22;
	--cta-y0: 18;
}
/* RIGHT portrait people (Nelson, Michelle) */
.mot-person--flip,
.mot-person--nelson,
.mot-person--michelle {
	--photo-x0: 42;
	--head-x0: -32;
	--bio-x0: -26;
	--exp-x0: -22;
}

/* t1247u five-stage scroll-driven assemble.
   1 Portrait 2 Role+Name+Tagline 3 Bio 4 Specialties 5 Contact
   Scroll-linked via --p. Stop freezes. Reverse rewinds. */
.mot-person .mot-in-photo,
.mot-person .mot-in-heading,
.mot-person .mot-in-bio,
.mot-person .mot-in-exp,
.mot-person .mot-in-cta {
	transition: none !important;
	will-change: transform, opacity;
}

/* STAGE 1 — Portrait 0.00 → 0.24 */
.mot-person .mot-in-photo {
	--t: clamp(0, var(--p, 0) / 0.24, 1);
	opacity: calc(0 + 1 * var(--t));
	transform: translate3d(calc(var(--photo-x0) * (1 - var(--t)) * 1px), 0, 0) scale(calc(var(--photo-s0) + (1 - var(--photo-s0)) * var(--t)));
}

/* STAGE 2 — Role + Name + Tagline ONE group 0.14 → 0.42 */
.mot-person .mot-in-heading {
	--t: clamp(0, (var(--p, 0) - 0.14) / 0.28, 1);
	opacity: calc(0 + 1 * var(--t));
	transform: translate3d(calc(var(--head-x0) * (1 - var(--t)) * 1px), calc(var(--head-y0) * (1 - var(--t)) * 1px), 0);
}

/* STAGE 3 — Biography ONE block 0.30 → 0.64 */
.mot-person .mot-in-bio {
	--t: clamp(0, (var(--p, 0) - 0.30) / 0.34, 1);
	opacity: calc(0 + 1 * var(--t));
	transform: translate3d(calc(var(--bio-x0) * (1 - var(--t)) * 1px), calc(var(--bio-y0) * (1 - var(--t)) * 1px), 0);
}

/* STAGE 4 — Specialties ONE group 0.52 → 0.80 */
.mot-person .mot-in-exp {
	--t: clamp(0, (var(--p, 0) - 0.52) / 0.28, 1);
	opacity: calc(0 + 1 * var(--t));
	transform: translate3d(calc(var(--exp-x0) * (1 - var(--t)) * 1px), 0, 0);
}

/* STAGE 5 — Contact button 0.72 → 1.00 */
.mot-person .mot-in-cta {
	--t: clamp(0, (var(--p, 0) - 0.72) / 0.28, 1);
	opacity: calc(0 + 1 * var(--t));
	transform: translate3d(0, calc(var(--cta-y0) * (1 - var(--t)) * 1px), 0);
}

@media (max-width: 1099px) {
	.mot-bridge { height: 44px; }
	.mot-bridge__rule { width: 180px; }
	.mot-person {
		--photo-x0: -32;
		--head-x0: 24;
		--head-y0: 16;
		--bio-x0: 20;
		--bio-y0: 20;
		--exp-x0: 16;
		--cta-y0: 16;
	}
	.mot-person--flip,
	.mot-person--nelson,
	.mot-person--michelle {
		--photo-x0: 32;
		--head-x0: -24;
		--bio-x0: -20;
		--exp-x0: -16;
	}
	.mot-person .mot-person__grid,
	.mot-person.mot-person--flip .mot-person__grid {
		grid-template-columns: 270px minmax(0, 1fr);
		padding-top: 18px;
		padding-bottom: 32px;
	}
	.mot-person.mot-person--flip .mot-person__grid {
		grid-template-columns: minmax(0, 1fr) 270px;
	}
	.mot-person .mot-photo {
		grid-column: 1;
		grid-row: 1;
		order: 0;
		width: 250px;
		height: 250px;
		justify-self: start;
		margin-top: -8px;
	}
	.mot-person .mot-story { grid-column: 2; grid-row: 1; order: 0; }
	.mot-person .mot-exp,
	.mot-person.mot-person--flip .mot-exp {
		grid-column: 1 / -1;
		grid-row: 2;
		order: 0;
		flex-direction: row;
		flex-wrap: wrap;
	}
	.mot-person.mot-person--flip .mot-story { grid-column: 1; grid-row: 1; order: 0; }
	.mot-person.mot-person--flip .mot-photo {
		grid-column: 2;
		grid-row: 1;
		order: 0;
		justify-self: end;
	}
}
@media (max-width: 759px) {
	.mot-bridge { height: 40px; }
	.mot-bridge__rule { width: 150px; }
	.mot-person {
		--photo-x0: -22;
		--photo-s0: 0.99;
		--head-x0: 18;
		--head-y0: 14;
		--bio-x0: 14;
		--bio-y0: 14;
		--exp-x0: 12;
		--cta-y0: 14;
	}
	.mot-person--flip,
	.mot-person--nelson,
	.mot-person--michelle {
		--photo-x0: 22;
		--head-x0: -18;
		--bio-x0: -14;
		--exp-x0: -12;
	}
	.mot-person .mot-person__grid,
	.mot-person.mot-person--flip .mot-person__grid {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		padding-top: 8px;
		padding-bottom: 28px;
	}
	.mot-person .mot-story,
	.mot-person.mot-person--flip .mot-story { display: contents; }
	.mot-person .mot-photo,
	.mot-person.mot-person--flip .mot-photo {
		order: 1;
		width: 220px;
		height: 220px;
		margin: 8px auto 6px;
		align-self: center;
		justify-self: center;
	}
	.mot-person .mot-in-heading { order: 2; }
	.mot-person .mot-bio { order: 3; }
	.mot-person .mot-exp,
	.mot-person.mot-person--flip .mot-exp {
		order: 4;
		width: 100%;
		flex-direction: column;
	}
	.mot-person .mot-in-cta { order: 5; }
	.mot-person .mot-exp li,
	.mot-person.mot-person--flip .mot-exp li { flex: 0 0 auto; }
}
@media (prefers-reduced-motion: reduce) {
	.mot-person .mot-in-photo,
	.mot-person .mot-in-heading,
	.mot-person .mot-in-bio,
	.mot-person .mot-in-exp,
	.mot-person .mot-in-cta {
		opacity: 1 !important;
		transform: none !important;
	}
	.mot-bridge__rule { transform: scaleX(1) !important; }
	.mot-person-pin__track { height: auto !important; }
	.mot-person-pin__sticky { position: relative !important; top: auto !important; }
}

/* t1255u closing sections A/B/C (07 standard, 08 work, 09 invite) — SHORT PINNED builds.
   Same track > sticky > section architecture as the t1247u profile pins.
   ARRIVE (hidden, frame visible) → PIN (content block centred ~57% vh) → BUILD by scroll
   → SETTLE → RELEASE. Track height = section + build-distance spacer (CSS vh), so
   page height never depends on JS measurement. JS only sets the sticky top (--mot-cl-top)
   and writes progress --clp (0→1) = scroll travelled while pinned / build distance.
   Opacity + `translate` (Y only). Hidden start state keys off html.js-mot-closing, which is
   added in <head> before first paint only when JS runs and reduced motion is off. */
.mot-cl-pin { position: relative; width: 100%; }
.mot-cl-pin--a { background: var(--navy); }
.mot-cl-pin--b { background: var(--ivory); }
.mot-cl-pin--c { background: #101820; }
.mot-cl-pin__track { position: relative; width: 100%; }
/* build distance = in-flow spacer after the sticky (sticky travels only within the
   track content box, so the reserve must be content, not padding) */
.mot-cl-pin__hold { display: none; pointer-events: none; }
html.js-mot-closing .mot-cl-pin__hold { display: block; height: var(--mot-cl-hold, 0px); }
html.js-mot-closing .mot-cl-pin__sticky {
	position: sticky;
	top: var(--mot-cl-top, 20vh);
	width: 100%;
	z-index: 1;
}
/* build distances — desktop ≥1100 */
.mot-cl-pin--a { --mot-cl-hold: 65vh; }
.mot-cl-pin--b { --mot-cl-hold: 55vh; }
.mot-cl-pin--c { --mot-cl-hold: 45vh; }

.mot-cl { --cl-y: 0px; }
.mot-cl--head { --cl-y: 24px; }
.mot-cl--support { --cl-y: 16px; }
.mot-cl--principle { --cl-y: 18px; }
.mot-cl--button { --cl-y: 14px; }
.mot-cl--cta { --cl-y: 14px; }
html.js-mot-closing .mot-cl {
	--cl-t: clamp(0, (var(--clp, 0) - var(--cla, 0)) / (var(--clb, 1) - var(--cla, 0)), 1);
	opacity: var(--cl-t);
	/* gentle quadratic ease-out on travel, no overshoot; vertical only */
	translate: 0 calc(var(--cl-y) * (1 - var(--cl-t)) * (1 - var(--cl-t)));
	/* never ease opacity/translate over time — keep hover easing on transform/colours only */
	transition-property: transform, color, background-color, border-color, box-shadow !important;
}
/* focus safeguard: a focused control inside an unrevealed stage is always visible */
html.js-mot-closing .mot-cl:focus-within {
	opacity: 1;
	translate: none;
}
@media (max-width: 1099px) {
	.mot-cl-pin--a { --mot-cl-hold: 58vh; }
	.mot-cl-pin--b { --mot-cl-hold: 50vh; }
	.mot-cl-pin--c { --mot-cl-hold: 42vh; }
}
@media (max-width: 767px) {
	.mot-cl-pin--a { --mot-cl-hold: 52vh; }
	.mot-cl-pin--b { --mot-cl-hold: 48vh; }
	.mot-cl-pin--c { --mot-cl-hold: 40vh; }
	.mot-cl--head { --cl-y: 18px; }
	.mot-cl--support { --cl-y: 12px; }
	.mot-cl--principle,
	.mot-cl--button,
	.mot-cl--cta { --cl-y: 10px; }
}
@media (prefers-reduced-motion: reduce) {
	.mot-cl,
	html.js-mot-closing .mot-cl {
		opacity: 1 !important;
		translate: none !important;
	}
	html.js-mot-closing .mot-cl-pin__hold { display: none !important; }
	html.js-mot-closing .mot-cl-pin__sticky { position: relative !important; top: auto !important; }
	.mot-closing-sec { transform: none !important; }
}

/* t1258u — Craig-approved environment images for the two final closing sections.
   B (08 Work With Sundance)  → sundance-mot-work-with-sundance-tampa-residential
   C (09 Room To Build Here)  → sundance-mot-room-to-build-recruitment-workspace
   Images are shown unaltered (no crop of the visual, no mirroring, no filters). Both
   masters fade on the LEFT into a flat cream (B #f7f3e9 / C #f8f4eb, ≈ --ivory); the
   section background is that same cream, so the image's own fade carries the blend.
   DESKTOP ≥1100: image = full section height, anchored RIGHT, intrinsic aspect
   (2121/741 = 2.8623) so nothing is cropped; ivory continues to its left. Section height
   (--env-h) is chosen per width so the copy column ends before 47% of the image width
   (the quiet zone: luminance p5 ≥ ~195/255). Copy column = what is left of that zone.
   TABLET/PHONE ≤1099: stacked — full-bleed band on top (fixed CSS aspect-ratio, so space
   is reserved before load), copy below on ivory. object-position right keeps the visual.
   Motion: image only joins the existing scroll build via opacity (0.6 → 1 over --clp
   0–0.24). No zoom / parallax / lateral travel. No-JS + reduced motion: opacity 1. */
/* Background = each image's own measured cream field (left column / top / bottom rows of
   the master), 1–2/255 from --ivory #f6f2ea, so the image's edges are invisible. */
.mot-cl-pin--b,
.mot-work { background: #f7f3e9; }
.mot-cl-pin--c,
.mot-invite { background: #f8f4eb; }
.mot-invite { color: var(--ink); }
.mot-invite h2 { color: var(--navy); }
.mot-invite p { color: var(--body); }
.mot-invite .mot-btn--hold { color: var(--navy); }
.mot-invite :focus-visible { outline-color: var(--navy); }
.mot-work h2,
.mot-invite h2 { text-wrap: balance; }
.mot-work,
.mot-invite { position: relative; isolation: isolate; overflow: hidden; overflow: clip; }
.mot-env { margin: 0; pointer-events: none; }
.mot-env picture { display: block; width: 100%; height: 100%; }
.mot-env .mot-env__img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: 100% 50%;
}
html.js-mot-closing .mot-env {
	--env-t: clamp(0, var(--clp, 0) / 0.24, 1);
	opacity: calc(0.6 + 0.4 * var(--env-t));
	will-change: opacity;
}
@media (min-width: 1100px) {
	.mot-work,
	.mot-invite {
		container-type: inline-size;
		display: flex;
		align-items: center;
	}
	.mot-work > .mot-frame,
	.mot-invite > .mot-frame {
		position: static;
		width: 100%;
		/* cqw = section width (container, excludes scrollbar). Frame offset at ≥1440 (frame centred, max 1440) */
		--env-off: max(0px, (100cqw - 1440px) / 2);
		--env-h: clamp(360px, (100cqw - var(--env-need) - var(--env-off)) / 1.517, 680px);
		min-height: var(--env-h);
		display: flex;
		align-items: center;
	}
	/* breathing room so B's photo edge never butts directly against C's photo edge */
	.mot-cl-pin--c { padding-top: clamp(48px, 5vw, 96px); }
	.mot-work > .mot-frame { --env-need: 780px; }
	.mot-invite > .mot-frame { --env-need: 840px; }
	.mot-env {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		height: 100%;
		width: auto;
		aspect-ratio: 2121 / 741;
		z-index: -1;
	}
	.mot-work__inner,
	.mot-invite__inner {
		flex: 0 1 auto;
		/* copy column ends 24px before 47% of the image width (1.517 = 0.53 × 2.8623) */
		width: calc(100cqw - var(--env-h) * 1.517 - var(--env-off) - 24px);
		max-width: none;
		padding: 40px 0 40px 36px;
	}
}
@media (max-width: 1099px) {
	.mot-work__inner,
	.mot-invite__inner { padding-top: 0; }
	.mot-invite__inner { padding-bottom: 72px; max-width: none; }
	.mot-env {
		position: relative;
		margin: 0 -36px 32px;
		aspect-ratio: 2.4 / 1;
	}
}
@media (max-width: 759px) {
	.mot-env {
		margin: 0 -22px 26px;
		aspect-ratio: 3 / 2;
	}
}
@media (prefers-reduced-motion: reduce) {
	.mot-env,
	html.js-mot-closing .mot-env { opacity: 1 !important; }
}

/* t1259u production: hide Houzez duplicate page H1 (page-scoped; prior MOT prod behavior) */
.page-id-18854 .page-title-wrap {
	display: none !important;
}
