/* ==========================================================================
   More Services page
   Built from design/more-services-reference.png (669 x 861).

   From 1280px up the page is laid out in the reference's own units: every
   desktop size below is calc(N * var(--u)), where N is the measurement in
   reference pixels and --u is the fixed px size of one reference pixel at
   that breakpoint (the card grid, 625 reference px wide, filling the site
   container). So the page keeps the reference's proportions, and its line
   breaks, at every desktop width. --u only changes at breakpoints, so the
   SIZING RULE in theme.css (no vw/vh for type) still holds.

   The words on the photos (carved into the banner wall, on the notebook,
   the document box and the sky) are live text, not part of the image files.
   Each photo sits on a "canvas" that keeps the file's own proportions and
   covers its frame the way object-fit: cover would, so a percentage on the
   canvas always lands on the same spot of the picture. Text on a canvas is
   sized in cqw of that canvas so it scales with the photo.
   ========================================================================== */

.page-template-template-more-services {
	--ms-navy: #0a1e42;
	--ms-text: #4b5974;
	--ms-note: #7a849c;
	--ms-gold: #9c7a4e;
	--ms-gold-line: #b09370;
	--ms-bronze: #8e6838;
	--ms-button: #94703e;
	--ms-script: #a4815a;
	--ms-line: #e7e5e4;

	/* Mobile / tablet sizes; desktop replaces them with reference units. */
	--ms-hero-h: 0px;
	--ms-hero-pad-top: 56px;
	--ms-hero-pad-bottom: 56px;
	--ms-hero-x: 0px;
	--ms-eyebrow: 13px;
	--ms-hero-title: 38px;
	--ms-hero-title-lh: 44px;
	--ms-hero-title-gap: 16px;
	--ms-rule-w: 56px;
	--ms-rule-gap: 24px;
	--ms-hero-lede: 18px;
	--ms-hero-lede-lh: 27px;
	--ms-hero-lede-gap: 22px;

	--ms-sec-top: 28px;
	--ms-sec-bottom: 28px;
	--ms-col-gap: 20px;
	--ms-row-gap: 20px;
	--ms-inset: 10px;
	--ms-inset-bottom: 10px;
	--ms-body-x: 24px;
	--ms-body-right: 24px;

	--ms-pad-top: 30px;
	--ms-num-title: 16px;
	--ms-flag-gap: 8px;
	--ms-flag-title: 10px;
	--ms-title-lede: 12px;
	--ms-lede-list: 20px;
	--ms-item-gap: 10px;
	--ms-list-note: 22px;
	--ms-pad-bottom: 30px;

	--ms-num: 18px;
	--ms-dash: 40px;
	--ms-num-gap: 14px;
	--ms-flag: 14px;
	--ms-title: 28px;
	--ms-title-lh: 34px;
	--ms-lede: 17px;
	--ms-lede-lh: 25px;
	--ms-item: 16px;
	--ms-item-lh: 24px;
	--ms-check: 22px;
	--ms-item-x: 36px;
	--ms-note-size: 14px;
	--ms-note-lh: 21px;
	--ms-media-h: 320px;

	--ms-cta-top: 48px;
	--ms-cta-bottom: 52px;
	--ms-cta-title: 30px;
	--ms-cta-rule-gap: 18px;
	--ms-cta-lede: 17px;
	--ms-cta-lede-lh: 25px;
	--ms-cta-lede-gap: 16px;
	--ms-btn-gap: 24px;
	--ms-btn-w: 240px;
	--ms-btn-h: 56px;
	--ms-btn-size: 17px;
	--ms-btn-arrow: 22px;
	--ms-btn-arrow-gap: 14px;
}

.ms-rule {
	display: block;
	width: var(--ms-rule-w);
	height: 2px;
	background: var(--ms-gold-line);
}

/* --- Banner ----------------------------------------------------------------- */

.ms-hero {
	position: relative;
	min-height: var(--ms-hero-h);
	overflow: hidden;
	background: #f6f2ef;
}

.ms-hero__media {
	position: absolute;
	inset: 0;
	container-type: size;
}

/* Cream wash that carries the copy; the whole photo is under it on small
   screens, only the sky half on desktop. */
.ms-hero__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(248, 245, 242, 0.86);
}

/* 2172 x 724 banner, pinned to the right so the building stays in view. */
.ms-hero__canvas {
	position: absolute;
	top: 50%;
	right: 0;
	width: max(100cqw, 300cqh);
	aspect-ratio: 2172 / 724;
	transform: translateY(-50%);
	container-type: inline-size;
}

.ms-hero__canvas img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
}

/* Cut into the stone wall at the right edge of the photo, following the
   wall's perspective. */
.ms-hero__carved {
	display: none;
	position: absolute;
	top: 29.5%;
	left: 80.6%;
	margin: 0;
	transform: skewY(-25deg);
	transform-origin: left top;
	font-family: var(--display);
	font-size: 1.2cqw;
	font-weight: 400;
	line-height: 2.5;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	white-space: nowrap;
	color: rgba(112, 90, 66, 0.74);
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.55), 0 -1px 0 rgba(80, 58, 34, 0.22);
}

.ms-hero__carved span {
	display: block;
}

.ms-hero__script {
	display: none;
	position: absolute;
	top: 79.5%;
	left: 84.2%;
	margin: 0;
	transform: rotate(-17deg);
	transform-origin: left top;
	font-family: "Hurricane", "Brush Script MT", cursive;
	font-size: 2.1cqw;
	font-weight: 400;
	line-height: 1;
	white-space: nowrap;
	color: var(--ms-script);
}

.ms-hero__script span {
	display: block;
	padding-left: 1.45em;
}

.ms-hero__script span:last-child {
	display: flex;
	align-items: center;
	gap: 0.5em;
	padding-left: 0;
}

.ms-hero__script span:last-child::before {
	content: "";
	flex: none;
	width: 1.3em;
	height: 1px;
	background: currentColor;
	opacity: 0.8;
}

.ms-hero__inner {
	position: relative;
	z-index: 1;
	padding-top: var(--ms-hero-pad-top);
	padding-bottom: var(--ms-hero-pad-bottom);
}

.ms-hero__copy {
	padding-left: var(--ms-hero-x);
}

.ms-hero__eyebrow {
	margin: 0;
	font-size: var(--ms-eyebrow);
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--ms-gold);
}

.ms-hero__title {
	margin: var(--ms-hero-title-gap) 0 0;
	font-family: var(--display);
	font-size: var(--ms-hero-title);
	font-weight: 500;
	line-height: var(--ms-hero-title-lh);
	letter-spacing: -0.01em;
	color: var(--ms-navy);
}

[data-lang="vi"] .ms-hero__title {
	font-size: calc(var(--ms-hero-title) * 0.8);
}

/* Be Vietnam Pro sets wider than Playfair; scaled so each title keeps to
   the same two lines as the English. */
[data-lang="vi"] .ms-card__title {
	font-size: calc(var(--ms-title) * 0.86);
}

.ms-hero .ms-rule {
	margin-top: var(--ms-rule-gap);
}

.ms-hero__lede {
	margin: var(--ms-hero-lede-gap) 0 0;
	font-size: var(--ms-hero-lede);
	line-height: var(--ms-hero-lede-lh);
	color: var(--ms-text);
}

/* The reference's own line breaks hold from 1280 up; narrower screens wrap
   naturally. */
.ms-hero__lede br,
.ms-card__lede br,
.ms-card__list br,
.ms-card__note br {
	display: none;
}

/* --- Service cards ---------------------------------------------------------- */

.ms-services {
	background: #fff;
	padding-top: var(--ms-sec-top);
	padding-bottom: var(--ms-sec-bottom);
}

.ms-grid {
	display: grid;
	gap: var(--ms-row-gap) var(--ms-col-gap);
	margin-block: 0;
	list-style: none;
}

.ms-card {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	background: #fff;
	border: 1px solid var(--ms-line);
	border-radius: 3px;
	box-shadow: 0 6px 18px -14px rgba(10, 30, 66, 0.28);
	scroll-margin-top: calc(var(--header-h) + 24px);
}

.ms-card__body {
	padding: var(--ms-pad-top) var(--ms-body-right) var(--ms-pad-bottom) var(--ms-body-x);
}

.ms-card__num {
	display: flex;
	align-items: center;
	gap: var(--ms-num-gap);
	margin: 0;
	font-size: var(--ms-num);
	font-weight: 400;
	line-height: 1;
	color: var(--ms-gold);
}

.ms-card__num::after {
	content: "";
	width: var(--ms-dash);
	height: 1.5px;
	background: var(--ms-gold-line);
}

.ms-card__flag {
	margin: var(--ms-flag-gap) 0 0;
	font-size: var(--ms-flag);
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: var(--ms-gold);
}

.ms-card__title {
	margin: var(--ms-num-title) 0 0;
	font-family: var(--display);
	font-size: var(--ms-title);
	font-weight: 500;
	line-height: var(--ms-title-lh);
	letter-spacing: -0.01em;
	color: var(--ms-navy);
}

.ms-card__flag + .ms-card__title {
	margin-top: var(--ms-flag-title);
}

.ms-card__lede {
	margin: var(--ms-title-lede) 0 0;
	font-size: var(--ms-lede);
	line-height: var(--ms-lede-lh);
	color: var(--ms-text);
}

.ms-card__list {
	display: grid;
	gap: var(--ms-item-gap);
	margin: var(--ms-lede-list) 0 0;
	padding: 0;
	list-style: none;
}

.ms-card__list li {
	position: relative;
	padding-left: var(--ms-item-x);
	font-size: var(--ms-item);
	line-height: var(--ms-item-lh);
	color: var(--ms-text);
}

.ms-card__check {
	position: absolute;
	top: calc((var(--ms-item-lh) - var(--ms-check)) / 2);
	left: 0;
	display: grid;
	place-items: center;
	width: var(--ms-check);
	height: var(--ms-check);
	border-radius: 50%;
	background: var(--ms-bronze);
	color: #fff;
}

.ms-card__check svg {
	width: 56%;
	height: 56%;
	fill: none;
	stroke: currentColor;
	stroke-width: 3;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.ms-card__note {
	margin: var(--ms-list-note) 0 0;
	font-size: var(--ms-note-size);
	font-style: italic;
	line-height: var(--ms-note-lh);
	color: var(--ms-note);
}

/* Photo frame, inset inside the card like a mounted print. */
.ms-card__media {
	--ms-fx: 50%;
	--ms-fy: 50%;
	--ms-zoom: 1;
	position: relative;
	height: var(--ms-media-h);
	margin: 0 var(--ms-inset) var(--ms-inset-bottom);
	overflow: hidden;
	container-type: size;
}

/* 1024 x 1536 photo covering the frame (times --ms-zoom); --ms-fx/--ms-fy
   is the point of the photo held at the same point of the frame. */
.ms-card__canvas {
	position: absolute;
	top: var(--ms-fy);
	left: var(--ms-fx);
	width: calc(max(100cqw, 66.667cqh) * var(--ms-zoom));
	aspect-ratio: 1024 / 1536;
	transform: translate(calc(var(--ms-fx) * -1), calc(var(--ms-fy) * -1));
	container-type: inline-size;
}

.ms-card__canvas img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
}

/* Framed like the reference: the notebook and the pen low in the frame,
   closer in on the document box, the family centred on the hill. */
.ms-card--business-funding .ms-card__media {
	--ms-fy: 74%;
	--ms-zoom: 1.2;
}

.ms-card--document-preparation .ms-card__media {
	--ms-fx: 73.6%;
	--ms-fy: 51%;
	--ms-zoom: 1.43;
}

.ms-card--life-insurance .ms-card__media {
	--ms-fx: 46%;
	--ms-fy: 41%;
	--ms-zoom: 1.1;
}

.ms-card__tag {
	position: absolute;
	margin: 0;
	pointer-events: none;
	white-space: nowrap;
}

.ms-card__tag span {
	display: block;
}

/* Written across the notebook page above the pen. */
.ms-card__tag--notebook {
	top: 62.5%;
	left: 49.5%;
	transform: rotate(21deg);
	transform-origin: left top;
	font-size: 2.8cqw;
	font-weight: 400;
	line-height: 1.65;
	letter-spacing: 0.34em;
	text-transform: uppercase;
	color: rgba(58, 56, 54, 0.82);
}

.ms-card__tag--notebook span:nth-child(2) {
	margin-left: -1em;
}

.ms-card__tag--notebook span:nth-child(3) {
	margin-left: -2em;
}

.ms-card__tag--notebook span:nth-child(4) {
	margin-left: -3em;
}

/* Printed on the front of the linen document box. */
.ms-card__tag--box {
	top: 45.4%;
	left: 54.9%;
	transform: skewY(4deg);
	transform-origin: left top;
	font-size: 3.1cqw;
	font-weight: 500;
	line-height: 2.2;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	color: rgba(66, 62, 58, 0.85);
}

/* "Bước tiếp theo" runs longer than "Next Steps"; kept on the box face. */
[data-lang="vi"] .ms-card__tag--box {
	font-size: 2.6cqw;
	letter-spacing: 0.18em;
}

/* On the evening sky, pinned to the frame's top-left corner. */
.ms-card__tag--sky {
	top: 6.4%;
	left: 13%;
	font-size: 5.25cqw;
	font-weight: 500;
	line-height: 1.85;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: rgba(84, 72, 62, 0.88);
}

.ms-card__tag--sky::after {
	content: "";
	display: block;
	width: 12.8cqw;
	height: 1.5px;
	margin-top: 5cqw;
	background: rgba(84, 72, 62, 0.7);
}

/* --- Not sure where to start ------------------------------------------------ */

.ms-cta {
	position: relative;
	overflow: hidden;
	padding-top: var(--ms-cta-top);
	padding-bottom: var(--ms-cta-bottom);
	background:
		linear-gradient(rgba(250, 246, 240, 0.8), rgba(250, 246, 240, 0.8)),
		#f6efe8 url("../images/more-services/more-services_not-sure-where-to-start.avif") left center / cover no-repeat;
	text-align: center;
}

.ms-cta__inner {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.ms-cta__title {
	margin: 0;
	font-family: var(--display);
	font-size: var(--ms-cta-title);
	font-weight: 500;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: var(--ms-navy);
}

.ms-cta .ms-rule {
	margin-top: var(--ms-cta-rule-gap);
}

.ms-cta__lede {
	margin: var(--ms-cta-lede-gap) 0 0;
	font-size: var(--ms-cta-lede);
	line-height: var(--ms-cta-lede-lh);
	color: var(--ms-text);
	text-wrap: pretty;
}

.ms-cta__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--ms-btn-arrow-gap);
	width: var(--ms-btn-w);
	max-width: 100%;
	height: var(--ms-btn-h);
	margin-top: var(--ms-btn-gap);
	border-radius: 4px;
	background: var(--ms-button);
	box-shadow: 0 8px 18px -12px rgba(80, 52, 20, 0.55);
	font-size: var(--ms-btn-size);
	font-weight: 500;
	color: #fff;
	text-decoration: none;
	transition: background-color 0.25s var(--ease), transform 0.25s var(--ease);
}

.ms-cta__btn:hover {
	background: #85622f;
	color: #fff;
	transform: translateY(-2px);
}

.ms-cta__btn svg {
	width: var(--ms-btn-arrow);
	height: auto;
	aspect-ratio: 16 / 12;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.4;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.ms-cta__script {
	display: none;
	position: absolute;
	top: 37%;
	left: 83.5%;
	margin: 0;
	transform: rotate(-19deg);
	transform-origin: left top;
	font-family: "Hurricane", "Brush Script MT", cursive;
	font-size: 44px;
	line-height: 0.85;
	white-space: nowrap;
	color: var(--ms-script);
	text-align: left;
}

.ms-cta__script span {
	display: block;
}

.ms-cta__script span:nth-child(2) {
	padding-left: 0.25em;
}

.ms-cta__script span:last-child {
	display: flex;
	align-items: center;
	gap: 0.2em;
}

.ms-cta__script span:last-child::before {
	content: "";
	flex: none;
	width: 0.7em;
	height: 1px;
	background: currentColor;
	opacity: 0.8;
}

/* --- Breakpoints ------------------------------------------------------------ */

@media (min-width: 600px) {
	/* Copy on the left, the photo mounted on the right. */
	.ms-card {
		grid-template-columns: minmax(0, 1.515fr) minmax(0, 1fr);
	}

	.ms-card__media {
		height: auto;
		min-height: 300px;
		margin: var(--ms-inset) var(--ms-inset) var(--ms-inset-bottom) 0;
	}
}

@media (min-width: 768px) {
	.page-template-template-more-services {
		--ms-hero-title: 46px;
		--ms-hero-title-lh: 54px;
		--ms-cta-title: 38px;
	}
}

@media (min-width: 1080px) {
	.page-template-template-more-services {
		--ms-hero-h: 400px;
		--ms-hero-x: 24px;
		--ms-hero-title: 50px;
		--ms-hero-title-lh: 60px;
		--ms-body-x: 24px;
		--ms-body-right: 14px;
		--ms-title: 26px;
		--ms-title-lh: 32px;
		--ms-lede: 16px;
		--ms-lede-lh: 23px;
		--ms-item: 15px;
		--ms-item-lh: 23px;
		--ms-check: 20px;
		--ms-item-x: 32px;
		--ms-note-size: 13px;
		--ms-note-lh: 19px;
		--ms-flag: 13px;
	}

	.ms-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* The wash gives way to the photograph past the copy. */
	.ms-hero__media::after {
		background: linear-gradient(90deg,
			rgba(248, 245, 242, 0.96) 0%,
			rgba(248, 245, 242, 0.9) 30%,
			rgba(248, 245, 242, 0.5) 44%,
			rgba(248, 245, 242, 0) 56%);
	}

	.ms-hero__carved,
	.ms-hero__script {
		display: block;
	}

	/* The olive sprig clears the centred copy from here up. */
	.ms-cta {
		background: #f6efe8 url("../images/more-services/more-services_not-sure-where-to-start.avif") left center / cover no-repeat;
	}
}

/* From here up: the reference layout, in reference pixels (see top). */
@media (min-width: 1280px) {
	.page-template-template-more-services {
		--u: 1.894px;

		--ms-hero-h: calc(208 * var(--u));
		--ms-hero-pad-top: calc(36.8 * var(--u));
		--ms-hero-pad-bottom: calc(20 * var(--u));
		--ms-hero-x: calc(12.2 * var(--u));
		--ms-eyebrow: calc(7.44 * var(--u));
		--ms-hero-title: calc(26.7 * var(--u));
		--ms-hero-title-lh: calc(32 * var(--u));
		--ms-hero-title-gap: calc(11.4 * var(--u));
		--ms-rule-w: calc(32 * var(--u));
		--ms-rule-gap: calc(16.6 * var(--u));
		--ms-hero-lede: calc(10.28 * var(--u));
		--ms-hero-lede-lh: calc(14 * var(--u));
		--ms-hero-lede-gap: calc(12.5 * var(--u));

		--ms-sec-top: calc(15.3 * var(--u));
		--ms-sec-bottom: calc(8.3 * var(--u));
		--ms-col-gap: calc(14 * var(--u));
		--ms-row-gap: calc(10.7 * var(--u));
		--ms-inset: calc(4.4 * var(--u));
		--ms-inset-bottom: calc(5.5 * var(--u));
		--ms-body-x: calc(13.1 * var(--u));
		--ms-body-right: calc(5 * var(--u));

		--ms-pad-top: calc(16.2 * var(--u));
		--ms-num-title: calc(9.6 * var(--u));
		--ms-flag-gap: calc(3.8 * var(--u));
		--ms-flag-title: calc(6.1 * var(--u));
		--ms-title-lede: calc(8.3 * var(--u));
		--ms-lede-list: calc(9.8 * var(--u));
		--ms-item-gap: calc(5.4 * var(--u));
		--ms-list-note: calc(13.4 * var(--u));
		--ms-pad-bottom: calc(15.8 * var(--u));

		--ms-num: calc(9.6 * var(--u));
		--ms-dash: calc(23.2 * var(--u));
		--ms-num-gap: calc(7.4 * var(--u));
		--ms-flag: calc(8.3 * var(--u));
		--ms-title: calc(15.3 * var(--u));
		--ms-title-lh: calc(19.25 * var(--u));
		--ms-lede: calc(8.75 * var(--u));
		--ms-lede-lh: calc(12.5 * var(--u));
		--ms-item: calc(8.2 * var(--u));
		--ms-item-lh: calc(13.5 * var(--u));
		--ms-check: calc(11 * var(--u));
		--ms-item-x: calc(21 * var(--u));
		--ms-note-size: calc(7 * var(--u));
		--ms-note-lh: calc(11 * var(--u));

		--ms-cta-top: calc(19 * var(--u));
		--ms-cta-bottom: calc(13.9 * var(--u));
		--ms-cta-title: calc(22.3 * var(--u));
		--ms-cta-rule-gap: calc(13.55 * var(--u));
		--ms-cta-lede: calc(8.86 * var(--u));
		--ms-cta-lede-lh: calc(12.25 * var(--u));
		--ms-cta-lede-gap: calc(8.5 * var(--u));
		--ms-btn-gap: calc(11.6 * var(--u));
		--ms-btn-w: calc(127 * var(--u));
		--ms-btn-h: calc(29 * var(--u));
		--ms-btn-size: calc(8.75 * var(--u));
		--ms-btn-arrow: calc(11.8 * var(--u));
		--ms-btn-arrow-gap: calc(8.3 * var(--u));
	}

	/* Row two (the Nevada-only services) sits tighter in the reference. */
	.ms-card--nevada {
		--ms-pad-top: calc(14 * var(--u));
		--ms-flag-gap: calc(4.2 * var(--u));
		--ms-flag-title: calc(6.5 * var(--u));
		--ms-title-lede: calc(6.5 * var(--u));
		--ms-lede-list: calc(10.2 * var(--u));
		--ms-item-gap: calc(4.4 * var(--u));
		--ms-list-note: calc(10.6 * var(--u));
		--ms-pad-bottom: calc(13 * var(--u));
	}

	/* Commercial real estate is spaced a little more openly in the reference. */
	.ms-card--commercial-real-estate {
		--ms-lede-list: calc(14.2 * var(--u));
		--ms-item-gap: calc(7.2 * var(--u));
	}

	/* The photo is a fixed 120 reference px wide, plus its 4.4 px inset. */
	.ms-card {
		grid-template-columns: minmax(0, 1fr) calc(124.4 * var(--u));
	}

	.ms-hero__lede br,
	.ms-card__lede br,
	.ms-card__list br,
	.ms-card__note br {
		display: inline;
	}

	/* English follows the reference line for line, so its lines never wrap on
	   their own; Vietnamese runs longer and keeps wrapping naturally. */
	[data-lang="en"] .ms-hero__title,
	[data-lang="en"] .ms-hero__lede,
	[data-lang="en"] .ms-card__title,
	[data-lang="en"] .ms-card__lede,
	[data-lang="en"] .ms-card__list li,
	[data-lang="en"] .ms-card__note {
		white-space: nowrap;
	}

	/* The reference sets the closing copy a touch right of centre, each line
	   by its own amount. */
	.ms-cta__title {
		position: relative;
		left: calc(12.25 * var(--u));
	}

	.ms-cta .ms-rule {
		position: relative;
		left: calc(1.5 * var(--u));
	}

	.ms-cta__lede {
		position: relative;
		left: calc(4.8 * var(--u));
	}

	.ms-cta__btn {
		position: relative;
		left: calc(2 * var(--u));
	}

	.ms-cta__lede {
		white-space: nowrap;
	}

	/* Needs the reference spacing to clear the centred copy. */
	.ms-cta__script {
		display: block;
		font-size: calc(19.3 * var(--u));
	}
}

@media (min-width: 1536px) {
	.page-template-template-more-services {
		--u: 2.285px;
	}
}