:root{
	--services-bg:#f4f4f1;
	--services-surface:#fcfcfa;
	--services-text:#171717;
	--services-muted:#666666;
	--services-line:rgba(23,23,23,.12);
	--services-line-strong:rgba(23,23,23,.18);
	--services-font-serif:ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
	--services-font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

html,
body{
	margin:0;
	padding:0;
	background:
		radial-gradient(circle at top left, rgba(255,255,255,.84), transparent 20%),
		linear-gradient(180deg, #f8f8f6 0%, #efefec 100%);
	color:var(--services-text);
	font-family:var(--services-font-serif);
}

body{
	min-height:100vh;
}

.services-shell,
.services-wrap{
	min-height:100vh;
}

.services-wrap{
	padding:0 3.25rem 4rem;
	background:rgba(252,252,250,.88);
}

.services-main{
	padding-top:1rem;
	width:calc(100% + 6.5rem);
	margin-left:-3.25rem;
	margin-right:-3.25rem;
}

.services-hero,
.services-strip,
.services-intro,
.services-lines,
.services-process{
	padding-left:clamp(1rem, 3vw, 3rem);
	padding-right:clamp(1rem, 3vw, 3rem);
}

.services-strip,
.services-lines,
.services-process-track{
	max-width:1440px;
	margin-left:auto;
	margin-right:auto;
}

.services-kicker{
	display:inline-block;
	font-family:var(--services-font-mono);
	font-size:.76rem;
	font-weight:700;
	letter-spacing:.16em;
	text-transform:uppercase;
	color:#7c7c7c;
}

.services-hero{
	position:relative;
	display:block;
	padding:2.5rem 0 3rem;
	overflow:hidden;
	border-radius:0;
	min-height:620px;
	background:#ececea;
}

.services-hero-media,
.services-hero-overlay{
	position:absolute;
	inset:0;
}

.services-hero-media video{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}

.services-hero-overlay{
	background:
		linear-gradient(180deg, rgba(252,252,250,.72), rgba(252,252,250,.84)),
		radial-gradient(circle at 50% 22%, rgba(255,255,255,.32), transparent 28%);
}

.services-hero-copy{
	position:relative;
	z-index:1;
}

.services-hero-copy-centered{
	max-width:1100px;
	margin:0 auto;
	text-align:center;
	padding:6.5rem 2rem 5rem;
}

.services-hero h1{
	margin:1rem 0 0;
	font-family:var(--services-font-serif);
	font-size:clamp(2.8rem, 5.2vw, 4.2rem);
	font-weight:600;
	line-height:1;
	letter-spacing:-.08em;
	max-width:18ch;
	margin-left:auto;
	margin-right:auto;
}

.services-hero p{
	max-width:34rem;
	margin:1.5rem 0 0;
	font-size:1.08rem;
	line-height:1.85;
	color:var(--services-muted);
	margin-left:auto;
	margin-right:auto;
}

.services-actions{
	display:flex;
	flex-wrap:wrap;
	gap:1rem;
	margin-top:2rem;
}

.services-actions-centered{
	justify-content:center;
}

.services-primary-link,
.services-secondary-link{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:1rem 1.55rem;
	border-radius:999px;
	text-decoration:none;
	font-family:var(--services-font-mono);
	font-size:.92rem;
	font-weight:700;
	transition:transform .25s ease, background .25s ease, border-color .25s ease;
}

.services-primary-link{
	background:#171717;
	color:#ffffff;
}

.services-secondary-link{
	background:transparent;
	border:1px solid var(--services-line-strong);
	color:var(--services-text);
}

.services-primary-link:hover,
.services-secondary-link:hover{
	transform:translateY(-2px);
}

.services-strip{
	display:grid;
	grid-template-columns:repeat(3, minmax(0, 1fr));
	gap:1.5rem;
	padding:1.5rem 0;
	border-top:1px solid var(--services-line);
	border-bottom:1px solid var(--services-line);
	align-items:stretch;
}

.services-strip-item span{
	display:block;
	font-family:var(--services-font-mono);
	font-size:.74rem;
	font-weight:700;
	letter-spacing:.16em;
	text-transform:uppercase;
	color:#7f7f7f;
}

.services-strip-item{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:space-between;
	min-height:132px;
	padding-top:.2rem;
	text-align:center;
}

.services-strip-item strong{
	display:block;
	margin-top:.7rem;
	font-family:var(--services-font-mono);
	font-size:2.3rem;
	font-weight:500;
	line-height:1;
	letter-spacing:-.08em;
	font-variant-numeric:tabular-nums;
}

.services-intro{
	max-width:1100px;
	margin:0 auto;
	padding:4.5rem 0 3rem;
	text-align:center;
}

.services-intro h2,
.services-process-heading h2{
	margin:1rem 0 0;
	font-family:var(--services-font-serif);
	font-size:clamp(2.2rem, 4.4vw, 4rem);
	font-weight:600;
	line-height:.96;
	letter-spacing:-.07em;
}

.services-lines{
	padding-top:1rem;
}

.services-shuffle-stage{
	position:relative;
	min-height:280vh;
	--services-process-reveal:0;
}

.services-shuffle-sticky{
	position:sticky;
	top:92px;
	min-height:calc(100vh - 92px);
	padding:2rem 0 0;
	overflow:hidden;
}

.services-focus-wrap{
	opacity:calc(1 - (var(--services-process-reveal) * .95));
	transform:
		translateY(calc(var(--services-process-reveal) * -48px))
		scale(calc(1 - (var(--services-process-reveal) * .03)));
	transition:opacity .25s linear, transform .25s linear;
}

.services-line-item{
	display:grid;
	grid-template-columns:90px minmax(0, 1fr) minmax(240px, .8fr);
	gap:1.4rem;
	align-items:start;
	padding:1.5rem 0;
	border-bottom:1px solid var(--services-line);
}

.services-line-item:first-child{
	border-top:1px solid var(--services-line);
}

.services-line-index,
.services-process-no{
	display:block;
	font-family:var(--services-font-mono);
	font-size:.76rem;
	font-weight:700;
	letter-spacing:.16em;
	text-transform:uppercase;
	color:#7e7e7e;
}

.services-line-main{
	max-width:36rem;
}

.services-line-main h3,
.services-process-step h3{
	margin:0;
	font-family:var(--services-font-serif);
	font-size:2rem;
	font-weight:600;
	line-height:1.02;
	letter-spacing:-.05em;
}

.services-line-main p,
.services-process-step p{
	margin:1rem 0 0;
	font-size:1rem;
	line-height:1.82;
	color:var(--services-muted);
}

.services-line-points{
	margin:0;
	padding:0;
	list-style:none;
}

.services-line-points li{
	padding:.25rem 0;
	font-family:var(--services-font-mono);
	font-size:.88rem;
	font-weight:600;
	letter-spacing:.04em;
	color:#2b2b2b;
}

.services-process-heading{
	max-width:1100px;
	margin:0 auto;
	text-align:center;
}

.services-process-overlay{
	position:absolute;
	inset:0;
	display:flex;
	flex-direction:column;
	justify-content:center;
	padding:2rem 0 0;
	opacity:var(--services-process-reveal);
	transform:translateY(calc((1 - var(--services-process-reveal)) * 90px));
	pointer-events:none;
	transition:opacity .25s linear, transform .25s linear;
}

.services-process-deck{
	display:grid;
	grid-template-columns:repeat(3, minmax(0, 1fr));
	gap:2rem;
	margin-top:2.5rem;
	padding-top:1.5rem;
	border-top:1px solid var(--services-line);
	max-width:1440px;
	margin-left:auto;
	margin-right:auto;
}

.services-process-step{
	padding:1.6rem 1.4rem 0;
	min-height:270px;
	background:rgba(255,255,255,.82);
	border:1px solid rgba(23,23,23,.08);
	border-radius:1.8rem;
	box-shadow:0 22px 50px rgba(23,23,23,.06);
	backdrop-filter:blur(6px);
	transform-origin:center center;
	transition:transform .25s linear;
}

.services-process-step:nth-child(1){
	transform:
		translate(
			calc((1 - var(--services-process-reveal)) * 120px),
			calc((1 - var(--services-process-reveal)) * 100px)
		)
		rotate(calc((1 - var(--services-process-reveal)) * -10deg));
}

.services-process-step:nth-child(2){
	transform:
		translate(
			0,
			calc((1 - var(--services-process-reveal)) * -26px)
		)
		rotate(calc((1 - var(--services-process-reveal)) * 6deg));
}

.services-process-step:nth-child(3){
	transform:
		translate(
			calc((1 - var(--services-process-reveal)) * -120px),
			calc((1 - var(--services-process-reveal)) * 110px)
		)
		rotate(calc((1 - var(--services-process-reveal)) * 11deg));
}

.services-process-step h3{
	margin-top:.9rem;
	font-size:1.65rem;
}

.services-reveal{
	opacity:0;
	transform:translateY(42px);
	transition:
		opacity .85s cubic-bezier(.22,1,.36,1),
		transform .85s cubic-bezier(.22,1,.36,1);
}

.services-reveal[data-reveal="left"]{
	transform:translateX(42px);
}

.services-reveal.is-visible{
	opacity:1;
	transform:none;
}

.services-wrap .site-footer{
	margin-top:1rem;
	padding:1.4rem 0 2rem;
	border-top:1px solid rgba(16,16,16,.08);
}

.services-wrap .site-footer__inner{
	color:var(--services-muted);
}

.services-wrap .site-footer__inner strong{
	color:var(--services-text);
}

@media (prefers-reduced-motion: reduce){
	.services-reveal,
	.services-primary-link,
	.services-secondary-link{
		transition:none;
	}

	.services-reveal{
		opacity:1;
		transform:none;
	}
}

@media (max-width:1199px){
	.services-wrap{
		padding:0 1.5rem 3rem;
	}

	.services-main{
		width:calc(100% + 3rem);
		margin-left:-1.5rem;
		margin-right:-1.5rem;
	}

	.services-hero{
		min-height:560px;
	}

	.services-line-item{
		grid-template-columns:80px minmax(0, 1fr);
		max-width:980px;
		margin-left:auto;
		margin-right:auto;
	}

	.services-line-points{
		grid-column:2;
	}

	.services-shuffle-stage{
		min-height:300vh;
	}

	.services-process-deck{
		grid-template-columns:1fr;
		gap:1.5rem;
	}

	.services-process-step:nth-child(1),
	.services-process-step:nth-child(2),
	.services-process-step:nth-child(3){
		transform:
			translateY(calc((1 - var(--services-process-reveal)) * 50px))
			rotate(calc((1 - var(--services-process-reveal)) * 4deg));
	}
}

@media (max-width:767px){
	.services-wrap{
		padding:0 1.2rem 2.75rem;
	}

	.services-main{
		padding-top:.8rem;
		width:calc(100% + 2.4rem);
		margin-left:-1.2rem;
		margin-right:-1.2rem;
	}

	.services-hero{
		padding:1.75rem 0 2.5rem;
		min-height:480px;
		border-radius:0;
	}

	.services-hero h1{
		font-size:clamp(3rem, 14vw, 4.6rem);
	}

	.services-hero-copy-centered{
		padding:4.8rem 1.2rem 4rem;
	}

	.services-hero-art{
		min-height:260px;
	}

	.services-strip{
		grid-template-columns:1fr;
		gap:1rem;
	}

	.services-intro,
	.services-process-overlay{
		padding-top:4rem;
	}

	.services-shuffle-stage{
		min-height:320vh;
	}

	.services-shuffle-sticky{
		top:76px;
		min-height:calc(100vh - 76px);
	}

	.services-line-item{
		grid-template-columns:1fr;
		gap:.75rem;
		max-width:680px;
	}

	.services-line-points{
		grid-column:auto;
	}

	.services-line-main h3,
	.services-process-step h3{
		font-size:1.6rem;
	}

	.services-process-step{
		min-height:auto;
		padding:1.25rem 1rem 0;
	}
}
