/* ==========================================================================
   THE SEO GENIUS — page sections
   Composition: one anchored edge, one liberated edge. Asymmetric, left-led.
   Breakpoints: 782px (tablet) and 1024px (desktop).
   ========================================================================== */

/* Shared frame ------------------------------------------------------------ */

.tsg-hero__inner,
.tsg-situation__inner,
.tsg-pillars__inner,
.tsg-work__inner,
.tsg-thinking__inner,
.tsg-sectors__inner,
.tsg-insights__inner,
.tsg-next__inner {
	box-sizing: border-box;
	width: 100%;
	max-width: calc(var(--wp--style--global--wide-size) + var(--tsg-gutter-l) + var(--tsg-gutter-r));
	margin-inline: auto;
	padding-inline: var(--tsg-gutter-l) var(--tsg-gutter-r);
}

.tsg-home > section {
	margin-block: 0;
}

.tsg-home h2 {
	margin-block: 0.5rem 1.25rem;
}

/* THE SIGNAL: Signal Lime marks one thing that matters. Ink text on lime is 15.9:1. */
mark.tsg-signal {
	background: linear-gradient(to bottom, transparent 58%, var(--wp--preset--color--signal-lime) 58%, var(--wp--preset--color--signal-lime) 94%, transparent 94%);
	color: inherit;
	padding-inline: 0.06em;
	margin-inline: -0.06em;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

[class*="is-style-section-blue"] mark.tsg-signal,
[class*="is-style-section-ink"] mark.tsg-signal {
	background: var(--wp--preset--color--signal-lime);
	color: var(--wp--preset--color--ink);
	padding-inline: 0.12em;
	margin-inline: 0;
	border-radius: 0.12em;
}

/* Arrow link: "More about us →" */
.tsg-arrow-link {
	margin: 0;
	font-weight: 600;
}

.tsg-arrow-link a {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	min-height: 44px;
	text-decoration: none;
}

.tsg-arrow-link a::after {
	content: "→";
	transition: transform var(--wp--custom--motion--quick) var(--wp--custom--motion--ease);
}

.tsg-arrow-link a:hover {
	text-decoration: underline;
	text-underline-offset: 0.3em;
}

.tsg-arrow-link a:hover::after {
	transform: translateX(4px);
}

/* ==========================================================================
   1. Hero
   ========================================================================== */

.tsg-hero {
	position: relative;
	z-index: 2;
	overflow-x: clip;
	padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--70);
}

.tsg-hero__inner {
	display: grid;
	gap: var(--wp--preset--spacing--50);
}

.tsg-hero__title {
	margin: 0 0 1.5rem;
	font-size: clamp(2.625rem, 1.6rem + 4.4vw, 5.5rem);
	line-height: 1.02;
	letter-spacing: -0.035em;
	max-width: 12.5ch;
}

.tsg-hero__lead {
	margin: 0 0 2rem;
	max-width: 31em;
}

.tsg-hero__actions {
	gap: 0.75rem;
}

.tsg-hero__note {
	margin: 1.75rem 0 0;
	color: var(--wp--preset--color--slate);
	font-size: var(--wp--preset--font-size--small);
}

/* Visual: the brand's circle composition, with a "next move" card crossing into it. */
.tsg-hero__visual {
	position: relative;
	min-height: 320px;
}

.tsg-hero__field,
.tsg-hero__depth {
	position: absolute;
	border-radius: 50%;
}

/* The field leaves the frame on the right and carries down into the next section. */
.tsg-hero__field {
	top: 0;
	left: 18%;
	width: 120vw;
	max-width: 900px;
	aspect-ratio: 1;
	background: var(--wp--preset--color--genius-blue);
}

.tsg-hero__depth {
	top: 52%;
	left: 58%;
	width: 62%;
	min-width: 220px;
	aspect-ratio: 1;
	background: var(--wp--preset--color--ink);
}

.tsg-hero__signal {
	position: absolute;
	top: calc(52% + 3.5rem);
	left: calc(58% + 3rem);
	width: 1.75rem;
	height: 1.75rem;
	border-radius: 50%;
	background: var(--wp--preset--color--signal-lime);
}

.tsg-hero__card {
	position: relative;
	z-index: 1;
	box-sizing: border-box;
	width: min(300px, 82%);
	margin-top: 3.5rem;
	padding: 1.25rem 1.25rem 0.75rem;
	border-radius: var(--wp--custom--radius--card);
	background: var(--wp--preset--color--white);
	box-shadow: var(--wp--preset--shadow--deep);
}

.tsg-hero__card-title {
	margin: 0 0 0.5rem;
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.0625rem;
	font-weight: 700;
	letter-spacing: -0.01em;
}

.tsg-hero__steps {
	margin: 0;
	padding: 0;
	list-style: none;
}

.tsg-hero__steps li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.7rem 0;
	border-top: 1px solid var(--wp--preset--color--line);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

.tsg-hero__step-state {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	padding: 0.25rem 0.625rem;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--blue-mist);
	font-size: var(--wp--preset--font-size--caption);
	font-weight: 600;
}

.tsg-hero__steps .is-done .tsg-hero__step-state::before {
	content: "✓";
	color: var(--wp--preset--color--genius-blue);
}

.tsg-hero__steps .is-next .tsg-hero__step-state {
	background: var(--wp--preset--color--signal-lime);
}

.tsg-hero__steps .is-next .tsg-hero__step-state::after {
	content: "↗";
}

@media (min-width: 1024px) {
	.tsg-hero {
		padding-block: var(--wp--preset--spacing--70) var(--wp--preset--spacing--80);
	}

	.tsg-hero__inner {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		align-items: center;
	}

	.tsg-hero__copy {
		grid-column: 1 / span 7;
	}

	.tsg-hero__visual {
		grid-column: 8 / -1;
		align-self: stretch;
		min-height: 520px;
	}

	.tsg-hero__field {
		top: -8%;
		left: 8%;
		width: 125%;
		max-width: none;
	}

	.tsg-hero__depth {
		top: 46%;
		left: 54%;
		width: 74%;
	}

	.tsg-hero__signal {
		top: calc(46% + 4.5rem);
		left: calc(54% + 4rem);
	}

	/* Narrower laptops: give the headline more room so it keeps its three lines. */
	@media (max-width: 1279.98px) {
		.tsg-hero__copy {
			grid-column: 1 / span 8;
		}

		.tsg-hero__visual {
			grid-column: 9 / -1;
		}

		.tsg-hero__title {
			font-size: clamp(2.625rem, 0.5rem + 5.4vw, 4.5rem);
		}

		.tsg-hero__card {
			left: -2%;
			width: 260px;
		}
	}

	/* The card crosses the boundary between copy and field. */
	.tsg-hero__card {
		position: absolute;
		top: 30%;
		left: -6%;
		margin: 0;
		width: 300px;
	}
}

@media (max-width: 1023.98px) {
	/* Small screens: the composition stays inside the hero so it never covers the next headline. */
	.tsg-hero {
		overflow: clip;
	}

	.tsg-hero__visual {
		margin-inline: calc(var(--tsg-gutter-l) * -1) calc(var(--tsg-gutter-r) * -1);
		padding-inline: var(--tsg-gutter-l);
		min-height: 360px;
	}

	.tsg-hero__field {
		left: 30%;
		width: 560px;
	}

	.tsg-hero__depth {
		top: 46%;
		left: 62%;
		width: 300px;
	}

	.tsg-hero__signal {
		top: calc(46% + 2.5rem);
		left: calc(62% + 2.25rem);
	}
}

/* ==========================================================================
   2. Where you are
   ========================================================================== */

.tsg-situation {
	position: relative;
	z-index: 1;
	padding-block: var(--wp--preset--spacing--80);
}

.tsg-situation__inner {
	display: grid;
	gap: var(--wp--preset--spacing--50);
}

.tsg-situation__copy p:last-child {
	max-width: 30em;
}

/* The pieces: a column of separate things, joined by one line. */
.tsg-pieces {
	--tsg-node: 10px;
	position: relative;
	display: grid;
	gap: 0.75rem;
	margin: 0;
	padding: 0 0 0 1.75rem;
	list-style: none;
}

.tsg-pieces::before {
	content: "";
	position: absolute;
	top: 1.4rem;
	bottom: 1.4rem;
	left: 4px;
	width: 2px;
	background: var(--wp--preset--color--genius-blue);
	transform-origin: top;
}

.tsg-pieces li {
	position: relative;
	justify-self: start;
	padding: 0.75rem 1.125rem;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--white);
	box-shadow: 0 1px 2px rgb(11 18 32 / 0.05);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	line-height: 1.35;
}

.tsg-pieces li::before {
	content: "";
	position: absolute;
	top: 50%;
	left: calc(-1.75rem + 5px - (var(--tsg-node) / 2) - var(--o, 0px));
	width: var(--tsg-node);
	height: var(--tsg-node);
	margin-top: calc(var(--tsg-node) / -2);
	border-radius: 50%;
	background: var(--wp--preset--color--genius-blue);
}

.tsg-situation__quiet {
	margin: 0;
	color: var(--wp--preset--color--slate);
}

.tsg-situation__turn {
	margin: 0.5rem 0 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--heading-s);
	font-weight: 600;
	letter-spacing: -0.01em;
	line-height: 1.3;
	max-width: 24em;
}

/* THE CARRY: the line leaves this section and becomes the thread in the next. */
.tsg-situation::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: calc(max(var(--tsg-gutter-l), (100% - var(--wp--style--global--wide-size)) / 2) + 4px);
	width: 2px;
	height: var(--wp--preset--spacing--60);
	background: var(--wp--preset--color--genius-blue);
}

@media (min-width: 1024px) {
	.tsg-situation__inner {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: 1.5rem;
		row-gap: var(--wp--preset--spacing--50);
	}

	.tsg-situation__copy {
		grid-column: 1 / span 5;
		grid-row: 1 / span 2;
		align-self: start;
		position: sticky;
		top: calc(var(--tsg-header-offset) + 2rem);
	}

	.tsg-pieces {
		grid-column: 7 / -1;
	}

	/* Desktop: pieces sit at different offsets, like work that grew one bit at a time. */
	.tsg-pieces li:nth-child(2) { --o: 2.5rem; }
	.tsg-pieces li:nth-child(3) { --o: 0.75rem; }
	.tsg-pieces li:nth-child(4) { --o: 4rem; }
	.tsg-pieces li:nth-child(5) { --o: 1.5rem; }
	.tsg-pieces li:nth-child(6) { --o: 3rem; }

	.tsg-pieces li {
		margin-left: var(--o, 0px);
	}

	.tsg-situation__resolve {
		grid-column: 7 / -1;
	}

}

/* ==========================================================================
   3. Brand · Build · Grow
   ========================================================================== */

.tsg-pillars {
	padding-block: var(--wp--preset--spacing--80);
}

.tsg-pillars__intro {
	display: grid;
	gap: 0 var(--wp--preset--spacing--50);
	margin-bottom: var(--wp--preset--spacing--60);
}

.tsg-pillars__intro h2 {
	font-size: var(--wp--preset--font-size--heading-xl);
}

.tsg-pillars__intro p:last-child {
	max-width: 30em;
	font-size: var(--wp--preset--font-size--lead);
	line-height: 1.5;
}

.tsg-pillars__thread {
	margin: 0 0 1rem;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

.tsg-pillars__row {
	position: relative;
	gap: var(--wp--preset--spacing--50);
	margin: 0;
}

/* THE LINK: one line joins the three, ending in the signal. */
.tsg-pillars__row::before {
	content: "";
	position: absolute;
	background: var(--wp--preset--color--white);
}

.tsg-pillars__row::after {
	content: "";
	position: absolute;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--wp--preset--color--signal-lime);
}

.tsg-pillar {
	position: relative;
}

.tsg-pillar::before {
	content: "";
	position: absolute;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--wp--preset--color--white);
}

.tsg-pillar__step {
	margin: 0 0 0.25rem;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

.tsg-pillar__title {
	margin: 0 0 0.75rem;
	font-size: var(--wp--preset--font-size--heading-l);
	font-weight: 700;
}

.tsg-pillar__links {
	display: grid;
	gap: 0.125rem;
	margin: 1.25rem 0 0;
	padding: 0;
	list-style: none;
}

.tsg-pillar__links a {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	font-weight: 600;
	text-underline-offset: 0.3em;
}

@media (min-width: 782px) {
	.tsg-pillars__intro {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		align-items: end;
	}

	.tsg-pillars__intro > * {
		grid-column: 1;
	}

	.tsg-pillars__intro > p:last-child {
		grid-column: 2;
		grid-row: 2;
		margin-bottom: 1.25rem;
	}

	.tsg-pillars__row {
		padding-top: 2.5rem;
	}

	.tsg-pillars__row::before {
		top: 0;
		left: 0;
		right: 9px;
		height: 2px;
		transform-origin: left;
	}

	.tsg-pillars__row::after {
		top: -8px;
		right: 0;
	}

	.tsg-pillar::before {
		top: calc(-2.5rem - 5px);
		left: 0;
	}
}

@media (max-width: 781.98px) {
	.tsg-pillars__row {
		padding-left: 1.75rem;
		padding-bottom: 2.5rem;
	}

	.tsg-pillars__row::before {
		top: 0.4rem;
		bottom: 9px;
		left: 5px;
		width: 2px;
		transform-origin: top;
	}

	.tsg-pillars__row::after {
		bottom: 0;
		left: -3px;
	}

	.tsg-pillar::before {
		top: 0.3rem;
		left: calc(-1.75rem);
	}
}

/* ==========================================================================
   4. Featured work
   ========================================================================== */

.tsg-work {
	padding-block: var(--wp--preset--spacing--80);
}

.tsg-work__inner {
	display: grid;
	gap: var(--wp--preset--spacing--60);
}

.tsg-work h2 {
	font-size: clamp(2.25rem, 1.6rem + 2.4vw, 3.5rem);
}

.tsg-work__client {
	color: var(--tsg-text-quiet);
	max-width: 28em;
	margin-bottom: 2rem;
}

/* The journey: three states on one line; the last one is the arrival. */
.tsg-journey {
	position: relative;
	display: grid;
	gap: var(--wp--preset--spacing--40);
	margin: 0;
	padding: 0 0 0 2.25rem;
	list-style: none;
}

.tsg-journey li:not(:last-child)::after {
	content: "";
	position: absolute;
	top: 0.75rem;
	bottom: calc(-1 * var(--wp--preset--spacing--40) - 0.75rem);
	left: calc(-2.25rem + 7px);
	width: 2px;
	background: var(--wp--preset--color--genius-blue);
	transform-origin: top;
}

.tsg-journey li {
	position: relative;
	color: var(--tsg-text-quiet);
	line-height: 1.6;
}

.tsg-journey li::before {
	content: "";
	position: absolute;
	top: 0.35rem;
	left: calc(-2.25rem + 2px);
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--wp--preset--color--genius-blue);
}

.tsg-journey li strong {
	display: block;
	margin-bottom: 0.375rem;
	color: var(--wp--preset--color--white);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--heading-s);
	font-weight: 600;
	letter-spacing: -0.01em;
}

.tsg-journey li:last-child {
	color: var(--wp--preset--color--white);
	font-size: var(--wp--preset--font-size--lead);
}

.tsg-journey li:last-child strong {
	font-size: var(--wp--preset--font-size--heading-m);
}

.tsg-journey li:last-child::before {
	top: 0.4rem;
	left: calc(-2.25rem - 2px);
	width: 20px;
	height: 20px;
	background: var(--wp--preset--color--signal-lime);
}

@media (min-width: 1024px) {
	.tsg-work__inner {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: 1.5rem;
	}

	.tsg-work__copy {
		grid-column: 1 / span 6;
	}

	.tsg-journey {
		grid-column: 7 / -1;
		padding-top: 0.5rem;
	}
}

/* ==========================================================================
   5. How we think
   ========================================================================== */

.tsg-thinking {
	padding-block: var(--wp--preset--spacing--80);
}

.tsg-thinking__belief {
	max-width: 19ch;
	margin-bottom: var(--wp--preset--spacing--60) !important;
	font-size: var(--wp--preset--font-size--heading-xl);
	line-height: 1.08;
}

.tsg-thinking__body {
	display: grid;
	gap: var(--wp--preset--spacing--60);
}

.tsg-principles {
	display: grid;
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: tsg-principle;
}

.tsg-principles li {
	position: relative;
	padding: 1.5rem 0 1.5rem 4rem;
	border-top: 1px solid var(--wp--preset--color--line);
	color: var(--wp--preset--color--slate);
	counter-increment: tsg-principle;
}

.tsg-principles li::before {
	content: counter(tsg-principle, decimal-leading-zero);
	position: absolute;
	top: 1.4rem;
	left: 0;
	color: var(--wp--preset--color--genius-blue);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--heading-s);
	font-weight: 700;
}

.tsg-principles li strong {
	display: block;
	margin-bottom: 0.25rem;
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--heading-s);
	font-weight: 600;
	letter-spacing: -0.01em;
}

.tsg-founder {
	align-self: start;
	padding: 1.75rem;
	border-radius: var(--wp--custom--radius--card);
	background: var(--wp--preset--color--cloud);
}

.tsg-founder p {
	margin: 0 0 0.75rem;
}

.tsg-founder__label {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--heading-s);
	font-weight: 700;
	letter-spacing: -0.01em;
}

@media (min-width: 1024px) {
	.tsg-thinking__body {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: 1.5rem;
	}

	.tsg-principles {
		grid-column: 1 / span 7;
	}

	.tsg-founder {
		grid-column: 9 / -1;
		margin-top: 1.5rem;
	}
}

/* ==========================================================================
   6. Where we're strongest
   ========================================================================== */

.tsg-sectors {
	padding-block: var(--wp--preset--spacing--70);
}

.tsg-sectors__inner {
	display: grid;
	gap: var(--wp--preset--spacing--50);
}

.tsg-sectors h2 {
	font-size: var(--wp--preset--font-size--heading-xl);
}

.tsg-sectors__lead p:last-child {
	max-width: 32em;
	font-size: var(--wp--preset--font-size--lead);
	line-height: 1.55;
}

.tsg-sectors__label {
	margin: 0 0 0.5rem;
	color: var(--wp--preset--color--slate);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

.tsg-sectors__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.tsg-sectors__list li {
	padding: 0.875rem 0;
	border-top: 1px solid rgb(11 18 32 / 0.12);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--heading-s);
	font-weight: 600;
	letter-spacing: -0.01em;
}

@media (min-width: 1024px) {
	.tsg-sectors__inner {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: 1.5rem;
		align-items: start;
	}

	.tsg-sectors__lead {
		grid-column: 1 / span 7;
	}

	.tsg-sectors__also {
		grid-column: 9 / -1;
	}
}

/* ==========================================================================
   7. Insights
   ========================================================================== */

.tsg-insights {
	padding-block: var(--wp--preset--spacing--80);
}

.tsg-insights__head {
	margin-bottom: var(--wp--preset--spacing--40);
}

.tsg-insights__head h2 {
	margin: 0 !important;
}

.tsg-insights__list {
	display: grid;
	gap: 0 var(--wp--preset--spacing--50);
	margin: 0;
	padding: 0;
	list-style: none;
}

.tsg-insights__list > li {
	margin: 0;
}

.tsg-insight {
	margin: 0;
	padding-block: 1.5rem;
	border-top: 1px solid var(--wp--preset--color--line);
}

.tsg-insight__cat {
	margin: 0 0 0.5rem;
	font-size: var(--wp--preset--font-size--caption);
	font-weight: 600;
}

.tsg-insight__cat a {
	text-decoration: none;
}

.tsg-insight__title {
	margin: 0 0 0.5rem;
	font-size: var(--wp--preset--font-size--heading-s);
	line-height: 1.25;
}

.tsg-insight__title a {
	color: inherit;
	text-decoration: none;
}

.tsg-insight__title a:hover {
	color: var(--wp--preset--color--genius-blue);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.tsg-insight__excerpt {
	color: var(--wp--preset--color--slate);
	font-size: var(--wp--preset--font-size--small);
}

.tsg-insight__excerpt p {
	margin: 0;
}

.tsg-insight__excerpt .wp-block-post-excerpt__more-text {
	display: none;
}

@media (min-width: 1024px) {
	.tsg-insights__list {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: 1.5rem;
	}

	/* The newest post leads; the other two stack beside it. */
	.tsg-insights__list > li:first-child {
		grid-column: 1 / span 7;
		grid-row: 1 / span 2;
	}

	.tsg-insights__list > li:not(:first-child) {
		grid-column: 9 / -1;
	}

	.tsg-insights__list > li:first-child .tsg-insight {
		padding-right: var(--wp--preset--spacing--50);
	}

	.tsg-insights__list > li:first-child .tsg-insight__title {
		font-size: var(--wp--preset--font-size--heading-l);
		line-height: 1.12;
	}

	.tsg-insights__list > li:first-child .tsg-insight__excerpt {
		font-size: var(--wp--preset--font-size--body);
		max-width: 34em;
	}
}

/* ==========================================================================
   8. What's your next move?
   ========================================================================== */

.tsg-next {
	padding-block: var(--wp--preset--spacing--80);
}

.tsg-next__inner {
	display: grid;
	gap: var(--wp--preset--spacing--50);
}

.tsg-next__title {
	margin-top: 0 !important;
}

.tsg-next__copy p {
	max-width: 26em;
	font-size: var(--wp--preset--font-size--lead);
	line-height: 1.5;
}

.tsg-moves {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid rgb(255 255 255 / 0.4);
}

.tsg-moves li {
	border-bottom: 1px solid rgb(255 255 255 / 0.4);
}

.tsg-moves a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	min-height: 72px;
	padding-block: 1rem;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--heading-s);
	font-weight: 600;
	letter-spacing: -0.01em;
	line-height: 1.25;
	text-decoration: none;
}

/* The arrow is the signal: Ink on Lime, the brand's "go" mark. */
.tsg-moves a::after {
	content: "→";
	display: grid;
	place-items: center;
	flex-shrink: 0;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 50%;
	background: var(--wp--preset--color--signal-lime);
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--body);
	font-size: 1.25rem;
	transition: transform var(--wp--custom--motion--quick) var(--wp--custom--motion--ease);
}

.tsg-moves a:hover {
	text-decoration: underline;
	text-underline-offset: 0.25em;
	text-decoration-thickness: 2px;
}

.tsg-moves a:hover::after {
	transform: translateX(4px);
}

.tsg-moves li:last-child a {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--body);
	font-weight: 600;
}

.tsg-moves li:last-child a::after {
	width: 2.25rem;
	height: 2.25rem;
	border: 2px solid var(--wp--preset--color--white);
	background: transparent;
	color: var(--wp--preset--color--white);
	font-size: 1rem;
}

@media (min-width: 1024px) {
	.tsg-next__inner {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: 1.5rem;
		align-items: center;
	}

	.tsg-next__copy {
		grid-column: 1 / span 5;
	}

	.tsg-moves {
		grid-column: 7 / -1;
	}
}

/* ==========================================================================
   Motion. State → Move → Resolve.
   Only applies when the motion script is running and the visitor hasn't
   asked for reduced motion. Otherwise everything is shown in its final state.
   ========================================================================== */

.tsg-motion .tsg-reveal {
	transition:
		opacity var(--wp--custom--motion--expressive) var(--wp--custom--motion--ease),
		transform var(--wp--custom--motion--expressive) var(--wp--custom--motion--ease);
}

.tsg-motion .tsg-reveal:not(.is-inview) {
	opacity: 0;
	transform: translateY(16px);
}

.tsg-motion .tsg-hero__lead { transition-delay: 60ms; }
.tsg-motion .tsg-hero__actions { transition-delay: 160ms; }
.tsg-motion .tsg-hero__note { transition-delay: 260ms; }

/* Hero visual: the field settles, the card arrives, the signal lands last. */
.tsg-motion .tsg-hero__field,
.tsg-motion .tsg-hero__depth,
.tsg-motion .tsg-hero__card,
.tsg-motion .tsg-hero__signal {
	transition:
		opacity var(--wp--custom--motion--expressive) var(--wp--custom--motion--ease),
		transform var(--wp--custom--motion--expressive) var(--wp--custom--motion--ease);
}

.tsg-motion .tsg-hero__visual:not(.is-inview) .tsg-hero__field { transform: translateX(6%) scale(0.96); }
.tsg-motion .tsg-hero__visual:not(.is-inview) .tsg-hero__depth { transform: translate(8%, 6%); }
.tsg-motion .tsg-hero__visual:not(.is-inview) .tsg-hero__card { opacity: 0; transform: translateX(-24px); }
.tsg-motion .tsg-hero__visual:not(.is-inview) .tsg-hero__signal { opacity: 0; transform: scale(0.2); }
.tsg-motion .tsg-hero__card { transition-delay: 200ms; }
.tsg-motion .tsg-hero__signal { transition-delay: 520ms; }

/* Pieces: scattered, then into line, then the line joins them. */
.tsg-motion .tsg-pieces li {
	transition:
		transform var(--wp--custom--motion--expressive) var(--wp--custom--motion--ease),
		opacity var(--wp--custom--motion--standard) ease;
}

.tsg-motion .tsg-pieces::before,
.tsg-motion .tsg-pieces li::before {
	transition: transform var(--wp--custom--motion--expressive) var(--wp--custom--motion--ease), opacity var(--wp--custom--motion--standard) ease;
	transition-delay: 640ms;
}

.tsg-motion .tsg-pieces:not(.is-inview) li:nth-child(1) { transform: translate(18px, 6px) rotate(-3deg); }
.tsg-motion .tsg-pieces:not(.is-inview) li:nth-child(2) { transform: translate(-22px, 4px) rotate(2.5deg); }
.tsg-motion .tsg-pieces:not(.is-inview) li:nth-child(3) { transform: translate(36px, -2px) rotate(-1.5deg); }
.tsg-motion .tsg-pieces:not(.is-inview) li:nth-child(4) { transform: translate(-12px, 8px) rotate(3deg); }
.tsg-motion .tsg-pieces:not(.is-inview) li:nth-child(5) { transform: translate(28px, 2px) rotate(-2.5deg); }
.tsg-motion .tsg-pieces:not(.is-inview) li:nth-child(6) { transform: translate(-30px, -4px) rotate(1.5deg); }
.tsg-motion .tsg-pieces:not(.is-inview)::before { transform: scaleY(0); }
.tsg-motion .tsg-pieces:not(.is-inview) li::before { opacity: 0; }

.tsg-motion .tsg-pieces li:nth-child(2) { transition-delay: 40ms; }
.tsg-motion .tsg-pieces li:nth-child(3) { transition-delay: 80ms; }
.tsg-motion .tsg-pieces li:nth-child(4) { transition-delay: 120ms; }
.tsg-motion .tsg-pieces li:nth-child(5) { transition-delay: 160ms; }
.tsg-motion .tsg-pieces li:nth-child(6) { transition-delay: 200ms; }

/* Lines that draw themselves when they arrive. */
.tsg-motion .tsg-link-draw::before {
	transition: transform 900ms var(--wp--custom--motion--ease);
}

.tsg-motion .tsg-link-draw::after {
	transition: opacity var(--wp--custom--motion--standard) ease 800ms, transform var(--wp--custom--motion--standard) var(--wp--custom--motion--ease) 800ms;
}

.tsg-motion .tsg-pillars__row.tsg-link-draw:not(.is-inview)::before { transform: scaleX(0); }
.tsg-motion .tsg-journey li::after { transition: transform var(--wp--custom--motion--expressive) var(--wp--custom--motion--ease); }
.tsg-motion .tsg-journey li:nth-child(2)::after { transition-delay: 450ms; }
.tsg-motion .tsg-journey:not(.is-inview) li::after { transform: scaleY(0); }
.tsg-motion .tsg-journey li:last-child::before { transition: opacity var(--wp--custom--motion--standard) ease 900ms, transform var(--wp--custom--motion--standard) var(--wp--custom--motion--ease) 900ms; }
.tsg-motion .tsg-journey:not(.is-inview) li:last-child::before { opacity: 0; transform: scale(0.3); }
.tsg-motion .tsg-link-draw:not(.is-inview)::after { opacity: 0; transform: scale(0.3); }

@media (max-width: 781.98px) {
	.tsg-motion .tsg-pillars__row.tsg-link-draw:not(.is-inview)::before { transform: scaleY(0); }
}

/* ==========================================================================
   Start a project (/get-started/)
   ========================================================================== */

.tsg-start {
	padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--80);
}

.tsg-start__inner {
	box-sizing: border-box;
	display: grid;
	gap: var(--wp--preset--spacing--50);
	width: 100%;
	max-width: calc(var(--wp--style--global--wide-size) + var(--tsg-gutter-l) + var(--tsg-gutter-r));
	margin-inline: auto;
	padding-inline: var(--tsg-gutter-l) var(--tsg-gutter-r);
}

.tsg-start__title {
	margin: 0.5rem 0 1.25rem;
	font-size: clamp(2.375rem, 1.6rem + 3vw, 4rem);
	max-width: 11ch;
}

.tsg-start__subhead {
	margin: var(--wp--preset--spacing--50) 0 1rem;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--body);
	font-weight: 700;
	letter-spacing: 0;
}

/* The three steps after sending, on one line. */
.tsg-start__next {
	position: relative;
	display: grid;
	gap: 1rem;
	margin: 0;
	padding: 0 0 0 1.75rem;
	list-style: none;
	counter-reset: tsg-next;
	color: var(--wp--preset--color--slate);
}

.tsg-start__next::before {
	content: "";
	position: absolute;
	top: 0.5rem;
	bottom: 0.6rem;
	left: 4px;
	width: 2px;
	background: var(--wp--preset--color--line);
}

.tsg-start__next li {
	position: relative;
}

.tsg-start__next li::before {
	content: "";
	position: absolute;
	top: 0.45rem;
	left: calc(-1.75rem);
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--wp--preset--color--genius-blue);
}

.tsg-start__alt {
	margin-top: var(--wp--preset--spacing--40);
}

.tsg-start__form {
	padding: clamp(1.25rem, 4vw, 3rem);
	border-radius: var(--wp--custom--radius--card);
	background: var(--wp--preset--color--white);
	box-shadow: var(--wp--preset--shadow--lift);
}

@media (max-width: 1023.98px) {
	/* Phones: the form comes first; the reassurance sits below its intro. */
	.tsg-start__subhead,
	.tsg-start__next,
	.tsg-start__alt {
		display: none;
	}

	.tsg-start__form {
		margin-inline: calc(var(--tsg-gutter-l) * -0.5) calc(var(--tsg-gutter-r) * -0.5);
	}
}

@media (min-width: 1024px) {
	.tsg-start__inner {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: 1.5rem;
		align-items: start;
	}

	.tsg-start__aside {
		grid-column: 1 / span 5;
		position: sticky;
		top: calc(var(--tsg-header-offset) + 2.5rem);
	}

	.tsg-start__form {
		grid-column: 7 / -1;
	}
}

/* ==========================================================================
   Service pages
   ========================================================================== */

.tsg-svc__inner,
.tsg-svc-hero__inner,
.tsg-system__inner {
	box-sizing: border-box;
	width: 100%;
	max-width: calc(var(--wp--style--global--wide-size) + var(--tsg-gutter-l) + var(--tsg-gutter-r));
	margin-inline: auto;
	padding-inline: var(--tsg-gutter-l) var(--tsg-gutter-r);
}

.tsg-svc-content > *,
.tsg-service > * {
	margin-block: 0;
}

/* Hero: the pillar's name runs large off the right edge (The Carry). */
.tsg-svc-hero {
	position: relative;
	overflow: clip;
	padding-block: var(--wp--preset--spacing--70);
}

/* Content sits above the word; the word is measured from the screen edge. */
.tsg-svc-hero__inner > :not(.tsg-svc-word) {
	position: relative;
	z-index: 1;
}

.tsg-svc-word {
	position: absolute;
	right: -0.06em;
	bottom: -0.24em;
	z-index: 0;
	color: var(--wp--preset--color--blue-mist);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(6rem, 3rem + 15vw, 18rem);
	font-weight: 800;
	letter-spacing: -0.06em;
	line-height: 1;
	pointer-events: none;
	user-select: none;
}

.tsg-svc-eyebrow a {
	color: inherit;
	text-decoration: none;
}

.tsg-svc-eyebrow a:hover {
	text-decoration: underline;
}

.tsg-svc-hero__title {
	max-width: 15ch;
	margin: 0.5rem 0 1.25rem;
	font-size: clamp(2.5rem, 1.5rem + 3.6vw, 4.5rem);
	line-height: 1.04;
	letter-spacing: -0.035em;
}

.tsg-svc-hero__lead {
	max-width: 34em;
	margin-bottom: 2rem;
	font-size: var(--wp--preset--font-size--lead);
	line-height: 1.55;
}

.tsg-svc-hero__lead p {
	margin: 0;
}

.tsg-svc-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
}

/* Sound familiar? ---------------------------------------------------------- */

.tsg-svc-signs {
	padding-block: var(--wp--preset--spacing--70);
}

.tsg-svc-signs .tsg-svc__inner {
	display: grid;
	gap: 1.5rem;
}

.tsg-svc-signs h2 {
	margin: 0;
}

.tsg-svc-signs__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.tsg-svc-signs__list li {
	position: relative;
	padding: 1rem 0 1rem 2rem;
	border-top: 1px solid var(--wp--preset--color--line);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--heading-s);
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1.35;
}

.tsg-svc-signs__list li::before {
	content: "";
	position: absolute;
	top: 1.55rem;
	left: 0;
	width: 10px;
	height: 10px;
	border: 2px solid var(--wp--preset--color--genius-blue);
	border-radius: 50%;
}

@media (min-width: 1024px) {
	.tsg-svc-signs .tsg-svc__inner {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: 1.5rem;
	}

	.tsg-svc-signs h2 {
		grid-column: 1 / span 4;
	}

	.tsg-svc-signs__list {
		grid-column: 6 / -1;
	}
}

/* What the work includes ------------------------------------------------- */

.tsg-svc-deliver {
	padding-block: var(--wp--preset--spacing--80);
}

.tsg-svc-deliver__head {
	margin-bottom: var(--wp--preset--spacing--50);
}

.tsg-svc-deliver__head h2 {
	margin: 0.25rem 0 0;
}

.tsg-svc-deliver__list {
	display: grid;
	gap: 0 var(--wp--preset--spacing--50);
	margin: 0;
	padding: 0;
	list-style: none;
}

.tsg-svc-deliver__list li {
	padding: 1.5rem 0;
	border-top: 1px solid var(--wp--preset--color--line);
	color: var(--wp--preset--color--slate);
}

.tsg-svc-deliver__list li strong {
	display: block;
	margin-bottom: 0.375rem;
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--heading-s);
	font-weight: 600;
	letter-spacing: -0.01em;
}

@media (min-width: 782px) {
	.tsg-svc-deliver__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* How it works (ink) ------------------------------------------------------ */

.tsg-svc-steps {
	padding-block: var(--wp--preset--spacing--80);
}

.tsg-svc-steps h2 {
	margin: 0.25rem 0 var(--wp--preset--spacing--50);
}

.tsg-svc-steps__list {
	position: relative;
	display: grid;
	gap: var(--wp--preset--spacing--40);
	margin: 0;
	padding: 0;
	list-style: none;
}

.tsg-svc-steps__list li {
	position: relative;
	color: var(--tsg-text-quiet);
}

.tsg-svc-steps__list li strong {
	display: block;
	margin-bottom: 0.5rem;
	color: var(--wp--preset--color--white);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--heading-m);
	font-weight: 700;
}

.tsg-svc-steps__list li::before {
	content: "";
	position: absolute;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--wp--preset--color--genius-blue);
}

.tsg-svc-steps__list li:last-child::before {
	width: 18px;
	height: 18px;
	background: var(--wp--preset--color--signal-lime);
}

.tsg-svc-steps__list::before {
	content: "";
	position: absolute;
	background: var(--wp--preset--color--genius-blue);
}

@media (min-width: 782px) {
	.tsg-svc-steps__list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		padding-top: 2.5rem;
	}

	.tsg-svc-steps__list::before {
		top: 5px;
		left: 0;
		right: 0;
		height: 2px;
		transform-origin: left;
	}

	.tsg-svc-steps__list li::before {
		top: calc(-2.5rem);
		left: 0;
	}

	.tsg-svc-steps__list li:last-child::before {
		top: calc(-2.5rem - 3px);
	}
}

@media (max-width: 781.98px) {
	.tsg-svc-steps__list {
		padding-left: 2rem;
	}

	.tsg-svc-steps__list::before {
		top: 0.5rem;
		bottom: 1rem;
		left: 5px;
		width: 2px;
		transform-origin: top;
	}

	.tsg-svc-steps__list li::before {
		top: 0.45rem;
		left: -2rem;
	}

	.tsg-svc-steps__list li:last-child::before {
		left: calc(-2rem - 3px);
	}
}

.tsg-motion .tsg-svc-steps__list.tsg-link-draw:not(.is-inview)::before {
	transform: scaleX(0);
}

@media (max-width: 781.98px) {
	.tsg-motion .tsg-svc-steps__list.tsg-link-draw:not(.is-inview)::before {
		transform: scaleY(0);
	}
}

/* Is this right for you? -------------------------------------------------- */

.tsg-svc-fit {
	padding-block: var(--wp--preset--spacing--80);
}

.tsg-svc-fit h2 {
	margin: 0 0 var(--wp--preset--spacing--40);
}

.tsg-svc-fit__cols {
	gap: var(--wp--preset--spacing--50);
}

.tsg-svc-fit h3 {
	margin: 0 0 1rem;
	font-size: var(--wp--preset--font-size--heading-s);
}

.tsg-fit-yes,
.tsg-fit-no {
	display: grid;
	gap: 0.875rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.tsg-fit-yes li,
.tsg-fit-no li {
	position: relative;
	padding-left: 2.25rem;
	line-height: 1.55;
}

.tsg-fit-yes li::before,
.tsg-fit-no li::before {
	position: absolute;
	top: 0.05em;
	left: 0;
	display: grid;
	place-items: center;
	width: 1.5rem;
	height: 1.5rem;
	border-radius: 50%;
	font-size: 0.875rem;
	font-weight: 700;
}

.tsg-fit-yes li::before {
	content: "✓";
	background: var(--wp--preset--color--genius-blue);
	color: var(--wp--preset--color--white);
}

.tsg-fit-no li {
	color: var(--wp--preset--color--slate);
}

.tsg-fit-no li::before {
	content: "–";
	border: 1.5px solid var(--wp--preset--color--slate);
	color: var(--wp--preset--color--slate);
}

/* Questions --------------------------------------------------------------- */

.tsg-svc-faq {
	padding-block: var(--wp--preset--spacing--80);
}

.tsg-svc-faq .tsg-svc__inner {
	display: grid;
	gap: 1.5rem;
}

.tsg-svc-faq h2 {
	margin: 0;
}

.tsg-svc-faq__list > * {
	margin-block: 0;
}

.tsg-svc-faq .wp-block-details {
	border-top: 1px solid var(--wp--preset--color--line);
}

.tsg-svc-faq .wp-block-details:last-child {
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.tsg-svc-faq summary {
	position: relative;
	display: block;
	padding: 1.25rem 3rem 1.25rem 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--heading-s);
	font-weight: 600;
	letter-spacing: -0.01em;
	line-height: 1.35;
	cursor: pointer;
	list-style: none;
}

.tsg-svc-faq summary::-webkit-details-marker {
	display: none;
}

.tsg-svc-faq summary::after {
	content: "+";
	position: absolute;
	top: 50%;
	right: 0;
	display: grid;
	place-items: center;
	width: 2rem;
	height: 2rem;
	margin-top: -1rem;
	border: 1.5px solid currentColor;
	border-radius: 50%;
	font-family: var(--wp--preset--font-family--body);
	font-size: 1.125rem;
	font-weight: 500;
	transition: transform var(--wp--custom--motion--quick) var(--wp--custom--motion--ease);
}

.tsg-svc-faq details[open] summary::after {
	content: "−";
}

.tsg-svc-faq details > :not(summary) {
	max-width: 44em;
	margin: 0 0 1.25rem;
	color: var(--wp--preset--color--slate);
}

@media (min-width: 1024px) {
	.tsg-svc-faq .tsg-svc__inner {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: 1.5rem;
	}

	.tsg-svc-faq h2 {
		grid-column: 1 / span 4;
	}

	.tsg-svc-faq__list {
		grid-column: 6 / -1;
	}
}

/* Part of one system ------------------------------------------------------ */

.tsg-system {
	padding-block: var(--wp--preset--spacing--80);
	border-top: 1px solid var(--wp--preset--color--line);
}

.tsg-system__title {
	max-width: 18ch;
	margin: 0.25rem 0 1rem;
}

.tsg-system__lead {
	max-width: 36em;
	margin: 0 0 var(--wp--preset--spacing--50);
	color: var(--wp--preset--color--slate);
}

.tsg-system__line {
	position: relative;
	display: grid;
	gap: 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.tsg-system__line::before {
	content: "";
	position: absolute;
	background: var(--wp--preset--color--genius-blue);
}

.tsg-system__node {
	position: relative;
	display: grid;
	gap: 0.25rem;
}

.tsg-system__node::before {
	content: "";
	position: absolute;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--wp--preset--color--genius-blue);
}

/* This page: the signal. Lime with an Ink ring so it reads on white. */
.tsg-system__node.is-current::before {
	width: 20px;
	height: 20px;
	border: 3px solid var(--wp--preset--color--ink);
	background: var(--wp--preset--color--signal-lime);
}

.tsg-system__name {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--heading-m);
	font-weight: 700;
	letter-spacing: -0.015em;
}

.tsg-system__name a {
	color: inherit;
	text-decoration-color: var(--wp--preset--color--line);
	text-underline-offset: 0.2em;
}

.tsg-system__name a:hover {
	color: var(--wp--preset--color--genius-blue);
	text-decoration-color: currentColor;
}

.tsg-system__desc {
	color: var(--wp--preset--color--slate);
	font-size: var(--wp--preset--font-size--small);
}

.tsg-system__more {
	margin-top: var(--wp--preset--spacing--50);
	padding-top: 1.5rem;
	border-top: 1px solid var(--wp--preset--color--line);
}

.tsg-system__more-title {
	margin: 0 0 0.5rem;
	font-weight: 700;
}

.tsg-system__more ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem 1.75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.tsg-system__more a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	font-weight: 600;
	text-underline-offset: 0.3em;
}

@media (min-width: 782px) {
	.tsg-system__line {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		padding-top: 2.5rem;
	}

	.tsg-system__line::before {
		top: 5px;
		left: 0;
		right: 0;
		height: 2px;
	}

	.tsg-system__node::before {
		top: -2.5rem;
		left: 0;
	}

	.tsg-system__node.is-current::before {
		top: calc(-2.5rem - 4px);
	}
}

@media (max-width: 781.98px) {
	.tsg-system__line {
		padding-left: 2rem;
	}

	.tsg-system__line::before {
		top: 0.6rem;
		bottom: 2rem;
		left: 5px;
		width: 2px;
	}

	.tsg-system__node::before {
		top: 0.55rem;
		left: -2rem;
	}

	.tsg-system__node.is-current::before {
		left: calc(-2rem - 4px);
		top: 0.35rem;
	}
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

@media (max-width: 781.98px) {
	/* Phones: the pillar word sits below the buttons, not behind them. */
	.tsg-svc-hero {
		padding-bottom: clamp(5rem, 22vw, 7rem);
	}
}

/* ==========================================================================
   About
   ========================================================================== */

.tsg-about-story,
.tsg-about-founder,
.tsg-about-partner {
	padding-block: var(--wp--preset--spacing--80);
}

.tsg-about-story .tsg-svc__inner,
.tsg-about-founder .tsg-svc__inner {
	display: grid;
	gap: var(--wp--preset--spacing--50);
}

.tsg-about-story h2 {
	max-width: 14ch;
	margin: 0.25rem 0 0;
}

.tsg-about-story__body p {
	max-width: 36em;
	font-size: var(--wp--preset--font-size--lead);
	line-height: 1.6;
}

.tsg-about-story__body p:first-child {
	margin-top: 0;
}

.tsg-mission p:not(.tsg-founder__label) {
	margin-bottom: 1.5rem;
}

/* Founder (ink): the brand mark echoes the three moves. */
.tsg-about-founder h2 {
	max-width: 16ch;
	margin: 0.25rem 0 1.5rem;
}

.tsg-about-founder__copy p:not(.is-style-eyebrow) {
	max-width: 36em;
	color: var(--tsg-text-quiet);
	font-size: var(--wp--preset--font-size--lead);
	line-height: 1.6;
}

.tsg-about-founder__mark {
	position: relative;
	min-height: 260px;
}

.tsg-about-founder__mark span {
	position: absolute;
	border-radius: 50%;
}

.tsg-about-founder__mark span:nth-child(1) {
	top: 0;
	left: 10%;
	width: min(320px, 70%);
	aspect-ratio: 1;
	background: var(--wp--preset--color--genius-blue);
}

.tsg-about-founder__mark span:nth-child(2) {
	top: 40%;
	left: 46%;
	width: min(200px, 44%);
	aspect-ratio: 1;
	border: 2px solid var(--wp--preset--color--white);
}

.tsg-about-founder__mark span:nth-child(3) {
	top: 24%;
	left: 62%;
	width: 26px;
	aspect-ratio: 1;
	background: var(--wp--preset--color--signal-lime);
}

/* How we work, on white: the steps section uses its light variant. */
.tsg-about-how li {
	color: var(--wp--preset--color--slate);
}

.tsg-about-how .tsg-svc-steps__list li strong {
	color: var(--wp--preset--color--ink);
}

.tsg-about-how .tsg-svc-steps__list li:last-child::before {
	border: 3px solid var(--wp--preset--color--ink);
}

.tsg-about-partner h2 {
	margin: 0 0 0.75rem;
	font-size: var(--wp--preset--font-size--heading-m);
}

.tsg-about-partner p {
	max-width: 44em;
	margin: 0;
}

@media (min-width: 1024px) {
	.tsg-about-story .tsg-svc__inner,
	.tsg-about-founder .tsg-svc__inner {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: 1.5rem;
	}

	.tsg-about-story__head {
		grid-column: 1 / span 5;
	}

	.tsg-about-story__body {
		grid-column: 7 / -1;
	}

	.tsg-about-founder__copy {
		grid-column: 1 / span 7;
	}

	.tsg-about-founder__mark {
		grid-column: 9 / -1;
		align-self: center;
		min-height: 340px;
	}

	.tsg-about-partner .tsg-svc__inner {
		display: grid;
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: 1.5rem;
		align-items: baseline;
	}

	.tsg-about-partner h2 {
		grid-column: 1 / span 5;
	}

	.tsg-about-partner p {
		grid-column: 7 / -1;
	}
}

@media (max-width: 1023.98px) {
	.tsg-about-founder__mark {
		min-height: 220px;
	}
}

/* ==========================================================================
   Case studies
   ========================================================================== */

.tsg-case-back a {
	color: inherit;
	text-decoration: none;
}

.tsg-case-back a:hover {
	text-decoration: underline;
}

.tsg-case-hero__title {
	max-width: 18ch;
}

/* Facts row: what, who, when, then the live site. */
.tsg-case-facts {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 1.5rem 3rem;
	margin-top: 2rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--wp--preset--color--line);
	max-width: 56rem;
}

.tsg-case-facts__list {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem 2.5rem;
	margin: 0;
}

.tsg-case-facts__item dt {
	color: var(--wp--preset--color--slate);
	font-size: var(--wp--preset--font-size--caption);
	font-weight: 600;
}

.tsg-case-facts__item dd {
	margin: 0.125rem 0 0;
	font-weight: 600;
}

.tsg-case-facts__link {
	margin: 0;
}

/* Cover: wide, rounded on one side, running off the right edge. */
.tsg-case-cover {
	box-sizing: border-box;
	margin: 0 0 var(--wp--preset--spacing--70) !important;
	padding-left: max(var(--tsg-gutter-l), calc((100% - var(--wp--style--global--wide-size)) / 2));
}

.tsg-case-cover img {
	display: block;
	width: 100%;
	max-height: 680px;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--card) 0 0 var(--wp--custom--radius--card);
	box-shadow: var(--wp--preset--shadow--lift);
}

/* The story: seven parts on one line, labels on the left on wide screens. */
.tsg-case-content {
	box-sizing: border-box;
	width: 100%;
	max-width: calc(var(--wp--style--global--wide-size) + var(--tsg-gutter-l) + var(--tsg-gutter-r));
	margin-inline: auto;
	padding: 0 var(--tsg-gutter-r) var(--wp--preset--spacing--80) var(--tsg-gutter-l);
}

.tsg-story {
	position: relative;
	counter-reset: tsg-part;
}

.tsg-story::before {
	content: "";
	position: absolute;
	top: 0.6rem;
	bottom: 0.6rem;
	left: 5px;
	width: 2px;
	background: var(--wp--preset--color--line);
}

.tsg-story__part {
	position: relative;
	margin: 0 0 var(--wp--preset--spacing--60) !important;
	padding-left: 2.5rem;
	counter-increment: tsg-part;
}

.tsg-story__part::before {
	content: "";
	position: absolute;
	top: 0.55rem;
	left: 0;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--wp--preset--color--genius-blue);
}

.tsg-story__part:last-child {
	margin-bottom: 0 !important;
}

/* "After": the arrival. */
.tsg-story__part:nth-child(5)::before {
	left: -4px;
	width: 20px;
	height: 20px;
	top: 0.35rem;
	border: 3px solid var(--wp--preset--color--ink);
	background: var(--wp--preset--color--signal-lime);
}

.tsg-story__part h2 {
	margin: 0 0 0.75rem;
	font-size: var(--wp--preset--font-size--heading-m);
}

.tsg-story__part h2::before {
	content: counter(tsg-part, decimal-leading-zero) "  ";
	color: var(--wp--preset--color--genius-blue);
	font-size: 0.7em;
	white-space: pre;
}

.tsg-story__part > :not(h2) {
	max-width: 40em;
}

.tsg-story__part p,
.tsg-story__part li {
	font-size: var(--wp--preset--font-size--lead);
	line-height: 1.6;
}

.tsg-story__part figure {
	max-width: none;
	margin-block: 1.5rem;
}

.tsg-story__part img {
	border-radius: var(--wp--custom--radius--md);
	box-shadow: var(--wp--preset--shadow--lift);
}

.tsg-story__part blockquote {
	margin-block: 1.5rem;
}

@media (min-width: 1024px) {
	.tsg-story__part {
		display: grid;
		grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
		column-gap: 1.5rem;
	}

	.tsg-story__part > * {
		grid-column: 2;
	}

	.tsg-story__part > h2 {
		grid-column: 1;
		grid-row: 1 / span 20;
		align-self: start;
		position: sticky;
		top: calc(var(--tsg-header-offset) + 2rem);
	}
}

/* Evidence pair: a number and what it means. */
.tsg-evidence {
	display: grid;
	gap: 0.25rem;
	margin: 0 0 1.25rem;
}

.tsg-evidence__number {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--metric);
	font-weight: 800;
	letter-spacing: -0.04em;
	line-height: 1;
}

.tsg-evidence__meaning {
	margin: 0;
	color: var(--wp--preset--color--slate);
	font-size: var(--wp--preset--font-size--body) !important;
}

/* Our work listing ------------------------------------------------------------ */

.tsg-cases {
	padding-block: 0 var(--wp--preset--spacing--80);
}

.tsg-cases__list {
	display: grid;
	gap: var(--wp--preset--spacing--60);
	margin: 0;
	padding: 0;
	list-style: none;
}

.tsg-case-card {
	display: grid;
	gap: 1.5rem;
	align-items: center;
}

.tsg-case-card__media {
	overflow: hidden;
	aspect-ratio: 16 / 10;
	border-radius: var(--wp--custom--radius--card);
	background:
		radial-gradient(circle at 78% 70%, var(--wp--preset--color--ink) 0 22%, transparent 22.2%),
		radial-gradient(circle at 60% 40%, var(--wp--preset--color--genius-blue) 0 38%, transparent 38.2%),
		var(--wp--preset--color--blue-mist);
}

.tsg-case-card__img,
.tsg-case-card__img a,
.tsg-case-card__img img {
	display: block;
	width: 100%;
	height: 100%;
	margin: 0;
	object-fit: cover;
}

.tsg-case-card__title {
	margin: 0.25rem 0 0.75rem;
	font-size: var(--wp--preset--font-size--heading-l);
}

.tsg-case-card__title a {
	color: inherit;
	text-decoration: none;
}

.tsg-case-card__title a:hover {
	color: var(--wp--preset--color--genius-blue);
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

.tsg-case-card__excerpt {
	max-width: 34em;
	color: var(--wp--preset--color--slate);
}

.tsg-case-card__more {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	min-height: 44px;
	font-weight: 600;
}

.tsg-case-card__more::after {
	content: "→";
}

.tsg-cases__empty {
	max-width: 36em;
	padding: 2rem;
	border-radius: var(--wp--custom--radius--card);
	background: var(--wp--preset--color--cloud);
	font-size: var(--wp--preset--font-size--lead);
}

@media (min-width: 1024px) {
	.tsg-case-card {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: 1.5rem;
	}

	.tsg-case-card__media {
		grid-column: 1 / span 7;
	}

	.tsg-case-card__body {
		grid-column: 9 / -1;
	}

	/* Alternate sides for rhythm. */
	.tsg-cases__list > li:nth-child(even) .tsg-case-card__media {
		grid-column: 6 / -1;
		grid-row: 1;
	}

	.tsg-cases__list > li:nth-child(even) .tsg-case-card__body {
		grid-column: 1 / span 4;
		grid-row: 1;
	}
}

.tsg-story__part > h2 + * {
	margin-top: 0.35rem;
}

@media (min-width: 1024px) {
	.tsg-story__part > h2 + * {
		margin-top: 0.2rem;
	}
}

/* ==========================================================================
   Contact
   ========================================================================== */

.tsg-contact {
	margin: 0;
}

.tsg-contact dt {
	font-size: var(--wp--preset--font-size--caption);
	font-weight: 600;
}

.tsg-contact dd {
	margin: 0;
}

.tsg-contact a {
	overflow-wrap: anywhere;
}

/* Contact page: large, tappable details. */
.tsg-contact-main {
	padding-block: 0 var(--wp--preset--spacing--80);
}

.tsg-contact-main .tsg-svc__inner {
	display: grid;
	gap: var(--wp--preset--spacing--50);
	align-items: start;
}

.tsg-contact--cards {
	display: grid;
	gap: 0;
}

.tsg-contact--cards .tsg-contact__item {
	padding: 1.25rem 0;
	border-top: 1px solid var(--wp--preset--color--line);
}

.tsg-contact--cards dt {
	color: var(--wp--preset--color--slate);
}

.tsg-contact--cards dd {
	margin-top: 0.25rem;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--heading-m);
	font-weight: 600;
	letter-spacing: -0.015em;
	line-height: 1.25;
}

.tsg-contact--cards a {
	color: inherit;
	text-decoration-color: var(--wp--preset--color--genius-blue);
	text-decoration-thickness: 2px;
	text-underline-offset: 0.2em;
}

.tsg-contact--cards a:hover {
	color: var(--wp--preset--color--genius-blue);
}

.tsg-contact--cards .tsg-contact__item--address dd,
.tsg-contact--cards .tsg-contact__item--hours dd {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--lead);
	font-weight: 500;
	letter-spacing: 0;
}

.tsg-contact-main__project {
	padding: clamp(1.5rem, 4vw, 2.75rem);
	border-radius: var(--wp--custom--radius--card);
}

.tsg-contact-main__project h2 {
	margin: 0 0 0.75rem;
	font-size: var(--wp--preset--font-size--heading-l);
}

.tsg-contact-main__project p {
	margin: 0 0 1.5rem;
}

@media (min-width: 1024px) {
	.tsg-contact-main .tsg-svc__inner {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: 1.5rem;
	}

	.tsg-contact-main__details {
		grid-column: 1 / span 6;
	}

	.tsg-contact-main__project {
		grid-column: 8 / -1;
	}
}

/* Footer: compact list under the intro. */
.tsg-contact--footer {
	display: grid;
	gap: 0.5rem;
	margin-top: 1.25rem;
	color: var(--tsg-text-quiet);
	font-size: var(--wp--preset--font-size--small);
}

.tsg-contact--footer .tsg-contact__item {
	display: flex;
	gap: 0.5rem;
}

.tsg-contact--footer dt {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

.tsg-contact--footer a {
	color: var(--wp--preset--color--white);
	text-decoration: none;
}

.tsg-contact--footer a:hover {
	text-decoration: underline;
}

/* ==========================================================================
   Blog: listing, archives, search, news
   ========================================================================== */

.tsg-blog-hero .tsg-svc-hero__inner > .is-style-eyebrow a {
	color: inherit;
	text-decoration: none;
}

.tsg-blog-hero .wp-block-term-description p {
	margin: 0;
}

.tsg-blog-hero {
	padding-bottom: var(--wp--preset--spacing--50);
}

/* Topic filter: pills, the current one filled. */
.tsg-filter ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 2rem 0 0;
	padding: 0;
	list-style: none;
}

.tsg-filter a {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 0.375rem 1rem;
	border: 1.5px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--ink);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	text-decoration: none;
}

.tsg-filter a:hover {
	border-color: var(--wp--preset--color--ink);
}

.tsg-filter a[aria-current="page"] {
	border-color: var(--wp--preset--color--ink);
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--white);
}

.tsg-blog-list {
	padding-block: var(--wp--preset--spacing--40) var(--wp--preset--spacing--80);
}

.tsg-list__items {
	display: grid;
	gap: var(--wp--preset--spacing--50) 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.tsg-list__items > li {
	margin: 0;
}

.tsg-card {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	height: 100%;
	padding-top: 1.25rem;
	border-top: 1px solid var(--wp--preset--color--line);
}

.tsg-card > * {
	margin: 0 !important;
}

.tsg-card__img {
	overflow: hidden;
	margin-bottom: 0.75rem !important;
	border-radius: var(--wp--custom--radius--md);
	aspect-ratio: 16 / 9;
}

.tsg-card__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--wp--custom--motion--standard) var(--wp--custom--motion--ease);
}

.tsg-card:hover .tsg-card__img img {
	transform: scale(1.03);
}

.tsg-card__cat {
	font-size: var(--wp--preset--font-size--caption);
	font-weight: 600;
}

.tsg-card__cat a {
	text-decoration: none;
}

.tsg-card__title {
	font-size: var(--wp--preset--font-size--heading-s);
	line-height: 1.25;
}

.tsg-card__title a {
	color: inherit;
	text-decoration: none;
}

.tsg-card__title a:hover {
	color: var(--wp--preset--color--genius-blue);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.tsg-card__excerpt {
	color: var(--wp--preset--color--slate);
	font-size: var(--wp--preset--font-size--small);
}

.tsg-card__excerpt p {
	margin: 0;
}

.tsg-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem 0.5rem;
	margin: 0;
	color: var(--wp--preset--color--slate);
	font-size: var(--wp--preset--font-size--caption);
}

.tsg-card .tsg-meta {
	margin-top: auto !important;
	padding-top: 0.5rem;
}

@media (min-width: 640px) {
	.tsg-list__items {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.tsg-list__items {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	/* First page of the blog: the newest article leads, wide. */
	.tsg-blog:not(.tsg-search) .tsg-list:not(.tsg-list--related) .tsg-list__items > li:first-child {
		grid-column: 1 / -1;
	}

	.tsg-blog:not(.tsg-search) .tsg-list:not(.tsg-list--related) .tsg-list__items > li:first-child .tsg-card:has(.tsg-card__img) {
		display: grid;
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		grid-auto-rows: min-content;
		column-gap: var(--wp--preset--spacing--50);
		align-content: start;
	}

	.tsg-blog:not(.tsg-search) .tsg-list:not(.tsg-list--related) .tsg-list__items > li:first-child .tsg-card:has(.tsg-card__img) > * {
		grid-column: 2;
	}

	.tsg-blog:not(.tsg-search) .tsg-list:not(.tsg-list--related) .tsg-list__items > li:first-child .tsg-card:not(:has(.tsg-card__img)) > * {
		max-width: 46rem;
	}

	.tsg-blog:not(.tsg-search) .tsg-list:not(.tsg-list--related) .tsg-list__items > li:first-child .tsg-card__img {
		grid-column: 1;
		grid-row: 1 / span 6;
		margin: 0 !important;
	}

	.tsg-blog:not(.tsg-search) .tsg-list:not(.tsg-list--related) .tsg-list__items > li:first-child .tsg-card__title {
		font-size: var(--wp--preset--font-size--heading-l);
		line-height: 1.1;
	}

	.tsg-blog:not(.tsg-search) .tsg-list:not(.tsg-list--related) .tsg-list__items > li:first-child .tsg-card__excerpt {
		font-size: var(--wp--preset--font-size--body);
	}
}

.tsg-pagination {
	margin-top: var(--wp--preset--spacing--60);
	padding-top: 1.5rem;
	border-top: 1px solid var(--wp--preset--color--line);
	font-weight: 600;
}

.tsg-pagination a,
.tsg-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	text-decoration: none;
}

.tsg-pagination .page-numbers.current {
	border-radius: 50%;
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--white);
}

/* Search box */
.tsg-searchform {
	max-width: 36rem;
	margin-top: 1.5rem;
}

.tsg-searchform .wp-block-search__inside-wrapper {
	gap: 0.5rem;
}

.tsg-searchform input[type="search"] {
	min-height: 52px;
	padding: 0.75rem 1rem;
	border: 1.5px solid #7a8699;
	border-radius: var(--wp--custom--radius--md);
	font: inherit;
	font-size: max(16px, 1rem);
}

.tsg-searchform .wp-block-search__button {
	margin: 0;
	min-height: 52px;
}

.tsg-search__title {
	font-size: var(--wp--preset--font-size--heading-l) !important;
}

/* News: a quiet, dated list. */
.tsg-news-list {
	padding-block: var(--wp--preset--spacing--40) var(--wp--preset--spacing--80);
}

.tsg-news__items {
	margin: 0;
	padding: 0;
	list-style: none;
}

.tsg-news-item {
	display: grid;
	gap: 0.25rem 1.5rem;
	padding: 1.5rem 0;
	border-top: 1px solid var(--wp--preset--color--line);
}

.tsg-news-item > * {
	margin: 0 !important;
}

.tsg-news-item__date {
	color: var(--wp--preset--color--slate);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

.tsg-news-item__title {
	font-size: var(--wp--preset--font-size--heading-s);
}

.tsg-news-item__title a {
	color: inherit;
	text-decoration: none;
}

.tsg-news-item__title a:hover {
	color: var(--wp--preset--color--genius-blue);
	text-decoration: underline;
}

.tsg-news-item__excerpt {
	max-width: 44em;
	color: var(--wp--preset--color--slate);
}

.tsg-news-item__excerpt p {
	margin: 0;
}

@media (min-width: 782px) {
	.tsg-news-item {
		grid-template-columns: 10rem minmax(0, 1fr);
	}

	.tsg-news-item > *:not(.tsg-news-item__date) {
		grid-column: 2;
	}

	.tsg-news-item__date {
		grid-row: 1 / span 2;
		padding-top: 0.2rem;
	}
}

/* ==========================================================================
   Article
   ========================================================================== */

.tsg-article__head,
.tsg-article__img,
.tsg-article__body {
	box-sizing: border-box;
	width: 100%;
	max-width: calc(var(--wp--style--global--wide-size) + var(--tsg-gutter-l) + var(--tsg-gutter-r));
	margin-inline: auto !important;
	padding-inline: var(--tsg-gutter-l) var(--tsg-gutter-r);
}

.tsg-article__head {
	padding-top: var(--wp--preset--spacing--60);
	padding-bottom: var(--wp--preset--spacing--40);
}

.tsg-article__head > * {
	max-width: 52rem;
}

.tsg-breadcrumbs {
	margin-bottom: 1rem;
	color: var(--wp--preset--color--slate);
	font-size: var(--wp--preset--font-size--caption);
}

.tsg-breadcrumbs a {
	color: inherit;
}

.tsg-article__cat {
	margin: 0;
}

.tsg-article__cat a {
	text-decoration: none;
}

.tsg-article__title {
	margin: 0.5rem 0 1rem;
	font-size: clamp(2.25rem, 1.5rem + 2.8vw, 3.75rem);
	line-height: 1.06;
	letter-spacing: -0.03em;
}

.tsg-article__lead {
	max-width: 40em;
	margin: 0 0 1.5rem;
	font-size: var(--wp--preset--font-size--lead);
	line-height: 1.55;
}

.tsg-article__lead p {
	margin: 0;
}

.tsg-meta--byline {
	padding-top: 1rem;
	border-top: 1px solid var(--wp--preset--color--line);
	font-size: var(--wp--preset--font-size--small);
}

.tsg-meta__author {
	color: var(--wp--preset--color--ink);
	font-weight: 600;
}

.tsg-article__img {
	margin-block: var(--wp--preset--spacing--30) var(--wp--preset--spacing--50) !important;
}

.tsg-article__img img {
	width: 100%;
	max-height: 560px;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--card);
}

/* Reading column: comfortable measure, clear rhythm. */
.tsg-article__body {
	padding-bottom: var(--wp--preset--spacing--60);
	font-size: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem);
	line-height: 1.75;
}

.tsg-article__body > * {
	margin-block: 0 1.25em;
}

.tsg-article__body > h2 {
	margin-top: 2.25em;
	margin-bottom: 0.6em;
	font-size: var(--wp--preset--font-size--heading-l);
	line-height: 1.12;
}

.tsg-article__body > h3 {
	margin-top: 1.75em;
	margin-bottom: 0.5em;
	font-size: var(--wp--preset--font-size--heading-m);
	line-height: 1.2;
}

.tsg-article__body > h4 {
	margin-top: 1.5em;
	margin-bottom: 0.5em;
}

.tsg-article__body ul,
.tsg-article__body ol {
	padding-left: 1.4em;
}

.tsg-article__body li + li {
	margin-top: 0.4em;
}

.tsg-article__body li::marker {
	color: var(--wp--preset--color--genius-blue);
	font-weight: 700;
}

.tsg-article__body a {
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
}

.tsg-article__body blockquote,
.tsg-article__body .wp-block-quote {
	margin-block: 2em;
	padding-left: 1.5rem;
	border-left: 3px solid var(--wp--preset--color--genius-blue);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--heading-s);
	font-weight: 500;
	line-height: 1.45;
}

.tsg-article__body blockquote cite {
	display: block;
	margin-top: 0.75rem;
	color: var(--wp--preset--color--slate);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--small);
	font-style: normal;
}

.tsg-article__body figure {
	margin-block: 2em;
}

.tsg-article__body img {
	height: auto;
	border-radius: var(--wp--custom--radius--md);
}

.tsg-article__body figcaption {
	margin-top: 0.5rem;
	color: var(--wp--preset--color--slate);
	font-size: var(--wp--preset--font-size--small);
}

.tsg-article__body table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--wp--preset--font-size--small);
}

.tsg-article__body .wp-block-table {
	overflow-x: auto;
}

.tsg-article__body th,
.tsg-article__body td {
	padding: 0.75rem;
	border-bottom: 1px solid var(--wp--preset--color--line);
	text-align: left;
	vertical-align: top;
}

.tsg-article__body th {
	background: var(--wp--preset--color--cloud);
	font-weight: 700;
}

.tsg-article__body code {
	padding: 0.1em 0.35em;
	border-radius: 4px;
	background: var(--wp--preset--color--cloud);
	font-size: 0.9em;
}

.tsg-article__body pre {
	overflow-x: auto;
	padding: 1rem 1.25rem;
	border-radius: var(--wp--custom--radius--md);
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--white);
	font-size: var(--wp--preset--font-size--small);
}

.tsg-article__body pre code {
	padding: 0;
	background: none;
}

.tsg-article__body hr {
	margin-block: 2.5em;
	border: 0;
	border-top: 1px solid var(--wp--preset--color--line);
}

/* End of article: one next move, aligned with the reading column. */
.tsg-article__cta {
	box-sizing: border-box;
	max-width: 720px;
	margin: 0 var(--tsg-gutter-r) var(--wp--preset--spacing--70) var(--tsg-gutter-l) !important;
	padding: clamp(1.5rem, 4vw, 2.5rem);
	border-radius: var(--wp--custom--radius--card);
}

.tsg-article__cta h2 {
	margin: 0 0 0.5rem;
	font-size: var(--wp--preset--font-size--heading-m);
}

.tsg-article__cta p {
	margin: 0 0 1.25rem;
}

/* Keep reading */
.tsg-related {
	padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--80);
	background: var(--wp--preset--color--cloud);
}

.tsg-related__title {
	margin: 0 0 var(--wp--preset--spacing--40);
}

@media (min-width: 1024px) {
	.tsg-article__head,
	.tsg-article__body {
		padding-left: max(var(--tsg-gutter-l), calc((100% - var(--wp--style--global--wide-size)) / 2 + (var(--wp--style--global--wide-size) / 12)));
		max-width: none;
	}

	.tsg-article__cta {
		margin-left: max(var(--tsg-gutter-l), calc((100% - var(--wp--style--global--wide-size)) / 2 + (var(--wp--style--global--wide-size) / 12))) !important;
	}
}