
.page-service {
	--service-top-band: 1018px; 
	--service-band: 930px; 
	--service-gap: 140px; 
	--service-hero-height: 678px; 
	--service-lattice-tail: 101px; 
	color: var(--color-cream);
	background: var(--color-black);
}
.page-service .site-footer {
	margin-top: 0;
}
.page-service .service-top {
	position: relative;
	max-width: var(--service-top-band);
	min-height: var(--service-hero-height);
	margin-inline: auto;
}
.page-service .service-body {
	max-width: var(--service-band);
	margin-inline: auto;
}
.page-service .service-eyebrow {
	margin: 0;
	font: var(--label-int);
	letter-spacing: var(--ls-label);
	text-transform: uppercase;
	text-align: center;
	color: var(--color-brand);
}
.page-service .service-title {
	margin: 0;
	font: 700 var(--text-display-s) / 1 var(--font-sans);
	letter-spacing: var(--ls-display);
	text-align: center;
	color: var(--color-cream);
}
.page-service .service-head {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.page-service .service-section {
	margin-top: var(--service-gap);
}
.page-service .service-top::before {
	content: "";
	position: absolute;
	left: 50%;
	width: 100vw;
	translate: -50% 0;
	top: calc(-1 * var(--header-offset));
	height: calc(100% + var(--header-offset) + var(--service-lattice-tail));
	height: round(
		up,
		calc(100% + var(--header-offset) + var(--service-lattice-tail)),
		var(--grid-tile)
	);
	background-image: url(../../media/home/grid-tile.svg);
	background-size: var(--grid-tile) var(--grid-tile);
	background-position: center top;
	z-index: -1;
	pointer-events: none;
}
.page-service .service-back {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	margin: 38px 0 0 -4px;
	font: 700 var(--text-body-int) / 1.4 var(--font-sans);
	color: var(--color-cream);
	text-decoration: none;
}
.page-service .service-back:hover,
.page-service .service-back:focus-visible {
	color: var(--color-brand);
}
.page-service .service-back__arrow {
	flex: none;
	rotate: 180deg;
}
.page-service .service-back__page {
	text-transform: uppercase;
}
.page-service .service-hero {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
.page-service .service-hero__art {
	margin-top: 63px;
	line-height: 0;
}
.page-service .service-art--face {
	display: block;
	width: 124px;
	height: 150px;
}
.page-service .service-art--team {
	display: block;
	width: 266px;
	height: 106px;
	margin: 1px -6px -6px;
}
.page-service .service-art--grid {
	display: block;
	width: 148px;
	height: 148px;
	overflow: visible;
}
.page-service .service-art--grid g[class^="agent-grid__"] {
	animation-duration: 6s;
	animation-timing-function: cubic-bezier(0.68, -0.6, 0.32, 1.6);
	animation-iteration-count: infinite;
}
.page-service .agent-grid__agent {
	animation-name: agent-grid-from-bl;
}
.page-service .agent-grid__a {
	animation-name: agent-grid-from-tl;
}
.page-service .agent-grid__b {
	animation-name: agent-grid-from-tr;
}
.page-service .agent-grid__c {
	animation-name: agent-grid-from-br;
}
@keyframes agent-grid-from-bl {
	0%, 10%, 95%, 100% { translate: 0 0; }
	20%, 35% { translate: 0 -71px; }
	45%, 60% { translate: 71px -71px; }
	70%, 85% { translate: 71px 0; }
}
@keyframes agent-grid-from-tl {
	0%, 10%, 95%, 100% { translate: 0 0; }
	20%, 35% { translate: 71px 0; }
	45%, 60% { translate: 71px 71px; }
	70%, 85% { translate: 0 71px; }
}
@keyframes agent-grid-from-tr {
	0%, 10%, 95%, 100% { translate: 0 0; }
	20%, 35% { translate: 0 71px; }
	45%, 60% { translate: -71px 71px; }
	70%, 85% { translate: -71px 0; }
}
@keyframes agent-grid-from-br {
	0%, 10%, 95%, 100% { translate: 0 0; }
	20%, 35% { translate: -71px 0; }
	45%, 60% { translate: -71px -71px; }
	70%, 85% { translate: 0 -71px; }
}
@media (prefers-reduced-motion: reduce) {
	.page-service .service-art--grid g[class^="agent-grid__"] {
		animation: none;
	}
}
.page-service .service-art--bulb {
	display: block;
	width: 103.962px;
	height: 129px;
	margin: -3px -17px -17px -3px;
	transform-origin: 45px 112px;
}
.page-service .service-art__filament {
	transition: fill 0.4s ease-out;
}
.page-service .service-art__glow {
	transition: opacity 0.4s ease-out;
}
html.reduced-motion .page-service .service-art__filament,
html.js:not(.reduced-motion) .page-service .service-hero__art.is-visible .service-art__filament {
	fill: var(--color-brand);
}
html.reduced-motion .page-service .service-art__glow {
	opacity: 0.6;
}
html.js:not(.reduced-motion) .page-service .service-hero__art.is-visible .service-art--bulb {
	animation: service-bulb-pop 0.7s ease-out both;
}
html.js:not(.reduced-motion) .page-service .service-hero__art.is-visible .service-art__glow {
	opacity: 0.6;
	animation: service-bulb-breathe 2.8s ease-in-out 0.7s infinite;
}
@keyframes service-bulb-pop {
	0% {
		rotate: 0deg;
	}
	57% {
		rotate: -10deg;
	}
	100% {
		rotate: 0deg;
	}
}
@keyframes service-bulb-breathe {
	0%,
	100% {
		opacity: 0.6;
	}
	50% {
		opacity: 0.25;
	}
}
.page-service .service-hero__title {
	margin: 48px 0 0;
	font: var(--display-xl);
	letter-spacing: var(--ls-display);
	color: var(--color-brand);
	text-wrap: balance;
}
.page-service .service-hero__headline {
	max-width: var(--service-headline, 818px);
	margin: 20px 0 0;
	font: 700 var(--text-display-s) / 1 var(--font-sans);
	letter-spacing: var(--ls-display);
	color: var(--color-cream);
	text-wrap: balance;
}
.page-service .service-hero__lead {
	max-width: var(--service-lead, 632px);
	margin: 28px 0 0;
	font: 400 var(--text-lg) / 1.1 var(--font-sans);
	color: var(--color-cream);
}
.page-service .service-opener {
	position: relative;
	overflow: hidden;
	padding: 64px 96px;
	background: var(--color-black);
	border: 1.5px solid var(--color-sand);
	border-radius: var(--radius-opener);
}
.page-service .service-opener::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--gradient-cta-band);
	opacity: 0.9;
	pointer-events: none;
}
.page-service .service-opener__text {
	position: relative;
	max-width: 735px;
	margin: 0 auto;
	font: 700 var(--text-display-xs) / 1.1 var(--font-sans);
	letter-spacing: var(--ls-display);
	text-align: center;
	color: var(--color-cream);
}
.page-service .service-opener__text.is-scrubbing .service-word {
	opacity: 0.3;
	transition: opacity 0.15s linear;
}
.page-service .service-opener__text.is-scrubbing .service-word.is-lit {
	opacity: 1;
}
.page-service .service-build {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 28px;
	margin: 48px 0 0;
	padding: 0;
	list-style: none;
}
.page-service .service-build__card {
	display: flex;
	flex-direction: column;
	padding: 40px 32px;
	background: linear-gradient(180deg, var(--color-black), var(--color-grid));
	border: 1.5px solid var(--color-sand);
	border-radius: var(--radius-block);
}
.page-service .service-build__icon {
	display: block;
	align-self: flex-end;
	width: 160px;
	height: 66px;
	margin-bottom: 48px;
}
.page-service .service-build__eyebrow {
	margin: 0;
	font: var(--label-m);
	letter-spacing: var(--ls-label);
	text-transform: uppercase;
	color: var(--color-brand);
}
.page-service .service-build__text {
	margin: 12px 0 0;
	font: var(--body-m);
}
.page-service .service-build__card:nth-child(2).is-visible {
	transition-delay: 80ms;
}
.page-service .service-included {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 14px 12px;
	margin: 40px 0 0;
	padding: 0;
	list-style: none;
}
.page-service .service-included li {
	padding: 14px 26px;
	background: linear-gradient(180deg, var(--color-black), var(--color-sand));
	border: 1px solid var(--color-pill-edge);
	border-radius: var(--radius-pill);
	filter: drop-shadow(0 4px 2px color-mix(in srgb, var(--color-black) 25%, transparent));
	font: 700 var(--text-base) / 1.35 var(--font-sans);
	color: var(--color-cream);
	white-space: nowrap;
	transition:
		background 0.2s ease,
		color 0.2s ease;
}
.page-service .service-included li:hover {
	background: var(--color-brand);
	color: var(--color-black);
}
html.js:not(.reduced-motion) .page-service .service-included li {
	opacity: 0;
	scale: 0.96;
}
html.js:not(.reduced-motion) .page-service .service-included.is-visible li {
	opacity: 1;
	scale: 1;
	transition:
		opacity 0.4s ease-out calc(var(--i) * 40ms),
		scale 0.4s ease-out calc(var(--i) * 40ms),
		background 0.2s ease,
		color 0.2s ease;
}
.page-service .quote-band {
	grid-template-columns: var(--service-quote, 387px) auto;
	justify-content: center;
	gap: var(--service-quote-gap, 107px);
	margin-top: 40px;
	padding: 48px var(--service-quote-pad, 80px);
}
.page-service .quote-band__quote p {
	max-width: none;
}
.page-service .quote-band__person {
	grid-template-columns: 64px max-content;
	row-gap: 3px;
}
.page-service .quote-band__role {
	max-width: 249px;
	text-wrap: balance;
}
.page-service .quote-band__role {
	font: var(--label-m);
	letter-spacing: var(--ls-label);
}
.page-service .service-faq {
	display: flex;
	flex-direction: column;
	gap: 28px;
	margin-top: 40px;
}
.page-service .service-faq__q {
	display: flex;
	align-items: center;
	gap: 40px;
	padding-bottom: 16px;
	border-bottom: 2px solid color-mix(in srgb, var(--color-sand) 80%, transparent);
	font: 700 var(--text-display-xs) / 1.1 var(--font-sans);
	letter-spacing: var(--ls-display);
	color: var(--color-sand-soft);
	cursor: pointer;
	list-style: none;
	transition:
		color 0.2s ease,
		border-color 0.2s ease;
}
.page-service .service-faq__q::-webkit-details-marker {
	display: none;
}
.page-service .service-faq__item[open] .service-faq__q {
	color: var(--color-cream);
}
.page-service .service-faq__q:hover,
.page-service .service-faq__q:focus-visible {
	color: var(--color-cream);
	border-color: var(--color-brand);
}
.page-service .service-faq__icon {
	flex: none;
	margin-left: auto;
	width: 36px;
	height: 18px;
	border: 2.5px solid var(--color-brand);
	border-radius: 0 0 var(--radius-pill) var(--radius-pill);
	transition: transform 0.3s ease-out;
}
.page-service .service-faq__item[open] .service-faq__icon {
	transform: rotate(180deg);
}
.page-service .service-faq__a {
	overflow: hidden;
}
.page-service .service-faq__a p {
	max-width: 745px;
	margin: 20px 0 12px;
	font: var(--body-m);
	transition: opacity 0.3s ease-out;
}
.page-service .service-faq__item:not([open]) .service-faq__a p {
	opacity: 0;
}
.page-service .final-cta {
	padding-top: var(--service-gap);
}
html.js:not(.reduced-motion) .page-service .service-cta .final-cta__band {
	opacity: 0;
	transform: translateY(24px) scale(0.98);
}
html.js:not(.reduced-motion) .page-service .service-cta.is-visible .final-cta__band {
	opacity: 1;
	transform: none;
	transition:
		opacity 0.7s ease-out,
		transform 0.7s ease-out,
		border-radius 0.2s ease;
}
@media (max-width: 1099px) {
	.page-service .service-top,
	.page-service .service-body {
		padding-inline: var(--page-gutter-sm);
	}
	.page-service .service-body {
		max-width: calc(var(--service-band) + 2 * var(--page-gutter-sm));
	}
	.page-service .service-opener {
		padding: 56px 48px;
	}
	.page-service .quote-band {
		grid-template-columns: 1fr;
		gap: 24px;
		padding: 40px;
	}
}
@media (max-width: 767px) {
	.page-service {
		--service-gap: 80px;
		--service-hero-height: 0;
	}
	.page-service .service-top::before {
		top: calc(-1 * var(--header-offset-sm));
		height: calc(100% + var(--header-offset-sm) + var(--service-lattice-tail));
		height: round(
			up,
			calc(100% + var(--header-offset-sm) + var(--service-lattice-tail)),
			var(--grid-tile)
		);
	}
	.page-service .service-back {
		margin-top: 24px;
	}
	.page-service .service-hero__art {
		margin-top: 40px;
		zoom: 0.75;
	}
	.page-service .service-hero__title {
		margin-top: 32px;
		font: var(--display-hero-sm);
	}
	.page-service .service-hero__headline {
		font-size: var(--text-display-xs);
	}
	.page-service .service-hero__lead {
		font-size: var(--text-base);
	}
	.page-service .service-body {
		padding-top: 96px;
	}
	.page-service .service-opener {
		padding: 40px 24px;
	}
	.page-service .service-opener__text {
		font-size: var(--text-lg);
	}
	.page-service .service-build {
		grid-template-columns: 1fr;
		gap: 20px;
	}
	.page-service .service-build__card:nth-child(2).is-visible {
		transition-delay: 0s;
	}
	.page-service .service-included li {
		white-space: normal;
		text-align: center;
	}
	.page-service .quote-band {
		padding: 32px 24px;
	}
	.page-service .quote-band__person {
		grid-template-columns: 64px minmax(0, max-content);
	}
	.page-service .service-faq__q {
		gap: 20px;
		font-size: var(--text-lg);
	}
}
