@layer reset, base, layout, components, pages, utilities;

@font-face {
	font-family: "Bebas Neue";
	src: url("../fonts/BebasNeue-Regular.woff2") format("woff2"),
		url("../fonts/BebasNeue-Regular.woff") format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@layer reset {
	*,
	*::before,
	*::after {
		box-sizing: border-box;
	}

	html {
		-webkit-text-size-adjust: 100%;
		scroll-behavior: smooth;
	}

	body {
		margin: 0;
	}

	img,
	picture,
	svg {
		display: block;
		max-width: 100%;
	}

	button,
	input,
	textarea,
	select {
		font: inherit;
	}

	a {
		color: inherit;
		text-decoration: none;
	}
}

@layer base {
	:root {
		--color-black: #121212;
		--color-black-rgb: 18 18 18;
		--color-white: #ffffff;
		--color-white-rgb: 255 255 255;
		--color-green: #a9ff1e;
		--color-green-dark: #4f7f00;
		--color-green-dark-rgb: 79 127 0;
		--color-dark-text: #272727;
		--color-small-heading: #6a6a6b;
		--color-off-white: #f4f3f3;

		--font-body: "Hiragino Kaku Gothic Pro", "Hiragino Sans", "Yu Gothic", Arial, sans-serif;
		--font-heading: "Bebas Neue", "Arial Narrow", Impact, sans-serif;

		--container-max: 1440px;
		--container-padding: clamp(1.25rem, 4vw, 4rem);

		--header-height: 6rem;
		--section-space: 5rem;
		--section-content-gap: 2rem;
		--hero-space: 7.5rem;
		--hero-title-gap: clamp(4.5rem, 7.5vw, 7.5rem);
		--trusted-strip-height: 6.75rem;
		--ease-premium: cubic-bezier(0.16, 1, 0.3, 1);
	}

	body {
		min-width: 320px;
		background: var(--color-black);
		color: var(--color-white);
		font-family: var(--font-body);
		font-size: 1rem;
		font-weight: 300;
		line-height: 1.5;
		text-rendering: optimizeLegibility;
		-webkit-font-smoothing: antialiased;
	}

	body.nav-is-open {
		overflow: hidden;
	}

	::selection {
		background: var(--color-green);
		color: var(--color-black);
	}

	:focus-visible {
		outline: 2px solid var(--color-green);
		outline-offset: 0.35rem;
	}
}

@layer layout {
	.container {
		width: min(100% - (var(--container-padding) * 2), var(--container-max));
		margin-inline: auto;
	}

	.site-main {
		min-height: 100svh;
	}
}

@layer utilities {
	.screen-reader-text {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border: 0;
	}

	.screen-reader-text:focus {
		z-index: 100000;
		top: 1rem;
		left: 1rem;
		width: auto;
		height: auto;
		padding: 0.75rem 1rem;
		clip: auto;
		background: var(--color-green);
		color: var(--color-black);
		font-weight: 700;
	}
}

	.text-nowrap {
		white-space: nowrap;
	}

@layer components {
	.button {
		position: relative;
		isolation: isolate;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-height: 2.35rem;
		padding: 0.55rem 1rem 0.5rem;
		overflow: hidden;
		border: 1px solid rgb(var(--color-white-rgb) / 0.72);
		background: rgb(var(--color-white-rgb) / 0.06);
		color: var(--color-white);
		font-size: 0.9rem;
		font-weight: 300;
		line-height: 1;
		transition:
			border-color 300ms var(--ease-premium),
			color 300ms var(--ease-premium),
			background-color 300ms var(--ease-premium),
			transform 300ms var(--ease-premium);
	}

	.button::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -2;
		background: var(--color-green);
		transform: translateX(-105%) skewX(-14deg);
		transform-origin: left center;
		transition: transform 520ms var(--ease-premium);
	}

	.button::after {
		content: "";
		position: absolute;
		inset-block: -30%;
		left: -45%;
		z-index: -1;
		width: 35%;
		background: linear-gradient(
			90deg,
			transparent,
			rgb(var(--color-white-rgb) / 0.5),
			transparent
		);
		transform: translateX(-120%) skewX(-18deg);
		opacity: 0;
		transition:
			transform 700ms var(--ease-premium),
			opacity 220ms ease;
	}

	.button:hover,
	.button:focus-visible {
		border-color: var(--color-green);
		color: var(--color-black);
		transform: translateY(-1px);
	}

	.button:hover::before,
	.button:focus-visible::before {
		transform: translateX(0) skewX(0);
	}

	.button:hover::after,
	.button:focus-visible::after {
		opacity: 1;
		transform: translateX(440%) skewX(-18deg);
	}

	.button--hero {
		min-height: 2.6rem;
		padding-inline: 1.2rem;
	}


	.button--dark {
		border-color: rgb(39 39 39 / 0.72);
		background: transparent;
		color: var(--color-dark-text);
	}

	.button--dark:hover,
	.button--dark:focus-visible {
		border-color: var(--color-green);
		color: var(--color-black);
	}

	.site-header {
		position: fixed;
		z-index: 50;
		top: 0;
		left: 0;
		width: 100%;
		background: transparent;
		transition:
			background-color 340ms var(--ease-premium),
			border-color 340ms var(--ease-premium),
			box-shadow 340ms var(--ease-premium),
			backdrop-filter 340ms var(--ease-premium);
	}


	.selected-work__header {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	.selected-work__view-all {
		width: fit-content;
		margin-top: 0;
	}

	.selected-work-card {
		grid-template-columns: 1fr;
	}

	.selected-work-card__content {
		min-height: auto;
		padding: 1.6rem;
	}

	.selected-work-card__text {
		max-width: 26rem;
		margin-bottom: 2rem;
	}

	.selected-work-card__button {
		margin-top: 0;
	}

	.selected-work-card__media {
		min-height: clamp(13rem, 54vw, 21rem);
	}

	body.admin-bar .site-header {
		top: 32px;
	}

	.site-header.is-scrolled,
	body.nav-is-open .site-header {
		border-bottom: 1px solid rgb(var(--color-white-rgb) / 0.08);
		background: rgb(var(--color-black-rgb) / 0.74);
		box-shadow: 0 1rem 3rem rgb(0 0 0 / 0.22);
		backdrop-filter: blur(18px) saturate(135%);
	}

	.site-header__inner {
		position: relative;
		display: grid;
		grid-template-columns: auto 1fr auto;
		gap: clamp(1rem, 3vw, 2rem);
		align-items: center;
		min-height: var(--header-height);
	}

	.site-brand {
		position: relative;
		z-index: 55;
		display: inline-flex;
		align-items: center;
		transition: opacity 260ms var(--ease-premium), visibility 260ms var(--ease-premium);
	}

	.site-brand .custom-logo {
		width: auto;
		height: 2.1rem;
	}

	.site-brand__fallback {
		display: inline-flex;
		align-items: baseline;
		color: var(--color-white);
		font-family: var(--font-body);
		font-size: 1.65rem;
		font-weight: 800;
		letter-spacing: -0.08em;
		line-height: 1;
	}

	.site-brand__fallback span:last-child {
		color: var(--color-green);
	}

	.site-nav {
		justify-self: end;
	}

	.site-nav .menu {
		display: flex;
		align-items: center;
		gap: clamp(1.35rem, 2.5vw, 2.6rem);
		padding: 0;
		margin: 0;
		list-style: none;
	}

	.site-nav a {
		position: relative;
		display: inline-flex;
		padding-block: 0.4rem;
		color: rgb(var(--color-white-rgb) / 0.88);
		font-size: 0.88rem;
		line-height: 1;
		transition: color 260ms var(--ease-premium);
	}

	.site-nav a::after {
		content: "";
		position: absolute;
		right: 0;
		bottom: 0.05rem;
		left: 0;
		height: 1px;
		background: var(--color-green);
		transform: scaleX(0);
		transform-origin: right center;
		transition: transform 420ms var(--ease-premium);
	}

	.site-nav a:hover,
	.site-nav a:focus-visible,
	.site-nav .current-menu-item > a {
		color: var(--color-white);
	}

	.site-nav a:hover::after,
	.site-nav a:focus-visible::after,
	.site-nav .current-menu-item > a::after {
		transform: scaleX(1);
		transform-origin: left center;
	}

	.site-nav .site-nav__mobile-cta {
		display: none;
	}

	.site-header__cta {
		justify-self: end;
		min-width: 5.75rem;
	}

	.nav-toggle {
		display: none;
		width: 2.7rem;
		height: 2.7rem;
		padding: 0;
		border: 1px solid rgb(var(--color-white-rgb) / 0.22);
		background: rgb(var(--color-white-rgb) / 0.06);
		color: var(--color-white);
		cursor: pointer;
	}

	.nav-toggle__line {
		display: block;
		width: 1rem;
		height: 1px;
		margin-inline: auto;
		background: currentColor;
		transition:
			transform 260ms var(--ease-premium),
			opacity 260ms var(--ease-premium);
	}

	.nav-toggle__line + .nav-toggle__line {
		margin-top: 0.35rem;
	}

	.nav-is-open .nav-toggle__line:first-child {
		transform: translateY(0.18rem) rotate(45deg);
	}

	.nav-is-open .nav-toggle__line:nth-child(2) {
		transform: translateY(-0.18rem) rotate(-45deg);
	}

	.site-footer {
		background: var(--color-black);
		color: rgb(var(--color-white-rgb) / 0.58);
	}

	.site-footer__inner {
		padding-block: 2rem;
		font-size: 0.85rem;
	}
}

@layer pages {
	.home-hero {
		position: relative;
		isolation: isolate;
		min-height: 100svh;
		overflow: hidden;
		background: var(--color-black);
	}


	.home-hero::before {
		content: "";
		position: absolute;
		inset: -7% -4% -5%;
		z-index: -3;
		background:
			linear-gradient(
				90deg,
				rgb(var(--color-black-rgb) / 0.94) 0%,
				rgb(var(--color-black-rgb) / 0.78) 38%,
				rgb(var(--color-black-rgb) / 0.42) 100%
			),
			url("../images/hero-bg.png") center / cover no-repeat;
		opacity: 0.96;
		transform: scale(1.015);
		animation: nd9-hero-drift 18s var(--ease-premium) infinite alternate;
	}

	.home-hero::after {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -2;
		pointer-events: none;
		background:
			radial-gradient(circle at 76% 28%, rgb(169 255 30 / 0.15), transparent 20rem),
			radial-gradient(circle at 72% 78%, rgb(169 255 30 / 0.11), transparent 26rem),
			linear-gradient(180deg, rgb(0 0 0 / 0.18), rgb(0 0 0 / 0.56));
	}

	.home-hero__inner {
		display: grid;
		grid-template-columns: minmax(0, 1.02fr) minmax(18rem, 0.72fr);
		gap: clamp(2.5rem, 7vw, 7rem);
		align-items: end;
		min-height: 100svh;
		padding-top: calc(var(--header-height) + var(--hero-space));
		padding-bottom: calc(var(--hero-space) + var(--trusted-strip-height));
	}

	.home-hero__content {
		max-width: 47rem;
	}

	.home-hero__title {
		margin: 0;
		color: var(--color-white);
		font-family: var(--font-heading);
		font-size: clamp(4.4rem, 8.7vw, 9.6rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.88;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.home-hero__title-line {
		display: block;
	}

	.home-hero__title-line--accent {
		color: var(--color-green);
	}

	.home-hero__intro {
		max-width: 42rem;
		margin: var(--hero-title-gap) 0 0;
		color: rgb(var(--color-white-rgb) / 0.88);
		font-size: clamp(0.95rem, 1.1vw, 1.08rem);
		line-height: 1.45;
		text-wrap: balance;
	}

	.home-hero .button--hero {
		margin-top: 1.35rem;
	}

	.home-hero__observation {
		align-self: end;
		justify-self: start;
		width: min(100%, 28rem);
		margin-bottom: 0;
		color: var(--color-white);
	}

	.home-hero__observation::before {
		content: "";
		display: block;
		width: 100%;
		height: 1px;
		margin-bottom: 0.95rem;
		background: linear-gradient(
			90deg,
			rgb(var(--color-white-rgb) / 0.7),
			rgb(var(--color-white-rgb) / 0.05)
		);
	}

	.home-hero__observation-kicker {
		margin: 0 0 0.65rem;
		color: var(--color-green);
		font-size: 0.82rem;
		font-weight: 300;
		letter-spacing: 0.14em;
		line-height: 1;
		text-transform: uppercase;
	}

	.home-hero__observation-kicker span {
		margin-right: 0.25rem;
	}

	.home-hero__observation-text {
		margin: 0;
		color: rgb(var(--color-white-rgb) / 0.86);
		font-size: clamp(0.95rem, 1.05vw, 1.05rem);
		line-height: 1.45;
	}

	.trusted-strip {
		position: absolute;
		right: 0;
		bottom: 0;
		left: 0;
		display: grid;
		grid-template-columns: auto minmax(0, 1fr);
		gap: clamp(1.5rem, 4vw, 3.5rem);
		align-items: center;
		padding-top: 1.15rem;
		padding-bottom: 1.65rem;
		border-top: 1px solid rgb(var(--color-white-rgb) / 0.66);
	}

	.trusted-strip__label {
		margin: 0;
		color: rgb(var(--color-white-rgb) / 0.92);
		font-size: 0.78rem;
		font-weight: 700;
		line-height: 1;
		text-transform: uppercase;
		white-space: nowrap;
	}

	.trusted-strip__viewport {
		overflow: visible;
	}

	.trusted-strip__track {
		display: block;
	}

	.trusted-strip__logos {
		display: grid;
		grid-template-columns: repeat(6, minmax(5rem, 1fr));
		gap: clamp(1rem, 2vw, 2rem);
		padding: 0;
		margin: 0;
		list-style: none;
	}

	.trusted-strip__logos--duplicate {
		display: none;
	}

	.trusted-strip__logo-card {
		display: grid;
		place-items: center;
		width: 100%;
		height: clamp(2.8rem, 3.8vw, 3.65rem);
		padding: 0;
		background: transparent;
		box-shadow: none;
		overflow: visible;
	}

	.trusted-strip__logo {
		display: block;
		width: auto;
		max-width: min(10.25rem, 100%);
		height: auto;
		max-height: 3.35rem;
		object-fit: contain;
		object-position: center;
	}

	.section {
		padding-block: var(--section-space);
	}

	.selected-work {
		background: var(--color-white);
		color: var(--color-dark-text);
	}

	.selected-work__header {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		gap: clamp(2rem, 5vw, 4rem);
		align-items: start;
		margin-bottom: clamp(2.5rem, 5vw, 3rem);
	}

	.selected-work__heading-group {
		max-width: 57rem;
	}

	.section-eyebrow,
	.selected-work__eyebrow {
		margin: 0 0 1rem;
		color: var(--color-small-heading);
		font-size: 1rem;
		font-weight: 700;
		letter-spacing: 0.08em;
		line-height: 1.2;
		text-transform: uppercase;
	}

	.selected-work__title {
		margin: 0;
		color: var(--color-dark-text);
		font-family: var(--font-heading);
		font-size: clamp(2.6rem, 4vw, 3rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.98;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.selected-work__title span {
		color: var(--color-green-dark);
	}

	.selected-work__intro {
		max-width: 48rem;
		margin: var(--section-content-gap) 0 0;
		color: var(--color-dark-text);
		font-size: clamp(0.98rem, 1.2vw, 1.08rem);
		line-height: 1.45;
		text-wrap: balance;
	}

	.selected-work__view-all {
		align-self: start;
		margin-top: 2rem;
		white-space: nowrap;
	}

	.selected-work__slider {
		position: relative;
	}

	.selected-work__track {
		display: flex;
		width: 100%;
		overflow: hidden;
		scroll-snap-type: x mandatory;
		scroll-behavior: smooth;
		scrollbar-width: none;
		touch-action: pan-y;
	}

	.selected-work__track::-webkit-scrollbar {
		display: none;
	}

	.selected-work-card {
		position: relative;
		isolation: isolate;
		display: grid;
		grid-template-columns: minmax(17rem, 0.4fr) minmax(0, 1fr);
		flex: 0 0 100%;
		min-width: 100%;
		overflow: hidden;
		scroll-snap-align: start;
		background: var(--color-off-white);
		color: var(--color-dark-text);
	}

	.selected-work-card::before {
		content: "";
		position: absolute;
		z-index: 2;
		inset-block: 0;
		left: 0;
		width: 0.28rem;
		background: var(--color-green-dark);
		transform: scaleY(0);
		transform-origin: top center;
		transition: transform 420ms var(--ease-premium);
	}

	.selected-work-card:hover::before,
	.selected-work-card:focus-within::before {
		transform: scaleY(1);
	}

	.selected-work-card__content {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		min-height: clamp(15.5rem, 24vw, 18rem);
		padding: clamp(1.75rem, 3vw, 2.45rem);
	}

	.selected-work-card__count {
		margin: 0 0 1.35rem;
		color: var(--color-dark-text);
		font-size: 0.82rem;
		font-weight: 700;
		letter-spacing: 0.08em;
		line-height: 1;
	}

	.selected-work-card__title {
		margin: 0;
		font-family: var(--font-body);
		font-size: clamp(1.05rem, 1.4vw, 1.2rem);
		font-weight: 700;
		letter-spacing: -0.03em;
		line-height: 1.25;
	}

	.selected-work-card__title a {
		transition: color 240ms var(--ease-premium);
	}

	.selected-work-card__title a:hover,
	.selected-work-card__title a:focus-visible {
		color: var(--color-green-dark);
	}

	.selected-work-card__text {
		max-width: 15rem;
		margin: 1.25rem 0 0;
		color: var(--color-dark-text);
		font-size: clamp(0.95rem, 1.2vw, 1.04rem);
		line-height: 1.45;
	}

	.selected-work-card__button {
		margin-top: auto;
	}

	.selected-work-card__media {
		position: relative;
		display: block;
		min-height: clamp(15.5rem, 24vw, 18rem);
		overflow: hidden;
		background: #0d1110;
	}

	.selected-work-card__media::after {
		content: "";
		position: absolute;
		inset: 0;
		pointer-events: none;
		background:
			linear-gradient(90deg, rgb(0 0 0 / 0.04), transparent 18%),
			radial-gradient(circle at 78% 26%, rgb(169 255 30 / 0.18), transparent 13rem);
		opacity: 0;
		transition: opacity 420ms var(--ease-premium);
	}

	.selected-work-card:hover .selected-work-card__media::after,
	.selected-work-card:focus-within .selected-work-card__media::after {
		opacity: 1;
	}

	.selected-work-card__media img,
	.selected-work-card__placeholder {
		width: 100%;
		height: 100%;
		min-height: inherit;
		object-fit: cover;
		transition: transform 650ms var(--ease-premium), filter 650ms var(--ease-premium);
	}

	.selected-work-card:hover .selected-work-card__media img,
	.selected-work-card:focus-within .selected-work-card__media img,
	.selected-work-card:hover .selected-work-card__placeholder,
	.selected-work-card:focus-within .selected-work-card__placeholder {
		transform: scale(1.035);
		filter: saturate(1.12);
	}

	.selected-work-card__placeholder {
		position: relative;
		display: block;
		background:
			linear-gradient(180deg, rgb(8 12 14 / 0.88), rgb(10 13 14 / 0.98)),
			radial-gradient(circle at 16% 46%, rgb(169 255 30 / 0.16), transparent 12rem),
			linear-gradient(110deg, transparent 0 38%, rgb(169 255 30 / 0.12) 38.2% 38.8%, transparent 39% 100%),
			linear-gradient(90deg, rgb(169 255 30 / 0.08) 1px, transparent 1px),
			linear-gradient(0deg, rgb(169 255 30 / 0.07) 1px, transparent 1px);
		background-size: auto, auto, auto, 3.5rem 3.5rem, 3.5rem 3.5rem;
	}

	.selected-work-card__placeholder::before,
	.selected-work-card__placeholder::after {
		content: "";
		position: absolute;
		border: 1px solid rgb(169 255 30 / 0.24);
	}

	.selected-work-card__placeholder::before {
		top: 18%;
		left: 8%;
		width: 48%;
		height: 52%;
	}

	.selected-work-card__placeholder::after {
		right: 8%;
		bottom: 16%;
		width: 31%;
		height: 42%;
		background:
			linear-gradient(45deg, transparent calc(50% - 0.5px), rgb(169 255 30 / 0.28) calc(50% - 0.5px) calc(50% + 0.5px), transparent calc(50% + 0.5px)),
			linear-gradient(-45deg, transparent calc(50% - 0.5px), rgb(169 255 30 / 0.28) calc(50% - 0.5px) calc(50% + 0.5px), transparent calc(50% + 0.5px));
	}

	.selected-work-card__placeholder-top,
	.selected-work-card__placeholder-title,
	.selected-work-card__placeholder-box {
		position: absolute;
		display: block;
		border: 1px solid rgb(169 255 30 / 0.25);
	}

	.selected-work-card__placeholder-top {
		top: 18%;
		left: 8%;
		width: 48%;
		height: 2rem;
		border-bottom-color: transparent;
	}

	.selected-work-card__placeholder-top::before,
	.selected-work-card__placeholder-top::after {
		content: "";
		position: absolute;
		top: 0.62rem;
		width: 0.38rem;
		height: 0.38rem;
		border-radius: 999px;
		background: rgb(169 255 30 / 0.55);
	}

	.selected-work-card__placeholder-top::before {
		left: 0.75rem;
	}

	.selected-work-card__placeholder-top::after {
		left: 1.55rem;
	}

	.selected-work-card__placeholder-title {
		top: 42%;
		left: 13%;
		width: 34%;
		height: 0.85rem;
		border-right: 0;
		border-left: 0;
	}

	.selected-work-card__placeholder-box {
		right: 13%;
		bottom: 25%;
		width: 23%;
		height: 27%;
	}

}

@keyframes nd9-hero-drift {
	from {
		transform: scale(1.015) translate3d(0, 0, 0);
	}

	to {
		transform: scale(1.04) translate3d(-0.65rem, -0.4rem, 0);
	}
}

@keyframes nd9-logo-marquee {
	from {
		transform: translate3d(0, 0, 0);
	}

	to {
		transform: translate3d(-50%, 0, 0);
	}
}

@keyframes nd9-logo-marquee-mobile {
	from {
		transform: translate3d(0, 0, 0);
	}

	to {
		transform: translate3d(var(--nd9-marquee-distance, -50%), 0, 0);
	}
}

@media (max-width: 900px) {
	:root {
		--header-height: 5rem;
		--section-space: 5rem;
		--hero-space: 7.5rem;
		--hero-title-gap: clamp(4.5rem, 13vw, 7.5rem);
		--trusted-strip-height: 7.75rem;
	}


	.selected-work__header {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	.selected-work__view-all {
		width: fit-content;
		margin-top: 0;
	}

	.selected-work-card {
		grid-template-columns: 1fr;
	}

	.selected-work-card__content {
		min-height: auto;
		padding: 1.6rem;
	}

	.selected-work-card__text {
		max-width: 26rem;
		margin-bottom: 2rem;
	}

	.selected-work-card__button {
		margin-top: 0;
	}

	.selected-work-card__media {
		min-height: clamp(13rem, 54vw, 21rem);
	}

	body.admin-bar .site-header {
		top: 46px;
	}

	body.nav-is-open::before {
		content: "";
		position: fixed;
		inset: 0;
		z-index: 45;
		background: rgb(0 0 0 / 0.48);
		backdrop-filter: blur(2px);
	}

	body.admin-bar .site-nav {
		top: 46px;
		height: calc(100dvh - 46px);
		min-height: calc(100svh - 46px);
	}

	body.nav-is-open .site-brand {
		opacity: 0;
		visibility: hidden;
	}

	.site-header__inner {
		grid-template-columns: auto minmax(0, 1fr) auto;
		gap: 1rem;
	}

	.site-header__cta {
		display: none;
	}

	.nav-toggle {
		position: relative;
		z-index: 60;
		display: inline-grid;
		grid-column: 3;
		place-content: center;
		justify-self: end;
		margin-left: auto;
	}

	.site-nav {
		position: fixed;
		z-index: 58;
		top: 0;
		right: 0;
		bottom: auto;
		left: auto;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		width: min(31rem, 90vw);
		height: 100dvh;
		min-height: 100svh;
		padding: max(6.5rem, calc(var(--header-height) + 1.5rem)) clamp(1.5rem, 7vw, 3rem) 2.5rem;
		overflow-y: auto;
		overscroll-behavior: contain;
		border-left: 1px solid rgb(var(--color-white-rgb) / 0.1);
		background:
			linear-gradient(160deg, rgb(20 20 20 / 0.98), rgb(7 7 7 / 0.96)),
			radial-gradient(circle at 82% 18%, rgb(169 255 30 / 0.18), transparent 18rem);
		box-shadow: -1.5rem 0 4rem rgb(0 0 0 / 0.38);
		backdrop-filter: blur(20px) saturate(145%);
		transform: translateX(105%);
		opacity: 1;
		pointer-events: none;
		transition: transform 520ms var(--ease-premium);
	}

	.site-nav[data-state="open"] {
		transform: translateX(0);
		pointer-events: auto;
	}

	.site-nav .menu {
		display: grid;
		gap: clamp(0.35rem, 1.8vh, 0.75rem);
		align-items: stretch;
	}

	.site-nav .menu > li,
	.site-nav__mobile-cta {
		opacity: 0;
		transform: translateX(1.25rem);
		transition:
			opacity 380ms ease,
			transform 520ms var(--ease-premium);
	}

	.site-nav[data-state="open"] .menu > li,
	.site-nav[data-state="open"] .site-nav__mobile-cta {
		opacity: 1;
		transform: translateX(0);
	}

	.site-nav[data-state="open"] .menu > li:nth-child(1) {
		transition-delay: 110ms;
	}

	.site-nav[data-state="open"] .menu > li:nth-child(2) {
		transition-delay: 170ms;
	}

	.site-nav[data-state="open"] .menu > li:nth-child(3) {
		transition-delay: 230ms;
	}

	.site-nav[data-state="open"] .menu > li:nth-child(4) {
		transition-delay: 290ms;
	}

	.site-nav[data-state="open"] .site-nav__mobile-cta {
		transition-delay: 350ms;
	}

	.site-nav a:not(.button) {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0.62rem 0;
		border-bottom: 1px solid rgb(var(--color-white-rgb) / 0.1);
		font-family: var(--font-heading);
		font-size: clamp(2.65rem, 11.5vw, 4.45rem);
		letter-spacing: 0.02em;
		line-height: 0.95;
		text-transform: uppercase;
	}

	.site-nav a:not(.button)::before {
		content: "0" counter(nav-item);
		order: 2;
		color: var(--color-green);
		font-family: var(--font-body);
		font-size: 0.75rem;
		letter-spacing: 0.1em;
	}

	.site-nav .menu {
		counter-reset: nav-item;
	}

	.site-nav .menu > li {
		counter-increment: nav-item;
	}

	.site-nav a:not(.button)::after {
		display: none;
	}

	.site-nav .site-nav__mobile-cta {
		display: inline-flex;
		width: fit-content;
		margin-top: clamp(1.5rem, 6vh, 3rem);
	}

	.home-hero::before {
		inset: -4%;
		background:
			linear-gradient(
				180deg,
				rgb(var(--color-black-rgb) / 0.84) 0%,
				rgb(var(--color-black-rgb) / 0.74) 46%,
				rgb(var(--color-black-rgb) / 0.9) 100%
			),
			url("../images/hero-bg.png") center / cover no-repeat;
	}

	.home-hero__inner {
		grid-template-columns: 1fr;
		gap: clamp(3.5rem, 8vh, 5rem);
		align-items: end;
		min-height: auto;
		padding-top: calc(var(--header-height) + var(--hero-space));
		padding-bottom: calc(var(--trusted-strip-height) + 2.5rem);
	}

	.home-hero__content {
		max-width: 42rem;
	}

	.home-hero__title {
		font-size: clamp(3.75rem, 14.5vw, 6.2rem);
	}

	.home-hero__intro {
		max-width: 34rem;
		margin-top: var(--hero-title-gap);
	}

	.home-hero__observation {
		justify-self: stretch;
		width: 100%;
		max-width: 34rem;
		margin-bottom: 0;
	}

	.trusted-strip {
		grid-template-columns: 1fr;
		gap: 1rem;
		width: 100%;
		padding-top: 1.05rem;
		padding-right: var(--container-padding);
		padding-bottom: 1.25rem;
		padding-left: var(--container-padding);
		border-top-color: rgb(var(--color-white-rgb) / 0.42);
	}

	.trusted-strip__label {
		font-size: 0.72rem;
		letter-spacing: 0.08em;
	}

	.trusted-strip__viewport {
		width: calc(100% + (var(--container-padding) * 2));
		margin-inline: calc(var(--container-padding) * -1);
		overflow: hidden;
		-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
		mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	}

	.trusted-strip__track {
		--logo-marquee-gap: clamp(0.85rem, 4vw, 1.4rem);
		--nd9-marquee-duration: 42s;
		display: inline-flex;
		flex-wrap: nowrap;
		width: max-content;
		min-width: max-content;
		animation: nd9-logo-marquee-mobile var(--nd9-marquee-duration) linear infinite;
		transform: translate3d(0, 0, 0);
		will-change: transform;
		-webkit-transform: translate3d(0, 0, 0);
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
	}

	.trusted-strip__track.is-marquee-ready {
		animation-name: nd9-logo-marquee-mobile;
	}

	.trusted-strip__logos,
	.trusted-strip__logos--duplicate {
		display: flex;
		flex: 0 0 auto;
		flex-wrap: nowrap;
		grid-template-columns: none;
		gap: var(--logo-marquee-gap);
		padding-right: var(--logo-marquee-gap);
	}

	.trusted-strip__logos li {
		flex: 0 0 auto;
	}

	.trusted-strip__logo-card {
		width: clamp(6.75rem, 30vw, 9rem);
		height: clamp(2.55rem, 10vw, 3.25rem);
	}

	.trusted-strip__logo {
		max-width: min(8.25rem, 100%);
		max-height: 2.9rem;
	}
}


@media (min-width: 783px) and (max-width: 900px) {
	body.admin-bar .site-header,
	body.admin-bar .site-nav {
		top: 32px;
	}

	body.admin-bar .site-nav {
		height: calc(100dvh - 32px);
		min-height: calc(100svh - 32px);
	}
}

@media (max-width: 560px) {
	:root {
		--hero-space: 6.25rem;
		--hero-title-gap: clamp(4.25rem, 16vw, 6.25rem);
		--trusted-strip-height: 7.25rem;
	}


	.section-eyebrow,
	.selected-work__eyebrow {
		font-size: 0.9rem;
	}

	.selected-work__title {
		font-size: clamp(2.3rem, 11vw, 3rem);
	}

	.selected-work-card__content {
		padding: 1.35rem;
	}

	.home-hero__inner {
		padding-top: calc(var(--header-height) + var(--hero-space));
		padding-bottom: calc(var(--trusted-strip-height) + 2rem);
	}

	.home-hero__title {
		font-size: clamp(3.35rem, 18vw, 4.95rem);
	}

	.home-hero__intro {
		margin-top: var(--hero-title-gap);
	}

	.home-hero__observation {
		margin-bottom: 0;
	}

	.site-nav {
		width: min(27rem, 92vw);
	}

	.site-nav a:not(.button) {
		font-size: clamp(2.35rem, 13vw, 3.65rem);
	}

	.site-nav {
		padding-top: max(5.75rem, calc(var(--header-height) + 0.75rem));
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: 0.001ms !important;
	}

	.trusted-strip__track {
		animation: none !important;
		transform: none !important;
	}
}

/* Index fallback */

.default-page {
	min-height: 100svh;
	padding-block: calc(var(--header-height) + 5rem) 5rem;
	background: var(--color-black);
	color: var(--color-white);
}

.default-page__inner {
	max-width: 72rem;
}

.default-page__header {
	margin-bottom: 3rem;
}

.default-page__title {
	margin: 0;
	font-family: var(--font-heading);
	font-size: clamp(4rem, 9vw, 8rem);
	font-weight: 400;
	line-height: 0.9;
	text-transform: uppercase;
}

.default-page__content {
	display: grid;
	gap: 1.5rem;
}

.default-card {
	padding-block: 1.5rem;
	border-top: 1px solid rgb(var(--color-white-rgb) / 0.16);
}

.default-card__title {
	margin: 0 0 0.75rem;
	font-size: clamp(1.75rem, 4vw, 3rem);
	font-weight: 400;
	line-height: 1;
}

.default-card__title a {
	transition: color 220ms var(--ease-premium);
}

.default-card__title a:hover,
.default-card__title a:focus-visible {
	color: var(--color-green);
}

.default-card__excerpt {
	max-width: 44rem;
	color: rgb(var(--color-white-rgb) / 0.72);
}

@layer pages {
	.selected-work__track {
		overscroll-behavior-x: none;
		scroll-padding-inline: 0;
	}

	.selected-work__controls {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		gap: 0.75rem;
		margin-top: 1.25rem;
	}

	.selected-work__status {
		min-width: 4.75rem;
		margin: 0;
		color: var(--color-small-heading);
		font-size: 0.82rem;
		font-weight: 700;
		letter-spacing: 0.08em;
		line-height: 1;
		text-align: center;
	}

	.selected-work__control {
		position: relative;
		display: inline-grid;
		place-items: center;
		width: 2.45rem;
		height: 2.45rem;
		padding: 0;
		overflow: hidden;
		border: 1px solid rgb(39 39 39 / 0.28);
		border-radius: 999px;
		background: transparent;
		color: var(--color-dark-text);
		cursor: pointer;
		transition:
			border-color 280ms var(--ease-premium),
			color 280ms var(--ease-premium),
			background-color 280ms var(--ease-premium),
			opacity 280ms var(--ease-premium),
			transform 280ms var(--ease-premium);
	}

	.selected-work__control::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		background: var(--color-green-dark);
		transform: scaleX(0);
		transform-origin: left center;
		transition: transform 360ms var(--ease-premium);
	}

	.selected-work__control:hover,
	.selected-work__control:focus-visible {
		border-color: var(--color-green-dark);
		color: var(--color-black);
		transform: translateY(-1px);
	}

	.selected-work__control:hover::before,
	.selected-work__control:focus-visible::before {
		transform: scaleX(1);
	}

	.selected-work__control:disabled {
		opacity: 0.32;
		pointer-events: none;
	}

	.work-hub,
	.case-study-hero,
	.case-study-content,
	.case-study-nav {
		background: var(--color-white);
		color: var(--color-dark-text);
	}

	.work-hub {
		padding-top: calc(var(--header-height) + var(--section-space));
	}

	.work-hub__header {
		max-width: 62rem;
		margin-bottom: clamp(3rem, 6vw, 5rem);
	}

	.work-hub__title,
	.case-study-hero__title {
		margin: 0;
		font-family: var(--font-heading);
		font-size: clamp(4rem, 9vw, 8.25rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.9;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.work-hub__intro,
	.case-study-hero__intro {
		max-width: 42rem;
		margin: var(--section-content-gap) 0 0;
		font-size: clamp(1rem, 1.3vw, 1.14rem);
		line-height: 1.5;
		text-wrap: balance;
	}

	.work-grid {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: clamp(1.25rem, 3vw, 2rem);
	}

	.work-grid-card {
		position: relative;
		isolation: isolate;
		overflow: hidden;
		background: var(--color-off-white);
	}

	.work-grid-card::before {
		content: "";
		position: absolute;
		z-index: 2;
		inset-block: 0;
		left: 0;
		width: 0.28rem;
		background: var(--color-green);
		transform: scaleY(0);
		transform-origin: top center;
		transition: transform 420ms var(--ease-premium);
	}

	.work-grid-card:hover::before,
	.work-grid-card:focus-within::before {
		transform: scaleY(1);
	}

	.work-grid-card__media {
		display: block;
		aspect-ratio: 16 / 10;
		overflow: hidden;
		background: var(--color-black);
	}

	.work-grid-card__media img,
	.work-grid-card__placeholder {
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform 620ms var(--ease-premium), opacity 620ms var(--ease-premium);
	}

	.work-grid-card:hover .work-grid-card__media img,
	.work-grid-card:focus-within .work-grid-card__media img,
	.work-grid-card:hover .work-grid-card__placeholder,
	.work-grid-card:focus-within .work-grid-card__placeholder {
		transform: scale(1.035);
		opacity: 0.88;
	}

	.work-grid-card__placeholder,
	.case-study-hero__media--placeholder {
		display: block;
		background:
			linear-gradient(90deg, rgb(18 18 18 / 0.92), rgb(18 18 18 / 0.58)),
			url("../images/hero-bg.png") center / cover no-repeat;
	}

	.work-grid-card__content {
		padding: clamp(1.25rem, 3vw, 2rem);
	}

	.work-grid-card__title {
		margin: 0;
		font-size: clamp(1.4rem, 2.4vw, 2rem);
		font-weight: 400;
		letter-spacing: -0.03em;
		line-height: 1.1;
	}

	.work-grid-card__title a {
		transition: color 260ms var(--ease-premium);
	}

	.work-grid-card__title a:hover,
	.work-grid-card__title a:focus-visible {
		color: var(--color-green);
	}

	.work-grid-card__excerpt {
		margin: 1rem 0 0;
		color: rgb(39 39 39 / 0.82);
		line-height: 1.5;
	}

	.work-hub__empty {
		padding: 2rem;
		background: var(--color-off-white);
	}

	.case-study-hero {
		padding-top: calc(var(--header-height) + var(--section-space));
	}

	.case-study-hero__inner {
		display: grid;
		grid-template-columns: minmax(0, 0.85fr) minmax(20rem, 1fr);
		gap: clamp(2rem, 6vw, 5rem);
		align-items: end;
	}

	.case-study-hero__media {
		margin: 0;
		aspect-ratio: 16 / 10;
		overflow: hidden;
		background: var(--color-black);
	}

	.case-study-hero__media img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.case-study-content {
		padding-top: 0;
	}

	.case-study-content__inner {
		max-width: 52rem;
	}

	.case-study-content__inner > * {
		margin-top: 0;
		margin-bottom: 1.35rem;
	}

	.case-study-content__inner h2,
	.case-study-content__inner h3 {
		margin-top: 3rem;
		margin-bottom: 1rem;
		font-family: var(--font-heading);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.95;
		text-transform: uppercase;
	}

	.case-study-content__inner h2 {
		font-size: clamp(2.6rem, 5vw, 4.5rem);
	}

	.case-study-content__inner h3 {
		font-size: clamp(2rem, 3.5vw, 3rem);
	}

	.case-study-content__inner p,
	.case-study-content__inner li {
		font-size: clamp(1rem, 1.2vw, 1.1rem);
		line-height: 1.65;
	}

	.case-study-content__inner a {
		text-decoration: underline;
		text-decoration-color: var(--color-green);
		text-underline-offset: 0.25em;
	}

	.case-study-nav {
		padding-block: 0 var(--section-space);
	}

	.case-study-nav__inner {
		display: grid;
		grid-template-columns: 1fr auto 1fr;
		gap: 1.5rem;
		align-items: center;
		padding-top: 2rem;
		border-top: 1px solid rgb(39 39 39 / 0.16);
	}

	.case-study-nav__item a {
		display: grid;
		gap: 0.35rem;
		transition: color 260ms var(--ease-premium);
	}

	.case-study-nav__item a:hover,
	.case-study-nav__item a:focus-visible {
		color: var(--color-green);
	}

	.case-study-nav__item span {
		color: var(--color-small-heading);
		font-size: 0.72rem;
		font-weight: 700;
		letter-spacing: 0.08em;
		text-transform: uppercase;
	}

	.case-study-nav__item strong {
		font-weight: 400;
	}

	.case-study-nav__item--next {
		text-align: right;
	}

	.case-study-nav__back {
		white-space: nowrap;
	}
}

@media (max-width: 900px) {
	.work-grid,
	.case-study-hero__inner,
	.case-study-nav__inner {
		grid-template-columns: 1fr;
	}

	.selected-work__controls {
		justify-content: flex-start;
	}

	.case-study-nav__item--next {
		text-align: left;
	}

	.case-study-nav__back {
		width: fit-content;
		order: 3;
	}
}

@media (max-width: 560px) {
	.selected-work__controls {
		margin-top: 1rem;
	}

	.selected-work__control {
		width: 2.25rem;
		height: 2.25rem;
	}
}

@layer pages {
	.practice-process {
		background: #1d1b1b;
		color: var(--color-white);
	}

	.practice-process__intro {
		max-width: 62rem;
		margin-bottom: clamp(2.75rem, 5vw, 3.5rem);
	}

	.practice-process__eyebrow {
		color: rgb(var(--color-white-rgb) / 0.76);
	}

	.practice-process__title {
		max-width: 62rem;
		margin: 0;
		color: var(--color-white);
		font-family: var(--font-heading);
		font-size: clamp(2.75rem, 4.2vw, 3rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.98;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.practice-process__text {
		max-width: 42rem;
		margin: var(--section-content-gap) 0 0;
		color: rgb(var(--color-white-rgb) / 0.9);
		font-size: clamp(0.98rem, 1.2vw, 1.08rem);
		line-height: 1.5;
		text-wrap: balance;
	}

	.process-grid {
		display: grid;
		grid-template-columns: repeat(5, minmax(0, 1fr));
		border: 1px solid var(--color-green);
	}

	.process-card {
		position: relative;
		isolation: isolate;
		min-height: clamp(14rem, 18vw, 16.5rem);
		padding: clamp(1.5rem, 2.6vw, 2rem) clamp(1.25rem, 2.2vw, 1.6rem);
		overflow: hidden;
		border-left: 1px solid var(--color-green);
		background: transparent;
		color: var(--color-white);
	}

	.process-card:first-child {
		border-left: 0;
	}

	.process-card::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		background: rgb(var(--color-white-rgb) / 0.15);
		opacity: 0;
		transform: scaleX(0.94) scaleY(0.96);
		transform-origin: center;
		transition:
			opacity 420ms var(--ease-premium),
			transform 520ms var(--ease-premium);
	}

	.process-card:hover::before,
	.process-card:focus-within::before {
		opacity: 1;
		transform: scaleX(1) scaleY(1);
	}

	.process-card__number {
		margin: 0;
		color: var(--color-green);
		font-size: clamp(2.1rem, 3.2vw, 2.6rem);
		font-weight: 700;
		letter-spacing: 0.02em;
		line-height: 0.9;
	}

	.process-card__title {
		margin: 0.55rem 0 0;
		color: var(--color-white);
		font-size: clamp(1.55rem, 2vw, 1.95rem);
		font-weight: 700;
		letter-spacing: -0.06em;
		line-height: 1.05;
	}

	.process-card__text {
		max-width: 15rem;
		margin: 1.45rem 0 0;
		color: rgb(var(--color-white-rgb) / 0.88);
		font-size: clamp(0.92rem, 1vw, 1rem);
		line-height: 1.45;
	}

	.review-rotator {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr);
		gap: clamp(1.25rem, 2.6vw, 2rem);
		align-items: start;
		max-width: 70rem;
		margin-top: clamp(3rem, 6vw, 4.5rem);
	}

	.review-rotator__mark {
		color: var(--color-green);
		font-family: var(--font-heading);
		font-size: clamp(4rem, 8vw, 6rem);
		font-weight: 400;
		line-height: 0.78;
	}

	.review-rotator__items {
		display: grid;
		min-width: 0;
	}

	.review-slide {
		grid-area: 1 / 1;
		max-width: 62rem;
		margin: 0;
		opacity: 0;
		visibility: hidden;
		transform: translate3d(0, 0.75rem, 0);
		transition:
			opacity 620ms var(--ease-premium),
			transform 620ms var(--ease-premium),
			visibility 0ms linear 620ms;
	}

	.review-slide[data-active] {
		opacity: 1;
		visibility: visible;
		transform: translate3d(0, 0, 0);
		transition:
			opacity 620ms var(--ease-premium),
			transform 620ms var(--ease-premium),
			visibility 0ms linear 0ms;
	}

	.review-slide__quote {
		margin: 0;
	}

	.review-slide__quote p {
		max-width: 58rem;
		margin: 0;
		color: var(--color-white);
		font-size: clamp(1.35rem, 2.15vw, 1.85rem);
		font-weight: 700;
		letter-spacing: -0.055em;
		line-height: 1.28;
		text-wrap: balance;
	}

	.review-slide__meta {
		display: grid;
		gap: 0.12rem;
		margin-top: 1.75rem;
		font-style: normal;
	}

	.review-slide__name,
	.review-slide__company {
		display: block;
		font-size: 0.95rem;
		font-weight: 700;
		line-height: 1.25;
	}

	.review-slide__name {
		color: var(--color-white);
	}

	.review-slide__company {
		color: var(--color-green);
	}
}

@media (max-width: 1100px) {
	.process-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.process-card:nth-child(odd) {
		border-left: 0;
	}

	.process-card:nth-child(n + 3) {
		border-top: 1px solid var(--color-green);
	}
}

@media (max-width: 700px) {
	.practice-process__intro {
		margin-bottom: 2.4rem;
	}

	.process-grid {
		grid-template-columns: 1fr;
	}

	.process-card,
	.process-card:nth-child(odd) {
		min-height: auto;
		border-left: 0;
	}

	.process-card + .process-card,
	.process-card:nth-child(n + 3) {
		border-top: 1px solid var(--color-green);
	}

	.process-card__text {
		max-width: 27rem;
	}

	.review-rotator {
		grid-template-columns: 1fr;
		gap: 0.2rem;
		margin-top: 4.25rem;
	}

	.review-rotator__mark {
		font-size: 4.5rem;
		line-height: 0.58;
	}

	.review-slide__quote p {
		font-size: clamp(1.25rem, 6vw, 1.65rem);
	}
}

@layer pages {
	.service-signpost {
		background: var(--color-white);
		color: var(--color-dark-text);
	}

	.service-signpost__header {
		max-width: 72rem;
		margin-bottom: clamp(3rem, 6vw, 4.75rem);
	}

	.service-signpost__eyebrow {
		color: var(--color-small-heading);
	}

	.service-signpost__title {
		max-width: 72rem;
		margin: 0;
		color: var(--color-dark-text);
		font-family: var(--font-heading);
		font-size: clamp(2.75rem, 4.2vw, 3rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.98;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.service-signpost__title span {
		display: block;
		color: var(--color-green-dark);
	}

	.service-signpost__intro {
		max-width: 48rem;
		margin: var(--section-content-gap) 0 0;
		color: var(--color-dark-text);
		font-size: clamp(0.98rem, 1.2vw, 1.08rem);
		line-height: 1.5;
		text-wrap: balance;
	}

	.service-signpost__body {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.34fr);
		gap: clamp(3rem, 8vw, 8rem);
		align-items: start;
		margin-bottom: clamp(3rem, 6vw, 4.75rem);
	}

	.service-signpost__points {
		display: grid;
		gap: 0.85rem;
		max-width: 58rem;
		padding: 0;
		margin: 0;
		list-style: none;
	}

	.service-signpost__points li {
		position: relative;
		isolation: isolate;
		display: grid;
		grid-template-columns: auto minmax(0, 1fr);
		gap: 0.65rem;
		align-items: start;
		padding: 0.18rem 0.8rem 0.18rem 0;
		overflow: hidden;
		color: var(--color-dark-text);
		font-size: clamp(0.98rem, 1.2vw, 1.08rem);
		font-weight: 700;
		line-height: 1.45;
		transition: transform 420ms var(--ease-premium), color 320ms var(--ease-premium), padding-left 420ms var(--ease-premium);
	}

	.service-signpost__points li::before {
		content: "";
		position: absolute;
		z-index: -1;
		inset-block: 0;
		left: 0;
		width: 0.2rem;
		background: var(--color-green-dark);
		transform: scaleY(0);
		transform-origin: top center;
		transition: transform 420ms var(--ease-premium);
	}

	.service-signpost__points li::after {
		content: "";
		position: absolute;
		z-index: -2;
		inset: 0;
		background: rgb(var(--color-green-dark-rgb) / 0.08);
		opacity: 0;
		transform: translateX(-0.75rem);
		transition: opacity 420ms var(--ease-premium), transform 520ms var(--ease-premium);
	}

	.service-signpost__points li:hover {
		padding-left: 0.9rem;
		transform: translateX(0.15rem);
	}

	.service-signpost__points li:hover::before {
		transform: scaleY(1);
	}

	.service-signpost__points li:hover::after {
		opacity: 1;
		transform: translateX(0);
	}

	.service-signpost__points span {
		color: var(--color-green-dark);
		font-weight: 700;
	}

	.service-signpost__observation {
		display: grid;
		justify-items: start;
		padding-top: 1.05rem;
		border-top: 1px solid rgb(39 39 39 / 0.08);
	}

	.service-signpost__observation-kicker {
		margin: 0 0 0.85rem;
		color: var(--color-green-dark);
		font-size: 0.82rem;
		font-weight: 300;
		letter-spacing: 0.14em;
		line-height: 1;
		text-transform: uppercase;
	}

	.service-signpost__observation-kicker span {
		margin-right: 0.25rem;
	}

	.service-signpost__observation-text {
		max-width: 20rem;
		margin: 0;
		color: var(--color-dark-text);
		font-size: clamp(0.95rem, 1.08vw, 1.04rem);
		line-height: 1.5;
	}

	.service-signpost__button {
		margin-top: clamp(2.5rem, 5vw, 4rem);
	}

	.service-grid {
		display: grid;
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: clamp(1.25rem, 3vw, 2rem);
	}

	.service-card {
		position: relative;
		isolation: isolate;
		display: flex;
		align-items: flex-end;
		min-height: clamp(15rem, 21vw, 18rem);
		padding: clamp(1.25rem, 2.4vw, 1.6rem);
		overflow: hidden;
		background: #666665;
		color: var(--color-white);
	}

	.service-card::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		background: linear-gradient(180deg, transparent 0%, rgb(0 0 0 / 0.24) 100%);
		transition: opacity 420ms var(--ease-premium);
	}

	.service-card::after {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		background:
			linear-gradient(135deg, rgb(169 255 30 / 0.12), transparent 42%),
			rgb(var(--color-white-rgb) / 0.15);
		opacity: 0;
		transform: scale(0.97);
		transition: opacity 420ms var(--ease-premium), transform 560ms var(--ease-premium);
	}

	.service-card:hover::after,
	.service-card:focus-visible::after {
		opacity: 1;
		transform: scale(1);
	}

	.service-card img,
	.service-card__placeholder {
		position: absolute;
		inset: 0;
		z-index: -2;
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform 720ms var(--ease-premium), filter 720ms var(--ease-premium);
	}

	.service-card:hover img,
	.service-card:focus-visible img,
	.service-card:hover .service-card__placeholder,
	.service-card:focus-visible .service-card__placeholder {
		transform: scale(1.045);
		filter: saturate(1.08);
	}

	.service-card__placeholder {
		display: block;
		background:
			radial-gradient(circle at 78% 18%, rgb(169 255 30 / 0.18), transparent 10rem),
			linear-gradient(135deg, rgb(102 102 101), rgb(76 76 75));
	}

	.service-card__placeholder::before {
		content: "";
		position: absolute;
		inset: 12%;
		border: 1px solid rgb(255 255 255 / 0.12);
		opacity: 0.3;
	}

	.service-card__label {
		display: inline-flex;
		gap: 0.85rem;
		align-items: center;
		font-size: clamp(1.35rem, 2vw, 1.65rem);
		font-weight: 700;
		letter-spacing: -0.065em;
		line-height: 1.05;
	}

	.service-card__arrow {
		font-weight: 300;
		letter-spacing: 0;
		transition: transform 360ms var(--ease-premium), color 360ms var(--ease-premium);
	}

	.service-card:hover .service-card__arrow,
	.service-card:focus-visible .service-card__arrow {
		color: var(--color-green);
		transform: translateX(0.35rem);
	}

	.services-hub,
	.service-single {
		background: var(--color-white);
		color: var(--color-dark-text);
	}

	.services-hub {
		padding-top: calc(var(--header-height) + var(--section-space));
	}

	.services-hub__header {
		max-width: 62rem;
		margin-bottom: clamp(3rem, 6vw, 5rem);
	}

	.services-hub__title,
	.service-hero__title {
		margin: 0;
		font-family: var(--font-heading);
		font-size: clamp(4rem, 9vw, 8.25rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.9;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.services-hub__intro,
	.service-hero__intro {
		max-width: 42rem;
		margin: var(--section-content-gap) 0 0;
		font-size: clamp(1rem, 1.3vw, 1.14rem);
		line-height: 1.5;
		text-wrap: balance;
	}

	.services-hub-grid {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: clamp(1.25rem, 3vw, 2rem);
	}

	.services-hub-card {
		position: relative;
		isolation: isolate;
		overflow: hidden;
		background: var(--color-off-white);
	}

	.services-hub-card::before {
		content: "";
		position: absolute;
		z-index: 2;
		inset-block: 0;
		left: 0;
		width: 0.28rem;
		background: var(--color-green);
		transform: scaleY(0);
		transform-origin: top center;
		transition: transform 420ms var(--ease-premium);
	}

	.services-hub-card:hover::before,
	.services-hub-card:focus-within::before {
		transform: scaleY(1);
	}

	.services-hub-card__media {
		display: block;
		aspect-ratio: 16 / 10;
		overflow: hidden;
		background: var(--color-black);
	}

	.services-hub-card__media img,
	.services-hub-card__placeholder,
	.service-hero__media img,
	.service-hero__media--placeholder {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.services-hub-card__media img,
	.services-hub-card__placeholder {
		transition: transform 620ms var(--ease-premium), opacity 620ms var(--ease-premium);
	}

	.services-hub-card:hover .services-hub-card__media img,
	.services-hub-card:focus-within .services-hub-card__media img,
	.services-hub-card:hover .services-hub-card__placeholder,
	.services-hub-card:focus-within .services-hub-card__placeholder {
		transform: scale(1.035);
		opacity: 0.88;
	}

	.services-hub-card__placeholder,
	.service-hero__media--placeholder {
		display: block;
		background:
			linear-gradient(90deg, rgb(18 18 18 / 0.78), rgb(18 18 18 / 0.46)),
			url("../images/hero-bg.png") center / cover no-repeat;
	}

	.services-hub-card__content {
		padding: clamp(1.25rem, 3vw, 2rem);
	}

	.services-hub-card__title {
		margin: 0;
		font-size: clamp(1.4rem, 2.4vw, 2rem);
		font-weight: 700;
		letter-spacing: -0.055em;
		line-height: 1.1;
	}

	.services-hub-card__title a {
		transition: color 260ms var(--ease-premium);
	}

	.services-hub-card__title a:hover,
	.services-hub-card__title a:focus-visible {
		color: var(--color-green);
	}

	.services-hub-card__excerpt {
		margin: 1rem 0 0;
		color: rgb(39 39 39 / 0.82);
		line-height: 1.5;
	}

	.services-hub__empty {
		padding: 2rem;
		background: var(--color-off-white);
	}

	.service-hero {
		padding-top: calc(var(--header-height) + var(--section-space));
	}

	.service-hero__inner {
		display: grid;
		grid-template-columns: minmax(0, 0.85fr) minmax(20rem, 1fr);
		gap: clamp(2rem, 6vw, 5rem);
		align-items: end;
	}

	.service-hero__media {
		margin: 0;
		aspect-ratio: 16 / 10;
		overflow: hidden;
		background: var(--color-black);
	}

	.service-content {
		padding-top: 0;
	}

	.service-content__inner {
		max-width: 52rem;
	}

	.service-content__inner > * {
		margin-top: 0;
		margin-bottom: 1.35rem;
	}

	.service-content__inner h2,
	.service-content__inner h3 {
		margin-top: 3rem;
		margin-bottom: 1rem;
		font-family: var(--font-heading);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.95;
		text-transform: uppercase;
	}

	.service-content__inner h2 {
		font-size: clamp(2.6rem, 5vw, 4.5rem);
	}

	.service-content__inner h3 {
		font-size: clamp(2rem, 3.5vw, 3rem);
	}

	.service-content__inner p,
	.service-content__inner li {
		font-size: clamp(1rem, 1.2vw, 1.1rem);
		line-height: 1.65;
	}

	.service-content__inner a {
		text-decoration: underline;
		text-decoration-color: var(--color-green);
		text-underline-offset: 0.25em;
	}

	.service-nav {
		padding-block: 0 var(--section-space);
	}

	.service-nav__inner {
		padding-top: 2rem;
		border-top: 1px solid rgb(39 39 39 / 0.16);
	}
}

@media (max-width: 1100px) {
	.service-signpost__body {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}

	.service-signpost__observation {
		max-width: 28rem;
	}

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

@media (max-width: 900px) {
	.services-hub-grid,
	.service-hero__inner {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 700px) {
	.service-signpost__header {
		margin-bottom: 2.6rem;
	}

	.service-signpost__body {
		margin-bottom: 2.8rem;
	}

	.service-signpost__points {
		gap: 0.95rem;
	}

	.service-signpost__points li {
		padding-right: 0;
	}

	.service-signpost__observation {
		padding-top: 1rem;
	}

	.service-signpost__button {
		margin-top: 2rem;
	}

	.service-grid {
		grid-template-columns: 1fr;
	}

	.service-card {
		min-height: 13.75rem;
	}
}


@layer pages {
	.studio-letter {
		background: #1d1b1b;
		color: var(--color-white);
	}

	.studio-letter__inner {
		display: grid;
		grid-template-columns: minmax(16rem, 0.34fr) minmax(0, 0.66fr);
		gap: clamp(3rem, 7vw, 6.5rem);
		align-items: start;
	}

	.studio-letter__heading {
		min-height: clamp(17rem, 24vw, 23.5rem);
		padding-right: clamp(2rem, 4.5vw, 4.5rem);
		border-right: 1px solid rgb(var(--color-white-rgb) / 0.48);
	}

	.studio-letter__eyebrow {
		color: rgb(var(--color-white-rgb) / 0.78);
	}

	.studio-letter__title {
		max-width: 22rem;
		margin: 0;
		color: var(--color-white);
		font-family: var(--font-heading);
		font-size: clamp(2.75rem, 4.2vw, 3rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.98;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.studio-letter__content {
		max-width: 48rem;
		padding-top: 0.1rem;
	}

	.studio-letter__content p {
		margin: 0;
		color: var(--color-white);
		font-size: clamp(1.45rem, 2.25vw, 1.88rem);
		font-weight: 700;
		letter-spacing: -0.055em;
		line-height: 1.28;
		text-wrap: balance;
	}

	.studio-letter__content p + p {
		margin-top: clamp(2.2rem, 4vw, 2.75rem);
	}

	.studio-letter__content .studio-letter__signature {
		margin-top: clamp(2.2rem, 4vw, 2.75rem);
		color: var(--color-green);
		font-size: 1rem;
		font-weight: 700;
		letter-spacing: -0.03em;
		line-height: 1.2;
	}
}

@media (max-width: 900px) {
	.studio-letter__inner {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}

	.studio-letter__heading {
		min-height: auto;
		padding-right: 0;
		padding-bottom: 2.25rem;
		border-right: 0;
		border-bottom: 1px solid rgb(var(--color-white-rgb) / 0.34);
	}

	.studio-letter__content {
		max-width: 44rem;
	}

	.studio-letter__content p {
		font-size: clamp(1.3rem, 6vw, 1.7rem);
	}
}

@layer pages {
	.journal-preview {
		background: var(--color-white);
		color: var(--color-dark-text);
	}

	.journal-preview__header {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		gap: clamp(2rem, 5vw, 4rem);
		align-items: start;
		margin-bottom: clamp(2.75rem, 5vw, 4rem);
	}

	.journal-preview__eyebrow {
		margin-bottom: 0.55rem;
		font-size: 0.86rem;
	}

	.journal-preview__title {
		margin: 0;
		color: var(--color-dark-text);
		font-family: var(--font-heading);
		font-size: clamp(2.75rem, 4.2vw, 3rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.98;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.journal-preview__view-all {
		align-self: start;
		margin-top: 1.2rem;
		white-space: nowrap;
	}

	.journal-preview__list {
		display: grid;
		border-top: 1px solid rgb(39 39 39 / 0.16);
	}

	.journal-card {
		position: relative;
		isolation: isolate;
		display: grid;
		grid-template-columns: minmax(10rem, 0.26fr) minmax(0, 1fr);
		gap: clamp(2rem, 6vw, 7rem);
		align-items: start;
		padding: clamp(2rem, 4.5vw, 3.5rem) clamp(1rem, 2.5vw, 2rem);
		overflow: hidden;
		border-bottom: 1px solid rgb(39 39 39 / 0.16);
		background: transparent;
		transition:
			background-color 420ms var(--ease-premium),
			transform 420ms var(--ease-premium),
			box-shadow 420ms var(--ease-premium);
	}

	.journal-card::before {
		content: "";
		position: absolute;
		z-index: 1;
		inset-block: 0;
		left: 0;
		width: 0.18rem;
		background: var(--color-green-dark);
		transform: scaleY(0);
		transform-origin: top center;
		transition: transform 460ms var(--ease-premium);
	}

	.journal-card::after {
		content: "";
		position: absolute;
		z-index: -1;
		inset: 0;
		background:
			linear-gradient(90deg, rgb(var(--color-green-dark-rgb) / 0.08), transparent 48%),
			var(--color-off-white);
		opacity: 0;
		transform: translateX(-1rem);
		transition:
			opacity 460ms var(--ease-premium),
			transform 560ms var(--ease-premium);
	}

	.journal-card:hover,
	.journal-card:focus-within {
		background: var(--color-off-white);
		transform: translateY(-0.18rem);
		box-shadow: 0 1.5rem 3rem rgb(39 39 39 / 0.06);
	}

	.journal-card:hover::before,
	.journal-card:focus-within::before {
		transform: scaleY(1);
	}

	.journal-card:hover::after,
	.journal-card:focus-within::after {
		opacity: 1;
		transform: translateX(0);
	}

	.journal-card__meta {
		display: grid;
		gap: clamp(1.7rem, 4vw, 2.6rem);
		max-width: 14rem;
	}

	.journal-card__kicker {
		margin: 0;
		color: var(--color-green-dark);
		font-size: 0.72rem;
		font-weight: 300;
		letter-spacing: 0.12em;
		line-height: 1;
		text-transform: uppercase;
	}

	.journal-card__kicker span {
		margin-right: 0.25rem;
	}

	.journal-card__excerpt {
		margin: 0;
		color: var(--color-dark-text);
		font-size: clamp(0.82rem, 0.95vw, 0.92rem);
		line-height: 1.35;
	}

	.journal-card__content {
		display: grid;
		justify-items: start;
		gap: 1.25rem;
	}

	.journal-card__title {
		max-width: 45rem;
		margin: 0;
		color: var(--color-dark-text);
		font-size: clamp(1.7rem, 3vw, 2.1rem);
		font-weight: 700;
		letter-spacing: -0.055em;
		line-height: 1.16;
		text-wrap: balance;
	}

	.journal-card__title a {
		background-image: linear-gradient(var(--color-green-dark), var(--color-green-dark));
		background-position: 0 100%;
		background-repeat: no-repeat;
		background-size: 0% 0.12em;
		transition:
			background-size 460ms var(--ease-premium),
			color 260ms var(--ease-premium);
	}

	.journal-card__title a:hover,
	.journal-card__title a:focus-visible {
		background-size: 100% 0.12em;
	}

	.journal-card__button {
		margin-top: 0.2rem;
	}
}

@media (max-width: 900px) {
	.journal-preview__header {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	.journal-preview__view-all {
		margin-top: 0;
	}

	.journal-card {
		grid-template-columns: 1fr;
		gap: 1.6rem;
		padding: 2rem 1rem;
	}

	.journal-card__meta {
		max-width: 100%;
		gap: 1rem;
	}

	.journal-card__excerpt {
		max-width: 22rem;
	}

	.journal-card__content {
		gap: 1rem;
	}
}

@layer components {
	.site-footer {
		background: var(--color-black);
		color: var(--color-white);
	}

	.site-footer__inner {
		padding-block: var(--section-space) 2rem;
		font-size: 1rem;
	}

	.site-footer__cta-row {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		gap: clamp(2rem, 5vw, 4rem);
		align-items: center;
		padding-bottom: clamp(3.25rem, 6vw, 4.5rem);
		border-bottom: 1px solid rgb(var(--color-white-rgb) / 0.72);
	}

	.site-footer__cta-title {
		max-width: 50rem;
		margin: 0;
		color: var(--color-white);
		font-family: var(--font-heading);
		font-size: clamp(3.15rem, 5.4vw, 5rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.94;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.site-footer__cta-title span {
		display: block;
		color: var(--color-green);
	}

	.site-footer__cta-button {
		justify-self: end;
		white-space: nowrap;
	}

	.site-footer__main {
		display: grid;
		grid-template-columns: minmax(18rem, 1.4fr) minmax(9rem, 0.7fr) minmax(14rem, 0.8fr);
		gap: clamp(2.5rem, 8vw, 7rem);
		padding-block: clamp(3.25rem, 6vw, 4.4rem);
	}

	.site-footer__brand-block,
	.site-footer__nav,
	.site-footer__contact {
		display: grid;
		align-content: start;
		gap: 1.4rem;
	}

	.site-footer__logo-link,
	.site-footer__logo-fallback {
		display: inline-flex;
		width: fit-content;
	}

	.site-footer__logo {
		width: auto;
		height: 2rem;
	}

	.site-footer__logo-fallback {
		align-items: baseline;
		color: var(--color-white);
		font-family: var(--font-body);
		font-size: 1.65rem;
		font-weight: 800;
		letter-spacing: -0.08em;
		line-height: 1;
	}

	.site-footer__logo-fallback span:last-child {
		color: var(--color-green);
	}

	.site-footer__description {
		max-width: 24rem;
		margin: 0;
		color: rgb(var(--color-white-rgb) / 0.82);
		font-size: clamp(0.95rem, 1.15vw, 1.05rem);
		line-height: 1.45;
	}

	.site-footer__heading {
		margin: 0;
		color: var(--color-white);
		font-size: 1rem;
		font-weight: 700;
		letter-spacing: -0.03em;
		line-height: 1.2;
		text-transform: uppercase;
	}

	.site-footer__links,
	.site-footer__contact-list {
		display: grid;
		gap: 1.05rem;
		padding: 0;
		margin: 0;
		list-style: none;
	}

	.site-footer__links a,
	.site-footer__contact-list a {
		color: rgb(var(--color-white-rgb) / 0.9);
		font-weight: 700;
		transition: color 260ms var(--ease-premium);
	}

	.site-footer__links a:hover,
	.site-footer__links a:focus-visible,
	.site-footer__contact-list a:hover,
	.site-footer__contact-list a:focus-visible {
		color: var(--color-green);
	}

	.site-footer__contact-list {
		gap: 1.35rem;
	}

	.site-footer__contact-list li {
		color: rgb(var(--color-white-rgb) / 0.9);
		font-weight: 700;
	}

	.site-footer__bottom {
		padding-top: 1.8rem;
		border-top: 1px solid rgb(var(--color-white-rgb) / 0.72);
	}

	.site-footer__bottom p {
		margin: 0;
		color: rgb(var(--color-white-rgb) / 0.82);
		font-size: 0.95rem;
		line-height: 1.5;
	}
}

@media (max-width: 900px) {
	.journal-preview__view-all,
	.journal-card__button {
		justify-self: start;
		width: fit-content;
		max-width: 100%;
	}

	.site-footer__cta-row {
		grid-template-columns: 1fr;
		align-items: start;
	}

	.site-footer__cta-button {
		justify-self: start;
		width: fit-content;
		max-width: 100%;
	}

	.site-footer__main {
		grid-template-columns: 1fr;
		gap: 2.6rem;
	}
}

@media (max-width: 560px) {
	.site-footer__inner {
		padding-block: 4rem 1.75rem;
	}

	.site-footer__cta-row {
		gap: 1.8rem;
		padding-bottom: 3rem;
	}

	.site-footer__cta-title {
		font-size: clamp(3rem, 14vw, 4.1rem);
	}

	.site-footer__main {
		padding-block: 3rem;
	}

	.site-footer__links,
	.site-footer__contact-list {
		gap: 0.95rem;
	}
}

@layer pages {
	.contact-page {
		background: var(--color-white);
		color: var(--color-dark-text);
	}

	.contact-hero {
		position: relative;
		isolation: isolate;
		overflow: hidden;
		padding-block: calc(var(--header-height) + var(--hero-space)) var(--hero-space);
		background: var(--color-black);
		color: var(--color-white);
	}

	.contact-hero::before {
		content: "";
		position: absolute;
		inset: -10% -5%;
		z-index: -2;
		background:
			linear-gradient(90deg, rgb(var(--color-black-rgb) / 0.94), rgb(var(--color-black-rgb) / 0.68) 52%, rgb(var(--color-black-rgb) / 0.84)),
			url("../images/hero-bg.png") center right / cover no-repeat;
		opacity: 0.9;
		transform: scale(1.02);
	}

	.contact-hero::after {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		background:
			radial-gradient(circle at 78% 34%, rgb(169 255 30 / 0.14), transparent 22rem),
			linear-gradient(180deg, transparent, rgb(0 0 0 / 0.36));
		pointer-events: none;
	}

	.contact-hero__inner {
		max-width: none;
	}

	.contact-hero__eyebrow {
		color: var(--color-green);
	}

	.contact-hero__title {
		max-width: 68rem;
		margin: 0;
		font-family: var(--font-heading);
		font-size: clamp(4.4rem, 8.7vw, 9.6rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.88;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.contact-hero__intro {
		max-width: 46rem;
		margin: var(--section-content-gap) 0 0;
		color: rgb(var(--color-white-rgb) / 0.86);
		font-size: clamp(1rem, 1.35vw, 1.16rem);
		line-height: 1.5;
		text-wrap: balance;
	}

	.contact-section {
		background: var(--color-white);
	}

	.contact-section__inner {
		display: grid;
		grid-template-columns: minmax(0, 0.76fr) minmax(18rem, 0.42fr);
		gap: clamp(2rem, 6vw, 5rem);
		align-items: start;
	}

	.contact-section__form-panel {
		padding: clamp(1.5rem, 4vw, 3rem);
		background: var(--color-off-white);
		color: var(--color-dark-text);
	}

	.contact-section__form-title {
		margin: 0 0 var(--section-content-gap);
		font-family: var(--font-heading);
		font-size: clamp(2.75rem, 5vw, 4.5rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.92;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.contact-section__form-content > *:first-child {
		margin-top: 0;
	}

	.contact-section__form-content > *:last-child {
		margin-bottom: 0;
	}

	.contact-section__admin-note,
	.contact-section__fallback {
		padding: 1rem;
		margin: 0;
		border-left: 0.28rem solid var(--color-green-dark);
		background: var(--color-white);
		color: var(--color-dark-text);
	}

	.contact-section__admin-note + .contact-section__fallback {
		margin-top: 1rem;
	}

	.contact-section__fallback a {
		color: var(--color-green-dark);
		font-weight: 700;
		text-decoration: underline;
		text-underline-offset: 0.25em;
	}

	.contact-section__next-card {
		position: sticky;
		top: calc(var(--header-height) + 2rem);
		display: grid;
		justify-items: start;
		padding-top: 1.05rem;
		border-top: 1px solid rgb(39 39 39 / 0.08);
		background: transparent;
		color: var(--color-dark-text);
	}

	.contact-section__next-kicker {
		margin: 0 0 0.85rem;
		color: var(--color-green-dark);
		font-size: 0.82rem;
		font-weight: 300;
		letter-spacing: 0.14em;
		line-height: 1;
		text-transform: uppercase;
	}

	.contact-section__next-kicker span {
		margin-right: 0.3rem;
	}

	.contact-section__next-title {
		max-width: 24rem;
		margin: 0;
		color: var(--color-dark-text);
		font-size: clamp(0.95rem, 1.08vw, 1.04rem);
		font-weight: 300;
		letter-spacing: 0;
		line-height: 1.5;
		text-wrap: balance;
	}

	.nd9-contact-form {
		display: grid;
		gap: 1.25rem;
	}

	.nd9-contact-form__field {
		display: grid;
		gap: 0.55rem;
	}

	.nd9-contact-form__label {
		display: inline-flex;
		margin-bottom: 0.65rem;
		color: var(--color-dark-text);
		font-size: 1rem;
		font-weight: 700;
		letter-spacing: -0.03em;
		line-height: 1.2;
	}

	.nd9-contact-form .wpcf7-form-control-wrap {
		display: block;
	}

	.nd9-contact-form__label + .wpcf7-form-control-wrap {
		margin-top: 0.65rem;
	}

	.nd9-contact-form__input,
	.nd9-contact-form__textarea {
		display: block;
		width: 100%;
		border: 1px solid rgb(39 39 39 / 0.18);
		border-radius: 0;
		background: var(--color-white);
		color: var(--color-dark-text);
		font: inherit;
		font-size: 1rem;
		line-height: 1.4;
		transition:
			border-color 260ms var(--ease-premium),
			box-shadow 260ms var(--ease-premium),
			background-color 260ms var(--ease-premium);
	}

	.nd9-contact-form__input {
		min-height: 3.25rem;
		padding: 0.85rem 1rem;
	}

	.nd9-contact-form__textarea {
		min-height: 8.75rem;
		padding: 1rem;
		resize: vertical;
	}

	.nd9-contact-form__input::placeholder,
	.nd9-contact-form__textarea::placeholder {
		color: rgb(39 39 39 / 0.5);
	}

	.nd9-contact-form__input:hover,
	.nd9-contact-form__textarea:hover {
		border-color: rgb(var(--color-green-dark-rgb) / 0.48);
	}

	.nd9-contact-form__input:focus,
	.nd9-contact-form__textarea:focus {
		outline: none;
		border-color: var(--color-green-dark);
		box-shadow: 0 0 0 3px rgb(var(--color-green-dark-rgb) / 0.14);
	}

	.nd9-contact-form__actions {
		display: flex;
		align-items: center;
		gap: 1rem;
		margin-top: 0.25rem;
	}

	.nd9-contact-form__submit,
	.nd9-contact-form .wpcf7-submit {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: fit-content;
		min-height: 2.75rem;
		padding: 0.68rem 1.15rem 0.62rem;
		border: 1px solid var(--color-black);
		border-radius: 0;
		background:
			linear-gradient(90deg, var(--color-green), var(--color-green)) left center / 0% 100% no-repeat,
			transparent;
		color: var(--color-black);
		font: inherit;
		font-size: 0.95rem;
		font-weight: 700;
		line-height: 1;
		cursor: pointer;
		transition:
			border-color 300ms var(--ease-premium),
			background-size 520ms var(--ease-premium),
			color 300ms var(--ease-premium),
			transform 300ms var(--ease-premium),
			box-shadow 300ms var(--ease-premium);
	}

	.nd9-contact-form__submit:hover,
	.nd9-contact-form__submit:focus-visible,
	.nd9-contact-form .wpcf7-submit:hover,
	.nd9-contact-form .wpcf7-submit:focus-visible {
		border-color: var(--color-black);
		background-size: 100% 100%;
		color: var(--color-black);
		box-shadow: 0 0.85rem 2rem rgb(169 255 30 / 0.22);
		transform: translateY(-1px);
	}

	.nd9-contact-form .wpcf7-spinner {
		margin: 0;
	}

	.nd9-contact-form .wpcf7-not-valid {
		border-color: #b3261e;
	}

	.nd9-contact-form .wpcf7-not-valid-tip {
		margin-top: 0.45rem;
		color: #b3261e;
		font-size: 0.86rem;
		font-weight: 700;
	}

	.contact-section .wpcf7 form .wpcf7-response-output {
		padding: 1rem;
		margin: 1.25rem 0 0;
		border: 1px solid rgb(39 39 39 / 0.18);
		background: var(--color-white);
		color: var(--color-dark-text);
		font-weight: 700;
	}

	.contact-section .wpcf7 form.sent .wpcf7-response-output {
		border-color: var(--color-green-dark);
	}

	.contact-section .wpcf7 form.invalid .wpcf7-response-output,
	.contact-section .wpcf7 form.failed .wpcf7-response-output,
	.contact-section .wpcf7 form.aborted .wpcf7-response-output {
		border-color: #b3261e;
	}
}

@media (max-width: 900px) {
	.contact-section__inner {
		grid-template-columns: 1fr;
		gap: clamp(2.75rem, 9vw, 4rem);
	}

	.contact-section__next-card {
		position: relative;
		top: auto;
		order: 0;
	}
}

@media (max-width: 560px) {
	.contact-hero {
		padding-block: calc(var(--header-height) + 5rem) 5rem;
	}

	.contact-hero__title {
		font-size: clamp(3.35rem, 18vw, 4.95rem);
	}

	.contact-section__form-panel {
		padding: 1.25rem;
	}

	.contact-section__next-card {
		padding-top: 1.05rem;
	}

	.nd9-contact-form__actions {
		align-items: flex-start;
		flex-direction: column;
	}
}

@layer pages {
	.practice-page {
		background: var(--color-white);
		color: var(--color-dark-text);
	}

	.practice-understanding {
		background: var(--color-white);
		color: var(--color-dark-text);
	}

	.practice-understanding__header {
		max-width: 72rem;
		margin-bottom: clamp(3rem, 6vw, 4.75rem);
	}

	.practice-understanding__eyebrow {
		color: var(--color-small-heading);
	}

	.practice-understanding__title {
		max-width: 72rem;
		margin: 0;
		color: var(--color-dark-text);
		font-family: var(--font-heading);
		font-size: clamp(2.75rem, 4.2vw, 3rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.98;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.practice-understanding__body {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.34fr);
		gap: clamp(3rem, 8vw, 8rem);
		align-items: start;
	}

	.practice-understanding__copy {
		max-width: 58rem;
	}

	.practice-understanding__copy p {
		margin: 0;
		color: var(--color-dark-text);
		font-size: clamp(0.98rem, 1.2vw, 1.08rem);
		line-height: 1.5;
		text-wrap: balance;
	}

	.practice-understanding__observation {
		display: grid;
		justify-items: start;
		padding-top: 1.05rem;
		border-top: 1px solid rgb(39 39 39 / 0.08);
	}

	.practice-understanding__observation-kicker {
		margin: 0 0 0.85rem;
		color: var(--color-green-dark);
		font-size: 0.82rem;
		font-weight: 300;
		letter-spacing: 0.14em;
		line-height: 1;
		text-transform: uppercase;
	}

	.practice-understanding__observation-kicker span {
		margin-right: 0.25rem;
	}

	.practice-understanding__observation-text {
		max-width: 20rem;
		margin: 0;
		color: var(--color-dark-text);
		font-size: clamp(0.95rem, 1.08vw, 1.04rem);
		line-height: 1.5;
	}
}

@media (max-width: 1100px) {
	.practice-understanding__body {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}

	.practice-understanding__observation {
		max-width: 28rem;
	}
}

@media (max-width: 700px) {
	.practice-understanding__header {
		margin-bottom: 2.6rem;
	}

	.practice-understanding__observation {
		padding-top: 1rem;
	}
}

@layer pages {
	.journal-page,
	.single-journal-page {
		background: var(--color-white);
		color: var(--color-dark-text);
	}

	.journal-hero,
	.post-hero {
		position: relative;
		isolation: isolate;
		overflow: hidden;
		padding-block: calc(var(--header-height) + var(--hero-space)) var(--hero-space);
		background: var(--color-black);
		color: var(--color-white);
	}

	.journal-hero::before,
	.post-hero::before {
		content: "";
		position: absolute;
		inset: -10% -5%;
		z-index: -2;
		background:
			linear-gradient(90deg, rgb(var(--color-black-rgb) / 0.94), rgb(var(--color-black-rgb) / 0.68) 52%, rgb(var(--color-black-rgb) / 0.84)),
			url("../images/hero-bg.png") center right / cover no-repeat;
		opacity: 0.9;
		transform: scale(1.02);
	}

	.journal-hero::after,
	.post-hero::after {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		background:
			radial-gradient(circle at 78% 34%, rgb(169 255 30 / 0.14), transparent 22rem),
			linear-gradient(180deg, transparent, rgb(0 0 0 / 0.36));
		pointer-events: none;
	}

	.journal-hero__inner,
	.post-hero__inner {
		max-width: none;
	}

	.journal-hero__eyebrow,
	.post-hero__eyebrow {
		color: var(--color-green);
	}

	.journal-hero__title,
	.post-hero__title {
		max-width: 68rem;
		margin: 0;
		font-family: var(--font-heading);
		font-size: clamp(4.4rem, 8.7vw, 9.6rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.88;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.journal-hero__intro,
	.post-hero__meta {
		max-width: 46rem;
		margin: var(--section-content-gap) 0 0;
		color: rgb(var(--color-white-rgb) / 0.86);
		font-size: clamp(1rem, 1.35vw, 1.16rem);
		line-height: 1.5;
		text-wrap: balance;
	}

	.journal-hero__intro p {
		margin: 0;
	}

	.journal-archive {
		background: var(--color-white);
	}

	.journal-archive__header {
		max-width: 52rem;
		margin-bottom: clamp(2.75rem, 5vw, 4rem);
	}

	.journal-archive__eyebrow {
		margin-bottom: 0.55rem;
		font-size: 0.86rem;
	}

	.journal-archive__title {
		margin: 0;
		color: var(--color-dark-text);
		font-family: var(--font-heading);
		font-size: clamp(2.75rem, 4.2vw, 3rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.98;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.journal-archive__list {
		display: grid;
		border-top: 1px solid rgb(39 39 39 / 0.16);
	}

	.journal-archive-card {
		position: relative;
		isolation: isolate;
		display: grid;
		grid-template-columns: minmax(15rem, 0.34fr) minmax(0, 1fr);
		gap: clamp(2rem, 5vw, 4.5rem);
		align-items: stretch;
		padding: clamp(1.5rem, 4vw, 2.75rem) clamp(1rem, 2.5vw, 2rem);
		overflow: hidden;
		border-bottom: 1px solid rgb(39 39 39 / 0.16);
		background: transparent;
		transition:
			background-color 420ms var(--ease-premium),
			transform 420ms var(--ease-premium),
			box-shadow 420ms var(--ease-premium);
	}

	.journal-archive-card::before {
		content: "";
		position: absolute;
		z-index: 2;
		inset-block: 0;
		left: 0;
		width: 0.18rem;
		background: var(--color-green-dark);
		transform: scaleY(0);
		transform-origin: top center;
		transition: transform 460ms var(--ease-premium);
	}

	.journal-archive-card::after {
		content: "";
		position: absolute;
		z-index: -1;
		inset: 0;
		background:
			linear-gradient(90deg, rgb(var(--color-green-dark-rgb) / 0.08), transparent 48%),
			var(--color-off-white);
		opacity: 0;
		transform: translateX(-1rem);
		transition:
			opacity 460ms var(--ease-premium),
			transform 560ms var(--ease-premium);
	}

	.journal-archive-card:hover,
	.journal-archive-card:focus-within {
		background: var(--color-off-white);
		transform: translateY(-0.18rem);
		box-shadow: 0 1.5rem 3rem rgb(39 39 39 / 0.06);
	}

	.journal-archive-card:hover::before,
	.journal-archive-card:focus-within::before {
		transform: scaleY(1);
	}

	.journal-archive-card:hover::after,
	.journal-archive-card:focus-within::after {
		opacity: 1;
		transform: translateX(0);
	}

	.journal-archive-card__media {
		position: relative;
		display: block;
		min-height: 15.5rem;
		overflow: hidden;
		background: var(--color-off-white);
	}

	.journal-archive-card__media img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform 700ms var(--ease-premium), opacity 420ms var(--ease-premium);
	}

	.journal-archive-card:hover .journal-archive-card__media img,
	.journal-archive-card:focus-within .journal-archive-card__media img {
		transform: scale(1.035);
	}

	.journal-archive-card__placeholder {
		position: absolute;
		inset: 0;
		display: grid;
		gap: 1rem;
		align-content: center;
		padding: 1.5rem;
		background:
			linear-gradient(135deg, rgb(39 39 39 / 0.1), transparent 42%),
			var(--color-off-white);
	}

	.journal-archive-card__placeholder::before,
	.journal-archive-card__placeholder::after {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(to bottom right, transparent calc(50% - 1px), rgb(39 39 39 / 0.16), transparent calc(50% + 1px));
	}

	.journal-archive-card__placeholder::after {
		transform: scaleX(-1);
	}

	.journal-archive-card__placeholder span {
		position: relative;
		z-index: 1;
		display: block;
		height: 0.55rem;
		background: rgb(39 39 39 / 0.12);
	}

	.journal-archive-card__placeholder span:first-child {
		width: 36%;
	}

	.journal-archive-card__placeholder span:nth-child(2) {
		width: 64%;
	}

	.journal-archive-card__placeholder span:nth-child(3) {
		width: 46%;
	}

	.journal-archive-card__content {
		display: grid;
		align-content: center;
		justify-items: start;
		gap: 1.15rem;
	}

	.journal-archive-card__meta {
		display: flex;
		flex-wrap: wrap;
		gap: 0.8rem 1.25rem;
		align-items: center;
	}

	.journal-archive-card__kicker {
		margin: 0;
		color: var(--color-green-dark);
		font-size: 0.72rem;
		font-weight: 300;
		letter-spacing: 0.12em;
		line-height: 1;
		text-transform: uppercase;
	}

	.journal-archive-card__kicker span {
		margin-right: 0.25rem;
	}

	.journal-archive-card__date {
		color: var(--color-small-heading);
		font-size: 0.78rem;
		font-weight: 700;
		letter-spacing: 0.08em;
		line-height: 1;
		text-transform: uppercase;
	}

	.journal-archive-card__title {
		max-width: 46rem;
		margin: 0;
		color: var(--color-dark-text);
		font-size: clamp(1.7rem, 3vw, 2.2rem);
		font-weight: 700;
		letter-spacing: -0.055em;
		line-height: 1.16;
		text-wrap: balance;
	}

	.journal-archive-card__title a {
		background-image: linear-gradient(var(--color-green-dark), var(--color-green-dark));
		background-position: 0 100%;
		background-repeat: no-repeat;
		background-size: 0% 0.12em;
		transition:
			background-size 460ms var(--ease-premium),
			color 260ms var(--ease-premium);
	}

	.journal-archive-card__title a:hover,
	.journal-archive-card__title a:focus-visible {
		background-size: 100% 0.12em;
	}

	.journal-archive-card__excerpt {
		max-width: 42rem;
		margin: 0;
		color: var(--color-dark-text);
		font-size: clamp(0.95rem, 1.1vw, 1.04rem);
		line-height: 1.45;
	}

	.journal-archive-card__button {
		margin-top: 0.35rem;
	}

	.journal-archive__empty {
		padding: 2rem;
		border-top: 1px solid rgb(39 39 39 / 0.16);
		border-bottom: 1px solid rgb(39 39 39 / 0.16);
		background: var(--color-off-white);
	}

	.journal-archive__empty p {
		margin: 0;
		color: var(--color-dark-text);
	}

	.journal-pagination {
		margin-top: clamp(2.5rem, 5vw, 4rem);
	}

	.journal-pagination ul {
		display: flex;
		flex-wrap: wrap;
		gap: 0.65rem;
		align-items: center;
		padding: 0;
		margin: 0;
		list-style: none;
	}

	.journal-pagination a,
	.journal-pagination span {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 2.6rem;
		min-height: 2.6rem;
		padding: 0.65rem 0.85rem;
		border: 1px solid rgb(39 39 39 / 0.18);
		background: transparent;
		color: var(--color-dark-text);
		font-size: 0.9rem;
		font-weight: 700;
		line-height: 1;
		transition:
			background-color 320ms var(--ease-premium),
			border-color 320ms var(--ease-premium),
			color 320ms var(--ease-premium),
			transform 320ms var(--ease-premium);
	}

	.journal-pagination .current,
	.journal-pagination a:hover,
	.journal-pagination a:focus-visible {
		border-color: var(--color-green-dark);
		background: rgb(var(--color-green-dark-rgb) / 0.1);
		color: var(--color-dark-text);
		transform: translateY(-1px);
	}

	.single-journal__section {
		background: var(--color-white);
	}

	.single-journal__media {
		margin: 0 0 clamp(3rem, 6vw, 5rem);
		overflow: hidden;
		background: var(--color-off-white);
	}

	.single-journal__media img {
		width: 100%;
		max-height: 42rem;
		object-fit: cover;
	}

	.single-journal__layout {
		display: grid;
		grid-template-columns: minmax(0, 0.72fr) minmax(18rem, 0.32fr);
		gap: clamp(2.5rem, 7vw, 6rem);
		align-items: start;
	}

	.single-journal__content {
		max-width: 48rem;
		color: var(--color-dark-text);
		font-size: clamp(1rem, 1.25vw, 1.1rem);
		line-height: 1.68;
	}

	.single-journal__content > *:first-child {
		margin-top: 0;
	}

	.single-journal__content > *:last-child {
		margin-bottom: 0;
	}

	.single-journal__content p,
	.single-journal__content ul,
	.single-journal__content ol,
	.single-journal__content blockquote,
	.single-journal__content figure {
		margin-block: 0 1.55rem;
	}

	.single-journal__content h2,
	.single-journal__content h3,
	.single-journal__content h4 {
		margin: 2.6rem 0 1rem;
		color: var(--color-dark-text);
		font-family: var(--font-heading);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.98;
		text-transform: uppercase;
	}

	.single-journal__content h2 {
		font-size: clamp(2.5rem, 5vw, 4rem);
	}

	.single-journal__content h3 {
		font-size: clamp(2rem, 4vw, 3rem);
	}

	.single-journal__content a {
		color: var(--color-green-dark);
		font-weight: 700;
		text-decoration: underline;
		text-decoration-thickness: 0.08em;
		text-underline-offset: 0.22em;
	}

	.single-journal__content blockquote {
		padding: 1.25rem 0 1.25rem 1.35rem;
		border-left: 0.28rem solid var(--color-green-dark);
		color: var(--color-dark-text);
		font-size: clamp(1.2rem, 2vw, 1.5rem);
		font-weight: 700;
		letter-spacing: -0.04em;
		line-height: 1.32;
	}

	.single-journal__content img {
		height: auto;
	}

	.single-journal__aside {
		position: sticky;
		top: calc(var(--header-height) + 2rem);
		display: grid;
		justify-items: start;
		padding-top: 1.05rem;
		border-top: 1px solid rgb(39 39 39 / 0.08);
	}

	.single-journal__aside-kicker {
		margin: 0 0 0.85rem;
		color: var(--color-green-dark);
		font-size: 0.82rem;
		font-weight: 300;
		letter-spacing: 0.14em;
		line-height: 1;
		text-transform: uppercase;
	}

	.single-journal__aside-kicker span {
		margin-right: 0.3rem;
	}

	.single-journal__aside-title {
		max-width: 24rem;
		margin: 0;
		color: var(--color-dark-text);
		font-size: clamp(0.95rem, 1.08vw, 1.04rem);
		font-weight: 300;
		letter-spacing: 0;
		line-height: 1.5;
		text-wrap: balance;
	}

	.single-journal__back {
		margin-top: 1.35rem;
	}

	.single-journal__page-links {
		display: flex;
		gap: 0.5rem;
		align-items: center;
		margin-top: 2rem;
	}
}

@media (max-width: 900px) {
	.journal-archive-card {
		grid-template-columns: 1fr;
		gap: 1.5rem;
		padding: 2rem 1rem;
	}

	.journal-archive-card__media {
		min-height: 13.75rem;
		aspect-ratio: 16 / 10;
	}

	.single-journal__layout {
		grid-template-columns: 1fr;
		gap: clamp(2.75rem, 9vw, 4rem);
	}

	.single-journal__aside {
		position: relative;
		top: auto;
	}
}

@media (max-width: 560px) {
	.journal-hero,
	.post-hero {
		padding-block: calc(var(--header-height) + 5rem) 5rem;
	}

	.journal-hero__title,
	.post-hero__title {
		font-size: clamp(3.35rem, 18vw, 4.95rem);
	}

	.journal-archive-card__content {
		gap: 1rem;
	}

	.journal-archive-card__title {
		font-size: clamp(1.55rem, 8vw, 2rem);
	}

	.journal-pagination ul {
		gap: 0.5rem;
	}

	.journal-pagination a,
	.journal-pagination span {
		min-width: 2.45rem;
		min-height: 2.45rem;
		padding: 0.6rem 0.75rem;
	}
}

/* Journal article HTML block components */
@layer pages {
	.single-journal__content .nd9-article-intro {
		margin-bottom: clamp(2rem, 4vw, 3rem);
		padding-bottom: clamp(2rem, 4vw, 3rem);
		border-bottom: 1px solid rgb(39 39 39 / 0.12);
		color: var(--color-dark-text);
		font-size: clamp(1.25rem, 2vw, 1.65rem);
		font-weight: 700;
		letter-spacing: -0.055em;
		line-height: 1.28;
		text-wrap: balance;
	}

	.single-journal__content .nd9-article-eyebrow {
		margin: 0 0 0.85rem;
		color: var(--color-green-dark);
		font-size: 0.82rem;
		font-weight: 300;
		letter-spacing: 0.14em;
		line-height: 1;
		text-transform: uppercase;
	}

	.single-journal__content .nd9-article-eyebrow span {
		margin-right: 0.28rem;
	}

	.single-journal__content .nd9-article-section {
		margin-block: clamp(3rem, 6vw, 4.5rem);
	}

	.single-journal__content .nd9-article-section > *:first-child {
		margin-top: 0;
	}

	.single-journal__content .nd9-article-section > *:last-child {
		margin-bottom: 0;
	}

	.single-journal__content .nd9-article-image {
		margin-block: clamp(2.5rem, 5vw, 4rem);
		overflow: hidden;
		background: var(--color-off-white);
	}

	.single-journal__content .nd9-article-image img {
		display: block;
		width: 100%;
		aspect-ratio: 16 / 9;
		height: auto;
		object-fit: cover;
	}

	.single-journal__content .nd9-article-image figcaption {
		padding-top: 0.8rem;
		color: var(--color-small-heading);
		font-size: 0.82rem;
		line-height: 1.4;
	}

	.single-journal__content .nd9-article-note {
		position: relative;
		isolation: isolate;
		margin-bottom: 2rem;
		padding: clamp(1.35rem, 3vw, 2rem);
		overflow: hidden;
		border-left: 0.22rem solid var(--color-green-dark);
		background: var(--color-off-white);
		color: var(--color-dark-text);
	}

	.single-journal__content .nd9-article-note::before {
		content: "";
		position: absolute;
		inset: 0 auto 0 0;
		z-index: -1;
		width: 0;
		background: rgb(var(--color-green-dark-rgb) / 0.08);
		transition: width 520ms var(--ease-premium);
	}

	.single-journal__content .nd9-article-note:hover::before,
	.single-journal__content .nd9-article-note:focus-within::before {
		width: 100%;
	}

	.single-journal__content .nd9-article-note p {
		margin: 0;
		font-size: clamp(1.05rem, 1.45vw, 1.22rem);
		font-weight: 700;
		letter-spacing: -0.045em;
		line-height: 1.35;
	}

	.single-journal__content .nd9-article-list {
		display: grid;
		gap: 0.85rem;
		padding: 0;
		margin: 0 0 1.55rem;
		list-style: none;
	}

	.single-journal__content .nd9-article-list li {
		position: relative;
		padding-left: 1.45rem;
	}

	.single-journal__content .nd9-article-list li::before {
		content: ">";
		position: absolute;
		left: 0;
		top: 0;
		color: var(--color-green-dark);
		font-weight: 700;
	}

	.single-journal__content .nd9-article-cta {
		position: relative;
		isolation: isolate;
		margin-top: clamp(3.5rem, 7vw, 5.5rem);
		padding: clamp(2rem, 5vw, 3.5rem);
		overflow: hidden;
		border-left: 0.22rem solid var(--color-green-dark);
		background: var(--color-off-white);
		color: var(--color-dark-text);
	}

	.single-journal__content .nd9-article-cta::before {
		content: "";
		position: absolute;
		inset: 0 auto 0 0;
		z-index: -1;
		width: 0;
		background: rgb(var(--color-green-dark-rgb) / 0.08);
		transition: width 520ms var(--ease-premium);
	}

	.single-journal__content .nd9-article-cta:hover::before,
	.single-journal__content .nd9-article-cta:focus-within::before {
		width: 100%;
	}

	.single-journal__content .nd9-article-cta__eyebrow {
		margin: 0 0 0.9rem;
		color: var(--color-green-dark);
		font-size: 0.82rem;
		font-weight: 300;
		letter-spacing: 0.14em;
		line-height: 1;
		text-transform: uppercase;
	}

	.single-journal__content .nd9-article-cta__title {
		max-width: 34rem;
		margin: 0;
		color: var(--color-dark-text);
		font-family: var(--font-heading);
		font-size: clamp(3rem, 6vw, 5rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.9;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.single-journal__content .nd9-article-cta__text {
		max-width: 34rem;
		margin: 1.4rem 0 0;
		color: var(--color-dark-text);
		font-size: clamp(0.98rem, 1.1vw, 1.08rem);
		line-height: 1.5;
	}

	.single-journal__content .nd9-article-cta__button {
		margin-top: 1.35rem;
		border-color: rgb(39 39 39 / 0.72);
		background: transparent;
		color: var(--color-dark-text);
		font-weight: 300;
		text-decoration: none;
	}

	.single-journal__content .nd9-article-cta__button:visited {
		color: var(--color-dark-text);
	}

	.single-journal__content .nd9-article-cta__button:hover,
	.single-journal__content .nd9-article-cta__button:focus-visible {
		border-color: var(--color-green);
		color: var(--color-black);
		text-decoration: none;
	}
}

@media (max-width: 560px) {
	.single-journal__content .nd9-article-intro {
		font-size: clamp(1.15rem, 6vw, 1.35rem);
	}

	.single-journal__content .nd9-article-image img {
		aspect-ratio: 4 / 3;
	}

	.single-journal__content .nd9-article-cta {
		margin-inline: calc(var(--container-padding) * -0.35);
		padding: 2rem 1.25rem;
	}
}

@layer pages {
	.work-page {
		background: var(--color-white);
		color: var(--color-dark-text);
	}

	.work-hero {
		position: relative;
		isolation: isolate;
		overflow: hidden;
		padding-block: calc(var(--header-height) + var(--hero-space)) var(--hero-space);
		background: var(--color-black);
		color: var(--color-white);
	}

	.work-hero::before {
		content: "";
		position: absolute;
		inset: -10% -5%;
		z-index: -2;
		background:
			linear-gradient(90deg, rgb(var(--color-black-rgb) / 0.94), rgb(var(--color-black-rgb) / 0.68) 52%, rgb(var(--color-black-rgb) / 0.84)),
			url("../images/hero-bg.png") center right / cover no-repeat;
		opacity: 0.9;
		transform: scale(1.02);
	}

	.work-hero::after {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		background:
			radial-gradient(circle at 78% 34%, rgb(169 255 30 / 0.14), transparent 22rem),
			linear-gradient(180deg, transparent, rgb(0 0 0 / 0.36));
		pointer-events: none;
	}

	.work-hero__inner {
		max-width: none;
	}

	.work-hero__eyebrow {
		color: var(--color-green);
	}

	.work-hero__title {
		max-width: 68rem;
		margin: 0;
		font-family: var(--font-heading);
		font-size: clamp(4.4rem, 8.7vw, 9.6rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.88;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.work-hero__intro {
		max-width: 46rem;
		margin: var(--section-content-gap) 0 0;
		color: rgb(var(--color-white-rgb) / 0.86);
		font-size: clamp(1rem, 1.35vw, 1.16rem);
		line-height: 1.5;
		text-wrap: balance;
	}

	.work-archive {
		background: var(--color-white);
	}

	.work-list {
		display: grid;
		border-top: 1px solid rgb(39 39 39 / 0.16);
	}

	.work-list-card {
		position: relative;
		isolation: isolate;
		display: grid;
		grid-template-columns: minmax(0, 0.82fr) minmax(21rem, 1fr);
		gap: clamp(2rem, 5vw, 5.5rem);
		align-items: stretch;
		padding: clamp(1.5rem, 4vw, 3rem) clamp(1rem, 2.5vw, 2rem);
		overflow: hidden;
		border-bottom: 1px solid rgb(39 39 39 / 0.16);
		background: transparent;
		transition:
			background-color 420ms var(--ease-premium),
			transform 420ms var(--ease-premium),
			box-shadow 420ms var(--ease-premium);
	}

	.work-list-card::before {
		content: "";
		position: absolute;
		z-index: 2;
		inset-block: 0;
		left: 0;
		width: 0.18rem;
		background: var(--color-green-dark);
		transform: scaleY(0);
		transform-origin: top center;
		transition: transform 460ms var(--ease-premium);
	}

	.work-list-card::after {
		content: "";
		position: absolute;
		z-index: -1;
		inset: 0;
		background:
			linear-gradient(90deg, rgb(var(--color-green-dark-rgb) / 0.08), transparent 48%),
			var(--color-off-white);
		opacity: 0;
		transform: translateX(-1rem);
		transition:
			opacity 460ms var(--ease-premium),
			transform 560ms var(--ease-premium);
	}

	.work-list-card:hover,
	.work-list-card:focus-within {
		background: var(--color-off-white);
		transform: translateY(-0.18rem);
		box-shadow: 0 1.5rem 3rem rgb(39 39 39 / 0.06);
	}

	.work-list-card:hover::before,
	.work-list-card:focus-within::before {
		transform: scaleY(1);
	}

	.work-list-card:hover::after,
	.work-list-card:focus-within::after {
		opacity: 1;
		transform: translateX(0);
	}

	.work-list-card__content {
		display: grid;
		align-content: center;
		justify-items: start;
		gap: 1.15rem;
	}

	.work-list-card__count {
		margin: 0 0 0.4rem;
		color: var(--color-green-dark);
		font-size: 0.72rem;
		font-weight: 300;
		letter-spacing: 0.12em;
		line-height: 1;
		text-transform: uppercase;
	}

	.work-list-card__title {
		max-width: 42rem;
		margin: 0;
		color: var(--color-dark-text);
		font-size: clamp(1.85rem, 3.4vw, 2.55rem);
		font-weight: 700;
		letter-spacing: -0.055em;
		line-height: 1.1;
		text-wrap: balance;
	}

	.work-list-card__title a {
		background-image: linear-gradient(var(--color-green-dark), var(--color-green-dark));
		background-position: 0 100%;
		background-repeat: no-repeat;
		background-size: 0% 0.12em;
		transition:
			background-size 460ms var(--ease-premium),
			color 260ms var(--ease-premium);
	}

	.work-list-card__title a:hover,
	.work-list-card__title a:focus-visible {
		background-size: 100% 0.12em;
	}

	.work-list-card__text {
		max-width: 38rem;
		margin: 0;
		color: var(--color-dark-text);
		font-size: clamp(0.95rem, 1.1vw, 1.04rem);
		line-height: 1.45;
	}

	.work-list-card__button {
		margin-top: 0.35rem;
	}

	.work-list-card__media {
		position: relative;
		display: block;
		min-height: clamp(18rem, 28vw, 28rem);
		overflow: hidden;
		background: var(--color-black);
	}

	.work-list-card__media::after {
		content: "";
		position: absolute;
		inset: 0;
		background:
			linear-gradient(135deg, rgb(169 255 30 / 0.16), transparent 36%),
			linear-gradient(180deg, transparent, rgb(0 0 0 / 0.2));
		opacity: 0;
		transition: opacity 520ms var(--ease-premium);
	}

	.work-list-card:hover .work-list-card__media::after,
	.work-list-card:focus-within .work-list-card__media::after {
		opacity: 1;
	}

	.work-list-card__media img,
	.work-list-card__placeholder {
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform 700ms var(--ease-premium), opacity 420ms var(--ease-premium);
	}

	.work-list-card:hover .work-list-card__media img,
	.work-list-card:focus-within .work-list-card__media img,
	.work-list-card:hover .work-list-card__placeholder,
	.work-list-card:focus-within .work-list-card__placeholder {
		transform: scale(1.035);
		opacity: 0.92;
	}

	.work-list-card__placeholder {
		display: grid;
		gap: 1.15rem;
		align-content: center;
		padding: clamp(1.5rem, 4vw, 3rem);
		background:
			linear-gradient(90deg, rgb(18 18 18 / 0.92), rgb(18 18 18 / 0.58)),
			url("../images/hero-bg.png") center / cover no-repeat;
	}

	.work-list-card__placeholder::before,
	.work-list-card__placeholder::after {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(to bottom right, transparent calc(50% - 1px), rgb(169 255 30 / 0.2), transparent calc(50% + 1px));
	}

	.work-list-card__placeholder::after {
		transform: scaleX(-1);
	}

	.work-list-card__placeholder-top,
	.work-list-card__placeholder-title,
	.work-list-card__placeholder-box {
		position: relative;
		z-index: 1;
		display: block;
		background: rgb(var(--color-white-rgb) / 0.18);
	}

	.work-list-card__placeholder-top {
		width: 42%;
		height: 0.55rem;
	}

	.work-list-card__placeholder-title {
		width: 68%;
		height: 1.1rem;
	}

	.work-list-card__placeholder-box {
		width: 36%;
		height: 4.5rem;
		margin-top: 1.2rem;
		border: 1px solid rgb(169 255 30 / 0.32);
		background: transparent;
	}

	.work-archive__empty {
		padding: 2rem;
		border-top: 1px solid rgb(39 39 39 / 0.16);
		border-bottom: 1px solid rgb(39 39 39 / 0.16);
		background: var(--color-off-white);
	}

	.work-archive__empty p {
		margin: 0;
		color: var(--color-dark-text);
	}
}

@media (max-width: 900px) {
	.work-list-card {
		grid-template-columns: 1fr;
		gap: 1.5rem;
		padding: 2rem 1rem;
	}

	.work-list-card__media {
		min-height: 15rem;
		aspect-ratio: 16 / 10;
		order: -1;
	}
}

@media (max-width: 560px) {
	.work-hero {
		padding-block: calc(var(--header-height) + 5rem) 5rem;
	}

	.work-hero__title {
		font-size: clamp(3.35rem, 18vw, 4.95rem);
	}

	.work-list-card__content {
		gap: 1rem;
	}

	.work-list-card__title {
		font-size: clamp(1.6rem, 8vw, 2.1rem);
	}
}

/* Single case study page */
@layer pages {
	.case-study-page {
		background: var(--color-white);
		color: var(--color-dark-text);
	}

	.case-study-single__section {
		background: var(--color-white);
	}

	.case-study-single__media {
		position: relative;
		margin: 0 0 clamp(2rem, 5vw, 4rem);
		aspect-ratio: 16 / 9;
		overflow: hidden;
		background: var(--color-off-white);
	}

	.case-study-single__media img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.case-study-single__media--placeholder {
		display: grid;
		gap: 1.2rem;
		align-content: center;
		padding: clamp(2rem, 6vw, 5rem);
		background:
			linear-gradient(90deg, rgb(18 18 18 / 0.92), rgb(18 18 18 / 0.55)),
			url("../images/hero-bg.png") center / cover no-repeat;
	}

	.case-study-single__media--placeholder::before,
	.case-study-single__media--placeholder::after {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(to bottom right, transparent calc(50% - 1px), rgb(255 255 255 / 0.24), transparent calc(50% + 1px));
	}

	.case-study-single__media--placeholder::after {
		transform: scaleX(-1);
	}

	.case-study-single__media--placeholder span {
		position: relative;
		z-index: 1;
		display: block;
		height: 0.65rem;
		background: rgb(var(--color-white-rgb) / 0.2);
	}

	.case-study-single__media--placeholder span:first-child {
		width: 32%;
	}

	.case-study-single__media--placeholder span:nth-child(2) {
		width: 58%;
	}

	.case-study-single__media--placeholder span:nth-child(3) {
		width: 42%;
	}

	.case-study-single__details {
		display: grid;
		grid-template-columns: repeat(4, minmax(0, 1fr));
		margin: 0 0 clamp(3rem, 6vw, 5rem);
		border-top: 1px solid rgb(39 39 39 / 0.16);
		border-bottom: 1px solid rgb(39 39 39 / 0.16);
	}

	.case-study-single__detail {
		padding: clamp(1.15rem, 2.5vw, 1.6rem) clamp(1rem, 2vw, 1.35rem);
		border-right: 1px solid rgb(39 39 39 / 0.12);
	}

	.case-study-single__detail:last-child {
		border-right: 0;
	}

	.case-study-single__detail dt {
		margin: 0 0 0.5rem;
		color: var(--color-small-heading);
		font-size: 0.72rem;
		font-weight: 700;
		letter-spacing: 0.1em;
		line-height: 1;
		text-transform: uppercase;
	}

	.case-study-single__detail dd {
		margin: 0;
		color: var(--color-dark-text);
		font-size: clamp(0.95rem, 1.15vw, 1.05rem);
		font-weight: 700;
		letter-spacing: -0.03em;
		line-height: 1.35;
	}

	.case-study-single__detail a {
		background-image: linear-gradient(var(--color-green-dark), var(--color-green-dark));
		background-position: 0 100%;
		background-repeat: no-repeat;
		background-size: 0% 0.1em;
		transition:
			background-size 420ms var(--ease-premium),
			color 260ms var(--ease-premium);
	}

	.case-study-single__detail a:hover,
	.case-study-single__detail a:focus-visible {
		background-size: 100% 0.1em;
	}

	.case-study-single__layout {
		display: grid;
		grid-template-columns: minmax(0, 0.72fr) minmax(18rem, 0.32fr);
		gap: clamp(2.5rem, 7vw, 6rem);
		align-items: start;
	}

	.case-study-single__content {
		max-width: 50rem;
		color: var(--color-dark-text);
		font-size: clamp(1rem, 1.25vw, 1.1rem);
		line-height: 1.68;
	}

	.case-study-single__content > *:first-child {
		margin-top: 0;
	}

	.case-study-single__content > *:last-child {
		margin-bottom: 0;
	}

	.case-study-single__content p,
	.case-study-single__content ul,
	.case-study-single__content ol,
	.case-study-single__content blockquote,
	.case-study-single__content figure {
		margin-block: 0 1.55rem;
	}

	.case-study-single__content h2,
	.case-study-single__content h3,
	.case-study-single__content h4 {
		margin: 2.6rem 0 1rem;
		color: var(--color-dark-text);
		font-family: var(--font-heading);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.98;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.case-study-single__content h2 {
		font-size: clamp(2.5rem, 5vw, 4rem);
	}

	.case-study-single__content h3 {
		font-size: clamp(2rem, 4vw, 3rem);
	}

	.case-study-single__content a:not(.button) {
		color: var(--color-green-dark);
		font-weight: 700;
		text-decoration: underline;
		text-decoration-thickness: 0.08em;
		text-underline-offset: 0.22em;
	}

	.case-study-single__content blockquote {
		padding: 1.25rem 0 1.25rem 1.35rem;
		border-left: 0.28rem solid var(--color-green-dark);
		color: var(--color-dark-text);
		font-size: clamp(1.2rem, 2vw, 1.5rem);
		font-weight: 700;
		letter-spacing: -0.04em;
		line-height: 1.32;
	}

	.case-study-single__content img {
		display: block;
		width: 100%;
		height: auto;
	}

	.case-study-single__content figure img {
		aspect-ratio: 16 / 9;
		object-fit: cover;
	}

	.case-study-single__content figcaption {
		padding-top: 0.8rem;
		color: var(--color-small-heading);
		font-size: 0.82rem;
		line-height: 1.4;
	}

	.case-study-single__aside {
		position: sticky;
		top: calc(var(--header-height) + 2rem);
		display: grid;
		justify-items: start;
		padding-top: 1.05rem;
		border-top: 1px solid rgb(39 39 39 / 0.16);
	}

	.case-study-single__aside-kicker {
		margin: 0 0 0.85rem;
		color: var(--color-green-dark);
		font-size: 0.82rem;
		font-weight: 300;
		letter-spacing: 0.14em;
		line-height: 1;
		text-transform: uppercase;
	}

	.case-study-single__aside-kicker span {
		margin-right: 0.3rem;
	}

	.case-study-single__aside-title {
		max-width: 24rem;
		margin: 0;
		color: var(--color-dark-text);
		font-size: clamp(0.95rem, 1.08vw, 1.04rem);
		font-weight: 300;
		letter-spacing: 0;
		line-height: 1.5;
		text-wrap: balance;
	}

	.case-study-single__back {
		margin-top: 1.35rem;
	}

	.case-study-single-nav {
		padding-block: 0 var(--section-space);
		background: var(--color-white);
		color: var(--color-dark-text);
	}

	.case-study-single-nav__inner {
		display: grid;
		grid-template-columns: 1fr auto 1fr;
		gap: 1.5rem;
		align-items: center;
		padding-top: 2rem;
		border-top: 1px solid rgb(39 39 39 / 0.16);
	}

	.case-study-single-nav__item a {
		display: grid;
		gap: 0.35rem;
		transition: color 260ms var(--ease-premium);
	}

	.case-study-single-nav__item a:hover,
	.case-study-single-nav__item a:focus-visible {
		color: var(--color-green-dark);
	}

	.case-study-single-nav__item span {
		color: var(--color-small-heading);
		font-size: 0.72rem;
		font-weight: 700;
		letter-spacing: 0.08em;
		text-transform: uppercase;
	}

	.case-study-single-nav__item strong {
		font-weight: 400;
	}

	.case-study-single-nav__item--next {
		text-align: right;
	}

	.case-study-single-nav__back {
		white-space: nowrap;
	}

	.case-study-single__content .nd9-case-study-intro {
		margin-bottom: clamp(2rem, 4vw, 3rem);
		padding-bottom: clamp(2rem, 4vw, 3rem);
		border-bottom: 1px solid rgb(39 39 39 / 0.12);
		color: var(--color-dark-text);
		font-size: clamp(1.25rem, 2vw, 1.65rem);
		font-weight: 700;
		letter-spacing: -0.055em;
		line-height: 1.28;
		text-wrap: balance;
	}

	.case-study-single__content .nd9-case-study-note {
		position: relative;
		isolation: isolate;
		margin-bottom: 2rem;
		padding: clamp(1.35rem, 3vw, 2rem);
		overflow: hidden;
		border-left: 0.22rem solid var(--color-green-dark);
		background: var(--color-off-white);
		color: var(--color-dark-text);
	}

	.case-study-single__content .nd9-case-study-note::before {
		content: "";
		position: absolute;
		inset: 0 auto 0 0;
		z-index: -1;
		width: 0;
		background: rgb(var(--color-green-dark-rgb) / 0.08);
		transition: width 520ms var(--ease-premium);
	}

	.case-study-single__content .nd9-case-study-note:hover::before,
	.case-study-single__content .nd9-case-study-note:focus-within::before {
		width: 100%;
	}

	.case-study-single__content .nd9-case-study-note p {
		margin: 0;
		font-size: clamp(1.05rem, 1.45vw, 1.22rem);
		font-weight: 700;
		letter-spacing: -0.045em;
		line-height: 1.35;
	}
}

@media (max-width: 900px) {
	.case-study-single__details,
	.case-study-single__layout,
	.case-study-single-nav__inner {
		grid-template-columns: 1fr;
	}

	.case-study-single__detail {
		border-right: 0;
		border-bottom: 1px solid rgb(39 39 39 / 0.12);
	}

	.case-study-single__detail:last-child {
		border-bottom: 0;
	}

	.case-study-single__aside {
		position: relative;
		top: auto;
	}

	.case-study-single-nav__item--next {
		text-align: left;
	}

	.case-study-single-nav__back {
		width: fit-content;
		order: 3;
	}
}

@media (max-width: 560px) {
	.case-study-single__media {
		aspect-ratio: 16 / 11;
	}

	.case-study-single__details {
		margin-bottom: 3rem;
	}
}

@layer pages {
	.services-page,
	.service-single-page {
		background: var(--color-white);
		color: var(--color-dark-text);
	}

	.services-common {
		background: var(--color-white);
		color: var(--color-dark-text);
	}

	.services-common__inner {
		display: grid;
		gap: clamp(3rem, 6vw, 5rem);
	}

	.services-common__header {
		max-width: 72rem;
	}

	.services-common__eyebrow {
		color: var(--color-small-heading);
	}

	.services-common__title {
		max-width: 68rem;
		margin: 0;
		color: var(--color-dark-text);
		font-family: var(--font-heading);
		font-size: clamp(2.75rem, 4.2vw, 3rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.98;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.services-common__body {
		display: grid;
		grid-template-columns: minmax(0, 0.68fr) minmax(18rem, 0.32fr);
		gap: clamp(3rem, 8vw, 7rem);
		align-items: start;
	}

	.services-common__note {
		grid-column: 2;
		grid-row: 1;
		position: sticky;
		top: calc(var(--header-height) + 2rem);
		display: grid;
		justify-items: start;
		padding-top: 1.05rem;
		border-top: 1px solid rgb(39 39 39 / 0.08);
		background: transparent;
		color: var(--color-dark-text);
	}

	.services-common__note-kicker {
		margin: 0 0 0.85rem;
		color: var(--color-green-dark);
		font-size: 0.82rem;
		font-weight: 300;
		letter-spacing: 0.14em;
		line-height: 1;
		text-transform: uppercase;
	}

	.services-common__note-kicker span {
		margin-right: 0.3rem;
	}

	.services-common__note-text {
		max-width: 22rem;
		margin: 0;
		color: var(--color-dark-text);
		font-size: clamp(0.95rem, 1.08vw, 1.04rem);
		line-height: 1.5;
		text-wrap: balance;
	}

	.services-directory {
		grid-column: 1;
		grid-row: 1;
		display: grid;
		gap: clamp(1rem, 2vw, 1.25rem);
	}

	.services-directory-card {
		position: relative;
		isolation: isolate;
		overflow: hidden;
		background: var(--color-off-white);
		color: var(--color-dark-text);
		transition:
			background-color 360ms var(--ease-premium),
			box-shadow 420ms var(--ease-premium),
			transform 420ms var(--ease-premium);
	}

	.services-directory-card::before {
		content: "";
		position: absolute;
		z-index: 2;
		inset-block: 0;
		left: 0;
		width: 0.28rem;
		background: var(--color-green-dark);
		transform: scaleY(0);
		transform-origin: top center;
		transition: transform 420ms var(--ease-premium);
	}

	.services-directory-card:hover,
	.services-directory-card:focus-within {
		background: var(--color-white);
		box-shadow: 0 1.4rem 3.5rem rgb(18 18 18 / 0.08);
		transform: translateY(-0.12rem);
	}

	.services-directory-card:hover::before,
	.services-directory-card:focus-within::before {
		transform: scaleY(1);
	}

	.services-directory-card__link {
		display: grid;
		grid-template-columns: minmax(12rem, 0.34fr) minmax(0, 1fr);
		min-height: clamp(11rem, 15vw, 13.5rem);
		color: inherit;
		text-decoration: none;
	}

	.services-directory-card__media {
		position: relative;
		display: block;
		overflow: hidden;
		background: var(--color-black);
	}

	.services-directory-card__media img,
	.services-directory-card__placeholder {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform 720ms var(--ease-premium), opacity 720ms var(--ease-premium);
	}

	.services-directory-card:hover .services-directory-card__media img,
	.services-directory-card:focus-within .services-directory-card__media img,
	.services-directory-card:hover .services-directory-card__placeholder,
	.services-directory-card:focus-within .services-directory-card__placeholder {
		transform: scale(1.045);
		opacity: 0.9;
	}

	.services-directory-card__placeholder {
		background:
			linear-gradient(90deg, rgb(18 18 18 / 0.78), rgb(18 18 18 / 0.42)),
			url("../images/hero-bg.png") center / cover no-repeat;
	}

	.services-directory-card__placeholder::before {
		content: "";
		position: absolute;
		inset: 14%;
		border: 1px solid rgb(var(--color-white-rgb) / 0.16);
		opacity: 0.55;
	}

	.services-directory-card__content {
		display: grid;
		align-content: center;
		gap: 1rem;
		padding: clamp(1.35rem, 3vw, 2.25rem);
	}

	.services-directory-card__title {
		display: inline-flex;
		gap: 0.75rem;
		align-items: center;
		margin: 0;
		font-family: var(--font-heading);
		font-size: clamp(2.25rem, 4vw, 3.4rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.95;
		text-transform: uppercase;
		text-wrap: balance;
		transition: color 260ms var(--ease-premium);
	}

	.services-directory-card__arrow {
		font-family: var(--font-body);
		font-size: 0.55em;
		font-weight: 300;
		letter-spacing: 0;
		line-height: 1;
		transition: transform 360ms var(--ease-premium), color 360ms var(--ease-premium);
	}

	.services-directory-card:hover .services-directory-card__title,
	.services-directory-card:focus-within .services-directory-card__title {
		color: var(--color-green-dark);
	}

	.services-directory-card:hover .services-directory-card__arrow,
	.services-directory-card:focus-within .services-directory-card__arrow {
		transform: translateX(0.35rem);
	}

	.services-directory-card__excerpt {
		display: block;
		max-width: 42rem;
		color: rgb(39 39 39 / 0.8);
		font-size: clamp(0.98rem, 1.12vw, 1.06rem);
		line-height: 1.5;
	}

	.services-directory-card--placeholder .services-directory-card__link {
		cursor: default;
	}

	.service-single-body {
		background: var(--color-white);
		color: var(--color-dark-text);
	}

	.service-single-body__inner {
		display: grid;
		gap: clamp(2rem, 5vw, 4rem);
	}

	.service-single-body__media {
		position: relative;
		margin: 0;
		min-height: clamp(18rem, 42vw, 34rem);
		overflow: hidden;
		background: var(--color-black);
	}

	.service-single-body__media img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.service-single-body__media--placeholder {
		display: grid;
		place-items: center;
		background:
			linear-gradient(90deg, rgb(18 18 18 / 0.86), rgb(18 18 18 / 0.48)),
			url("../images/hero-bg.png") center / cover no-repeat;
	}

	.service-single-body__media--placeholder::before,
	.service-single-body__media--placeholder::after {
		content: "";
		position: absolute;
		inset: 12%;
		border: 1px solid rgb(var(--color-white-rgb) / 0.14);
	}

	.service-single-body__media--placeholder::after {
		inset: 20%;
		border-color: rgb(169 255 30 / 0.22);
	}

	.service-single-body__media--placeholder span {
		position: absolute;
		display: block;
		background: rgb(169 255 30 / 0.48);
	}

	.service-single-body__media--placeholder span:first-child {
		width: 38%;
		height: 1px;
	}

	.service-single-body__media--placeholder span:nth-child(2) {
		width: 1px;
		height: 38%;
	}

	.service-single-body__media--placeholder span:nth-child(3) {
		width: 0.35rem;
		height: 0.35rem;
		border-radius: 999px;
	}

	.service-single-body__details {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		margin: 0;
		border-top: 1px solid rgb(39 39 39 / 0.16);
		border-bottom: 1px solid rgb(39 39 39 / 0.16);
	}

	.service-single-body__detail {
		display: grid;
		gap: 0.55rem;
		padding: clamp(1.25rem, 3vw, 2rem);
		border-right: 1px solid rgb(39 39 39 / 0.12);
	}

	.service-single-body__detail:last-child {
		border-right: 0;
	}

	.service-single-body__detail dt {
		color: var(--color-small-heading);
		font-size: 0.76rem;
		font-weight: 700;
		letter-spacing: 0.12em;
		line-height: 1;
		text-transform: uppercase;
	}

	.service-single-body__detail dd {
		margin: 0;
		color: var(--color-dark-text);
		font-size: clamp(1rem, 1.2vw, 1.1rem);
		line-height: 1.45;
	}

	.service-single-body__layout {
		display: grid;
		grid-template-columns: minmax(0, 0.68fr) minmax(18rem, 0.32fr);
		gap: clamp(3rem, 7vw, 6rem);
		align-items: start;
	}

	.service-single-body__content {
		max-width: 52rem;
	}

	.service-single-body__content > *:first-child {
		margin-top: 0;
	}

	.service-single-body__content > *:last-child {
		margin-bottom: 0;
	}

	.service-single-body__content p,
	.service-single-body__content ul,
	.service-single-body__content ol,
	.service-single-body__content blockquote,
	.service-single-body__content figure {
		margin-bottom: 1.45rem;
	}

	.service-single-body__content h2,
	.service-single-body__content h3,
	.service-single-body__content h4 {
		margin-top: 3.5rem;
		margin-bottom: 1rem;
		font-family: var(--font-heading);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.95;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.service-single-body__content h2 {
		font-size: clamp(2.75rem, 5vw, 4.5rem);
	}

	.service-single-body__content h3 {
		font-size: clamp(2.15rem, 3.8vw, 3.25rem);
	}

	.service-single-body__content p,
	.service-single-body__content li {
		color: rgb(39 39 39 / 0.86);
		font-size: clamp(1rem, 1.2vw, 1.1rem);
		line-height: 1.65;
	}

	.service-single-body__content a:not(.button) {
		color: var(--color-dark-text);
		text-decoration: underline;
		text-decoration-color: var(--color-green-dark);
		text-decoration-thickness: 1px;
		text-underline-offset: 0.25em;
	}

	.service-single-body__content blockquote {
		padding: clamp(1.25rem, 3vw, 2rem);
		margin-left: 0;
		border-left: 0.28rem solid var(--color-green-dark);
		background: var(--color-off-white);
		color: var(--color-dark-text);
	}

	.service-single-body__content img {
		width: 100%;
		height: auto;
	}

	.service-single-body__aside {
		position: sticky;
		top: calc(var(--header-height) + 2rem);
		display: grid;
		justify-items: start;
		padding-top: 1.05rem;
		border-top: 1px solid rgb(39 39 39 / 0.08);
	}

	.service-single-body__aside-kicker {
		margin: 0 0 0.85rem;
		color: var(--color-green-dark);
		font-size: 0.82rem;
		font-weight: 300;
		letter-spacing: 0.14em;
		line-height: 1;
		text-transform: uppercase;
	}

	.service-single-body__aside-kicker span {
		margin-right: 0.3rem;
	}

	.service-single-body__aside-title {
		max-width: 24rem;
		margin: 0;
		color: var(--color-dark-text);
		font-family: var(--font-body);
		font-size: clamp(0.95rem, 1.08vw, 1.04rem);
		font-weight: 300;
		letter-spacing: 0;
		line-height: 1.5;
		text-transform: none;
		text-wrap: balance;
	}

	.service-single-body__back {
		margin-top: clamp(2.5rem, 5vw, 4rem);
	}

	.service-single-cta {
		background: var(--color-black);
		color: var(--color-white);
	}

	.service-single-cta__inner {
		max-width: 58rem;
		margin-inline: auto;
		text-align: center;
	}

	.service-single-cta__eyebrow {
		justify-content: center;
		margin: 0 0 1rem;
		color: var(--color-green);
		font-size: 0.82rem;
		font-weight: 300;
		letter-spacing: 0.14em;
		line-height: 1;
		text-transform: uppercase;
	}

	.service-single-cta__eyebrow span {
		margin-right: 0.3rem;
	}

	.service-single-cta__title {
		margin: 0;
		color: var(--color-white);
		font-family: var(--font-heading);
		font-size: clamp(3.25rem, 6vw, 6rem);
		font-weight: 400;
		letter-spacing: 0.025em;
		line-height: 0.92;
		text-transform: uppercase;
		text-wrap: balance;
	}

	.service-single-cta__text {
		max-width: 36rem;
		margin: var(--section-content-gap) auto 0;
		color: rgb(var(--color-white-rgb) / 0.78);
		font-size: clamp(1rem, 1.2vw, 1.08rem);
		line-height: 1.5;
	}

	.service-single-cta__button {
		margin-top: 1.5rem;
	}
}

@media (max-width: 1000px) {
	.services-common__body,
	.service-single-body__layout {
		grid-template-columns: 1fr;
	}

	.services-common__note,
	.services-directory {
		grid-column: auto;
		grid-row: auto;
	}

	.services-common__note,
	.service-single-body__aside {
		position: static;
		max-width: 28rem;
	}
}

@media (max-width: 700px) {
	.services-directory-card__link {
		grid-template-columns: 1fr;
	}

	.services-directory-card__media {
		min-height: 12.5rem;
	}

	.services-directory-card__content {
		padding: 1.25rem;
	}

	.service-single-body__details {
		grid-template-columns: 1fr;
	}

	.service-single-body__detail {
		border-right: 0;
		border-bottom: 1px solid rgb(39 39 39 / 0.12);
	}

	.service-single-body__detail:last-child {
		border-bottom: 0;
	}

	.service-single-cta__inner {
		text-align: left;
	}

	.service-single-cta__eyebrow {
		justify-content: flex-start;
	}
}